@visactor/vtable-gantt 1.17.3-alpha.10 → 1.17.3-alpha.12

package/dist/vtable-gantt.js

@@ -26541,1208 +26541,403 @@
       registed || (registed = !0, preLoadAllModule(), isBrowserEnv() ? loadBrowserEnv(container) : isNodeEnv() && loadNodeEnv(container), registerArc(), registerCircle(), registerGroup(), registerImage(), registerLine(), registerRect(), registerRichtext(), registerShadowRoot(), registerSymbol(), registerText(), registerFlexLayoutPlugin(), loadPoptip(), registerFlexLayoutPlugin());
     }
 
-    const defaultTaskBarStyle = {
-        barColor: 'blue',
-        completedBarColor: 'gray',
-        width: 30,
-        cornerRadius: 3,
-        borderWidth: 0,
-        fontFamily: 'Arial',
-        fontSize: 14
-    };
-    function setWidthToDefaultTaskBarStyle(width) {
-        defaultTaskBarStyle.width = width;
+    function throttle$1(func, delay) {
+        let timer = null;
+        return function (...args) {
+            if (!timer) {
+                func.apply(this, args);
+                timer = setTimeout(() => {
+                    timer = null;
+                }, delay);
+            }
+        };
     }
-    const isNode$1 = typeof window === 'undefined' || typeof window.window === 'undefined';
-    const DayTimes = 1000 * 60 * 60 * 24;
-    function getDateIndexByX(x, gantt) {
-        const totalX = x + gantt.stateManager.scroll.horizontalBarPos;
-        const firstDateColWidth = gantt.getDateColWidth(0);
-        const dateIndex = Math.floor((totalX - firstDateColWidth) / gantt.parsedOptions.timelineColWidth) + 1;
-        return dateIndex;
+    function getTodayNearDay(dayOffset, format) {
+        const today = new Date();
+        const todayTime = today.getTime();
+        const oneDayTime = 24 * 60 * 60 * 1000;
+        const targetTime = todayTime + dayOffset * oneDayTime;
+        const date = new Date(targetTime);
+        if (format) {
+            const year = date.getFullYear().toString();
+            const month = (date.getMonth() + 1).toString().padStart(2, '0');
+            const day = date.getDate().toString().padStart(2, '0');
+            format = format.replace('yyyy', year);
+            format = format.replace('mm', month);
+            format = format.replace('dd', day);
+            return format;
+        }
+        return date;
     }
-    function generateMarkLine(markLine) {
-        if (!markLine) {
-            return [];
+    function formatDate(date, format) {
+        const year = date.getFullYear().toString();
+        const month = (date.getMonth() + 1).toString().padStart(2, '0');
+        const day = date.getDate().toString().padStart(2, '0');
+        format = format.replace('yyyy', year);
+        format = format.replace('mm', month);
+        format = format.replace('dd', day);
+        if (format.length > 10) {
+            const hour = date.getHours().toString().padStart(2, '0');
+            const minute = date.getMinutes().toString().padStart(2, '0');
+            const second = date.getSeconds().toString().padStart(2, '0');
+            format = format.replace('hh', hour);
+            format = format.replace('mm', minute);
+            format = format.replace('ss', second);
         }
-        if (markLine === true) {
-            return [
-                {
-                    date: createDateAtMidnight().toLocaleDateString(),
-                    scrollToMarkLine: true,
-                    position: 'left',
-                    style: {
-                        lineColor: 'red',
-                        lineWidth: 1
-                    }
+        return format;
+    }
+    function validateDate(dateParts, format) {
+        const yearIndex = format.indexOf('yyyy');
+        const monthIndex = format.indexOf('mm');
+        const dayIndex = format.indexOf('dd');
+        const dateYearIndex = yearIndex < monthIndex ? (yearIndex < dayIndex ? 0 : 1) : monthIndex < dayIndex ? 1 : 2;
+        const dateMonthIndex = monthIndex < yearIndex ? (monthIndex < dayIndex ? 0 : 1) : monthIndex < dayIndex ? 1 : 2;
+        const dateDayIndex = dayIndex < yearIndex ? (dayIndex < monthIndex ? 0 : 1) : dayIndex < monthIndex ? 1 : 2;
+        const year = parseInt(dateParts[dateYearIndex], 10);
+        const month = parseInt(dateParts[dateMonthIndex], 10) - 1;
+        const day = parseInt(dateParts[dateDayIndex], 10);
+        if (isNaN(year) || year < 1) {
+            return false;
+        }
+        if (isNaN(month) || month < 0 || month > 11) {
+            return false;
+        }
+        const daysInMonth = [31, isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+        if (isNaN(day) || day < 1 || day > daysInMonth[month]) {
+            return false;
+        }
+        return true;
+    }
+    function validateTime(dateParts, format) {
+        if (format.includes('hh') || format.includes('mm') || format.includes('ss')) {
+            const timeIndex = format.indexOf('hh') > -1 ? format.indexOf('hh') : format.indexOf('HH');
+            const hour = parseInt(dateParts[timeIndex], 10);
+            const minute = parseInt(dateParts[timeIndex + 1], 10);
+            const second = dateParts.length > timeIndex + 2 ? parseInt(dateParts[timeIndex + 2], 10) : 0;
+            if (isNaN(hour) || hour < 0 || hour > 23) {
+                return false;
+            }
+            if (isNaN(minute) || minute < 0 || minute > 59) {
+                return false;
+            }
+            if (isNaN(second) || second < 0 || second > 59) {
+                return false;
+            }
+        }
+        return true;
+    }
+    function isLeapYear(year) {
+        return (year % 4 === 0 && year % 100 !== 0) || year % 400 === 0;
+    }
+    function parseDateFormat(dateString) {
+        const formats = [
+            'yyyy-mm-dd',
+            'dd-mm-yyyy',
+            'mm/dd/yyyy',
+            'yyyy/mm/dd',
+            'dd/mm/yyyy',
+            'yyyy.mm.dd',
+            'mm.dd.yyyy',
+            'dd.mm.yyyy'
+        ];
+        const timeFormat = ['hh:mm:ss', 'hh:mm'];
+        dateString = dateString.trim();
+        const dates = dateString.split(' ');
+        const date = dates[0];
+        const time = dates[1];
+        let dateFormatMatched;
+        let timeFormatMatched;
+        if (date) {
+            for (let i = 0; i < formats.length; i++) {
+                const format = formats[i];
+                const dateParts = date.split(getSeparator(format));
+                const isValid = validateDate(dateParts, format);
+                if (dateParts.length === 3 && isValid) {
+                    dateFormatMatched = format;
+                    break;
                 }
-            ];
+            }
         }
-        else if (Array.isArray(markLine)) {
-            return markLine.map((item, index) => {
-                return {
-                    ...item,
-                    date: item.date,
-                    scrollToMarkLine: item.scrollToMarkLine,
-                    position: item.position ?? 'left',
-                    style: {
-                        lineColor: item.style?.lineColor || 'red',
-                        lineWidth: item.style?.lineWidth || 1,
-                        lineDash: item.style?.lineDash
+        if (dateFormatMatched) {
+            if (time) {
+                for (let i = 0; i < timeFormat.length; i++) {
+                    const format = timeFormat[i];
+                    const timeParts = time.split(getSeparator(format));
+                    const formatParts = format.split(getSeparator(format));
+                    const isValid = validateTime(timeParts, format);
+                    if (isValid && timeParts.length === formatParts.length) {
+                        timeFormatMatched = format;
+                        break;
                     }
-                };
-            });
-        }
-        return [
-            {
-                ...markLine,
-                date: markLine.date,
-                scrollToMarkLine: markLine.scrollToMarkLine ?? true,
-                position: markLine.position ?? 'left',
-                style: {
-                    lineColor: markLine.style?.lineColor || 'red',
-                    lineWidth: markLine.style?.lineWidth || 1,
-                    lineDash: markLine.style?.lineDash
                 }
             }
-        ];
+        }
+        if (date && time && dateFormatMatched && timeFormatMatched) {
+            return dateFormatMatched + ' ' + timeFormatMatched;
+        }
+        if (date && !time) {
+            return dateFormatMatched;
+        }
+        return 'yyyy-mm-dd hh:mm:ss';
     }
-    function getHorizontalScrollBarSize$1(scrollStyle) {
-        if (scrollStyle?.hoverOn ||
-            (scrollStyle?.horizontalVisible && scrollStyle?.horizontalVisible === 'none') ||
-            (!scrollStyle?.horizontalVisible && scrollStyle?.visible === 'none')) {
-            return 0;
+    function getSeparator(format) {
+        const separators = format.match(/[^\w]/g);
+        if (separators) {
+            const escapedSeparators = separators.map(s => '\\' + s).join('|');
+            return new RegExp(escapedSeparators, 'g');
         }
-        return scrollStyle?.width ?? 7;
+        return /[^\w]/;
     }
-    function getVerticalScrollBarSize$1(scrollStyle) {
-        if (scrollStyle?.hoverOn ||
-            (scrollStyle?.verticalVisible && scrollStyle?.verticalVisible === 'none') ||
-            (!scrollStyle?.verticalVisible && scrollStyle?.visible === 'none')) {
-            return 0;
+    function parseStringTemplate(template, data) {
+        const result = template.replace(/\{([^}]+)\}/g, (match, key) => {
+            const keys = key.split('.');
+            let value = data;
+            for (const k of keys) {
+                if (value.hasOwnProperty(k)) {
+                    value = value[k];
+                }
+                else {
+                    value = match;
+                    break;
+                }
+            }
+            return value;
+        });
+        return result;
+    }
+    function toBoxArray$2(obj) {
+        if (!Array.isArray(obj)) {
+            return [obj, obj, obj, obj];
         }
-        return scrollStyle?.width ?? 7;
+        if (obj.length === 3) {
+            return [obj[0], obj[1], obj[2], obj[1]];
+        }
+        if (obj.length === 2) {
+            return [obj[0], obj[1], obj[0], obj[1]];
+        }
+        if (obj.length === 1) {
+            return [obj[0], obj[0], obj[0], obj[0]];
+        }
+        return [obj[0], obj[1], obj[2], obj[3]];
     }
-    function initOptions(gantt) {
-        const options = gantt.options;
-        gantt.parsedOptions.tasksShowMode = options?.tasksShowMode ?? TasksShowMode.Tasks_Separate;
-        gantt.parsedOptions.pixelRatio = options?.pixelRatio ?? 1;
-        gantt.parsedOptions.rowHeight = options?.rowHeight ?? 40;
-        gantt.parsedOptions.timelineColWidth = options?.timelineHeader?.colWidth ?? 60;
-        gantt.parsedOptions.startDateField = options.taskBar?.startDateField ?? 'startDate';
-        gantt.parsedOptions.endDateField = options.taskBar?.endDateField ?? 'endDate';
-        gantt.parsedOptions.progressField = options.taskBar?.progressField ?? 'progress';
-        const { unit: minTimeUnit, startOfWeek, step } = gantt.parsedOptions.reverseSortedTimelineScales[0];
-        gantt.parsedOptions.minDate = options?.minDate
-            ? getStartDateByTimeUnit(new Date(options.minDate), minTimeUnit, startOfWeek)
-            : undefined;
-        gantt.parsedOptions.maxDate = options?.maxDate
-            ? getEndDateByTimeUnit(gantt.parsedOptions.minDate, new Date(options.maxDate), minTimeUnit, step)
-            : undefined;
-        gantt.parsedOptions._minDateTime = gantt.parsedOptions.minDate?.getTime();
-        gantt.parsedOptions._maxDateTime = gantt.parsedOptions.maxDate?.getTime();
-        gantt.parsedOptions.overscrollBehavior = options?.overscrollBehavior ?? 'auto';
-        gantt.parsedOptions.underlayBackgroundColor = options?.underlayBackgroundColor ?? '#FFF';
-        gantt.parsedOptions.scrollStyle = Object.assign({}, {
-            scrollRailColor: 'rgba(100, 100, 100, 0.2)',
-            scrollSliderColor: 'rgba(100, 100, 100, 0.5)',
-            scrollSliderCornerRadius: 4,
-            width: 10,
-            visible: 'always',
-            hoverOn: true,
-            barToSide: false
-        }, options?.scrollStyle);
-        gantt.parsedOptions.timelineHeaderHorizontalLineStyle = options?.timelineHeader?.horizontalLine;
-        gantt.parsedOptions.timelineHeaderVerticalLineStyle = options?.timelineHeader?.verticalLine;
-        gantt.parsedOptions.timelineHeaderBackgroundColor = options?.timelineHeader?.backgroundColor;
-        gantt.parsedOptions.timeLineHeaderRowHeights = [];
-        gantt.parsedOptions.timelineHeaderStyles = [];
-        for (let i = 0; i < gantt.parsedOptions.sortedTimelineScales.length ?? 0; i++) {
-            const style = gantt.parsedOptions.sortedTimelineScales[i].style;
-            gantt.parsedOptions.timelineHeaderStyles.push(Object.assign({
-                fontSize: 20,
-                fontWeight: 'bold',
-                textAlign: 'center',
-                textBaseline: 'middle',
-                color: '#000',
-                backgroundColor: '#fff'
-            }, style));
-            gantt.parsedOptions.timeLineHeaderRowHeights.push(gantt.parsedOptions.sortedTimelineScales[i].rowHeight ?? options?.headerRowHeight ?? 40);
+    function getWeekNumber(currentDate) {
+        const startOfYear = new Date(currentDate.getFullYear(), 0, 1);
+        const weekNumber = Math.ceil(((currentDate.getTime() + 1 - startOfYear.getTime()) / 86400000 + 1) / 7);
+        return weekNumber;
+    }
+    function getWeekday(dateString, format = 'long') {
+        const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
+        const date = new Date(dateString);
+        if (format === 'short') {
+            return days[date.getDay()].substr(0, 3);
         }
-        gantt.parsedOptions.grid = Object.assign({}, options?.grid);
-        setWidthToDefaultTaskBarStyle((gantt.parsedOptions.rowHeight * 3) / 4);
-        gantt.parsedOptions.taskBarStyle =
-            options?.taskBar?.barStyle && typeof options?.taskBar?.barStyle === 'function'
-                ? options.taskBar.barStyle
-                : Object.assign({}, defaultTaskBarStyle, options?.taskBar?.barStyle);
-        gantt.parsedOptions.taskBarMilestoneStyle = Object.assign(typeof gantt.parsedOptions.taskBarStyle === 'function'
-            ? {}
-            : {
-                width: gantt.parsedOptions.taskBarStyle.width,
-                borderColor: gantt.parsedOptions.taskBarStyle.borderColor,
-                borderLineWidth: gantt.parsedOptions.taskBarStyle.borderLineWidth ?? 1,
-                fillColor: gantt.parsedOptions.taskBarStyle.barColor,
-                cornerRadius: 0
-            }, options?.taskBar?.milestoneStyle);
-        gantt.parsedOptions.taskBarMilestoneHypotenuse = gantt.parsedOptions.taskBarMilestoneStyle.width * Math.sqrt(2);
-        gantt.parsedOptions.dateFormat = options?.dateFormat;
-        gantt.parsedOptions.taskBarHoverStyle = Object.assign({
-            barOverlayColor: 'rgba(99, 144, 0, 0.4)'
-        }, options?.taskBar?.hoverBarStyle);
-        gantt.parsedOptions.taskBarSelectable = options?.taskBar?.selectable ?? true;
-        gantt.parsedOptions.taskBarSelectedStyle = Object.assign(typeof gantt.parsedOptions.taskBarStyle === 'function'
-            ? {
-                shadowBlur: 6,
-                shadowOffsetX: 0,
-                shadowOffsetY: 0,
-                borderLineWidth: 1
-            }
-            : {
-                shadowBlur: 6,
-                shadowOffsetX: 0,
-                shadowOffsetY: 0,
-                shadowColor: gantt.parsedOptions.taskBarStyle.barColor,
-                borderColor: gantt.parsedOptions.taskBarStyle.barColor,
-                borderLineWidth: 1
-            }, options?.taskBar?.selectedBarStyle);
-        gantt.parsedOptions.taskBarLabelText = options?.taskBar?.labelText ?? '';
-        gantt.parsedOptions.taskBarMoveable = options?.taskBar?.moveable ?? true;
-        gantt.parsedOptions.moveTaskBarToExtendDateRange = options?.taskBar?.moveToExtendDateRange ?? true;
-        gantt.parsedOptions.taskBarResizable = options?.taskBar?.resizable ?? true;
-        gantt.parsedOptions.taskBarDragOrder = options?.taskBar?.dragOrder ?? true;
-        gantt.parsedOptions.taskBarLabelStyle = {
-            fontFamily: options?.taskBar?.labelTextStyle?.fontFamily ?? 'Arial',
-            fontSize: options?.taskBar?.labelTextStyle?.fontSize ?? 20,
-            color: options?.taskBar?.labelTextStyle?.color ?? '#F01',
-            textAlign: options?.taskBar?.labelTextStyle?.textAlign ?? 'left',
-            textBaseline: options?.taskBar?.labelTextStyle?.textBaseline ?? 'middle',
-            padding: options?.taskBar?.labelTextStyle?.padding ?? [0, 0, 0, 10],
-            textOverflow: options?.taskBar?.labelTextStyle?.textOverflow
-        };
-        gantt.parsedOptions.taskBarCustomLayout = options?.taskBar?.customLayout;
-        gantt.parsedOptions.taskBarCreatable =
-            options?.taskBar?.scheduleCreatable ??
-                !!(gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Separate ||
-                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Tasks_Separate);
-        gantt.parsedOptions.taskBarCreationButtonStyle = Object.assign({
-            lineColor: 'rgb(99, 144, 0)',
-            lineWidth: 1,
-            lineDash: [5, 5],
-            cornerRadius: 4,
-            backgroundColor: '#FFF'
-        }, options?.taskBar?.scheduleCreation?.buttonStyle);
-        gantt.parsedOptions.taskBarCreationCustomLayout = options?.taskBar?.scheduleCreation?.customLayout;
-        gantt.parsedOptions.taskBarCreationMaxWidth = options?.taskBar?.scheduleCreation?.maxWidth;
-        gantt.parsedOptions.taskBarCreationMinWidth = options?.taskBar?.scheduleCreation?.minWidth;
-        gantt.parsedOptions.outerFrameStyle = Object.assign({
-            borderColor: '#e1e4e8',
-            borderLineWidth: 1,
-            cornerRadius: 4
-        }, options.frame?.outerFrameStyle);
-        gantt.parsedOptions.markLine = generateMarkLine(options?.markLine);
-        if (gantt.parsedOptions.markLine?.length ?? 0) {
-            if (gantt.parsedOptions.markLine?.every(item => item.scrollToMarkLine === undefined)) {
-                gantt.parsedOptions.markLine[0].scrollToMarkLine = true;
-            }
-            if (gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine)) {
-                gantt.parsedOptions.scrollToMarkLineDate = getStartDateByTimeUnit(new Date(gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine).date), minTimeUnit, startOfWeek);
-            }
+        else if (format === 'long') {
+            return days[date.getDay()];
         }
-        gantt.parsedOptions.verticalSplitLineHighlight = options.frame?.verticalSplitLineHighlight;
-        gantt.parsedOptions.verticalSplitLine = Object.assign({
-            lineColor: gantt.parsedOptions.outerFrameStyle?.borderColor,
-            lineWidth: gantt.parsedOptions.outerFrameStyle?.borderLineWidth
-        }, options.frame?.verticalSplitLine);
-        gantt.parsedOptions.horizontalSplitLine = options.frame?.horizontalSplitLine;
-        gantt.parsedOptions.verticalSplitLineMoveable = options.frame?.verticalSplitLineMoveable;
-        gantt.parsedOptions.taskKeyField = options.taskKeyField ?? 'id';
-        gantt.parsedOptions.dependencyLinks = options.dependency?.links ?? [];
-        gantt.parsedOptions.dependencyLinkCreatable = options.dependency?.linkCreatable ?? false;
-        gantt.parsedOptions.dependencyLinkSelectable = options.dependency?.linkSelectable ?? true;
-        gantt.parsedOptions.dependencyLinkDeletable = options.dependency?.linkDeletable ?? false;
-        gantt.parsedOptions.dependencyLinkLineStyle = Object.assign({
-            lineColor: 'red',
-            lineWidth: 1
-        }, options.dependency?.linkLineStyle);
-        gantt.parsedOptions.dependencyLinkSelectedLineStyle = Object.assign({
-            shadowBlur: 4,
-            shadowOffset: 0,
-            shadowColor: gantt.parsedOptions.dependencyLinkLineStyle.lineColor,
-            lineColor: gantt.parsedOptions.dependencyLinkLineStyle.lineColor,
-            lineWidth: gantt.parsedOptions.dependencyLinkLineStyle.lineWidth
-        }, options?.dependency?.linkSelectedLineStyle);
-        gantt.parsedOptions.dependencyLinkLineCreatePointStyle = Object.assign({
-            strokeColor: 'red',
-            fillColor: 'white',
-            radius: 5,
-            strokeWidth: 1
-        }, options?.dependency?.linkCreatePointStyle);
-        gantt.parsedOptions.dependencyLinkLineCreatingPointStyle = Object.assign({
-            strokeColor: 'red',
-            fillColor: 'red',
-            radius: 5,
-            strokeWidth: 1
-        }, options?.dependency?.linkCreatingPointStyle);
-        gantt.parsedOptions.dependencyLinkLineCreatingStyle = Object.assign({
-            lineColor: 'red',
-            lineWidth: 1,
-            lineDash: [5, 5]
-        }, options?.dependency?.linkCreatingLineStyle);
-        gantt.parsedOptions.eventOptions = options?.eventOptions;
-        gantt.parsedOptions.keyboardOptions = options?.keyboardOptions;
-        gantt.parsedOptions.markLineCreateOptions = options?.markLineCreateOptions;
+        return 'Invalid format specified. Please use "short" or "long".';
     }
-    function updateOptionsWhenScaleChanged(gantt) {
-        const options = gantt.options;
-        const { unit: minTimeUnit, startOfWeek, step } = gantt.parsedOptions.reverseSortedTimelineScales[0];
-        gantt.parsedOptions.minDate = getStartDateByTimeUnit(new Date(gantt.parsedOptions.minDate), minTimeUnit, startOfWeek);
-        gantt.parsedOptions.maxDate = getEndDateByTimeUnit(gantt.parsedOptions.minDate, new Date(gantt.parsedOptions.maxDate), minTimeUnit, step);
-        gantt.parsedOptions._minDateTime = gantt.parsedOptions.minDate?.getTime();
-        gantt.parsedOptions._maxDateTime = gantt.parsedOptions.maxDate?.getTime();
-        gantt.parsedOptions.timeLineHeaderRowHeights = [];
-        gantt.parsedOptions.timelineHeaderStyles = [];
-        for (let i = 0; i < gantt.parsedOptions.sortedTimelineScales.length ?? 0; i++) {
-            const style = gantt.parsedOptions.sortedTimelineScales[i].style;
-            gantt.parsedOptions.timelineHeaderStyles.push(Object.assign({
-                fontSize: 20,
-                fontWeight: 'bold',
-                textAlign: 'center',
-                textBaseline: 'middle',
-                color: '#000',
-                backgroundColor: '#fff'
-            }, style));
-            gantt.parsedOptions.timeLineHeaderRowHeights.push(gantt.parsedOptions.sortedTimelineScales[i].rowHeight ?? options?.headerRowHeight ?? 40);
+    function isPropertyWritable(obj, prop) {
+        const descriptor = Object.getOwnPropertyDescriptor(obj, prop);
+        if (!descriptor) {
+            return false;
         }
+        return !!descriptor.set || descriptor.writable === true;
     }
-    function generateTimeLineDate(currentDate, endDate, scale) {
-        const { unit, step, format } = scale;
-        const timelineDates = [];
-        while (currentDate < endDate) {
-            if (unit === 'day') {
-                const year = currentDate.getFullYear();
-                const month = currentDate.getMonth();
-                const day = currentDate.getDate();
-                const end = createDateAtLastHour(new Date(year, month, day + step - 1), true);
-                if (end.getTime() > endDate.getTime()) {
-                    end.setTime(endDate.getTime());
+    function createDateAtMidnight(dateStr, forceMidnight = false) {
+        let date;
+        if (dateStr) {
+            date = new Date(dateStr);
+            if (typeof dateStr === 'string') {
+                if (dateStr.length > 10) {
+                    if (forceMidnight) {
+                        date.setHours(0, 0, 0, 0);
+                    }
+                    return date;
                 }
-                const start = currentDate;
-                const formattedDate = format?.({ dateIndex: day, startDate: start, endDate: end });
-                const columnTitle = formattedDate || day.toString();
-                const dayCellConfig = {
-                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
-                    startDate: start,
-                    endDate: end,
-                    step,
-                    unit: 'day',
-                    title: columnTitle,
-                    dateIndex: day
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate = new Date(year, month, day + step);
+                date.setHours(0, 0, 0, 0);
             }
-            else if (unit === 'month') {
-                const year = currentDate.getFullYear();
-                const month = currentDate.getMonth();
-                const end = createDateAtLastHour(new Date(year, month + step, 0), true);
-                if (end.getTime() > endDate.getTime()) {
-                    end.setTime(endDate.getTime());
+        }
+        else {
+            date = new Date();
+        }
+        if (forceMidnight) {
+            date.setHours(0, 0, 0, 0);
+        }
+        return date;
+    }
+    function createDateAtLastMinute(dateStr, forceSetMinute = false) {
+        let date;
+        if (dateStr) {
+            date = new Date(dateStr);
+            if (typeof dateStr === 'string') {
+                if (dateStr.length > 10) {
+                    if (forceSetMinute) {
+                        date.setMinutes(59, 59, 999);
+                    }
+                    return date;
                 }
-                const start = currentDate;
-                const formattedDate = format?.({ dateIndex: month + 1, startDate: start, endDate: end });
-                const columnTitle = formattedDate || (month + 1).toString();
-                const dayCellConfig = {
-                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
-                    startDate: start,
-                    step,
-                    unit: 'month',
-                    endDate: end,
-                    title: columnTitle,
-                    dateIndex: month + 1
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate = new Date(year, month + step, 1);
-            }
-            else if (unit === 'quarter') {
-                const year = currentDate.getFullYear();
-                const quarter = Math.floor(currentDate.getMonth() / 3);
-                const end = createDateAtLastHour(new Date(year, (quarter + step) * 3, 0), true);
-                if (end.getTime() > endDate.getTime()) {
-                    end.setTime(endDate.getTime());
-                }
-                const start = currentDate;
-                const formattedDate = format?.({ dateIndex: quarter + 1, startDate: start, endDate: end });
-                const columnTitle = formattedDate || (quarter + 1).toString();
-                const dayCellConfig = {
-                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / (1000 * 60 * 60 * 24),
-                    startDate: start,
-                    step,
-                    unit: 'quarter',
-                    endDate: end,
-                    title: columnTitle,
-                    dateIndex: quarter + 1
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate = new Date(year, (quarter + step) * 3, 1);
-            }
-            else if (unit === 'year') {
-                const year = currentDate.getFullYear();
-                const end = createDateAtLastHour(new Date(year + step - 1, 11, 31), true);
-                if (end.getTime() > endDate.getTime()) {
-                    end.setTime(endDate.getTime());
-                }
-                const start = currentDate;
-                const formattedDate = format?.({ dateIndex: year, startDate: start, endDate: end });
-                const columnTitle = formattedDate || year.toString();
-                const dayCellConfig = {
-                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
-                    startDate: start,
-                    endDate: end,
-                    step,
-                    unit: 'year',
-                    title: columnTitle,
-                    dateIndex: year
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate = new Date(year + step, 0, 1);
-            }
-            else if (unit === 'week') {
-                const startOfWeekSetting = scale.startOfWeek ?? 'monday';
-                let dayOfWeek = currentDate.getDay();
-                if (startOfWeekSetting === 'monday') {
-                    dayOfWeek = dayOfWeek === 0 ? 6 : dayOfWeek - 1;
-                }
-                const startOfWeek = createDateAtMidnight(currentDate);
-                const dateEnd = createDateAtLastHour(currentDate.getTime() + (7 * step - dayOfWeek) * 24 * 60 * 60 * 1000 - 1, true);
-                if (dateEnd > endDate) {
-                    dateEnd.setTime(endDate.getTime());
-                }
-                const weekNumber = getWeekNumber(startOfWeek);
-                const columnTitle = format?.({ dateIndex: weekNumber, startDate: startOfWeek, endDate: dateEnd }) || weekNumber.toString();
-                const dayCellConfig = {
-                    days: (dateEnd.getTime() - startOfWeek.getTime() + 1) / DayTimes,
-                    startDate: startOfWeek,
-                    endDate: dateEnd,
-                    step,
-                    unit: 'week',
-                    title: columnTitle,
-                    dateIndex: weekNumber
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate.setTime(createDateAtMidnight(currentDate.getTime() + (7 * step - dayOfWeek) * 24 * 60 * 60 * 1000, true).getTime());
-            }
-            else if (unit === 'hour') {
-                const year = currentDate.getFullYear();
-                const month = currentDate.getMonth();
-                const day = currentDate.getDate();
-                const hour = currentDate.getHours();
-                const end = createDateAtLastMinute(new Date(year, month, day, hour + step - 1), true);
-                if (end.getTime() > endDate.getTime()) {
-                    end.setTime(endDate.getTime());
-                }
-                const start = currentDate;
-                const formattedDate = format?.({ dateIndex: hour, startDate: start, endDate: end });
-                const columnTitle = formattedDate || hour.toString();
-                const dayCellConfig = {
-                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
-                    startDate: start,
-                    endDate: end,
-                    step,
-                    unit: 'hour',
-                    title: columnTitle,
-                    dateIndex: currentDate.getHours()
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate = new Date(year, month, day, hour + step);
-            }
-            else if (unit === 'minute') {
-                const year = currentDate.getFullYear();
-                const month = currentDate.getMonth();
-                const day = currentDate.getDate();
-                const hour = currentDate.getHours();
-                const minute = currentDate.getMinutes();
-                const end = createDateAtLastSecond(new Date(year, month, day, hour, minute + step - 1), true);
-                if (end.getTime() > endDate.getTime()) {
-                    end.setTime(endDate.getTime());
-                }
-                const start = currentDate;
-                const formattedDate = format?.({ dateIndex: minute, startDate: start, endDate: end });
-                const columnTitle = formattedDate || minute.toString();
-                const dayCellConfig = {
-                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
-                    startDate: start,
-                    endDate: end,
-                    step,
-                    unit: 'minute',
-                    title: columnTitle,
-                    dateIndex: currentDate.getMinutes()
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate = new Date(year, month, day, hour, minute + step);
-            }
-            else if (unit === 'second') {
-                const year = currentDate.getFullYear();
-                const month = currentDate.getMonth();
-                const day = currentDate.getDate();
-                const hour = currentDate.getHours();
-                const minute = currentDate.getMinutes();
-                const second = currentDate.getSeconds();
-                const end = createDateAtLastMillisecond(new Date(year, month, day, hour, minute, second + step - 1), true);
-                if (end.getTime() > endDate.getTime()) {
-                    end.setTime(endDate.getTime());
-                }
-                const start = currentDate;
-                const formattedDate = format?.({ dateIndex: second, startDate: start, endDate: end });
-                const columnTitle = formattedDate || second.toString();
-                const dayCellConfig = {
-                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
-                    startDate: start,
-                    endDate: end,
-                    step,
-                    unit: 'second',
-                    title: columnTitle,
-                    dateIndex: currentDate.getSeconds()
-                };
-                timelineDates.push(dayCellConfig);
-                currentDate = new Date(year, month, day, hour, minute, second + step);
+                date.setMinutes(59, 59, 999);
             }
         }
-        return timelineDates;
-    }
-    function getTextPos(padding, textAlign, textBaseline, width, height) {
-        let textX = padding[3] ?? 10;
-        if (textAlign === 'right' || textAlign === 'end') {
-            textX = width - 0 - (padding[1] ?? 10);
-        }
-        else if (textAlign === 'center') {
-            textX = 0 + (width - 0 + (padding[3] ?? 10) - (padding[1] ?? 10)) / 2;
-        }
-        let textY = 0 + (padding[0] ?? 10);
-        if (textBaseline === 'bottom' || textBaseline === 'alphabetic' || textBaseline === 'ideographic') {
-            textY = height - 0 - (padding[2] ?? 10);
-        }
-        else if (textBaseline === 'middle') {
-            textY = 0 + (height - 0 - (padding[0] ?? 10) - (padding[2] ?? 10)) / 2 + (padding[0] ?? 10);
+        else {
+            date = new Date();
         }
-        return {
-            x: textX,
-            y: textY
-        };
-    }
-    function convertProgress(progress) {
-        if (typeof progress === 'string') {
-            progress = progress.replace('%', '');
-            progress = parseFloat(progress);
+        if (forceSetMinute) {
+            date.setMinutes(59, 59, 999);
         }
-        return Math.round(progress);
+        return date;
     }
-    function createSplitLineAndResizeLine(gantt) {
-        if (gantt.taskListTableInstance) {
-            gantt.verticalSplitResizeLine = document.createElement('div');
-            gantt.verticalSplitResizeLine.style.position = 'absolute';
-            gantt.verticalSplitResizeLine.style.top = gantt.tableY + 'px';
-            gantt.verticalSplitResizeLine.style.left =
-                (gantt.taskTableWidth ? gantt.taskTableWidth - 7 + gantt.parsedOptions.verticalSplitLine.lineWidth / 2 : 0) +
-                    'px';
-            gantt.verticalSplitResizeLine.style.width = '14px';
-            gantt.verticalSplitResizeLine.style.height = gantt.drawHeight + 'px';
-            gantt.verticalSplitResizeLine.style.backgroundColor = 'rgba(0,0,0,0)';
-            gantt.verticalSplitResizeLine.style.zIndex = '100';
-            gantt.parsedOptions.verticalSplitLineMoveable && (gantt.verticalSplitResizeLine.style.cursor = 'col-resize');
-            gantt.verticalSplitResizeLine.style.userSelect = 'none';
-            gantt.verticalSplitResizeLine.style.opacity = '1';
-            const verticalSplitLine = document.createElement('div');
-            verticalSplitLine.style.position = 'absolute';
-            verticalSplitLine.style.top = '0px';
-            verticalSplitLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLine.lineWidth) / 2}px`;
-            verticalSplitLine.style.width = gantt.parsedOptions.verticalSplitLine.lineWidth + 'px';
-            verticalSplitLine.style.height = '100%';
-            verticalSplitLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLine.lineColor;
-            verticalSplitLine.style.zIndex = '100';
-            verticalSplitLine.style.userSelect = 'none';
-            verticalSplitLine.style.pointerEvents = 'none';
-            verticalSplitLine.style.transition = 'background-color 0.3s';
-            gantt.verticalSplitResizeLine.appendChild(verticalSplitLine);
-            if (gantt.parsedOptions.verticalSplitLineHighlight) {
-                const highlightLine = document.createElement('div');
-                highlightLine.style.position = 'absolute';
-                highlightLine.style.top = '0px';
-                highlightLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) / 2}px`;
-                highlightLine.style.width = (gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) + 'px';
-                highlightLine.style.height = '100%';
-                highlightLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLineHighlight.lineColor;
-                highlightLine.style.zIndex = '100';
-                highlightLine.style.cursor = 'col-resize';
-                highlightLine.style.userSelect = 'none';
-                highlightLine.style.pointerEvents = 'none';
-                highlightLine.style.opacity = '0';
-                highlightLine.style.transition = 'background-color 0.3s';
-                gantt.verticalSplitResizeLine.appendChild(highlightLine);
+    function createDateAtLastSecond(dateStr, forceSetSecond = false) {
+        let date;
+        if (dateStr) {
+            date = new Date(dateStr);
+            if (typeof dateStr === 'string') {
+                if (dateStr.length > 10) {
+                    if (forceSetSecond) {
+                        date.setSeconds(59, 999);
+                    }
+                    return date;
+                }
+                date.setSeconds(59, 999);
             }
-            gantt.container.appendChild(gantt.verticalSplitResizeLine);
         }
-    }
-    function updateSplitLineAndResizeLine(gantt) {
-        if (gantt.verticalSplitResizeLine) {
-            gantt.verticalSplitResizeLine.style.position = 'absolute';
-            gantt.verticalSplitResizeLine.style.top = gantt.tableY + 'px';
-            gantt.verticalSplitResizeLine.style.left = gantt.taskTableWidth
-                ? `${gantt.taskTableWidth - 7 + gantt.parsedOptions.verticalSplitLine.lineWidth / 2}px`
-                : '0px';
-            gantt.verticalSplitResizeLine.style.width = '14px';
-            gantt.verticalSplitResizeLine.style.height = gantt.drawHeight + 'px';
-            gantt.verticalSplitResizeLine.style.backgroundColor = 'rgba(0,0,0,0)';
-            gantt.verticalSplitResizeLine.style.zIndex = '100';
-            gantt.parsedOptions.verticalSplitLineMoveable && (gantt.verticalSplitResizeLine.style.cursor = 'col-resize');
-            gantt.verticalSplitResizeLine.style.userSelect = 'none';
-            gantt.verticalSplitResizeLine.style.opacity = '1';
-            const verticalSplitLine = gantt.verticalSplitResizeLine.childNodes[0];
-            verticalSplitLine.style.position = 'absolute';
-            verticalSplitLine.style.top = '0px';
-            verticalSplitLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLine.lineWidth) / 2}px`;
-            verticalSplitLine.style.width = gantt.parsedOptions.verticalSplitLine.lineWidth + 'px';
-            verticalSplitLine.style.height = '100%';
-            verticalSplitLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLine.lineColor;
-            verticalSplitLine.style.zIndex = '100';
-            verticalSplitLine.style.userSelect = 'none';
-            verticalSplitLine.style.pointerEvents = 'none';
-            verticalSplitLine.style.transition = 'background-color 0.3s';
-            if (gantt.verticalSplitResizeLine.childNodes[1]) {
-                const highlightLine = gantt.verticalSplitResizeLine.childNodes[1];
-                highlightLine.style.position = 'absolute';
-                highlightLine.style.top = '0px';
-                highlightLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) / 2}px`;
-                highlightLine.style.width = (gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) + 'px';
-                highlightLine.style.height = '100%';
-                highlightLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLineHighlight.lineColor;
-                highlightLine.style.zIndex = '100';
-                highlightLine.style.cursor = 'col-resize';
-                highlightLine.style.userSelect = 'none';
-                highlightLine.style.pointerEvents = 'none';
-                highlightLine.style.opacity = '0';
-                highlightLine.style.transition = 'background-color 0.3s';
-            }
+        else {
+            date = new Date();
+        }
+        if (forceSetSecond) {
+            date.setSeconds(59, 999);
         }
+        return date;
     }
-    function findRecordByTaskKey(records, taskKeyField, taskKey, childrenField = 'children') {
-        for (let i = 0; i < records.length; i++) {
-            if ((Array.isArray(taskKey) && taskKey.length === 1 && records[i][taskKeyField] === taskKey[0]) ||
-                records[i][taskKeyField] === taskKey) {
-                return { record: records[i], index: [i] };
-            }
-            else if (records[i][childrenField]?.length) {
-                if (Array.isArray(taskKey) && taskKey[0] === records[i][taskKeyField]) {
-                    const result = findRecordByTaskKey(records[i][childrenField], taskKeyField, taskKey.slice(1));
-                    if (result) {
-                        result.index.unshift(i);
-                        return result;
-                    }
-                }
-                else if (!Array.isArray(taskKey)) {
-                    const result = findRecordByTaskKey(records[i][childrenField], taskKeyField, taskKey);
-                    if (result) {
-                        result.index.unshift(i);
-                        return result;
+    function createDateAtLastMillisecond(dateStr, forceSetMillisecond = false) {
+        let date;
+        if (dateStr) {
+            date = new Date(dateStr);
+            if (typeof dateStr === 'string') {
+                if (dateStr.length > 10) {
+                    if (forceSetMillisecond) {
+                        date.setMilliseconds(999);
                     }
+                    return date;
                 }
+                date.setMilliseconds(999);
             }
         }
-    }
-    function clearRecordLinkInfos(records, childrenField = 'children') {
-        for (let i = 0; i < records.length; i++) {
-            if (records[i][childrenField]?.length) {
-                clearRecordLinkInfos(records[i][childrenField], childrenField);
-            }
-            else {
-                delete records[i].vtable_gantt_linkedTo;
-                delete records[i].vtable_gantt_linkedFrom;
-            }
+        else {
+            date = new Date();
         }
-    }
-    function clearRecordShowIndex(records, childrenField = 'children') {
-        for (let i = 0; i < records.length; i++) {
-            if (records[i][childrenField]?.length) {
-                clearRecordShowIndex(records[i][childrenField], childrenField);
-            }
-            else {
-                delete records[i].vtable_gantt_showIndex;
-            }
+        if (forceSetMillisecond) {
+            date.setMilliseconds(999);
         }
+        return date;
     }
-    function getTaskIndexsByTaskY(y, gantt) {
-        let task_index;
-        let sub_task_index;
-        if (gantt.taskListTableInstance) {
-            const rowInfo = gantt.taskListTableInstance.getTargetRowAt(y + gantt.headerHeight);
-            if (rowInfo) {
-                const { row } = rowInfo;
-                task_index = row - gantt.taskListTableInstance.columnHeaderLevelCount;
-                const beforeRowsHeight = gantt.getRowsHeightByIndex(0, task_index - 1);
-                if (gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Inline ||
-                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Arrange ||
-                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Compact ||
-                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Separate) {
-                    sub_task_index = Math.floor((y - beforeRowsHeight) / gantt.parsedOptions.rowHeight);
+    function createDateAtLastHour(dateStr, forceLastHour = false) {
+        let date;
+        if (dateStr) {
+            date = new Date(dateStr);
+            if (typeof dateStr === 'string') {
+                if (dateStr.length > 10) {
+                    if (forceLastHour) {
+                        date.setHours(23, 59, 59, 999);
+                    }
+                    return date;
                 }
+                date.setHours(23, 59, 59, 999);
             }
         }
         else {
-            task_index = Math.floor(y / gantt.parsedOptions.rowHeight);
-        }
-        return { task_index, sub_task_index };
-    }
-    function computeRowsCountByRecordDateForCompact(gantt, record) {
-        if (!record.children || record.children.length === 1) {
-            if (record.children?.length === 1) {
-                record.children[0].vtable_gantt_showIndex = 0;
-            }
-            else {
-                record.vtable_gantt_showIndex = 0;
-            }
-            return 1;
+            date = new Date();
         }
-        const sortedChildren = record.children.slice().sort((a, b) => {
-            const { startDate: aStartDate } = formatRecordDateConsiderHasHour(gantt, a);
-            const { startDate: bStartDate } = formatRecordDateConsiderHasHour(gantt, b);
-            return aStartDate.getTime() - bStartDate.getTime();
-        });
-        const rows = [];
-        for (let i = 0; i <= sortedChildren.length - 1; i++) {
-            const newRecord = sortedChildren[i];
-            const { startDate, endDate } = formatRecordDateConsiderHasHour(gantt, newRecord);
-            let placed = false;
-            for (let j = 0; j < rows.length; j++) {
-                if (startDate.getTime() > rows[j]) {
-                    rows[j] = endDate.getTime();
-                    placed = true;
-                    newRecord.vtable_gantt_showIndex = j;
-                    break;
-                }
-            }
-            if (!placed) {
-                rows.push(endDate.getTime());
-                newRecord.vtable_gantt_showIndex = rows.length - 1;
-            }
+        if (forceLastHour) {
+            date.setHours(23, 59, 59, 999);
         }
-        return rows.length;
-    }
-    function isOverlapping(startDate, endDate, rowTasks, gantt) {
-        return rowTasks.some(rowTask => {
-            const { startDate: startDate2, endDate: endDate2 } = formatRecordDateConsiderHasHour(gantt, rowTask);
-            return startDate <= endDate2 && startDate2 <= endDate;
-        });
+        return date;
     }
-    function computeRowsCountByRecordDate(gantt, record) {
-        if (!record.children || record.children.length === 1) {
-            if (record.children?.length === 1) {
-                record.children[0].vtable_gantt_showIndex = 0;
-            }
-            else {
-                record.vtable_gantt_showIndex = 0;
-            }
-            return 1;
+    function getEndDateByTimeUnit(startDate, date, timeScale, step) {
+        let endDate = new Date(date);
+        switch (timeScale) {
+            case 'second':
+                endDate.setMilliseconds(999);
+                break;
+            case 'minute':
+                endDate.setSeconds(59, 999);
+                break;
+            case 'hour':
+                endDate.setMinutes(59, 59, 999);
+                break;
+            case 'day':
+                endDate.setHours(23, 59, 59, 999);
+                break;
+            case 'week':
+                const day = endDate.getDay();
+                const diffToEndOfWeek = 6 - day;
+                endDate.setDate(endDate.getDate() + diffToEndOfWeek);
+                endDate.setHours(23, 59, 59, 999);
+                break;
+            case 'month':
+                const lastDayOfMonth = new Date(endDate.getFullYear(), endDate.getMonth() + 1, 0).getDate();
+                endDate.setDate(lastDayOfMonth);
+                endDate.setHours(23, 59, 59, 999);
+                break;
+            case 'quarter':
+                const currentMonth = endDate.getMonth();
+                const endMonthOfQuarter = currentMonth - (currentMonth % 3) + 2;
+                const lastDayOfQuarter = new Date(endDate.getFullYear(), endMonthOfQuarter + 1, 0).getDate();
+                endDate.setMonth(endMonthOfQuarter, lastDayOfQuarter);
+                endDate.setHours(23, 59, 59, 999);
+                break;
+            case 'year':
+                endDate.setMonth(11, 31);
+                endDate.setHours(23, 59, 59, 999);
+                break;
+            default:
+                throw new Error('Invalid time scale');
         }
-        const rows = [];
-        for (let i = 0; i <= record.children.length - 1; i++) {
-            const newRecord = record.children[i];
-            const { startDate, endDate } = formatRecordDateConsiderHasHour(gantt, newRecord);
-            let placed = false;
-            for (let j = 0; j < rows.length; j++) {
-                const rowTasks = record.children.filter((t) => t !== newRecord && t.vtable_gantt_showIndex === j);
-                if (!isOverlapping(startDate, endDate, rowTasks, gantt)) {
-                    rows[j] = endDate.getTime();
-                    placed = true;
-                    newRecord.vtable_gantt_showIndex = j;
+        const count = computeCountToTimeScale(endDate, startDate, timeScale, step, 1);
+        const targetCount = Math.ceil(count);
+        if (targetCount > count) {
+            const dif = (targetCount - count) * step;
+            const msInSecond = 1000;
+            const msInMinute = msInSecond * 60;
+            const msInHour = msInMinute * 60;
+            const msInDay = msInHour * 24;
+            const msInWeek = msInDay * 7;
+            new Date(endDate.getTime() + 1);
+            switch (timeScale) {
+                case 'second':
+                    endDate.setTime(endDate.getTime() + dif * msInSecond);
                     break;
-                }
-            }
-            if (!placed) {
-                rows.push(endDate.getTime());
-                newRecord.vtable_gantt_showIndex = rows.length - 1;
+                case 'minute':
+                    endDate.setTime(endDate.getTime() + dif * msInMinute);
+                    break;
+                case 'hour':
+                    endDate.setTime(endDate.getTime() + dif * msInHour);
+                    break;
+                case 'day':
+                    endDate.setTime(endDate.getTime() + dif * msInDay);
+                    break;
+                case 'week':
+                    endDate.setTime(endDate.getTime() + dif * msInWeek);
+                    break;
+                case 'month':
+                    endDate = new Date(endDate.getFullYear(), endDate.getMonth() + 1 + Math.round(dif), 0);
+                    endDate.setHours(23, 59, 59, 999);
+                    break;
+                case 'quarter':
+                    const currentMonth = endDate.getMonth();
+                    const endMonthOfQuarter = currentMonth - (currentMonth % 3) + 2;
+                    endDate = new Date(endDate.getFullYear(), endMonthOfQuarter + Math.round(dif * 3) + 1, 0);
+                    endDate.setHours(23, 59, 59, 999);
+                    break;
+                case 'year':
+                    endDate.setFullYear(endDate.getFullYear() + Math.floor(dif));
+                    endDate.setHours(23, 59, 59, 999);
+                    break;
+                default:
+                    throw new Error('Invalid time scale');
             }
         }
-        return rows.length;
-    }
-    function formatRecordDateConsiderHasHour(gantt, record) {
-        const { timeScaleIncludeHour, startDateField, endDateField } = gantt.parsedOptions;
-        const startDate = record[startDateField];
-        const endDate = record[endDateField];
-        if (timeScaleIncludeHour) {
-            return { startDate: createDateAtMidnight(startDate), endDate: createDateAtLastHour(endDate) };
-        }
-        return { startDate: createDateAtMidnight(startDate, true), endDate: createDateAtLastHour(endDate, true) };
-    }
-    function updateOptionsWhenRecordChanged(gantt) {
-        const options = gantt.options;
-        const { unit: minTimeUnit, startOfWeek } = gantt.parsedOptions.reverseSortedTimelineScales[0];
-        gantt.parsedOptions.markLine = generateMarkLine(options?.markLine);
-        if (gantt.parsedOptions.markLine?.length ?? 0) {
-            if (gantt.parsedOptions.markLine?.every(item => item.scrollToMarkLine === undefined)) {
-                gantt.parsedOptions.markLine[0].scrollToMarkLine = true;
-            }
-            if (gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine)) {
-                gantt.parsedOptions.scrollToMarkLineDate = getStartDateByTimeUnit(new Date(gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine).date), minTimeUnit, startOfWeek);
-            }
-        }
-        gantt.parsedOptions.dependencyLinks = options.dependency?.links;
-    }
-    function updateOptionsWhenDateRangeChanged(gantt) {
-        const options = gantt.options;
-        const { unit: minTimeUnit, startOfWeek, step } = gantt.parsedOptions.reverseSortedTimelineScales[0];
-        gantt.parsedOptions.minDate = options?.minDate
-            ? getStartDateByTimeUnit(new Date(options.minDate), minTimeUnit, startOfWeek)
-            : undefined;
-        gantt.parsedOptions.maxDate = options?.maxDate
-            ? getEndDateByTimeUnit(gantt.parsedOptions.minDate, new Date(options.maxDate), minTimeUnit, step)
-            : undefined;
-        gantt.parsedOptions._minDateTime = gantt.parsedOptions.minDate?.getTime();
-        gantt.parsedOptions._maxDateTime = gantt.parsedOptions.maxDate?.getTime();
-    }
-    function updateOptionsWhenMarkLineChanged(gantt) {
-        const options = gantt.options;
-        gantt.parsedOptions.markLine = generateMarkLine(options?.markLine);
-    }
-    function _getTaskInfoByXYForCreateSchedule(eventX, eventY, gantt) {
-        const taskIndex = getTaskIndexsByTaskY(eventY - gantt.headerHeight + gantt.stateManager.scrollTop, gantt);
-        const recordParent = gantt.getRecordByIndex(taskIndex.task_index);
-        const dateIndex = getDateIndexByX(eventX, gantt);
-        const dateRange = gantt.getDateRangeByIndex(dateIndex);
-        if (recordParent?.children) {
-            const taskIndex = getTaskIndexsByTaskY(eventY - gantt.headerHeight + gantt.stateManager.scrollTop, gantt);
-            for (let i = 0; i < recordParent.children.length; i++) {
-                const { startDate, endDate, taskDays, progress, taskRecord } = gantt.getTaskInfoByTaskListIndex(taskIndex.task_index, i);
-                if (((gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Compact ||
-                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Arrange) &&
-                    taskRecord.vtable_gantt_showIndex === taskIndex.sub_task_index) ||
-                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Inline) {
-                    if (dateRange.startDate.getTime() >= startDate.getTime() && dateRange.endDate.getTime() <= endDate.getTime()) {
-                        return { startDate, endDate, taskDays, progress, taskRecord };
-                    }
-                }
-            }
-        }
-    }
-    function getNodeClickPos(marklineIconNode, gantt) {
-        const left = marklineIconNode.globalTransMatrix.e +
-            gantt.taskListTableInstance.tableNoFrameWidth +
-            gantt.taskListTableInstance.tableX +
-            gantt.tableX;
-        const top = marklineIconNode.globalTransMatrix.f;
-        const width = marklineIconNode.attribute.width;
-        const height = marklineIconNode.attribute.height;
-        return {
-            left,
-            top,
-            width,
-            height
-        };
-    }
-    function judgeIfHasMarkLine(data, markLine) {
-        const beginTime = data.startDate.getTime();
-        const endTime = data.endDate.getTime();
-        return markLine.some(item => {
-            const marklineTime = new Date(item.date).getTime();
-            return marklineTime >= beginTime && marklineTime <= endTime;
-        });
-    }
-
-    function throttle$1(func, delay) {
-        let timer = null;
-        return function (...args) {
-            if (!timer) {
-                func.apply(this, args);
-                timer = setTimeout(() => {
-                    timer = null;
-                }, delay);
-            }
-        };
-    }
-    function getTodayNearDay(dayOffset, format) {
-        const today = new Date();
-        const todayTime = today.getTime();
-        const oneDayTime = 24 * 60 * 60 * 1000;
-        const targetTime = todayTime + dayOffset * oneDayTime;
-        const date = new Date(targetTime);
-        if (format) {
-            const year = date.getFullYear().toString();
-            const month = (date.getMonth() + 1).toString().padStart(2, '0');
-            const day = date.getDate().toString().padStart(2, '0');
-            format = format.replace('yyyy', year);
-            format = format.replace('mm', month);
-            format = format.replace('dd', day);
-            return format;
-        }
-        return date;
-    }
-    function formatDate(date, format) {
-        const year = date.getFullYear().toString();
-        const month = (date.getMonth() + 1).toString().padStart(2, '0');
-        const day = date.getDate().toString().padStart(2, '0');
-        format = format.replace('yyyy', year);
-        format = format.replace('mm', month);
-        format = format.replace('dd', day);
-        if (format.length > 10) {
-            const hour = date.getHours().toString().padStart(2, '0');
-            const minute = date.getMinutes().toString().padStart(2, '0');
-            const second = date.getSeconds().toString().padStart(2, '0');
-            format = format.replace('hh', hour);
-            format = format.replace('mm', minute);
-            format = format.replace('ss', second);
-        }
-        return format;
-    }
-    function validateDate(dateParts, format) {
-        const yearIndex = format.indexOf('yyyy');
-        const monthIndex = format.indexOf('mm');
-        const dayIndex = format.indexOf('dd');
-        const dateYearIndex = yearIndex < monthIndex ? (yearIndex < dayIndex ? 0 : 1) : monthIndex < dayIndex ? 1 : 2;
-        const dateMonthIndex = monthIndex < yearIndex ? (monthIndex < dayIndex ? 0 : 1) : monthIndex < dayIndex ? 1 : 2;
-        const dateDayIndex = dayIndex < yearIndex ? (dayIndex < monthIndex ? 0 : 1) : dayIndex < monthIndex ? 1 : 2;
-        const year = parseInt(dateParts[dateYearIndex], 10);
-        const month = parseInt(dateParts[dateMonthIndex], 10) - 1;
-        const day = parseInt(dateParts[dateDayIndex], 10);
-        if (isNaN(year) || year < 1) {
-            return false;
-        }
-        if (isNaN(month) || month < 0 || month > 11) {
-            return false;
-        }
-        const daysInMonth = [31, isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
-        if (isNaN(day) || day < 1 || day > daysInMonth[month]) {
-            return false;
-        }
-        return true;
-    }
-    function validateTime(dateParts, format) {
-        if (format.includes('hh') || format.includes('mm') || format.includes('ss')) {
-            const timeIndex = format.indexOf('hh') > -1 ? format.indexOf('hh') : format.indexOf('HH');
-            const hour = parseInt(dateParts[timeIndex], 10);
-            const minute = parseInt(dateParts[timeIndex + 1], 10);
-            const second = dateParts.length > timeIndex + 2 ? parseInt(dateParts[timeIndex + 2], 10) : 0;
-            if (isNaN(hour) || hour < 0 || hour > 23) {
-                return false;
-            }
-            if (isNaN(minute) || minute < 0 || minute > 59) {
-                return false;
-            }
-            if (isNaN(second) || second < 0 || second > 59) {
-                return false;
-            }
-        }
-        return true;
-    }
-    function isLeapYear(year) {
-        return (year % 4 === 0 && year % 100 !== 0) || year % 400 === 0;
-    }
-    function parseDateFormat(dateString) {
-        const formats = [
-            'yyyy-mm-dd',
-            'dd-mm-yyyy',
-            'mm/dd/yyyy',
-            'yyyy/mm/dd',
-            'dd/mm/yyyy',
-            'yyyy.mm.dd',
-            'mm.dd.yyyy',
-            'dd.mm.yyyy'
-        ];
-        const timeFormat = ['hh:mm:ss', 'hh:mm'];
-        dateString = dateString.trim();
-        const dates = dateString.split(' ');
-        const date = dates[0];
-        const time = dates[1];
-        let dateFormatMatched;
-        let timeFormatMatched;
-        if (date) {
-            for (let i = 0; i < formats.length; i++) {
-                const format = formats[i];
-                const dateParts = date.split(getSeparator(format));
-                const isValid = validateDate(dateParts, format);
-                if (dateParts.length === 3 && isValid) {
-                    dateFormatMatched = format;
-                    break;
-                }
-            }
-        }
-        if (dateFormatMatched) {
-            if (time) {
-                for (let i = 0; i < timeFormat.length; i++) {
-                    const format = timeFormat[i];
-                    const timeParts = time.split(getSeparator(format));
-                    const formatParts = format.split(getSeparator(format));
-                    const isValid = validateTime(timeParts, format);
-                    if (isValid && timeParts.length === formatParts.length) {
-                        timeFormatMatched = format;
-                        break;
-                    }
-                }
-            }
-        }
-        if (date && time && dateFormatMatched && timeFormatMatched) {
-            return dateFormatMatched + ' ' + timeFormatMatched;
-        }
-        if (date && !time) {
-            return dateFormatMatched;
-        }
-        return 'yyyy-mm-dd hh:mm:ss';
-    }
-    function getSeparator(format) {
-        const separators = format.match(/[^\w]/g);
-        if (separators) {
-            const escapedSeparators = separators.map(s => '\\' + s).join('|');
-            return new RegExp(escapedSeparators, 'g');
-        }
-        return /[^\w]/;
-    }
-    function parseStringTemplate(template, data) {
-        const result = template.replace(/\{([^}]+)\}/g, (match, key) => {
-            const keys = key.split('.');
-            let value = data;
-            for (const k of keys) {
-                if (value.hasOwnProperty(k)) {
-                    value = value[k];
-                }
-                else {
-                    value = match;
-                    break;
-                }
-            }
-            return value;
-        });
-        return result;
-    }
-    function toBoxArray$2(obj) {
-        if (!Array.isArray(obj)) {
-            return [obj, obj, obj, obj];
-        }
-        if (obj.length === 3) {
-            return [obj[0], obj[1], obj[2], obj[1]];
-        }
-        if (obj.length === 2) {
-            return [obj[0], obj[1], obj[0], obj[1]];
-        }
-        if (obj.length === 1) {
-            return [obj[0], obj[0], obj[0], obj[0]];
-        }
-        return [obj[0], obj[1], obj[2], obj[3]];
-    }
-    function getWeekNumber(currentDate) {
-        const startOfYear = new Date(currentDate.getFullYear(), 0, 1);
-        const weekNumber = Math.ceil(((currentDate.getTime() + 1 - startOfYear.getTime()) / 86400000 + 1) / 7);
-        return weekNumber;
-    }
-    function getWeekday(dateString, format = 'long') {
-        const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
-        const date = new Date(dateString);
-        if (format === 'short') {
-            return days[date.getDay()].substr(0, 3);
-        }
-        else if (format === 'long') {
-            return days[date.getDay()];
-        }
-        return 'Invalid format specified. Please use "short" or "long".';
-    }
-    function isPropertyWritable(obj, prop) {
-        const descriptor = Object.getOwnPropertyDescriptor(obj, prop);
-        if (!descriptor) {
-            return false;
-        }
-        return !!descriptor.set || descriptor.writable === true;
-    }
-    function createDateAtMidnight(dateStr, forceMidnight = false) {
-        let date;
-        if (dateStr) {
-            date = new Date(dateStr);
-            if (typeof dateStr === 'string') {
-                if (dateStr.length > 10) {
-                    if (forceMidnight) {
-                        date.setHours(0, 0, 0, 0);
-                    }
-                    return date;
-                }
-                date.setHours(0, 0, 0, 0);
-            }
-        }
-        else {
-            date = new Date();
-        }
-        if (forceMidnight) {
-            date.setHours(0, 0, 0, 0);
-        }
-        return date;
-    }
-    function createDateAtLastMinute(dateStr, forceSetMinute = false) {
-        let date;
-        if (dateStr) {
-            date = new Date(dateStr);
-            if (typeof dateStr === 'string') {
-                if (dateStr.length > 10) {
-                    if (forceSetMinute) {
-                        date.setMinutes(59, 59, 999);
-                    }
-                    return date;
-                }
-                date.setMinutes(59, 59, 999);
-            }
-        }
-        else {
-            date = new Date();
-        }
-        if (forceSetMinute) {
-            date.setMinutes(59, 59, 999);
-        }
-        return date;
-    }
-    function createDateAtLastSecond(dateStr, forceSetSecond = false) {
-        let date;
-        if (dateStr) {
-            date = new Date(dateStr);
-            if (typeof dateStr === 'string') {
-                if (dateStr.length > 10) {
-                    if (forceSetSecond) {
-                        date.setSeconds(59, 999);
-                    }
-                    return date;
-                }
-                date.setSeconds(59, 999);
-            }
-        }
-        else {
-            date = new Date();
-        }
-        if (forceSetSecond) {
-            date.setSeconds(59, 999);
-        }
-        return date;
-    }
-    function createDateAtLastMillisecond(dateStr, forceSetMillisecond = false) {
-        let date;
-        if (dateStr) {
-            date = new Date(dateStr);
-            if (typeof dateStr === 'string') {
-                if (dateStr.length > 10) {
-                    if (forceSetMillisecond) {
-                        date.setMilliseconds(999);
-                    }
-                    return date;
-                }
-                date.setMilliseconds(999);
-            }
-        }
-        else {
-            date = new Date();
-        }
-        if (forceSetMillisecond) {
-            date.setMilliseconds(999);
-        }
-        return date;
-    }
-    function createDateAtLastHour(dateStr, forceLastHour = false) {
-        let date;
-        if (dateStr) {
-            date = new Date(dateStr);
-            if (typeof dateStr === 'string') {
-                if (dateStr.length > 10) {
-                    if (forceLastHour) {
-                        date.setHours(23, 59, 59, 999);
-                    }
-                    return date;
-                }
-                date.setHours(23, 59, 59, 999);
-            }
-        }
-        else {
-            date = new Date();
-        }
-        if (forceLastHour) {
-            date.setHours(23, 59, 59, 999);
-        }
-        return date;
-    }
-    function getEndDateByTimeUnit(startDate, date, timeScale, step) {
-        let endDate = new Date(date);
-        switch (timeScale) {
-            case 'second':
-                endDate.setMilliseconds(999);
-                break;
-            case 'minute':
-                endDate.setSeconds(59, 999);
-                break;
-            case 'hour':
-                endDate.setMinutes(59, 59, 999);
-                break;
-            case 'day':
-                endDate.setHours(23, 59, 59, 999);
-                break;
-            case 'week':
-                const day = endDate.getDay();
-                const diffToEndOfWeek = 6 - day;
-                endDate.setDate(endDate.getDate() + diffToEndOfWeek);
-                endDate.setHours(23, 59, 59, 999);
-                break;
-            case 'month':
-                const lastDayOfMonth = new Date(endDate.getFullYear(), endDate.getMonth() + 1, 0).getDate();
-                endDate.setDate(lastDayOfMonth);
-                endDate.setHours(23, 59, 59, 999);
-                break;
-            case 'quarter':
-                const currentMonth = endDate.getMonth();
-                const endMonthOfQuarter = currentMonth - (currentMonth % 3) + 2;
-                const lastDayOfQuarter = new Date(endDate.getFullYear(), endMonthOfQuarter + 1, 0).getDate();
-                endDate.setMonth(endMonthOfQuarter, lastDayOfQuarter);
-                endDate.setHours(23, 59, 59, 999);
-                break;
-            case 'year':
-                endDate.setMonth(11, 31);
-                endDate.setHours(23, 59, 59, 999);
-                break;
-            default:
-                throw new Error('Invalid time scale');
-        }
-        const count = computeCountToTimeScale(endDate, startDate, timeScale, step, 1);
-        const targetCount = Math.ceil(count);
-        if (targetCount > count) {
-            const dif = (targetCount - count) * step;
-            const msInSecond = 1000;
-            const msInMinute = msInSecond * 60;
-            const msInHour = msInMinute * 60;
-            const msInDay = msInHour * 24;
-            const msInWeek = msInDay * 7;
-            new Date(endDate.getTime() + 1);
-            switch (timeScale) {
-                case 'second':
-                    endDate.setTime(endDate.getTime() + dif * msInSecond);
-                    break;
-                case 'minute':
-                    endDate.setTime(endDate.getTime() + dif * msInMinute);
-                    break;
-                case 'hour':
-                    endDate.setTime(endDate.getTime() + dif * msInHour);
-                    break;
-                case 'day':
-                    endDate.setTime(endDate.getTime() + dif * msInDay);
-                    break;
-                case 'week':
-                    endDate.setTime(endDate.getTime() + dif * msInWeek);
-                    break;
-                case 'month':
-                    endDate = new Date(endDate.getFullYear(), endDate.getMonth() + 1 + Math.round(dif), 0);
-                    endDate.setHours(23, 59, 59, 999);
-                    break;
-                case 'quarter':
-                    const currentMonth = endDate.getMonth();
-                    const endMonthOfQuarter = currentMonth - (currentMonth % 3) + 2;
-                    endDate = new Date(endDate.getFullYear(), endMonthOfQuarter + Math.round(dif * 3) + 1, 0);
-                    endDate.setHours(23, 59, 59, 999);
-                    break;
-                case 'year':
-                    endDate.setFullYear(endDate.getFullYear() + Math.floor(dif));
-                    endDate.setHours(23, 59, 59, 999);
-                    break;
-                default:
-                    throw new Error('Invalid time scale');
-            }
-        }
-        return endDate;
+        return endDate;
     }
     function getStartDateByTimeUnit(date, timeScale, startOfWeekSetting = 'monday') {
         const startDate = new Date(date);
@@ -27825,11 +27020,9 @@
             case 'quarter':
                 difference =
                     (adjusted_date.getFullYear() - startDate.getFullYear()) * 4 +
-                        Math.floor(adjusted_date.getMonth() / 3) -
-                        Math.floor(startDate.getMonth() / 3);
+                        (adjusted_date.getMonth() - startDate.getMonth()) / 3;
                 difference +=
-                    (adjusted_date.getTime() - startDate.getTime()) /
-                        DayTimes /
+                    (adjusted_date.getDate() - startDate.getDate()) /
                         (3 * new Date(adjusted_date.getFullYear(), adjusted_date.getMonth() + 1, 0).getDate());
                 break;
             case 'year':
@@ -28435,156 +27628,961 @@
             this._gantt.stateManager.setScrollTop(oldVerticalBarPos);
         }
     }
-
-    function handleWhell$1(event, state, gantt, isWheelEvent = true) {
-        let { deltaX, deltaY } = event;
-        if (event.shiftKey && event.deltaY) {
-            deltaX = deltaY;
-            deltaY = 0;
+
+    function handleWhell$1(event, state, gantt, isWheelEvent = true) {
+        let { deltaX, deltaY } = event;
+        if (event.shiftKey && event.deltaY) {
+            deltaX = deltaY;
+            deltaY = 0;
+        }
+        const [optimizedDeltaX, optimizedDeltaY] = optimizeScrollXY$1(deltaX, deltaY, { horizontal: 1, vertical: 1 });
+        if (optimizedDeltaX) {
+            state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX);
+            gantt.scenegraph.scrollbarComponent.showHorizontalScrollBar(true);
+        }
+        if (optimizedDeltaY) {
+            state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY);
+            gantt.scenegraph.scrollbarComponent.showVerticalScrollBar(true);
+        }
+        isWheelEvent && state.resetInteractionState();
+        if (event.cancelable &&
+            (state._gantt.parsedOptions.overscrollBehavior === 'none' ||
+                (Math.abs(deltaY) >= Math.abs(deltaX) && deltaY !== 0 && isVerticalScrollable$1(deltaY, state)) ||
+                (Math.abs(deltaY) <= Math.abs(deltaX) && deltaX !== 0 && isHorizontalScrollable$1(deltaX, state)))) {
+            event.preventDefault();
+        }
+    }
+    function optimizeScrollXY$1(x, y, ratio) {
+        const ANGLE = 2;
+        const angle = Math.abs(x / y);
+        const deltaX = angle <= 1 / ANGLE ? 0 : x;
+        const deltaY = angle > ANGLE ? 0 : y;
+        return [Math.ceil(deltaX * (ratio.horizontal ?? 0)), Math.ceil(deltaY * (ratio.vertical ?? 0))];
+    }
+    function isVerticalScrollable$1(deltaY, state) {
+        const totalHeight = state._gantt.getAllRowsHeight() - state._gantt.scenegraph.height;
+        if (totalHeight === 0) {
+            return false;
+        }
+        return !isScrollToTop$1(deltaY, state) && !isScrollToBottom$1(deltaY, state);
+    }
+    function isHorizontalScrollable$1(deltaX, state) {
+        const totalWidth = state._gantt.getAllDateColsWidth() - state._gantt.scenegraph.width;
+        if (totalWidth === 0) {
+            return false;
+        }
+        return !isScrollToLeft$1(deltaX, state) && !isScrollToRight$1(deltaX, state);
+    }
+    function isScrollToTop$1(deltaY, state) {
+        const totalHeight = state._gantt.getAllRowsHeight() - state._gantt.scenegraph.height;
+        return totalHeight !== 0 && deltaY <= 0 && state.scroll.verticalBarPos < 1;
+    }
+    function isScrollToBottom$1(deltaY, state) {
+        const totalHeight = state._gantt.getAllRowsHeight() - state._gantt.scenegraph.height;
+        return totalHeight !== 0 && deltaY >= 0 && Math.abs(state.scroll.verticalBarPos - totalHeight) < 1;
+    }
+    function isScrollToLeft$1(deltaX, state) {
+        const totalWidth = state._gantt.getAllDateColsWidth() - state._gantt.scenegraph.width;
+        return totalWidth !== 0 && deltaX <= 0 && state.scroll.horizontalBarPos < 1;
+    }
+    function isScrollToRight$1(deltaX, state) {
+        const totalWidth = state._gantt.getAllDateColsWidth() - state._gantt.scenegraph.width;
+        return totalWidth !== 0 && deltaX >= 0 && Math.abs(state.scroll.horizontalBarPos - totalWidth) < 1;
+    }
+    function bindScrollBarListener$1(eventManager) {
+        const table = eventManager._gantt;
+        const stateManager = table.stateManager;
+        const scenegraph = table.scenegraph;
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerover', (e) => {
+            scenegraph.scrollbarComponent.showVerticalScrollBar();
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerover', (e) => {
+            scenegraph.scrollbarComponent.showHorizontalScrollBar();
+        });
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerout', (e) => {
+            if (stateManager.interactionState === InteractionState$1.scrolling) {
+                return;
+            }
+            scenegraph.scrollbarComponent.hideVerticalScrollBar();
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerout', (e) => {
+            if (stateManager.interactionState === InteractionState$1.scrolling) {
+                return;
+            }
+            scenegraph.scrollbarComponent.hideHorizontalScrollBar();
+        });
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointermove', (e) => {
+            e.stopPropagation();
+        });
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('scrollDown', (e) => {
+            scenegraph._gantt.eventManager.isDown = true;
+        });
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerup', () => {
+            scenegraph._gantt.eventManager.isDraging = false;
+            if (stateManager.interactionState === InteractionState$1.scrolling) {
+                stateManager.updateInteractionState(InteractionState$1.default);
+            }
+        });
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerupoutside', () => {
+            if (stateManager.interactionState === InteractionState$1.scrolling) {
+                stateManager.updateInteractionState(InteractionState$1.default);
+            }
+        });
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('scrollUp', (e) => {
+            scenegraph._gantt.eventManager.isDraging = false;
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointermove', (e) => {
+            e.stopPropagation();
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerdown', (e) => {
+            e.stopPropagation();
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('scrollDown', (e) => {
+            scenegraph._gantt.eventManager.isDown = true;
+            if (stateManager.interactionState !== InteractionState$1.scrolling) {
+                stateManager.updateInteractionState(InteractionState$1.scrolling);
+            }
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerup', () => {
+            if (stateManager.interactionState === InteractionState$1.scrolling) {
+                stateManager.updateInteractionState(InteractionState$1.default);
+            }
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerupoutside', () => {
+            if (stateManager.interactionState === InteractionState$1.scrolling) {
+                stateManager.updateInteractionState(InteractionState$1.default);
+            }
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('scrollUp', (e) => {
+            scenegraph._gantt.eventManager.isDraging = false;
+        });
+        const throttleVerticalWheel = throttle$1(stateManager.updateVerticalScrollBar, 20);
+        const throttleHorizontalWheel = throttle$1(stateManager.updateHorizontalScrollBar, 20);
+        scenegraph.scrollbarComponent.vScrollBar.addEventListener('scrollDrag', (e) => {
+            if (scenegraph._gantt.eventManager.isDown) {
+                scenegraph._gantt.eventManager.isDraging = true;
+            }
+            if (stateManager.interactionState !== InteractionState$1.scrolling) {
+                stateManager.updateInteractionState(InteractionState$1.scrolling);
+            }
+            const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
+            throttleVerticalWheel(ratio, e);
+        });
+        scenegraph.scrollbarComponent.hScrollBar.addEventListener('scrollDrag', (e) => {
+            if (scenegraph._gantt.eventManager.isDown) {
+                scenegraph._gantt.eventManager.isDraging = true;
+            }
+            stateManager.fastScrolling = true;
+            if (stateManager.interactionState !== InteractionState$1.scrolling) {
+                stateManager.updateInteractionState(InteractionState$1.scrolling);
+            }
+            const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
+            throttleHorizontalWheel(ratio);
+        });
+    }
+
+    const defaultTaskBarStyle = {
+        barColor: 'blue',
+        completedBarColor: 'gray',
+        width: 30,
+        cornerRadius: 3,
+        borderWidth: 0,
+        fontFamily: 'Arial',
+        fontSize: 14
+    };
+    function setWidthToDefaultTaskBarStyle(width) {
+        defaultTaskBarStyle.width = width;
+    }
+    const isNode$1 = typeof window === 'undefined' || typeof window.window === 'undefined';
+    const DayTimes = 1000 * 60 * 60 * 24;
+    function getDateIndexByX(x, gantt) {
+        const totalX = x + gantt.stateManager.scroll.horizontalBarPos;
+        const firstDateColWidth = gantt.getDateColWidth(0);
+        const dateIndex = Math.floor((totalX - firstDateColWidth) / gantt.parsedOptions.timelineColWidth) + 1;
+        return dateIndex;
+    }
+    function generateMarkLine(markLine) {
+        if (!markLine) {
+            return [];
+        }
+        if (markLine === true) {
+            return [
+                {
+                    date: createDateAtMidnight().toLocaleDateString(),
+                    scrollToMarkLine: true,
+                    position: 'left',
+                    style: {
+                        lineColor: 'red',
+                        lineWidth: 1
+                    }
+                }
+            ];
+        }
+        else if (Array.isArray(markLine)) {
+            return markLine.map((item, index) => {
+                return {
+                    ...item,
+                    date: item.date,
+                    scrollToMarkLine: item.scrollToMarkLine,
+                    position: item.position ?? 'left',
+                    style: {
+                        lineColor: item.style?.lineColor || 'red',
+                        lineWidth: item.style?.lineWidth || 1,
+                        lineDash: item.style?.lineDash
+                    }
+                };
+            });
+        }
+        return [
+            {
+                ...markLine,
+                date: markLine.date,
+                scrollToMarkLine: markLine.scrollToMarkLine ?? true,
+                position: markLine.position ?? 'left',
+                style: {
+                    lineColor: markLine.style?.lineColor || 'red',
+                    lineWidth: markLine.style?.lineWidth || 1,
+                    lineDash: markLine.style?.lineDash
+                }
+            }
+        ];
+    }
+    function getHorizontalScrollBarSize$1(scrollStyle) {
+        if (scrollStyle?.hoverOn ||
+            (scrollStyle?.horizontalVisible && scrollStyle?.horizontalVisible === 'none') ||
+            (!scrollStyle?.horizontalVisible && scrollStyle?.visible === 'none')) {
+            return 0;
+        }
+        return scrollStyle?.width ?? 7;
+    }
+    function getVerticalScrollBarSize$1(scrollStyle) {
+        if (scrollStyle?.hoverOn ||
+            (scrollStyle?.verticalVisible && scrollStyle?.verticalVisible === 'none') ||
+            (!scrollStyle?.verticalVisible && scrollStyle?.visible === 'none')) {
+            return 0;
+        }
+        return scrollStyle?.width ?? 7;
+    }
+    function initOptions(gantt) {
+        const options = gantt.options;
+        gantt.parsedOptions.tasksShowMode = options?.tasksShowMode ?? TasksShowMode.Tasks_Separate;
+        gantt.parsedOptions.pixelRatio = options?.pixelRatio ?? 1;
+        gantt.parsedOptions.rowHeight = options?.rowHeight ?? 40;
+        gantt.parsedOptions.timelineColWidth = options?.timelineHeader?.colWidth ?? 60;
+        gantt.parsedOptions.startDateField = options.taskBar?.startDateField ?? 'startDate';
+        gantt.parsedOptions.endDateField = options.taskBar?.endDateField ?? 'endDate';
+        gantt.parsedOptions.progressField = options.taskBar?.progressField ?? 'progress';
+        const { unit: minTimeUnit, startOfWeek, step } = gantt.parsedOptions.reverseSortedTimelineScales[0];
+        gantt.parsedOptions.minDate = options?.minDate
+            ? getStartDateByTimeUnit(new Date(options.minDate), minTimeUnit, startOfWeek)
+            : undefined;
+        gantt.parsedOptions.maxDate = options?.maxDate
+            ? getEndDateByTimeUnit(gantt.parsedOptions.minDate, new Date(options.maxDate), minTimeUnit, step)
+            : undefined;
+        gantt.parsedOptions._minDateTime = gantt.parsedOptions.minDate?.getTime();
+        gantt.parsedOptions._maxDateTime = gantt.parsedOptions.maxDate?.getTime();
+        gantt.parsedOptions.overscrollBehavior = options?.overscrollBehavior ?? 'auto';
+        gantt.parsedOptions.underlayBackgroundColor = options?.underlayBackgroundColor ?? '#FFF';
+        gantt.parsedOptions.scrollStyle = Object.assign({}, {
+            scrollRailColor: 'rgba(100, 100, 100, 0.2)',
+            scrollSliderColor: 'rgba(100, 100, 100, 0.5)',
+            scrollSliderCornerRadius: 4,
+            width: 10,
+            visible: 'always',
+            hoverOn: true,
+            barToSide: false
+        }, options?.scrollStyle);
+        gantt.parsedOptions.timelineHeaderHorizontalLineStyle = options?.timelineHeader?.horizontalLine;
+        gantt.parsedOptions.timelineHeaderVerticalLineStyle = options?.timelineHeader?.verticalLine;
+        gantt.parsedOptions.timelineHeaderBackgroundColor = options?.timelineHeader?.backgroundColor;
+        gantt.parsedOptions.timeLineHeaderRowHeights = [];
+        gantt.parsedOptions.timelineHeaderStyles = [];
+        for (let i = 0; i < gantt.parsedOptions.sortedTimelineScales.length ?? 0; i++) {
+            const style = gantt.parsedOptions.sortedTimelineScales[i].style;
+            gantt.parsedOptions.timelineHeaderStyles.push(Object.assign({
+                fontSize: 20,
+                fontWeight: 'bold',
+                textAlign: 'center',
+                textBaseline: 'middle',
+                color: '#000',
+                backgroundColor: '#fff'
+            }, style));
+            gantt.parsedOptions.timeLineHeaderRowHeights.push(gantt.parsedOptions.sortedTimelineScales[i].rowHeight ?? options?.headerRowHeight ?? 40);
+        }
+        gantt.parsedOptions.grid = Object.assign({}, options?.grid);
+        setWidthToDefaultTaskBarStyle((gantt.parsedOptions.rowHeight * 3) / 4);
+        gantt.parsedOptions.taskBarStyle =
+            options?.taskBar?.barStyle && typeof options?.taskBar?.barStyle === 'function'
+                ? options.taskBar.barStyle
+                : Object.assign({}, defaultTaskBarStyle, options?.taskBar?.barStyle);
+        gantt.parsedOptions.taskBarMilestoneStyle = Object.assign(typeof gantt.parsedOptions.taskBarStyle === 'function'
+            ? {}
+            : {
+                width: gantt.parsedOptions.taskBarStyle.width,
+                borderColor: gantt.parsedOptions.taskBarStyle.borderColor,
+                borderLineWidth: gantt.parsedOptions.taskBarStyle.borderLineWidth ?? 1,
+                fillColor: gantt.parsedOptions.taskBarStyle.barColor,
+                cornerRadius: 0
+            }, options?.taskBar?.milestoneStyle);
+        gantt.parsedOptions.taskBarMilestoneHypotenuse = gantt.parsedOptions.taskBarMilestoneStyle.width * Math.sqrt(2);
+        gantt.parsedOptions.dateFormat = options?.dateFormat;
+        gantt.parsedOptions.taskBarHoverStyle = Object.assign({
+            barOverlayColor: 'rgba(99, 144, 0, 0.4)'
+        }, options?.taskBar?.hoverBarStyle);
+        gantt.parsedOptions.taskBarSelectable = options?.taskBar?.selectable ?? true;
+        gantt.parsedOptions.taskBarSelectedStyle = Object.assign(typeof gantt.parsedOptions.taskBarStyle === 'function'
+            ? {
+                shadowBlur: 6,
+                shadowOffsetX: 0,
+                shadowOffsetY: 0,
+                borderLineWidth: 1
+            }
+            : {
+                shadowBlur: 6,
+                shadowOffsetX: 0,
+                shadowOffsetY: 0,
+                shadowColor: gantt.parsedOptions.taskBarStyle.barColor,
+                borderColor: gantt.parsedOptions.taskBarStyle.barColor,
+                borderLineWidth: 1
+            }, options?.taskBar?.selectedBarStyle);
+        gantt.parsedOptions.taskBarLabelText = options?.taskBar?.labelText ?? '';
+        gantt.parsedOptions.taskBarMoveable = options?.taskBar?.moveable ?? true;
+        gantt.parsedOptions.moveTaskBarToExtendDateRange = options?.taskBar?.moveToExtendDateRange ?? true;
+        gantt.parsedOptions.taskBarResizable = options?.taskBar?.resizable ?? true;
+        gantt.parsedOptions.taskBarDragOrder = options?.taskBar?.dragOrder ?? true;
+        gantt.parsedOptions.taskBarLabelStyle = {
+            fontFamily: options?.taskBar?.labelTextStyle?.fontFamily ?? 'Arial',
+            fontSize: options?.taskBar?.labelTextStyle?.fontSize ?? 20,
+            color: options?.taskBar?.labelTextStyle?.color ?? '#F01',
+            textAlign: options?.taskBar?.labelTextStyle?.textAlign ?? 'left',
+            textBaseline: options?.taskBar?.labelTextStyle?.textBaseline ?? 'middle',
+            padding: options?.taskBar?.labelTextStyle?.padding ?? [0, 0, 0, 10],
+            textOverflow: options?.taskBar?.labelTextStyle?.textOverflow
+        };
+        gantt.parsedOptions.taskBarCustomLayout = options?.taskBar?.customLayout;
+        gantt.parsedOptions.taskBarCreatable =
+            options?.taskBar?.scheduleCreatable ??
+                !!(gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Separate ||
+                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Tasks_Separate);
+        gantt.parsedOptions.taskBarCreationButtonStyle = Object.assign({
+            lineColor: 'rgb(99, 144, 0)',
+            lineWidth: 1,
+            lineDash: [5, 5],
+            cornerRadius: 4,
+            backgroundColor: '#FFF'
+        }, options?.taskBar?.scheduleCreation?.buttonStyle);
+        gantt.parsedOptions.taskBarCreationCustomLayout = options?.taskBar?.scheduleCreation?.customLayout;
+        gantt.parsedOptions.taskBarCreationMaxWidth = options?.taskBar?.scheduleCreation?.maxWidth;
+        gantt.parsedOptions.taskBarCreationMinWidth = options?.taskBar?.scheduleCreation?.minWidth;
+        gantt.parsedOptions.outerFrameStyle = Object.assign({
+            borderColor: '#e1e4e8',
+            borderLineWidth: 1,
+            cornerRadius: 4
+        }, options.frame?.outerFrameStyle);
+        gantt.parsedOptions.markLine = generateMarkLine(options?.markLine);
+        if (gantt.parsedOptions.markLine?.length ?? 0) {
+            if (gantt.parsedOptions.markLine?.every(item => item.scrollToMarkLine === undefined)) {
+                gantt.parsedOptions.markLine[0].scrollToMarkLine = true;
+            }
+            if (gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine)) {
+                gantt.parsedOptions.scrollToMarkLineDate = getStartDateByTimeUnit(new Date(gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine).date), minTimeUnit, startOfWeek);
+            }
+        }
+        gantt.parsedOptions.verticalSplitLineHighlight = options.frame?.verticalSplitLineHighlight;
+        gantt.parsedOptions.verticalSplitLine = Object.assign({
+            lineColor: gantt.parsedOptions.outerFrameStyle?.borderColor,
+            lineWidth: gantt.parsedOptions.outerFrameStyle?.borderLineWidth
+        }, options.frame?.verticalSplitLine);
+        gantt.parsedOptions.horizontalSplitLine = options.frame?.horizontalSplitLine;
+        gantt.parsedOptions.verticalSplitLineMoveable = options.frame?.verticalSplitLineMoveable;
+        gantt.parsedOptions.taskKeyField = options.taskKeyField ?? 'id';
+        gantt.parsedOptions.dependencyLinks = options.dependency?.links ?? [];
+        gantt.parsedOptions.dependencyLinkCreatable = options.dependency?.linkCreatable ?? false;
+        gantt.parsedOptions.dependencyLinkSelectable = options.dependency?.linkSelectable ?? true;
+        gantt.parsedOptions.dependencyLinkDeletable = options.dependency?.linkDeletable ?? false;
+        gantt.parsedOptions.dependencyLinkLineStyle = Object.assign({
+            lineColor: 'red',
+            lineWidth: 1
+        }, options.dependency?.linkLineStyle);
+        gantt.parsedOptions.dependencyLinkSelectedLineStyle = Object.assign({
+            shadowBlur: 4,
+            shadowOffset: 0,
+            shadowColor: gantt.parsedOptions.dependencyLinkLineStyle.lineColor,
+            lineColor: gantt.parsedOptions.dependencyLinkLineStyle.lineColor,
+            lineWidth: gantt.parsedOptions.dependencyLinkLineStyle.lineWidth
+        }, options?.dependency?.linkSelectedLineStyle);
+        gantt.parsedOptions.dependencyLinkLineCreatePointStyle = Object.assign({
+            strokeColor: 'red',
+            fillColor: 'white',
+            radius: 5,
+            strokeWidth: 1
+        }, options?.dependency?.linkCreatePointStyle);
+        gantt.parsedOptions.dependencyLinkLineCreatingPointStyle = Object.assign({
+            strokeColor: 'red',
+            fillColor: 'red',
+            radius: 5,
+            strokeWidth: 1
+        }, options?.dependency?.linkCreatingPointStyle);
+        gantt.parsedOptions.dependencyLinkLineCreatingStyle = Object.assign({
+            lineColor: 'red',
+            lineWidth: 1,
+            lineDash: [5, 5]
+        }, options?.dependency?.linkCreatingLineStyle);
+        gantt.parsedOptions.eventOptions = options?.eventOptions;
+        gantt.parsedOptions.keyboardOptions = options?.keyboardOptions;
+        gantt.parsedOptions.markLineCreateOptions = options?.markLineCreateOptions;
+    }
+    function updateOptionsWhenScaleChanged(gantt) {
+        const options = gantt.options;
+        const { unit: minTimeUnit, startOfWeek, step } = gantt.parsedOptions.reverseSortedTimelineScales[0];
+        gantt.parsedOptions.minDate = getStartDateByTimeUnit(new Date(gantt.parsedOptions.minDate), minTimeUnit, startOfWeek);
+        gantt.parsedOptions.maxDate = getEndDateByTimeUnit(gantt.parsedOptions.minDate, new Date(gantt.parsedOptions.maxDate), minTimeUnit, step);
+        gantt.parsedOptions._minDateTime = gantt.parsedOptions.minDate?.getTime();
+        gantt.parsedOptions._maxDateTime = gantt.parsedOptions.maxDate?.getTime();
+        gantt.parsedOptions.timeLineHeaderRowHeights = [];
+        gantt.parsedOptions.timelineHeaderStyles = [];
+        for (let i = 0; i < gantt.parsedOptions.sortedTimelineScales.length ?? 0; i++) {
+            const style = gantt.parsedOptions.sortedTimelineScales[i].style;
+            gantt.parsedOptions.timelineHeaderStyles.push(Object.assign({
+                fontSize: 20,
+                fontWeight: 'bold',
+                textAlign: 'center',
+                textBaseline: 'middle',
+                color: '#000',
+                backgroundColor: '#fff'
+            }, style));
+            gantt.parsedOptions.timeLineHeaderRowHeights.push(gantt.parsedOptions.sortedTimelineScales[i].rowHeight ?? options?.headerRowHeight ?? 40);
+        }
+    }
+    function generateTimeLineDate(currentDate, endDate, scale) {
+        const { unit, step, format } = scale;
+        const timelineDates = [];
+        while (currentDate < endDate) {
+            if (unit === 'day') {
+                const year = currentDate.getFullYear();
+                const month = currentDate.getMonth();
+                const day = currentDate.getDate();
+                const end = createDateAtLastHour(new Date(year, month, day + step - 1), true);
+                if (end.getTime() > endDate.getTime()) {
+                    end.setTime(endDate.getTime());
+                }
+                const start = currentDate;
+                const formattedDate = format?.({ dateIndex: day, startDate: start, endDate: end });
+                const columnTitle = formattedDate || day.toString();
+                const dayCellConfig = {
+                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
+                    startDate: start,
+                    endDate: end,
+                    step,
+                    unit: 'day',
+                    title: columnTitle,
+                    dateIndex: day
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate = new Date(year, month, day + step);
+            }
+            else if (unit === 'month') {
+                const year = currentDate.getFullYear();
+                const month = currentDate.getMonth();
+                const end = createDateAtLastHour(new Date(year, month + step, 0), true);
+                if (end.getTime() > endDate.getTime()) {
+                    end.setTime(endDate.getTime());
+                }
+                const start = currentDate;
+                const formattedDate = format?.({ dateIndex: month + 1, startDate: start, endDate: end });
+                const columnTitle = formattedDate || (month + 1).toString();
+                const dayCellConfig = {
+                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
+                    startDate: start,
+                    step,
+                    unit: 'month',
+                    endDate: end,
+                    title: columnTitle,
+                    dateIndex: month + 1
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate = new Date(year, month + step, 1);
+            }
+            else if (unit === 'quarter') {
+                const year = currentDate.getFullYear();
+                const quarter = Math.floor(currentDate.getMonth() / 3);
+                const end = createDateAtLastHour(new Date(year, (quarter + step) * 3, 0), true);
+                if (end.getTime() > endDate.getTime()) {
+                    end.setTime(endDate.getTime());
+                }
+                const start = currentDate;
+                const formattedDate = format?.({ dateIndex: quarter + 1, startDate: start, endDate: end });
+                const columnTitle = formattedDate || (quarter + 1).toString();
+                const dayCellConfig = {
+                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / (1000 * 60 * 60 * 24),
+                    startDate: start,
+                    step,
+                    unit: 'quarter',
+                    endDate: end,
+                    title: columnTitle,
+                    dateIndex: quarter + 1
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate = new Date(year, (quarter + step) * 3, 1);
+            }
+            else if (unit === 'year') {
+                const year = currentDate.getFullYear();
+                const end = createDateAtLastHour(new Date(year + step - 1, 11, 31), true);
+                if (end.getTime() > endDate.getTime()) {
+                    end.setTime(endDate.getTime());
+                }
+                const start = currentDate;
+                const formattedDate = format?.({ dateIndex: year, startDate: start, endDate: end });
+                const columnTitle = formattedDate || year.toString();
+                const dayCellConfig = {
+                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
+                    startDate: start,
+                    endDate: end,
+                    step,
+                    unit: 'year',
+                    title: columnTitle,
+                    dateIndex: year
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate = new Date(year + step, 0, 1);
+            }
+            else if (unit === 'week') {
+                const startOfWeekSetting = scale.startOfWeek ?? 'monday';
+                let dayOfWeek = currentDate.getDay();
+                if (startOfWeekSetting === 'monday') {
+                    dayOfWeek = dayOfWeek === 0 ? 6 : dayOfWeek - 1;
+                }
+                const startOfWeek = createDateAtMidnight(currentDate);
+                const dateEnd = createDateAtLastHour(currentDate.getTime() + (7 * step - dayOfWeek) * 24 * 60 * 60 * 1000 - 1, true);
+                if (dateEnd > endDate) {
+                    dateEnd.setTime(endDate.getTime());
+                }
+                const weekNumber = getWeekNumber(startOfWeek);
+                const columnTitle = format?.({ dateIndex: weekNumber, startDate: startOfWeek, endDate: dateEnd }) || weekNumber.toString();
+                const dayCellConfig = {
+                    days: (dateEnd.getTime() - startOfWeek.getTime() + 1) / DayTimes,
+                    startDate: startOfWeek,
+                    endDate: dateEnd,
+                    step,
+                    unit: 'week',
+                    title: columnTitle,
+                    dateIndex: weekNumber
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate.setTime(createDateAtMidnight(currentDate.getTime() + (7 * step - dayOfWeek) * 24 * 60 * 60 * 1000, true).getTime());
+            }
+            else if (unit === 'hour') {
+                const year = currentDate.getFullYear();
+                const month = currentDate.getMonth();
+                const day = currentDate.getDate();
+                const hour = currentDate.getHours();
+                const end = createDateAtLastMinute(new Date(year, month, day, hour + step - 1), true);
+                if (end.getTime() > endDate.getTime()) {
+                    end.setTime(endDate.getTime());
+                }
+                const start = currentDate;
+                const formattedDate = format?.({ dateIndex: hour, startDate: start, endDate: end });
+                const columnTitle = formattedDate || hour.toString();
+                const dayCellConfig = {
+                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
+                    startDate: start,
+                    endDate: end,
+                    step,
+                    unit: 'hour',
+                    title: columnTitle,
+                    dateIndex: currentDate.getHours()
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate = new Date(year, month, day, hour + step);
+            }
+            else if (unit === 'minute') {
+                const year = currentDate.getFullYear();
+                const month = currentDate.getMonth();
+                const day = currentDate.getDate();
+                const hour = currentDate.getHours();
+                const minute = currentDate.getMinutes();
+                const end = createDateAtLastSecond(new Date(year, month, day, hour, minute + step - 1), true);
+                if (end.getTime() > endDate.getTime()) {
+                    end.setTime(endDate.getTime());
+                }
+                const start = currentDate;
+                const formattedDate = format?.({ dateIndex: minute, startDate: start, endDate: end });
+                const columnTitle = formattedDate || minute.toString();
+                const dayCellConfig = {
+                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
+                    startDate: start,
+                    endDate: end,
+                    step,
+                    unit: 'minute',
+                    title: columnTitle,
+                    dateIndex: currentDate.getMinutes()
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate = new Date(year, month, day, hour, minute + step);
+            }
+            else if (unit === 'second') {
+                const year = currentDate.getFullYear();
+                const month = currentDate.getMonth();
+                const day = currentDate.getDate();
+                const hour = currentDate.getHours();
+                const minute = currentDate.getMinutes();
+                const second = currentDate.getSeconds();
+                const end = createDateAtLastMillisecond(new Date(year, month, day, hour, minute, second + step - 1), true);
+                if (end.getTime() > endDate.getTime()) {
+                    end.setTime(endDate.getTime());
+                }
+                const start = currentDate;
+                const formattedDate = format?.({ dateIndex: second, startDate: start, endDate: end });
+                const columnTitle = formattedDate || second.toString();
+                const dayCellConfig = {
+                    days: Math.abs(end.getTime() - currentDate.getTime() + 1) / DayTimes,
+                    startDate: start,
+                    endDate: end,
+                    step,
+                    unit: 'second',
+                    title: columnTitle,
+                    dateIndex: currentDate.getSeconds()
+                };
+                timelineDates.push(dayCellConfig);
+                currentDate = new Date(year, month, day, hour, minute, second + step);
+            }
+        }
+        return timelineDates;
+    }
+    function getTextPos(padding, textAlign, textBaseline, width, height) {
+        let textX = padding[3] ?? 10;
+        if (textAlign === 'right' || textAlign === 'end') {
+            textX = width - 0 - (padding[1] ?? 10);
         }
-        const [optimizedDeltaX, optimizedDeltaY] = optimizeScrollXY$1(deltaX, deltaY, { horizontal: 1, vertical: 1 });
-        if (optimizedDeltaX) {
-            state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX);
-            gantt.scenegraph.scrollbarComponent.showHorizontalScrollBar(true);
+        else if (textAlign === 'center') {
+            textX = 0 + (width - 0 + (padding[3] ?? 10) - (padding[1] ?? 10)) / 2;
         }
-        if (optimizedDeltaY) {
-            state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY);
-            gantt.scenegraph.scrollbarComponent.showVerticalScrollBar(true);
+        let textY = 0 + (padding[0] ?? 10);
+        if (textBaseline === 'bottom' || textBaseline === 'alphabetic' || textBaseline === 'ideographic') {
+            textY = height - 0 - (padding[2] ?? 10);
         }
-        isWheelEvent && state.resetInteractionState();
-        if (event.cancelable &&
-            (state._gantt.parsedOptions.overscrollBehavior === 'none' ||
-                (Math.abs(deltaY) >= Math.abs(deltaX) && deltaY !== 0 && isVerticalScrollable$1(deltaY, state)) ||
-                (Math.abs(deltaY) <= Math.abs(deltaX) && deltaX !== 0 && isHorizontalScrollable$1(deltaX, state)))) {
-            event.preventDefault();
+        else if (textBaseline === 'middle') {
+            textY = 0 + (height - 0 - (padding[0] ?? 10) - (padding[2] ?? 10)) / 2 + (padding[0] ?? 10);
         }
+        return {
+            x: textX,
+            y: textY
+        };
     }
-    function optimizeScrollXY$1(x, y, ratio) {
-        const ANGLE = 2;
-        const angle = Math.abs(x / y);
-        const deltaX = angle <= 1 / ANGLE ? 0 : x;
-        const deltaY = angle > ANGLE ? 0 : y;
-        return [Math.ceil(deltaX * (ratio.horizontal ?? 0)), Math.ceil(deltaY * (ratio.vertical ?? 0))];
+    function convertProgress(progress) {
+        if (typeof progress === 'string') {
+            progress = progress.replace('%', '');
+            progress = parseFloat(progress);
+        }
+        return Math.round(progress);
     }
-    function isVerticalScrollable$1(deltaY, state) {
-        const totalHeight = state._gantt.getAllRowsHeight() - state._gantt.scenegraph.height;
-        if (totalHeight === 0) {
-            return false;
+    function createSplitLineAndResizeLine(gantt) {
+        if (gantt.taskListTableInstance) {
+            gantt.verticalSplitResizeLine = document.createElement('div');
+            gantt.verticalSplitResizeLine.style.position = 'absolute';
+            gantt.verticalSplitResizeLine.style.top = gantt.tableY + 'px';
+            gantt.verticalSplitResizeLine.style.left =
+                (gantt.taskTableWidth ? gantt.taskTableWidth - 7 + gantt.parsedOptions.verticalSplitLine.lineWidth / 2 : 0) +
+                    'px';
+            gantt.verticalSplitResizeLine.style.width = '14px';
+            gantt.verticalSplitResizeLine.style.height = gantt.drawHeight + 'px';
+            gantt.verticalSplitResizeLine.style.backgroundColor = 'rgba(0,0,0,0)';
+            gantt.verticalSplitResizeLine.style.zIndex = '100';
+            gantt.parsedOptions.verticalSplitLineMoveable && (gantt.verticalSplitResizeLine.style.cursor = 'col-resize');
+            gantt.verticalSplitResizeLine.style.userSelect = 'none';
+            gantt.verticalSplitResizeLine.style.opacity = '1';
+            const verticalSplitLine = document.createElement('div');
+            verticalSplitLine.style.position = 'absolute';
+            verticalSplitLine.style.top = '0px';
+            verticalSplitLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLine.lineWidth) / 2}px`;
+            verticalSplitLine.style.width = gantt.parsedOptions.verticalSplitLine.lineWidth + 'px';
+            verticalSplitLine.style.height = '100%';
+            verticalSplitLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLine.lineColor;
+            verticalSplitLine.style.zIndex = '100';
+            verticalSplitLine.style.userSelect = 'none';
+            verticalSplitLine.style.pointerEvents = 'none';
+            verticalSplitLine.style.transition = 'background-color 0.3s';
+            gantt.verticalSplitResizeLine.appendChild(verticalSplitLine);
+            if (gantt.parsedOptions.verticalSplitLineHighlight) {
+                const highlightLine = document.createElement('div');
+                highlightLine.style.position = 'absolute';
+                highlightLine.style.top = '0px';
+                highlightLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) / 2}px`;
+                highlightLine.style.width = (gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) + 'px';
+                highlightLine.style.height = '100%';
+                highlightLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLineHighlight.lineColor;
+                highlightLine.style.zIndex = '100';
+                highlightLine.style.cursor = 'col-resize';
+                highlightLine.style.userSelect = 'none';
+                highlightLine.style.pointerEvents = 'none';
+                highlightLine.style.opacity = '0';
+                highlightLine.style.transition = 'background-color 0.3s';
+                gantt.verticalSplitResizeLine.appendChild(highlightLine);
+            }
+            gantt.container.appendChild(gantt.verticalSplitResizeLine);
         }
-        return !isScrollToTop$1(deltaY, state) && !isScrollToBottom$1(deltaY, state);
     }
-    function isHorizontalScrollable$1(deltaX, state) {
-        const totalWidth = state._gantt.getAllDateColsWidth() - state._gantt.scenegraph.width;
-        if (totalWidth === 0) {
-            return false;
+    function updateSplitLineAndResizeLine(gantt) {
+        if (gantt.verticalSplitResizeLine) {
+            gantt.verticalSplitResizeLine.style.position = 'absolute';
+            gantt.verticalSplitResizeLine.style.top = gantt.tableY + 'px';
+            gantt.verticalSplitResizeLine.style.left = gantt.taskTableWidth
+                ? `${gantt.taskTableWidth - 7 + gantt.parsedOptions.verticalSplitLine.lineWidth / 2}px`
+                : '0px';
+            gantt.verticalSplitResizeLine.style.width = '14px';
+            gantt.verticalSplitResizeLine.style.height = gantt.drawHeight + 'px';
+            gantt.verticalSplitResizeLine.style.backgroundColor = 'rgba(0,0,0,0)';
+            gantt.verticalSplitResizeLine.style.zIndex = '100';
+            gantt.parsedOptions.verticalSplitLineMoveable && (gantt.verticalSplitResizeLine.style.cursor = 'col-resize');
+            gantt.verticalSplitResizeLine.style.userSelect = 'none';
+            gantt.verticalSplitResizeLine.style.opacity = '1';
+            const verticalSplitLine = gantt.verticalSplitResizeLine.childNodes[0];
+            verticalSplitLine.style.position = 'absolute';
+            verticalSplitLine.style.top = '0px';
+            verticalSplitLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLine.lineWidth) / 2}px`;
+            verticalSplitLine.style.width = gantt.parsedOptions.verticalSplitLine.lineWidth + 'px';
+            verticalSplitLine.style.height = '100%';
+            verticalSplitLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLine.lineColor;
+            verticalSplitLine.style.zIndex = '100';
+            verticalSplitLine.style.userSelect = 'none';
+            verticalSplitLine.style.pointerEvents = 'none';
+            verticalSplitLine.style.transition = 'background-color 0.3s';
+            if (gantt.verticalSplitResizeLine.childNodes[1]) {
+                const highlightLine = gantt.verticalSplitResizeLine.childNodes[1];
+                highlightLine.style.position = 'absolute';
+                highlightLine.style.top = '0px';
+                highlightLine.style.left = `${(14 - gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) / 2}px`;
+                highlightLine.style.width = (gantt.parsedOptions.verticalSplitLineHighlight.lineWidth ?? 2) + 'px';
+                highlightLine.style.height = '100%';
+                highlightLine.style.backgroundColor = gantt.parsedOptions.verticalSplitLineHighlight.lineColor;
+                highlightLine.style.zIndex = '100';
+                highlightLine.style.cursor = 'col-resize';
+                highlightLine.style.userSelect = 'none';
+                highlightLine.style.pointerEvents = 'none';
+                highlightLine.style.opacity = '0';
+                highlightLine.style.transition = 'background-color 0.3s';
+            }
         }
-        return !isScrollToLeft$1(deltaX, state) && !isScrollToRight$1(deltaX, state);
     }
-    function isScrollToTop$1(deltaY, state) {
-        const totalHeight = state._gantt.getAllRowsHeight() - state._gantt.scenegraph.height;
-        return totalHeight !== 0 && deltaY <= 0 && state.scroll.verticalBarPos < 1;
+    function findRecordByTaskKey(records, taskKeyField, taskKey, childrenField = 'children') {
+        for (let i = 0; i < records.length; i++) {
+            if ((Array.isArray(taskKey) && taskKey.length === 1 && records[i][taskKeyField] === taskKey[0]) ||
+                records[i][taskKeyField] === taskKey) {
+                return { record: records[i], index: [i] };
+            }
+            else if (records[i][childrenField]?.length) {
+                if (Array.isArray(taskKey) && taskKey[0] === records[i][taskKeyField]) {
+                    const result = findRecordByTaskKey(records[i][childrenField], taskKeyField, taskKey.slice(1));
+                    if (result) {
+                        result.index.unshift(i);
+                        return result;
+                    }
+                }
+                else if (!Array.isArray(taskKey)) {
+                    const result = findRecordByTaskKey(records[i][childrenField], taskKeyField, taskKey);
+                    if (result) {
+                        result.index.unshift(i);
+                        return result;
+                    }
+                }
+            }
+        }
     }
-    function isScrollToBottom$1(deltaY, state) {
-        const totalHeight = state._gantt.getAllRowsHeight() - state._gantt.scenegraph.height;
-        return totalHeight !== 0 && deltaY >= 0 && Math.abs(state.scroll.verticalBarPos - totalHeight) < 1;
+    function clearRecordLinkInfos(records, childrenField = 'children') {
+        for (let i = 0; i < records.length; i++) {
+            if (records[i][childrenField]?.length) {
+                clearRecordLinkInfos(records[i][childrenField], childrenField);
+            }
+            else {
+                delete records[i].vtable_gantt_linkedTo;
+                delete records[i].vtable_gantt_linkedFrom;
+            }
+        }
     }
-    function isScrollToLeft$1(deltaX, state) {
-        const totalWidth = state._gantt.getAllDateColsWidth() - state._gantt.scenegraph.width;
-        return totalWidth !== 0 && deltaX <= 0 && state.scroll.horizontalBarPos < 1;
+    function clearRecordShowIndex(records, childrenField = 'children') {
+        for (let i = 0; i < records.length; i++) {
+            if (records[i][childrenField]?.length) {
+                clearRecordShowIndex(records[i][childrenField], childrenField);
+            }
+            else {
+                delete records[i].vtable_gantt_showIndex;
+            }
+        }
     }
-    function isScrollToRight$1(deltaX, state) {
-        const totalWidth = state._gantt.getAllDateColsWidth() - state._gantt.scenegraph.width;
-        return totalWidth !== 0 && deltaX >= 0 && Math.abs(state.scroll.horizontalBarPos - totalWidth) < 1;
+    function getTaskIndexsByTaskY(y, gantt) {
+        let task_index;
+        let sub_task_index;
+        if (gantt.taskListTableInstance) {
+            const rowInfo = gantt.taskListTableInstance.getTargetRowAt(y + gantt.headerHeight);
+            if (rowInfo) {
+                const { row } = rowInfo;
+                task_index = row - gantt.taskListTableInstance.columnHeaderLevelCount;
+                const beforeRowsHeight = gantt.getRowsHeightByIndex(0, task_index - 1);
+                if (gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Inline ||
+                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Arrange ||
+                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Compact ||
+                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Separate) {
+                    sub_task_index = Math.floor((y - beforeRowsHeight) / gantt.parsedOptions.rowHeight);
+                }
+            }
+        }
+        else {
+            task_index = Math.floor(y / gantt.parsedOptions.rowHeight);
+        }
+        return { task_index, sub_task_index };
     }
-    function bindScrollBarListener$1(eventManager) {
-        const table = eventManager._gantt;
-        const stateManager = table.stateManager;
-        const scenegraph = table.scenegraph;
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerover', (e) => {
-            scenegraph.scrollbarComponent.showVerticalScrollBar();
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerover', (e) => {
-            scenegraph.scrollbarComponent.showHorizontalScrollBar();
-        });
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerout', (e) => {
-            if (stateManager.interactionState === InteractionState$1.scrolling) {
-                return;
+    function computeRowsCountByRecordDateForCompact(gantt, record) {
+        if (!record.children || record.children.length === 1) {
+            if (record.children?.length === 1) {
+                record.children[0].vtable_gantt_showIndex = 0;
             }
-            scenegraph.scrollbarComponent.hideVerticalScrollBar();
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerout', (e) => {
-            if (stateManager.interactionState === InteractionState$1.scrolling) {
-                return;
+            else {
+                record.vtable_gantt_showIndex = 0;
             }
-            scenegraph.scrollbarComponent.hideHorizontalScrollBar();
-        });
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointermove', (e) => {
-            e.stopPropagation();
-        });
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('scrollDown', (e) => {
-            scenegraph._gantt.eventManager.isDown = true;
+            return 1;
+        }
+        const sortedChildren = record.children.slice().sort((a, b) => {
+            const { startDate: aStartDate } = formatRecordDateConsiderHasHour(gantt, a);
+            const { startDate: bStartDate } = formatRecordDateConsiderHasHour(gantt, b);
+            return aStartDate.getTime() - bStartDate.getTime();
         });
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerup', () => {
-            scenegraph._gantt.eventManager.isDraging = false;
-            if (stateManager.interactionState === InteractionState$1.scrolling) {
-                stateManager.updateInteractionState(InteractionState$1.default);
+        const rows = [];
+        for (let i = 0; i <= sortedChildren.length - 1; i++) {
+            const newRecord = sortedChildren[i];
+            const { startDate, endDate } = formatRecordDateConsiderHasHour(gantt, newRecord);
+            let placed = false;
+            for (let j = 0; j < rows.length; j++) {
+                if (startDate.getTime() > rows[j]) {
+                    rows[j] = endDate.getTime();
+                    placed = true;
+                    newRecord.vtable_gantt_showIndex = j;
+                    break;
+                }
             }
-        });
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('pointerupoutside', () => {
-            if (stateManager.interactionState === InteractionState$1.scrolling) {
-                stateManager.updateInteractionState(InteractionState$1.default);
+            if (!placed) {
+                rows.push(endDate.getTime());
+                newRecord.vtable_gantt_showIndex = rows.length - 1;
             }
+        }
+        return rows.length;
+    }
+    function isOverlapping(startDate, endDate, rowTasks, gantt) {
+        return rowTasks.some(rowTask => {
+            const { startDate: startDate2, endDate: endDate2 } = formatRecordDateConsiderHasHour(gantt, rowTask);
+            return startDate <= endDate2 && startDate2 <= endDate;
         });
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('scrollUp', (e) => {
-            scenegraph._gantt.eventManager.isDraging = false;
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointermove', (e) => {
-            e.stopPropagation();
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerdown', (e) => {
-            e.stopPropagation();
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('scrollDown', (e) => {
-            scenegraph._gantt.eventManager.isDown = true;
-            if (stateManager.interactionState !== InteractionState$1.scrolling) {
-                stateManager.updateInteractionState(InteractionState$1.scrolling);
+    }
+    function computeRowsCountByRecordDate(gantt, record) {
+        if (!record.children || record.children.length === 1) {
+            if (record.children?.length === 1) {
+                record.children[0].vtable_gantt_showIndex = 0;
             }
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerup', () => {
-            if (stateManager.interactionState === InteractionState$1.scrolling) {
-                stateManager.updateInteractionState(InteractionState$1.default);
+            else {
+                record.vtable_gantt_showIndex = 0;
             }
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('pointerupoutside', () => {
-            if (stateManager.interactionState === InteractionState$1.scrolling) {
-                stateManager.updateInteractionState(InteractionState$1.default);
+            return 1;
+        }
+        const rows = [];
+        for (let i = 0; i <= record.children.length - 1; i++) {
+            const newRecord = record.children[i];
+            const { startDate, endDate } = formatRecordDateConsiderHasHour(gantt, newRecord);
+            let placed = false;
+            for (let j = 0; j < rows.length; j++) {
+                const rowTasks = record.children.filter((t) => t !== newRecord && t.vtable_gantt_showIndex === j);
+                if (!isOverlapping(startDate, endDate, rowTasks, gantt)) {
+                    rows[j] = endDate.getTime();
+                    placed = true;
+                    newRecord.vtable_gantt_showIndex = j;
+                    break;
+                }
             }
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('scrollUp', (e) => {
-            scenegraph._gantt.eventManager.isDraging = false;
-        });
-        const throttleVerticalWheel = throttle$1(stateManager.updateVerticalScrollBar, 20);
-        const throttleHorizontalWheel = throttle$1(stateManager.updateHorizontalScrollBar, 20);
-        scenegraph.scrollbarComponent.vScrollBar.addEventListener('scrollDrag', (e) => {
-            if (scenegraph._gantt.eventManager.isDown) {
-                scenegraph._gantt.eventManager.isDraging = true;
+            if (!placed) {
+                rows.push(endDate.getTime());
+                newRecord.vtable_gantt_showIndex = rows.length - 1;
             }
-            if (stateManager.interactionState !== InteractionState$1.scrolling) {
-                stateManager.updateInteractionState(InteractionState$1.scrolling);
+        }
+        return rows.length;
+    }
+    function formatRecordDateConsiderHasHour(gantt, record) {
+        const { timeScaleIncludeHour, startDateField, endDateField } = gantt.parsedOptions;
+        const startDate = record[startDateField];
+        const endDate = record[endDateField];
+        if (timeScaleIncludeHour) {
+            return { startDate: createDateAtMidnight(startDate), endDate: createDateAtLastHour(endDate) };
+        }
+        return { startDate: createDateAtMidnight(startDate, true), endDate: createDateAtLastHour(endDate, true) };
+    }
+    function updateOptionsWhenRecordChanged(gantt) {
+        const options = gantt.options;
+        const { unit: minTimeUnit, startOfWeek } = gantt.parsedOptions.reverseSortedTimelineScales[0];
+        gantt.parsedOptions.markLine = generateMarkLine(options?.markLine);
+        if (gantt.parsedOptions.markLine?.length ?? 0) {
+            if (gantt.parsedOptions.markLine?.every(item => item.scrollToMarkLine === undefined)) {
+                gantt.parsedOptions.markLine[0].scrollToMarkLine = true;
             }
-            const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
-            throttleVerticalWheel(ratio, e);
-        });
-        scenegraph.scrollbarComponent.hScrollBar.addEventListener('scrollDrag', (e) => {
-            if (scenegraph._gantt.eventManager.isDown) {
-                scenegraph._gantt.eventManager.isDraging = true;
+            if (gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine)) {
+                gantt.parsedOptions.scrollToMarkLineDate = getStartDateByTimeUnit(new Date(gantt.parsedOptions.markLine?.find(item => item.scrollToMarkLine).date), minTimeUnit, startOfWeek);
             }
-            stateManager.fastScrolling = true;
-            if (stateManager.interactionState !== InteractionState$1.scrolling) {
-                stateManager.updateInteractionState(InteractionState$1.scrolling);
+        }
+        gantt.parsedOptions.dependencyLinks = options.dependency?.links;
+    }
+    function updateOptionsWhenDateRangeChanged(gantt) {
+        const options = gantt.options;
+        const { unit: minTimeUnit, startOfWeek, step } = gantt.parsedOptions.reverseSortedTimelineScales[0];
+        gantt.parsedOptions.minDate = options?.minDate
+            ? getStartDateByTimeUnit(new Date(options.minDate), minTimeUnit, startOfWeek)
+            : undefined;
+        gantt.parsedOptions.maxDate = options?.maxDate
+            ? getEndDateByTimeUnit(gantt.parsedOptions.minDate, new Date(options.maxDate), minTimeUnit, step)
+            : undefined;
+        gantt.parsedOptions._minDateTime = gantt.parsedOptions.minDate?.getTime();
+        gantt.parsedOptions._maxDateTime = gantt.parsedOptions.maxDate?.getTime();
+    }
+    function updateOptionsWhenMarkLineChanged(gantt) {
+        const options = gantt.options;
+        gantt.parsedOptions.markLine = generateMarkLine(options?.markLine);
+    }
+    function _getTaskInfoByXYForCreateSchedule(eventX, eventY, gantt) {
+        const taskIndex = getTaskIndexsByTaskY(eventY - gantt.headerHeight + gantt.stateManager.scrollTop, gantt);
+        const recordParent = gantt.getRecordByIndex(taskIndex.task_index);
+        const dateIndex = getDateIndexByX(eventX, gantt);
+        const dateRange = gantt.getDateRangeByIndex(dateIndex);
+        if (recordParent?.children) {
+            const taskIndex = getTaskIndexsByTaskY(eventY - gantt.headerHeight + gantt.stateManager.scrollTop, gantt);
+            for (let i = 0; i < recordParent.children.length; i++) {
+                const { startDate, endDate, taskDays, progress, taskRecord } = gantt.getTaskInfoByTaskListIndex(taskIndex.task_index, i);
+                if (((gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Compact ||
+                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Arrange) &&
+                    taskRecord.vtable_gantt_showIndex === taskIndex.sub_task_index) ||
+                    gantt.parsedOptions.tasksShowMode === TasksShowMode.Sub_Tasks_Inline) {
+                    if (dateRange.startDate.getTime() >= startDate.getTime() && dateRange.endDate.getTime() <= endDate.getTime()) {
+                        return { startDate, endDate, taskDays, progress, taskRecord };
+                    }
+                }
             }
-            const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
-            throttleHorizontalWheel(ratio);
+        }
+    }
+    function getNodeClickPos(marklineIconNode, gantt) {
+        const left = marklineIconNode.globalTransMatrix.e +
+            gantt.taskListTableInstance.tableNoFrameWidth +
+            gantt.taskListTableInstance.tableX +
+            gantt.tableX;
+        const top = marklineIconNode.globalTransMatrix.f;
+        const width = marklineIconNode.attribute.width;
+        const height = marklineIconNode.attribute.height;
+        return {
+            left,
+            top,
+            width,
+            height
+        };
+    }
+    function judgeIfHasMarkLine(data, markLine) {
+        const beginTime = data.startDate.getTime();
+        const endTime = data.endDate.getTime();
+        return markLine.some(item => {
+            const marklineTime = new Date(item.date).getTime();
+            return marklineTime >= beginTime && marklineTime <= endTime;
         });
     }
 
@@ -36959,7 +36957,7 @@
     }
     function getCellCornerRadius(col, row, table) {
       const tableCornerRadius = table.theme.frameStyle.cornerRadius;
-      if (Array.isArray(tableCornerRadius)) {
+      if (table.theme.cellInnerBorder) if (Array.isArray(tableCornerRadius)) {
         if (0 === col && 0 === row) return [tableCornerRadius[0], 0, 0, 0];
         if (col === table.colCount - 1 && 0 === row) return [0, tableCornerRadius[1], 0, 0];
         if (0 === col && row === table.rowCount - 1) return [0, 0, 0, tableCornerRadius[3]];
@@ -42127,12 +42125,12 @@
         isWidthNumber = !Array.isArray(strokeArrayWidth),
         isStrokeTrue = !Array.isArray(stroke),
         isSplitDraw = Array.isArray(strokeArrayColor) || widthInfo.isSplitDraw;
-      context.setStrokeStyle(rect, rect.attribute, x, y, rectAttribute);
+      context.stroke(), context.setStrokeStyle(rect, rect.attribute, x, y, rectAttribute);
       const {
         lineDash = groupAttribute.lineDash
       } = group.attribute;
       let isDash = !1;
-      lineDash.length && lineDash.some(dash => Array.isArray(dash)) && (isDash = !0), context.moveTo(x, y);
+      lineDash.length && lineDash.some(dash => Array.isArray(dash)) && (isDash = !0), context.beginPath(), context.moveTo(x, y);
       const strokeTop = (isStrokeTrue || stroke[0]) && (isWidthNumber || strokeArrayWidth[0]),
         strokeRight = (isStrokeTrue || stroke[1]) && (isWidthNumber || strokeArrayWidth[1]),
         strokeBottom = (isStrokeTrue || stroke[2]) && (isWidthNumber || strokeArrayWidth[2]),
@@ -42153,7 +42151,7 @@
         isWidthNumber ? widthInfo.width : strokeArrayWidth[3], isWidthNumber ? widthInfo.width : strokeArrayWidth[3];
         context.moveTo(x1, y1), context.lineTo(x2, y2), (isSplitDraw || isDash) && (strokeArrayColor && strokeArrayColor[3] ? context.strokeStyle = strokeArrayColor[3] : strokeArrayColor && !strokeArrayColor[3] && (context.strokeStyle = "transparent"), isWidthNumber || (context.lineWidth = strokeArrayWidth[3]), context.lineDashOffset = context.currentMatrix.f / context.currentMatrix.d, isDash && context.setLineDash(null !== (_d = lineDash[3]) && void 0 !== _d ? _d : []), context.stroke(), context.beginPath(), context.moveTo(x, y));
       } else 3 === i && context.moveTo(x, y);
-      isSplitDraw || isDash || (!isWidthNumber && widthInfo.width && (context.lineWidth = widthInfo.width), context.stroke()), context.lineDashOffset = 0, context.setLineDash([]), context.closePath();
+      context.closePath(), isSplitDraw || isDash || (!isWidthNumber && widthInfo.width && (context.lineWidth = widthInfo.width), context.stroke()), context.lineDashOffset = 0, context.setLineDash([]), context.beginPath();
     }
 
     var __decorate$1 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
@@ -43537,7 +43535,7 @@
     };
     class SceneProxy {
       constructor(table) {
-        this.isRelease = !1, this.mode = "column", this.rowLimit = 200, this.currentRow = 0, this.rowStart = 0, this.rowEnd = 0, this.referenceRow = 0, this.screenTopRow = 0, this.deltaY = 0, this.deltaHeight = 0, this.colLimit = 100, this.screenLeftCol = 0, this.deltaX = 0, this.deltaWidth = 0, this.cellCache = new Map(), this.table = table, this.table.isPivotChart() ? (this.rowLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameHeight / table.defaultRowHeight)), this.colLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameWidth / table.defaultColWidth))) : this.table.isAutoRowHeight() ? this.rowLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameHeight / table.defaultRowHeight)) : ("autoWidth" === this.table.widthMode || (this.rowLimit = Math.max(200, Math.ceil(2 * table.tableNoFrameHeight / table.defaultRowHeight))), this.colLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameWidth / table.defaultColWidth))), this.table.internalProps.transpose ? this.mode = "row" : this.table.isPivotTable() && (this.mode = "pivot"), this.table.options.maintainedDataCount && (this.rowLimit = this.table.options.maintainedDataCount);
+        this.isRelease = !1, this.mode = "column", this.rowLimit = 200, this.currentRow = 0, this.rowStart = 0, this.rowEnd = 0, this.referenceRow = 0, this.screenTopRow = 0, this.deltaY = 0, this.deltaHeight = 0, this.colLimit = 100, this.screenLeftCol = 0, this.deltaX = 0, this.deltaWidth = 0, this.cellCache = new Map(), this.table = table, this.table.isPivotChart() ? (this.rowLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameHeight / table.defaultRowHeight)), this.colLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameWidth / table.defaultColWidth))) : this.table.isAutoRowHeight() ? this.rowLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameHeight / table.defaultRowHeight)) : ("autoWidth" === this.table.widthMode || (this.rowLimit = Math.max(200, Math.ceil(2 * table.tableNoFrameHeight / table.defaultRowHeight))), this.colLimit = Math.max(100, Math.ceil(2 * table.tableNoFrameWidth / table.defaultColWidth))), this.table.internalProps.transpose ? this.mode = "row" : this.table.isPivotTable() && (this.mode = "pivot"), this.table.options.maintainedDataCount && (this.rowLimit = this.table.options.maintainedDataCount), this.table.options.maintainedColumnCount && (this.colLimit = this.table.options.maintainedColumnCount);
       }
       get bodyLeftCol() {
         return this.table.frozenColCount;
@@ -44044,7 +44042,7 @@
         }
         isExtend && extendSelectRange();
       };
-      ifExtendSelectRange && extendSelectRange(), scene.selectingRangeComponents.forEach((selectComp, key) => {
+      ifExtendSelectRange && (extendSelectRange(), selectRange.start.col > selectRange.end.col ? (selectRange.start.col = Math.max(startCol, endCol), selectRange.end.col = Math.min(startCol, endCol)) : (selectRange.start.col = Math.min(startCol, endCol), selectRange.end.col = Math.max(startCol, endCol)), selectRange.start.row > selectRange.end.row ? (selectRange.start.row = Math.max(startRow, endRow), selectRange.end.row = Math.min(startRow, endRow)) : (selectRange.start.row = Math.min(startRow, endRow), selectRange.end.row = Math.max(startRow, endRow))), scene.selectingRangeComponents.forEach((selectComp, key) => {
         var _a;
         selectComp.rect.delete(), null === (_a = selectComp.fillhandle) || void 0 === _a || _a.delete();
       }), scene.selectingRangeComponents = new Map();
@@ -44134,7 +44132,7 @@
     }
 
     function createCellSelectBorder(scene, start_Col, start_Row, end_Col, end_Row, selectRangeType, selectId, strokes) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
+      var _a, _b, _c, _d, _e, _f, _g, _h, _j;
       let isHasFillHandleRect = !!(null === (_a = scene.table.options.excelOptions) || void 0 === _a ? void 0 : _a.fillHandle);
       if ((null === (_b = scene.table.stateManager.select.ranges) || void 0 === _b ? void 0 : _b.length) > 1) isHasFillHandleRect = !1, scene.removeFillHandleFromSelectComponents();else if (1 === (null === (_c = scene.table.stateManager.select.ranges) || void 0 === _c ? void 0 : _c.length)) {
         const maxRow = Math.max(scene.table.stateManager.select.ranges[0].start.row, scene.table.stateManager.select.ranges[0].end.row),
@@ -44160,7 +44158,8 @@
           y: firstCellBound.y1 - scene.tableGroup.attribute.y,
           width: 0,
           height: 0,
-          visible: !0
+          visible: !0,
+          cornerRadius: getCornerRadius(selectRangeType, null === (_j = scene.table.theme.frameStyle) || void 0 === _j ? void 0 : _j.cornerRadius, start_Col, start_Row, end_Col, end_Row, scene.table)
         });
       let fillhandle;
       isHasFillHandleRect && (fillhandle = createRect({
@@ -44178,6 +44177,15 @@
         role: selectRangeType
       }), scene.tableGroup.insertAfter(rect, "body" === selectRangeType ? scene.bodyGroup : "columnHeader" === selectRangeType ? scene.colHeaderGroup : "rowHeader" === selectRangeType ? scene.rowHeaderGroup : "cornerHeader" === selectRangeType ? scene.cornerHeaderGroup : "rightTopCorner" === selectRangeType ? scene.rightTopCornerGroup : "rightFrozen" === selectRangeType ? scene.rightFrozenGroup : "leftBottomCorner" === selectRangeType ? scene.leftBottomCornerGroup : "bottomFrozen" === selectRangeType ? scene.bottomFrozenGroup : scene.rightBottomCornerGroup), isHasFillHandleRect && scene.tableGroup.insertAfter(fillhandle, "body" === selectRangeType ? scene.bodyGroup : "columnHeader" === selectRangeType ? scene.colHeaderGroup : "rowHeader" === selectRangeType ? scene.rowHeaderGroup : "cornerHeader" === selectRangeType ? scene.cornerHeaderGroup : "rightTopCorner" === selectRangeType ? scene.rightTopCornerGroup : "rightFrozen" === selectRangeType ? scene.rightFrozenGroup : "leftBottomCorner" === selectRangeType ? scene.leftBottomCornerGroup : "bottomFrozen" === selectRangeType ? scene.bottomFrozenGroup : scene.rightBottomCornerGroup);
     }
+    function getCornerRadius(selectRangeType, cornerRadius, start_Col, start_Row, end_Col, end_Row, table) {
+      if (!cornerRadius) return;
+      const cornerRadiusArray = Array.isArray(cornerRadius) ? cornerRadius : [cornerRadius, cornerRadius, cornerRadius, cornerRadius],
+        tableEndCol = table.colCount - 1,
+        tableEndRow = table.rowCount - 1,
+        result = [0, 0, 0, 0];
+      let changed = !1;
+      return 0 === start_Col && 0 === start_Row ? (result[0] = cornerRadiusArray[0], changed = !0) : end_Col === tableEndCol && end_Row === tableEndRow ? (result[2] = cornerRadiusArray[2], changed = !0) : 0 === start_Col && end_Row === tableEndRow ? (result[3] = cornerRadiusArray[3], changed = !0) : end_Col === tableEndCol && 0 === start_Row && (result[1] = cornerRadiusArray[1], changed = !0), changed ? result : void 0;
+    }
 
     function moveSelectingRangeComponentsToSelectedRangeComponents(scene) {
       scene.selectingRangeComponents.forEach((rangeComponent, key) => {
@@ -44273,7 +44281,7 @@
           const minRow = Math.min(...addRows);
           scene.proxy.rowUpdatePos = Math.min(minRow, scene.proxy.rowUpdatePos);
         }
-        scene.proxy.rowUpdateDirection = "down", scene.proxy.updateCellGroups(2 * scene.proxy.screenRowCount), updateBottomFrozeCellGroups();
+        scene.proxy.rowUpdateDirection = "up", scene.proxy.updateCellGroups(2 * scene.proxy.screenRowCount), updateBottomFrozeCellGroups();
       } else removeRows.length && (setRowSeriesNumberCellNeedUpdate(removeRows[removeRows.length - 1], scene), scene.proxy.updateCellGroups(2 * scene.proxy.screenRowCount), updateBottomFrozeCellGroups());
       scene.proxy.progress();
       const newTotalHeight = table.getRowsHeight(table.frozenRowCount, table.rowCount - 1 - table.bottomFrozenRowCount);
@@ -44540,7 +44548,7 @@
     }
 
     function dealFrozen(scene) {
-      var _a, _b;
+      var _a, _b, _c, _d;
       if (scene.table.frozenColCount > scene.table.rowHeaderLevelCount) {
         scene.rowHeaderGroup.setAttribute("height", scene.bodyGroup.attribute.height), scene.rowHeaderGroup.setAttribute("y", scene.bodyGroup.attribute.y), scene.cornerHeaderGroup.setAttribute("height", scene.colHeaderGroup.attribute.height);
         for (let i = 0; i < scene.table.frozenColCount - scene.table.rowHeaderLevelCount; i++) moveColumnFromBodyToRowHeader(scene), moveColumnFromColHeaderToCornerHeader(scene), moveColumnFromBottomToLeftBottomCorner(scene);
@@ -44548,10 +44556,10 @@
         scene.bodyGroup.setAttribute("height", scene.rowHeaderGroup.attribute.height), scene.bodyGroup.setAttribute("y", scene.rowHeaderGroup.attribute.y), scene.colHeaderGroup.setAttribute("height", scene.cornerHeaderGroup.attribute.height);
         for (let i = 0; i < scene.table.rowHeaderLevelCount - scene.table.frozenColCount; i++) moveColumnFromRowHeaderToBody(scene), moveColumnFromCornerHeaderToColHeader(scene), moveColumnFromLeftBottomCornerToBottom(scene);
       }
-      scene.bodyGroup.setAttribute("x", scene.rowHeaderGroup.attribute.width), scene.colHeaderGroup.setAttribute("x", scene.cornerHeaderGroup.attribute.width), scene.updateContainer(), scene.updateBorderSizeAndPosition(), scene.isPivot || scene.table.transpose ? scene.table.options.frozenColCount ? scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1) : scene.table.options.frozenColCount && scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount) : (scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1), scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount)), scene.hasFrozen = !0, scene.frozenColCount = scene.table.frozenColCount, scene.frozenRowCount = null !== (_b = null === (_a = scene.colHeaderGroup.firstChild) || void 0 === _a ? void 0 : _a.childrenCount) && void 0 !== _b ? _b : 0;
+      scene.bodyGroup.setAttribute("x", scene.rowHeaderGroup.attribute.width), scene.colHeaderGroup.setAttribute("x", scene.cornerHeaderGroup.attribute.width), scene.updateContainer(), scene.updateBorderSizeAndPosition(), scene.isPivot || scene.table.transpose ? scene.table.options.frozenColCount ? scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1) : scene.table.options.frozenColCount && scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount) : (scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1), scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount)), scene.hasFrozen = !0, scene.frozenColCount = scene.table.frozenColCount, scene.frozenRowCount = null !== (_d = null !== (_b = null === (_a = scene.colHeaderGroup.firstChild) || void 0 === _a ? void 0 : _a.childrenCount) && void 0 !== _b ? _b : null === (_c = scene.cornerHeaderGroup.firstChild) || void 0 === _c ? void 0 : _c.childrenCount) && void 0 !== _d ? _d : scene.table.frozenRowCount;
     }
     function resetFrozen(scene) {
-      var _a, _b, _c, _d;
+      var _a, _b, _c, _d, _e, _f;
       if (scene.frozenColCount > scene.table.frozenColCount) {
         scene.bodyGroup.setAttribute("height", scene.rowHeaderGroup.attribute.height), scene.bodyGroup.setAttribute("y", scene.rowHeaderGroup.attribute.y), scene.colHeaderGroup.setAttribute("height", scene.cornerHeaderGroup.attribute.height);
         for (let i = 0; i < scene.frozenColCount - scene.table.frozenColCount; i++) moveColumnFromRowHeaderToBody(scene), moveColumnFromCornerHeaderToColHeader(scene), moveColumnFromLeftBottomCornerToBottom(scene);
@@ -44559,7 +44567,7 @@
         scene.rowHeaderGroup.setAttribute("height", scene.bodyGroup.attribute.height), scene.rowHeaderGroup.setAttribute("y", scene.bodyGroup.attribute.y), scene.cornerHeaderGroup.setAttribute("height", scene.colHeaderGroup.attribute.height);
         for (let i = 0; i < scene.table.frozenColCount - scene.frozenColCount; i++) moveColumnFromBodyToRowHeader(scene), moveColumnFromColHeaderToCornerHeader(scene), moveColumnFromBottomToLeftBottomCorner(scene);
       }
-      updateReactComponentContainer(scene), scene.recreateAllSelectRangeComponents(), scene.frozenColCount = scene.table.frozenColCount, scene.frozenRowCount = null !== (_b = null === (_a = scene.colHeaderGroup.firstChild) || void 0 === _a ? void 0 : _a.childrenCount) && void 0 !== _b ? _b : 0, scene.proxy.colStart = null !== (_d = null === (_c = scene.bodyGroup.firstChild) || void 0 === _c ? void 0 : _c.col) && void 0 !== _d ? _d : scene.table.frozenColCount, scene.bodyGroup.setAttribute("x", scene.rowHeaderGroup.attribute.width), scene.colHeaderGroup.setAttribute("x", scene.cornerHeaderGroup.attribute.width), scene.updateContainer(), scene.updateBorderSizeAndPosition(), scene.isPivot || scene.table.transpose ? scene.table.options.frozenColCount ? scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1) : scene.table.options.rightFrozenColCount && scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount) : (scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1), scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount)), scene.hasFrozen = !0;
+      updateReactComponentContainer(scene), scene.recreateAllSelectRangeComponents(), scene.frozenColCount = scene.table.frozenColCount, scene.frozenRowCount = null !== (_d = null !== (_b = null === (_a = scene.colHeaderGroup.firstChild) || void 0 === _a ? void 0 : _a.childrenCount) && void 0 !== _b ? _b : null === (_c = scene.cornerHeaderGroup.firstChild) || void 0 === _c ? void 0 : _c.childrenCount) && void 0 !== _d ? _d : scene.table.frozenRowCount, scene.proxy.colStart = null !== (_f = null === (_e = scene.bodyGroup.firstChild) || void 0 === _e ? void 0 : _e.col) && void 0 !== _f ? _f : scene.table.frozenColCount, scene.bodyGroup.setAttribute("x", scene.rowHeaderGroup.attribute.width), scene.colHeaderGroup.setAttribute("x", scene.cornerHeaderGroup.attribute.width), scene.updateContainer(), scene.updateBorderSizeAndPosition(), scene.isPivot || scene.table.transpose ? scene.table.options.frozenColCount ? scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1) : scene.table.options.rightFrozenColCount && scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount) : (scene.component.setFrozenColumnShadow(scene.table.frozenColCount - 1), scene.component.setRightFrozenColumnShadow(scene.table.colCount - scene.table.rightFrozenColCount)), scene.hasFrozen = !0;
     }
     function moveColumnFromBodyToRowHeader(scene) {
       const column = scene.bodyGroup.firstChild instanceof Group$1 ? scene.bodyGroup.firstChild : null;
@@ -46411,7 +46419,7 @@
                 } : table.getCellRange(col, row);
                 currentRange.start.col < cellRange.end.col ? currentRange.end.col = cellRange.end.col : currentRange.start.col > cellRange.start.col && (currentRange.end.col = cellRange.start.col), currentRange.start.row < cellRange.end.row ? currentRange.end.row = cellRange.end.row : currentRange.start.row > cellRange.start.row && (currentRange.end.row = cellRange.start.row), "body" === state.select.headerSelectMode && (table.isRowHeader(col, row) ? (currentRange.start.col = table.rowHeaderLevelCount + table.leftRowSeriesNumberCount, currentRange.end.col = table.colCount - 1) : table.isColumnHeader(col, row) ? (currentRange.start.row = table.columnHeaderLevelCount, currentRange.end.row = table.rowCount - 1) : table.internalProps.layoutMap.isSeriesNumberInBody(col, row) ? (currentRange.start.col = table.leftRowSeriesNumberCount, currentRange.end.col = table.colCount - 1) : table.isCornerHeader(col, row) ? (currentRange.start.col = table.rowHeaderLevelCount + table.leftRowSeriesNumberCount, currentRange.start.row = table.columnHeaderLevelCount, currentRange.end.col = table.colCount - 1, currentRange.end.row = table.rowCount - 1) : table.isSeriesNumber(col, row) && (currentRange.start.col = table.leftRowSeriesNumberCount, currentRange.start.row = table.columnHeaderLevelCount, currentRange.end.col = table.colCount - 1, currentRange.end.row = table.rowCount - 1)), skipBodyMerge && (currentRange.skipBodyMerge = !0);
               }
-              scenegraph.updateCellSelectBorder(currentRange, extendSelectRange);
+              currentRange && currentRange.start.row <= table.rowCount - 1 && currentRange.end.row <= table.rowCount - 1 && currentRange.start.col <= table.colCount - 1 && currentRange.end.col <= table.colCount - 1 && scenegraph.updateCellSelectBorder(currentRange, extendSelectRange);
             }
           }
         } else {
@@ -46609,7 +46617,7 @@
             }
             cellPos.col = col, cellPos.row = row;
             const currentRange = null === (_b = state.select.ranges) || void 0 === _b ? void 0 : _b[state.select.ranges.length - 1];
-            currentRange && scenegraph.updateCellSelectBorder(currentRange, extendSelectRange);
+            currentRange && currentRange.start.row <= table.rowCount - 1 && currentRange.end.row <= table.rowCount - 1 && currentRange.start.col <= table.colCount - 1 && currentRange.end.col <= table.colCount - 1 && scenegraph.updateCellSelectBorder(currentRange, extendSelectRange);
           }
         }
       } else cellPos.col = -1, cellPos.row = -1, state.select.ranges = [], scenegraph.deleteAllSelectBorder();
@@ -47672,76 +47680,108 @@
         var _a, _b;
         const totalHeight = this.table.getAllRowsHeight(),
           oldVerticalBarPos = this.scroll.verticalBarPos;
-        this.scroll.verticalBarPos = Math.ceil(yRatio * (totalHeight - this.table.scenegraph.height)), isValid$3(this.scroll.verticalBarPos) && !isNaN(this.scroll.verticalBarPos) || (this.scroll.verticalBarPos = 0), this.table.scenegraph.setY(-this.scroll.verticalBarPos, 1 === yRatio), this.scroll.verticalBarPos -= this.table.scenegraph.proxy.deltaY, this.table.scenegraph.proxy.deltaY = 0, this.updateHoverPos(-1, -1), this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+        let verticalBarPos = Math.ceil(yRatio * (totalHeight - this.table.scenegraph.height));
+        isValid$3(verticalBarPos) && !isNaN(verticalBarPos) || (verticalBarPos = 0);
+        const dy = verticalBarPos - this.table.scenegraph.proxy.deltaY - oldVerticalBarPos;
+        if (this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
           event: void 0,
-          scrollTop: this.scroll.verticalBarPos,
+          scrollTop: verticalBarPos - this.table.scenegraph.proxy.deltaY,
           scrollLeft: this.scroll.horizontalBarPos,
           scrollHeight: null === (_a = this.table.theme.scrollStyle) || void 0 === _a ? void 0 : _a.width,
           scrollWidth: null === (_b = this.table.theme.scrollStyle) || void 0 === _b ? void 0 : _b.width,
           viewHeight: this.table.tableNoFrameHeight,
           viewWidth: this.table.tableNoFrameWidth,
           scrollDirection: "vertical",
-          scrollRatioY: yRatio
-        }), oldVerticalBarPos !== this.scroll.verticalBarPos && this.checkVerticalScrollBarEnd();
+          scrollRatioY: yRatio,
+          dy: dy
+        }).some(value => !1 === value)) {
+          const yRatio = this.scroll.verticalBarPos / (totalHeight - this.table.scenegraph.height);
+          this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio);
+        } else this.scroll.verticalBarPos = verticalBarPos, this.table.scenegraph.setY(-this.scroll.verticalBarPos, 1 === yRatio), this.scroll.verticalBarPos -= this.table.scenegraph.proxy.deltaY, this.table.scenegraph.proxy.deltaY = 0, this.updateHoverPos(-1, -1), oldVerticalBarPos !== this.scroll.verticalBarPos && this.checkVerticalScrollBarEnd();
       }
       updateHorizontalScrollBar(xRatio) {
         var _a, _b;
         const totalWidth = this.table.getAllColsWidth(),
           oldHorizontalBarPos = this.scroll.horizontalBarPos;
-        this.scroll.horizontalBarPos = Math.ceil(xRatio * (totalWidth - this.table.scenegraph.width)), isValid$3(this.scroll.horizontalBarPos) && !isNaN(this.scroll.horizontalBarPos) || (this.scroll.horizontalBarPos = 0), this.table.scenegraph.setX(-this.scroll.horizontalBarPos, 1 === xRatio), this.scroll.horizontalBarPos -= this.table.scenegraph.proxy.deltaX, this.table.scenegraph.proxy.deltaX = 0, this.updateHoverPos(-1, -1), this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+        let horizontalBarPos = Math.ceil(xRatio * (totalWidth - this.table.scenegraph.width));
+        isValid$3(horizontalBarPos) && !isNaN(horizontalBarPos) || (horizontalBarPos = 0);
+        const dx = horizontalBarPos - this.table.scenegraph.proxy.deltaX - oldHorizontalBarPos;
+        if (this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
           event: void 0,
           scrollTop: this.scroll.verticalBarPos,
-          scrollLeft: this.scroll.horizontalBarPos,
+          scrollLeft: horizontalBarPos - this.table.scenegraph.proxy.deltaX,
           scrollHeight: null === (_a = this.table.theme.scrollStyle) || void 0 === _a ? void 0 : _a.width,
           scrollWidth: null === (_b = this.table.theme.scrollStyle) || void 0 === _b ? void 0 : _b.width,
           viewHeight: this.table.tableNoFrameHeight,
           viewWidth: this.table.tableNoFrameWidth,
           scrollDirection: "horizontal",
-          scrollRatioX: xRatio
-        }), oldHorizontalBarPos !== this.scroll.horizontalBarPos && this.checkHorizontalScrollBarEnd();
+          scrollRatioX: xRatio,
+          dx: dx
+        }).some(value => !1 === value)) {
+          const xRatio = this.scroll.horizontalBarPos / (totalWidth - this.table.scenegraph.width);
+          this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
+        } else this.scroll.horizontalBarPos = horizontalBarPos, this.table.scenegraph.setX(-this.scroll.horizontalBarPos, 1 === xRatio), this.scroll.horizontalBarPos -= this.table.scenegraph.proxy.deltaX, this.table.scenegraph.proxy.deltaX = 0, this.updateHoverPos(-1, -1), oldHorizontalBarPos !== this.scroll.horizontalBarPos && this.checkHorizontalScrollBarEnd();
       }
       setScrollTop(top, event) {
         let triggerEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : !0;
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e;
         const totalHeight = this.table.getAllRowsHeight(),
           sizeTolerance = (null === (_a = this.table.options.customConfig) || void 0 === _a ? void 0 : _a._disableColumnAndRowSizeRound) ? 1 : 0;
-        top = Math.max(0, Math.min(top, totalHeight - this.table.scenegraph.height - sizeTolerance)), ((top = Math.ceil(top)) !== this.scroll.verticalBarPos || this.table.isPivotChart()) && this.updateHoverPos(-1, -1);
-        const oldVerticalBarPos = this.scroll.verticalBarPos;
-        this.scroll.verticalBarPos = top, isValid$3(this.scroll.verticalBarPos) && !isNaN(this.scroll.verticalBarPos) || (this.scroll.verticalBarPos = 0), this.table.scenegraph.setY(-top);
-        const yRatio = top / (totalHeight - this.table.scenegraph.height);
-        this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio), oldVerticalBarPos !== top && triggerEvent && (this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
-          event: null == event ? void 0 : event.nativeEvent,
-          scrollTop: this.scroll.verticalBarPos,
-          scrollLeft: this.scroll.horizontalBarPos,
-          scrollHeight: null === (_b = this.table.theme.scrollStyle) || void 0 === _b ? void 0 : _b.width,
-          scrollWidth: null === (_c = this.table.theme.scrollStyle) || void 0 === _c ? void 0 : _c.width,
-          viewHeight: this.table.tableNoFrameHeight,
-          viewWidth: this.table.tableNoFrameWidth,
-          scrollDirection: "vertical",
-          scrollRatioY: yRatio
-        }), this.checkVerticalScrollBarEnd());
+        top = Math.max(0, Math.min(top, totalHeight - this.table.scenegraph.height - sizeTolerance)), top = Math.ceil(top);
+        const oldVerticalBarPos = this.scroll.verticalBarPos,
+          yRatio = top / (totalHeight - this.table.scenegraph.height);
+        if ((oldVerticalBarPos !== top || !0 === (null === (_c = null === (_b = this.table.options) || void 0 === _b ? void 0 : _b.customConfig) || void 0 === _c ? void 0 : _c.scrollEventAlwaysTrigger)) && triggerEvent) {
+          let verticalBarPos = top;
+          isValid$3(verticalBarPos) && !isNaN(verticalBarPos) || (verticalBarPos = 0);
+          const dy = verticalBarPos - oldVerticalBarPos;
+          if (this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+            event: null == event ? void 0 : event.nativeEvent,
+            scrollTop: verticalBarPos,
+            scrollLeft: this.scroll.horizontalBarPos,
+            scrollHeight: null === (_d = this.table.theme.scrollStyle) || void 0 === _d ? void 0 : _d.width,
+            scrollWidth: null === (_e = this.table.theme.scrollStyle) || void 0 === _e ? void 0 : _e.width,
+            viewHeight: this.table.tableNoFrameHeight,
+            viewWidth: this.table.tableNoFrameWidth,
+            scrollDirection: "vertical",
+            scrollRatioY: yRatio,
+            dy: dy
+          }).some(value => !1 === value)) {
+            const yRatio = this.scroll.verticalBarPos / (totalHeight - this.table.scenegraph.height);
+            return void this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio);
+          }
+        }
+        (top !== this.scroll.verticalBarPos || this.table.isPivotChart()) && this.updateHoverPos(-1, -1), this.scroll.verticalBarPos = top, isValid$3(this.scroll.verticalBarPos) && !isNaN(this.scroll.verticalBarPos) || (this.scroll.verticalBarPos = 0), this.table.scenegraph.setY(-top), this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio), oldVerticalBarPos !== top && triggerEvent && this.checkVerticalScrollBarEnd();
       }
       setScrollLeft(left, event) {
         let triggerEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : !0;
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e;
         this.table.scrollLeft;
         const totalWidth = this.table.getAllColsWidth(),
           sizeTolerance = (this.table.getFrozenColsWidth(), (null === (_a = this.table.options.customConfig) || void 0 === _a ? void 0 : _a._disableColumnAndRowSizeRound) ? 1 : 0);
-        left = Math.max(0, Math.min(left, totalWidth - this.table.scenegraph.width - sizeTolerance)), (left = Math.ceil(left)) !== this.scroll.horizontalBarPos && this.updateHoverPos(-1, -1);
-        const oldHorizontalBarPos = this.scroll.horizontalBarPos;
-        this.scroll.horizontalBarPos = left, isValid$3(this.scroll.horizontalBarPos) && !isNaN(this.scroll.horizontalBarPos) || (this.scroll.horizontalBarPos = 0), this.table.scenegraph.setX(-left);
-        const xRatio = left / (totalWidth - this.table.scenegraph.width);
-        this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio), oldHorizontalBarPos !== left && triggerEvent && (this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
-          event: null == event ? void 0 : event.nativeEvent,
-          scrollTop: this.scroll.verticalBarPos,
-          scrollLeft: this.scroll.horizontalBarPos,
-          scrollHeight: null === (_b = this.table.theme.scrollStyle) || void 0 === _b ? void 0 : _b.width,
-          scrollWidth: null === (_c = this.table.theme.scrollStyle) || void 0 === _c ? void 0 : _c.width,
-          viewHeight: this.table.tableNoFrameHeight,
-          viewWidth: this.table.tableNoFrameWidth,
-          scrollDirection: "horizontal",
-          scrollRatioX: xRatio
-        }), this.checkHorizontalScrollBarEnd());
+        left = Math.max(0, Math.min(left, totalWidth - this.table.scenegraph.width - sizeTolerance)), left = Math.ceil(left);
+        const oldHorizontalBarPos = this.scroll.horizontalBarPos,
+          xRatio = left / (totalWidth - this.table.scenegraph.width);
+        if ((oldHorizontalBarPos !== left || !0 === (null === (_c = null === (_b = this.table.options) || void 0 === _b ? void 0 : _b.customConfig) || void 0 === _c ? void 0 : _c.scrollEventAlwaysTrigger)) && triggerEvent) {
+          let horizontalBarPos = left;
+          isValid$3(horizontalBarPos) && !isNaN(horizontalBarPos) || (horizontalBarPos = 0);
+          const dx = horizontalBarPos - oldHorizontalBarPos;
+          if (this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+            event: null == event ? void 0 : event.nativeEvent,
+            scrollTop: this.scroll.verticalBarPos,
+            scrollLeft: horizontalBarPos,
+            scrollHeight: null === (_d = this.table.theme.scrollStyle) || void 0 === _d ? void 0 : _d.width,
+            scrollWidth: null === (_e = this.table.theme.scrollStyle) || void 0 === _e ? void 0 : _e.width,
+            viewHeight: this.table.tableNoFrameHeight,
+            viewWidth: this.table.tableNoFrameWidth,
+            scrollDirection: "horizontal",
+            scrollRatioX: xRatio,
+            dx: dx
+          }).some(value => !1 === value)) {
+            const xRatio = this.scroll.horizontalBarPos / (totalWidth - this.table.scenegraph.width);
+            return void this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
+          }
+        }
+        left !== this.scroll.horizontalBarPos && this.updateHoverPos(-1, -1), this.scroll.horizontalBarPos = left, isValid$3(this.scroll.horizontalBarPos) && !isNaN(this.scroll.horizontalBarPos) || (this.scroll.horizontalBarPos = 0), this.table.scenegraph.setX(-left), this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio), oldHorizontalBarPos !== left && triggerEvent && this.checkHorizontalScrollBarEnd();
       }
       hideVerticalScrollBar() {
         this.table.scenegraph.component.hideVerticalScrollBar();
@@ -48374,7 +48414,7 @@
         callback: globalPointerdownCallback
       }), vglobal.addEventListener("pointerup", globalPointerupCallback), vglobal.addEventListener("pointerdown", globalPointerdownCallback), table.scenegraph.tableGroup.addEventListener("pointerdown", e => {
         var _a, _b, _c, _d, _e;
-        table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
+        if (table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
           event: e.nativeEvent
         }), table.eventManager.isDown = !0, table.eventManager.LastBodyPointerXY = {
           x: e.x,
@@ -48382,7 +48422,7 @@
         }, table.eventManager.LastPointerXY = {
           x: e.x,
           y: e.y
-        };
+        }, 0 !== e.button) return;
         const eventArgsSet = getCellEventArgsSet(e);
         if (eventManager.downIcon = void 0, stateManager.interactionState !== InteractionState.default) return;
         if (table.isPivotChart() && "chart" !== (null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target.type) && table.scenegraph.updateChartState(null), (null === (_b = eventArgsSet.eventArgs) || void 0 === _b ? void 0 : _b.target) !== (null === (_c = stateManager.residentHoverIcon) || void 0 === _c ? void 0 : _c.icon) && stateManager.hideMenu(), "chart" === (null === (_d = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _d ? void 0 : _d.target.type)) return;
@@ -48958,7 +48998,7 @@
         }
       }), handler.on(table.getElement(), "contextmenu", e => {
         var _a;
-        !1 !== (null === (_a = table.eventOptions) || void 0 === _a ? void 0 : _a.preventDefaultContextMenu) && e.preventDefault();
+        !1 !== (null === (_a = table.eventOptions) || void 0 === _a ? void 0 : _a.preventDefaultContextMenu) ? e.preventDefault() : globalPointerupCallback(e);
       }), table.options.canvas || handler.on(table.getContainer(), "resize", e => {
         var _a;
         table.isReleased || 0 === e.width && 0 === e.height || ((table.autoFillWidth || table.autoFillHeight) && (null === (_a = table.editorManager) || void 0 === _a || _a.completeEdit()), isValid$3(table.options.pixelRatio) || table.setPixelRatio(getPixelRatio$1()), e.windowSizeNotChange || table.resize());
@@ -49389,6 +49429,75 @@
       });
     }
 
+    function bindIconClickEvent(table) {
+      table.on(TABLE_EVENT_TYPE.ICON_CLICK, iconInfo => {
+        var _a;
+        const {
+            col: col,
+            row: row,
+            x: x,
+            y: y,
+            funcType: funcType,
+            icon: icon,
+            event: event
+          } = iconInfo,
+          {
+            stateManager: stateManager
+          } = table;
+        if (funcType === IconFuncTypeEnum.dropDown) stateManager.triggerDropDownMenu(col, row, x, y, event);else if (funcType === IconFuncTypeEnum.sort) stateManager.triggerSort(col, row, icon, event);else if (funcType === IconFuncTypeEnum.frozen) stateManager.triggerFreeze(col, row, icon);else if (funcType === IconFuncTypeEnum.drillDown) drillClick(table);else if (funcType === IconFuncTypeEnum.collapse || funcType === IconFuncTypeEnum.expand) {
+          const isHasSelected = !!(null === (_a = stateManager.select.ranges) || void 0 === _a ? void 0 : _a.length);
+          stateManager.updateSelectPos(-1, -1), stateManager.endSelectCells(!0, isHasSelected), table.toggleHierarchyState(col, row);
+        }
+      });
+    }
+
+    function bindDropdownMenuClickEvent(table) {
+      table.on(TABLE_EVENT_TYPE.DROPDOWN_MENU_CLICK, () => {
+        table.stateManager.hideMenu();
+      });
+    }
+
+    function bindDBClickAutoColumnWidthEvent(table) {
+      table.on(TABLE_EVENT_TYPE.DBLCLICK_CELL, e => {
+        var _a, _b, _c;
+        if (e.federatedEvent) {
+          const eventArgsSet = getCellEventArgsSet(e.federatedEvent),
+            resizeCol = table.scenegraph.getResizeColAt(eventArgsSet.abstractPos.x, eventArgsSet.abstractPos.y, null === (_a = eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.targetCell),
+            disableDblclickAutoResizeColWidth = null !== (_b = table.options.disableDblclickAutoResizeColWidth) && void 0 !== _b ? _b : null === (_c = table.options.resize) || void 0 === _c ? void 0 : _c.disableDblclickAutoResizeColWidth;
+          if (table.eventManager.checkCellFillhandle(eventArgsSet)) table.fireListeners(TABLE_EVENT_TYPE.DBLCLICK_FILL_HANDLE, {});else if (table._canResizeColumn(resizeCol.col, resizeCol.row) && resizeCol.col >= 0 && !disableDblclickAutoResizeColWidth) {
+            table.scenegraph.updateAutoColWidth(resizeCol.col), table.internalProps._widthResizedColMap.add(resizeCol.col), table.scenegraph.updateChartSizeForResizeColWidth(resizeCol.col);
+            const state = table.stateManager;
+            state.columnResize.col < state.table.frozenColCount && !state.table.isPivotTable() && !state.table.transpose && state.table.scenegraph.component.setFrozenColumnShadow(state.table.frozenColCount - 1, state.columnResize.isRightFrozen);
+            const colWidths = [];
+            for (let col = 0; col < table.colCount; col++) colWidths.push(table.getColWidth(col));
+            table.fireListeners(TABLE_EVENT_TYPE.RESIZE_COLUMN_END, {
+              col: resizeCol.col,
+              colWidths: colWidths
+            });
+          }
+        }
+      });
+    }
+
+    function rightButtonClickEvent(table) {
+      table.on(TABLE_EVENT_TYPE.CONTEXTMENU_CELL, e => {
+        const {
+            col: col,
+            row: row
+          } = e,
+          ranges = table.getSelectedCellRanges();
+        let cellInRange = !1;
+        if (ranges.length > 0) for (let i = 0; i < ranges.length; i++) {
+          const range = ranges[i];
+          if (col >= range.start.col && col <= range.end.col && row >= range.start.row && row <= range.end.row) {
+            cellInRange = !0;
+            break;
+          }
+        }
+        cellInRange || table.selectCell(col, row);
+      });
+    }
+
     let EventManager$1 = class EventManager {
       constructor(table) {
         this.isDown = !1, this.isDraging = !1, this.globalEventListeners = [], this._enableTableScroll = !0, this.table = table, this.handleTextStickBindId = [], this.inertiaScroll = new InertiaScroll(table.stateManager), "node" === Env.mode || table.options.disableInteraction || (this.bindOuterEvent(), setTimeout(() => {
@@ -49413,44 +49522,7 @@
         }, 0);
       }
       bindSelfEvent() {
-        if (this.table.isReleased) return;
-        const stateManager = this.table.stateManager;
-        this.table.on(TABLE_EVENT_TYPE.ICON_CLICK, iconInfo => {
-          var _a;
-          const {
-            col: col,
-            row: row,
-            x: x,
-            y: y,
-            funcType: funcType,
-            icon: icon,
-            event: event
-          } = iconInfo;
-          if (funcType === IconFuncTypeEnum.dropDown) stateManager.triggerDropDownMenu(col, row, x, y, event);else if (funcType === IconFuncTypeEnum.sort) stateManager.triggerSort(col, row, icon, event);else if (funcType === IconFuncTypeEnum.frozen) stateManager.triggerFreeze(col, row, icon);else if (funcType === IconFuncTypeEnum.drillDown) drillClick(this.table);else if (funcType === IconFuncTypeEnum.collapse || funcType === IconFuncTypeEnum.expand) {
-            const isHasSelected = !!(null === (_a = stateManager.select.ranges) || void 0 === _a ? void 0 : _a.length);
-            stateManager.updateSelectPos(-1, -1), stateManager.endSelectCells(!0, isHasSelected), this.table.toggleHierarchyState(col, row);
-          }
-        }), this.table.on(TABLE_EVENT_TYPE.DROPDOWN_MENU_CLICK, () => {
-          stateManager.hideMenu();
-        }), this.updateEventBinder(), bindMediaClick(this.table), this.table.on(TABLE_EVENT_TYPE.DBLCLICK_CELL, e => {
-          var _a, _b, _c;
-          if (e.federatedEvent) {
-            const eventArgsSet = getCellEventArgsSet(e.federatedEvent),
-              resizeCol = this.table.scenegraph.getResizeColAt(eventArgsSet.abstractPos.x, eventArgsSet.abstractPos.y, null === (_a = eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.targetCell),
-              disableDblclickAutoResizeColWidth = null !== (_b = this.table.options.disableDblclickAutoResizeColWidth) && void 0 !== _b ? _b : null === (_c = this.table.options.resize) || void 0 === _c ? void 0 : _c.disableDblclickAutoResizeColWidth;
-            if (this.table.eventManager.checkCellFillhandle(eventArgsSet)) this.table.fireListeners(TABLE_EVENT_TYPE.DBLCLICK_FILL_HANDLE, {});else if (this.table._canResizeColumn(resizeCol.col, resizeCol.row) && resizeCol.col >= 0 && !disableDblclickAutoResizeColWidth) {
-              this.table.scenegraph.updateAutoColWidth(resizeCol.col), this.table.internalProps._widthResizedColMap.add(resizeCol.col), this.table.scenegraph.updateChartSizeForResizeColWidth(resizeCol.col);
-              const state = this.table.stateManager;
-              state.columnResize.col < state.table.frozenColCount && !state.table.isPivotTable() && !state.table.transpose && state.table.scenegraph.component.setFrozenColumnShadow(state.table.frozenColCount - 1, state.columnResize.isRightFrozen);
-              const colWidths = [];
-              for (let col = 0; col < this.table.colCount; col++) colWidths.push(this.table.getColWidth(col));
-              this.table.fireListeners(TABLE_EVENT_TYPE.RESIZE_COLUMN_END, {
-                col: resizeCol.col,
-                colWidths: colWidths
-              });
-            }
-          }
-        }), this.table.isPivotTable() && checkHaveDrill(this.table) && bindDrillEvent(this.table), bindSparklineHoverEvent(this.table), bindAxisClickEvent(this.table), bindAxisHoverEvent(this.table), bindGroupTitleCheckboxChange(this.table), bindButtonClickEvent(this.table);
+        this.table.isReleased || (bindIconClickEvent(this.table), bindDropdownMenuClickEvent(this.table), this.updateEventBinder(), bindMediaClick(this.table), bindDBClickAutoColumnWidthEvent(this.table), this.table.isPivotTable() && checkHaveDrill(this.table) && bindDrillEvent(this.table), bindSparklineHoverEvent(this.table), bindAxisClickEvent(this.table), bindAxisHoverEvent(this.table), bindGroupTitleCheckboxChange(this.table), bindButtonClickEvent(this.table), rightButtonClickEvent(this.table));
       }
       dealTableHover(eventArgsSet) {
         if (!eventArgsSet) return void this.table.stateManager.updateHoverPos(-1, -1);
@@ -52201,7 +52273,7 @@
       constructor(container) {
         let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
-        if (super(), this.showFrozenIcon = !0, this.version = "1.17.3-alpha.10", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), !container && "node" !== options.mode && !options.canvas) throw new Error("vtable's container is undefined");
+        if (super(), this.showFrozenIcon = !0, this.version = "1.17.3-alpha.12", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), !container && "node" !== options.mode && !options.canvas) throw new Error("vtable's container is undefined");
         !1 === (null === (_a = options.customConfig) || void 0 === _a ? void 0 : _a.imageAnonymous) && (vglobal.isImageAnonymous = !1);
         const {
           frozenColCount = 0,
@@ -52249,7 +52321,7 @@
           right: 0,
           left: 0,
           bottom: 0
-        }, padding && ("number" == typeof padding ? (this.padding.top = padding, this.padding.left = padding, this.padding.bottom = padding, this.padding.right = padding) : (padding.top && (this.padding.top = padding.top), padding.bottom && (this.padding.bottom = padding.bottom), padding.left && (this.padding.left = padding.left), padding.right && (this.padding.right = padding.right))), isValid$3(canvasHeight) && isValid$3(canvasWidth) && (this.canvasSizeSeted = !0), this.tableNoFrameWidth = 0, this.tableNoFrameHeight = 0, this.canvasWidth = isNumber$4(canvasWidth) ? canvasWidth : void 0, this.canvasHeight = isNumber$4(canvasHeight) ? canvasHeight : void 0, this.columnWidthComputeMode = null !== (_b = options.columnWidthComputeMode) && void 0 !== _b ? _b : "normal";
+        }, padding && ("number" == typeof padding ? (this.padding.top = padding, this.padding.left = padding, this.padding.bottom = padding, this.padding.right = padding) : (padding.top && (this.padding.top = padding.top), padding.bottom && (this.padding.bottom = padding.bottom), padding.left && (this.padding.left = padding.left), padding.right && (this.padding.right = padding.right))), (isValid$3(canvasHeight) || isValid$3(canvasWidth)) && (this.canvasSizeSeted = !0), this.tableNoFrameWidth = 0, this.tableNoFrameHeight = 0, this.canvasWidth = isNumber$4(canvasWidth) ? canvasWidth : void 0, this.canvasHeight = isNumber$4(canvasHeight) ? canvasHeight : void 0, this.columnWidthComputeMode = null !== (_b = options.columnWidthComputeMode) && void 0 !== _b ? _b : "normal";
         const internalProps = this.internalProps = {};
         void 0 !== showFrozenIcon && (this.showFrozenIcon = showFrozenIcon), "number" == typeof allowFrozenColCount && allowFrozenColCount <= 0 && (this.showFrozenIcon = !1), this.options.canvas ? ("node" !== Env.mode && (internalProps.element = this.options.canvas.parentElement, internalProps.element.style.position = "relative"), internalProps.focusControl = new FocusInput(this, internalProps.element), internalProps.canvas = this.options.canvas, internalProps.context = internalProps.canvas.getContext("2d")) : "node" !== Env.mode && (internalProps.element = createRootElement$1(this.padding), internalProps.focusControl = new FocusInput(this, internalProps.element), internalProps.canvas = document.createElement("canvas"), internalProps.element.appendChild(internalProps.canvas), internalProps.context = internalProps.canvas.getContext("2d"), (null === (_c = options.customConfig) || void 0 === _c ? void 0 : _c.createReactContainer) && createReactContainer(this)), internalProps.handler = new EventHandler$1(), isNumber$4(this.options.resizeTime) && (internalProps.handler.resizeTime = this.options.resizeTime), internalProps.pixelRatio = pixelRatio, internalProps.frozenColCount = frozenColCount, internalProps.frozenRowCount = frozenRowCount, internalProps.unfreezeAllOnExceedsMaxWidth = null == unfreezeAllOnExceedsMaxWidth || unfreezeAllOnExceedsMaxWidth, internalProps.defaultRowHeight = defaultRowHeight, internalProps.defaultHeaderRowHeight = null != defaultHeaderRowHeight ? defaultHeaderRowHeight : defaultRowHeight, internalProps.defaultColWidth = defaultColWidth, internalProps.defaultHeaderColWidth = null != defaultHeaderColWidth ? defaultHeaderColWidth : defaultColWidth, internalProps.keyboardOptions = keyboardOptions, internalProps.eventOptions = eventOptions, internalProps.rowSeriesNumber = rowSeriesNumber, internalProps.columnResizeMode = null !== (_d = null == resize ? void 0 : resize.columnResizeMode) && void 0 !== _d ? _d : columnResizeMode, internalProps.rowResizeMode = null !== (_e = null == resize ? void 0 : resize.rowResizeMode) && void 0 !== _e ? _e : rowResizeMode, internalProps.dragHeaderMode = null !== (_g = null !== (_f = null == dragOrder ? void 0 : dragOrder.dragHeaderMode) && void 0 !== _f ? _f : dragHeaderMode) && void 0 !== _g ? _g : "none", internalProps.renderChartAsync = renderChartAsync, setBatchRenderChartCount(renderChartAsyncBatchCount), internalProps.overscrollBehavior = null != overscrollBehavior ? overscrollBehavior : "auto", internalProps._rowHeightsMap = new NumberRangeMap(this), internalProps._rowRangeHeightsMap = new Map(), internalProps._colRangeWidthsMap = new Map(), internalProps._widthResizedColMap = new Set(), internalProps._heightResizedRowMap = new Set(), this.colWidthsMap = new NumberMap(), this.colContentWidthsMap = new NumberMap(), this.colWidthsLimit = {};
         const that = this;
@@ -52556,7 +52628,7 @@
         }
       }
       _updateSize() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
         const {
           padding: padding
         } = this;
@@ -52566,28 +52638,31 @@
           const element = this.getElement();
           let widthWithoutPadding = 0,
             heightWithoutPadding = 0;
-          if (this.canvasSizeSeted) widthWithoutPadding = this.canvasWidth, heightWithoutPadding = this.canvasHeight;else if (element.parentElement) {
+          const isDefWidth = isValid$3(this.canvasWidth),
+            isDefHeight = isValid$3(this.canvasHeight);
+          this.canvasSizeSeted && (isDefWidth && (widthWithoutPadding = this.canvasWidth), isDefHeight && (heightWithoutPadding = this.canvasHeight));
+          if ((!isDefWidth || !isDefHeight) && element.parentElement) {
             const computedStyle = element.parentElement.style || window.getComputedStyle(element.parentElement);
-            widthWithoutPadding = element.parentElement.offsetWidth - parseInt(computedStyle.paddingLeft || "0px", 10) - parseInt(computedStyle.paddingRight || "0px", 10), heightWithoutPadding = element.parentElement.offsetHeight - parseInt(computedStyle.paddingTop || "0px", 10) - parseInt(computedStyle.paddingBottom || "0px", 20), widthWithoutPadding = (null != widthWithoutPadding ? widthWithoutPadding : 1) - (this.options.tableSizeAntiJitter ? 1 : 0), heightWithoutPadding = (null != heightWithoutPadding ? heightWithoutPadding : 1) - (this.options.tableSizeAntiJitter ? 1 : 0);
+            isDefWidth || (widthWithoutPadding = element.parentElement.offsetWidth - (parseInt(computedStyle.paddingLeft, 10) || 0) - (parseInt(computedStyle.paddingRight, 10) || 0)), isDefHeight || (heightWithoutPadding = element.parentElement.offsetHeight - parseInt(computedStyle.paddingTop || "0px", 10) - parseInt(computedStyle.paddingBottom || "0px", 20)), widthWithoutPadding = (null != widthWithoutPadding ? widthWithoutPadding : 1) - (this.options.tableSizeAntiJitter ? 1 : 0), heightWithoutPadding = (null != heightWithoutPadding ? heightWithoutPadding : 1) - (this.options.tableSizeAntiJitter ? 1 : 0);
           }
           element.style.width = widthWithoutPadding && widthWithoutPadding - padding.left - padding.right + "px" || "0px", element.style.height = heightWithoutPadding && heightWithoutPadding - padding.top - padding.bottom + "px" || "0px";
           const {
             canvas: canvas
           } = this.internalProps;
-          widthP = (null !== (_c = null === (_b = canvas.parentElement) || void 0 === _b ? void 0 : _b.offsetWidth) && void 0 !== _c ? _c : 1) - (this.options.tableSizeAntiJitter ? 1 : 0), heightP = (null !== (_e = null === (_d = canvas.parentElement) || void 0 === _d ? void 0 : _d.offsetHeight) && void 0 !== _e ? _e : 1) - (this.options.tableSizeAntiJitter ? 1 : 0), (null === (_f = null == this ? void 0 : this.scenegraph) || void 0 === _f ? void 0 : _f.stage) ? this.scenegraph.stage.resize(widthP, heightP) : (canvas.style.width = "", canvas.style.height = "", canvas.width = widthP, canvas.height = heightP, canvas.style.width = `${widthP}px`, canvas.style.height = `${heightP}px`);
+          widthP = (null !== (_c = null === (_b = canvas.parentElement) || void 0 === _b ? void 0 : _b.offsetWidth) && void 0 !== _c ? _c : 1) - (this.options.tableSizeAntiJitter ? 1 : 0), heightP = (null !== (_e = null === (_d = canvas.parentElement) || void 0 === _d ? void 0 : _d.offsetHeight) && void 0 !== _e ? _e : 1) - (this.options.tableSizeAntiJitter ? 1 : 0), (null === (_f = null == this ? void 0 : this.scenegraph) || void 0 === _f ? void 0 : _f.stage) ? (null === (_g = this.options) || void 0 === _g ? void 0 : _g.viewBox) && !(null === (_h = this.options) || void 0 === _h ? void 0 : _h.canvas) && this.scenegraph.stage.resize(widthP, heightP) : (canvas.style.width = "", canvas.style.height = "", canvas.width = widthP, canvas.height = heightP, canvas.style.width = `${widthP}px`, canvas.style.height = `${heightP}px`), (null === (_j = this.options) || void 0 === _j ? void 0 : _j.viewBox) && (widthP = this.options.viewBox.x2 - this.options.viewBox.x1, heightP = this.options.viewBox.y2 - this.options.viewBox.y1), (null === (_k = null == this ? void 0 : this.scenegraph) || void 0 === _k ? void 0 : _k.stage) && (this.options.viewBox ? this.scenegraph.stage.setViewBox(this.options.viewBox, !1) : this.scenegraph.stage.resize(widthP, heightP));
         } else "node" === Env.mode && (widthP = this.canvasWidth - 1, heightP = this.canvasHeight - 1);
         const width = Math.floor(widthP - getVerticalScrollBarSize(this.getTheme().scrollStyle)),
           height = Math.floor(heightP - getHorizontalScrollBarSize(this.getTheme().scrollStyle));
-        if (null === (_g = this.internalProps.theme) || void 0 === _g ? void 0 : _g.frameStyle) {
-          const lineWidths = toBoxArray(null !== (_j = null === (_h = this.internalProps.theme.frameStyle) || void 0 === _h ? void 0 : _h.borderLineWidth) && void 0 !== _j ? _j : [null]),
-            shadowWidths = toBoxArray(null !== (_l = null === (_k = this.internalProps.theme.frameStyle) || void 0 === _k ? void 0 : _k.shadowBlur) && void 0 !== _l ? _l : [0]);
-          (null === (_m = this.theme.frameStyle) || void 0 === _m ? void 0 : _m.innerBorder) ? (this.tableX = 0, this.tableY = 0, this.tableNoFrameWidth = width - (null !== (_o = shadowWidths[1]) && void 0 !== _o ? _o : 0), this.tableNoFrameHeight = height - (null !== (_p = shadowWidths[2]) && void 0 !== _p ? _p : 0)) : (this.tableX = (null !== (_q = lineWidths[3]) && void 0 !== _q ? _q : 0) + (null !== (_r = shadowWidths[3]) && void 0 !== _r ? _r : 0), this.tableY = (null !== (_s = lineWidths[0]) && void 0 !== _s ? _s : 0) + (null !== (_t = shadowWidths[0]) && void 0 !== _t ? _t : 0), this.tableNoFrameWidth = width - ((null !== (_u = lineWidths[1]) && void 0 !== _u ? _u : 0) + (null !== (_v = shadowWidths[1]) && void 0 !== _v ? _v : 0)) - ((null !== (_w = lineWidths[3]) && void 0 !== _w ? _w : 0) + (null !== (_x = shadowWidths[3]) && void 0 !== _x ? _x : 0)), this.tableNoFrameHeight = height - ((null !== (_y = lineWidths[0]) && void 0 !== _y ? _y : 0) + (null !== (_z = shadowWidths[0]) && void 0 !== _z ? _z : 0)) - ((null !== (_0 = lineWidths[2]) && void 0 !== _0 ? _0 : 0) + (null !== (_1 = shadowWidths[2]) && void 0 !== _1 ? _1 : 0)));
+        if (null === (_l = this.internalProps.theme) || void 0 === _l ? void 0 : _l.frameStyle) {
+          const lineWidths = toBoxArray(null !== (_o = null === (_m = this.internalProps.theme.frameStyle) || void 0 === _m ? void 0 : _m.borderLineWidth) && void 0 !== _o ? _o : [null]),
+            shadowWidths = toBoxArray(null !== (_q = null === (_p = this.internalProps.theme.frameStyle) || void 0 === _p ? void 0 : _p.shadowBlur) && void 0 !== _q ? _q : [0]);
+          (null === (_r = this.theme.frameStyle) || void 0 === _r ? void 0 : _r.innerBorder) ? (this.tableX = 0, this.tableY = 0, this.tableNoFrameWidth = width - (null !== (_s = shadowWidths[1]) && void 0 !== _s ? _s : 0), this.tableNoFrameHeight = height - (null !== (_t = shadowWidths[2]) && void 0 !== _t ? _t : 0)) : (this.tableX = (null !== (_u = lineWidths[3]) && void 0 !== _u ? _u : 0) + (null !== (_v = shadowWidths[3]) && void 0 !== _v ? _v : 0), this.tableY = (null !== (_w = lineWidths[0]) && void 0 !== _w ? _w : 0) + (null !== (_x = shadowWidths[0]) && void 0 !== _x ? _x : 0), this.tableNoFrameWidth = width - ((null !== (_y = lineWidths[1]) && void 0 !== _y ? _y : 0) + (null !== (_z = shadowWidths[1]) && void 0 !== _z ? _z : 0)) - ((null !== (_0 = lineWidths[3]) && void 0 !== _0 ? _0 : 0) + (null !== (_1 = shadowWidths[3]) && void 0 !== _1 ? _1 : 0)), this.tableNoFrameHeight = height - ((null !== (_2 = lineWidths[0]) && void 0 !== _2 ? _2 : 0) + (null !== (_3 = shadowWidths[0]) && void 0 !== _3 ? _3 : 0)) - ((null !== (_4 = lineWidths[2]) && void 0 !== _4 ? _4 : 0) + (null !== (_5 = shadowWidths[2]) && void 0 !== _5 ? _5 : 0)));
         }
       }
       updateViewBox(newViewBox) {
-        var _a, _b, _c, _d, _e, _f, _g, _h;
-        const oldWidth = null !== (_d = null !== (_b = null === (_a = this.options) || void 0 === _a ? void 0 : _a.viewBox.x2) && void 0 !== _b ? _b : 0 - (null === (_c = this.options) || void 0 === _c ? void 0 : _c.viewBox.x1)) && void 0 !== _d ? _d : 0,
-          oldHeight = null !== (_h = null !== (_f = null === (_e = this.options) || void 0 === _e ? void 0 : _e.viewBox.y2) && void 0 !== _f ? _f : 0 - (null === (_g = this.options) || void 0 === _g ? void 0 : _g.viewBox.y1)) && void 0 !== _h ? _h : 0,
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+        const oldWidth = (null !== (_c = null === (_b = null === (_a = this.options) || void 0 === _a ? void 0 : _a.viewBox) || void 0 === _b ? void 0 : _b.x2) && void 0 !== _c ? _c : 0) - (null !== (_f = null === (_e = null === (_d = this.options) || void 0 === _d ? void 0 : _d.viewBox) || void 0 === _e ? void 0 : _e.x1) && void 0 !== _f ? _f : 0),
+          oldHeight = (null !== (_j = null === (_h = null === (_g = this.options) || void 0 === _g ? void 0 : _g.viewBox) || void 0 === _h ? void 0 : _h.y2) && void 0 !== _j ? _j : 0) - (null !== (_m = null === (_l = null === (_k = this.options) || void 0 === _k ? void 0 : _k.viewBox) || void 0 === _l ? void 0 : _l.y1) && void 0 !== _m ? _m : 0),
           newWidth = newViewBox.x2 - newViewBox.x1,
           newHeight = newViewBox.y2 - newViewBox.y1;
         this.options.viewBox = newViewBox, oldWidth !== newWidth || oldHeight !== newHeight ? this.resize() : this.scenegraph.stage.setViewBox(this.options.viewBox, !0);
@@ -55546,9 +55621,9 @@
         }, null), this._headerObjectsIncludeHided = this._addHeaders(0, columns, []), this._headerObjects = this._headerObjectsIncludeHided.filter(col => !0 !== col.define.hide), this._headerObjectMap = this._headerObjects.reduce((o, e) => (o[e.id] = e, o), {}), this.rowHierarchyType = checkHasTreeDefine(this) ? "tree" : "grid", this._hasAggregation = checkHasAggregation(this), this._hasAggregationOnBottomCount = checkHasAggregationOnBottom(this), this._hasAggregationOnTopCount = checkHasAggregationOnTop(this), this.handleRowSeriesNumber(table.internalProps.rowSeriesNumber);
       }
       handleRowSeriesNumber(rowSeriesNumber) {
-        var _a, _b;
+        var _a;
         rowSeriesNumber && (Array.isArray(rowSeriesNumber) ? this.rowSeriesNumberColumn = rowSeriesNumber.map((seriesNumber, index) => {
-          var _a, _b, _c;
+          var _a, _b;
           return {
             id: this.seqId++,
             title: seriesNumber.title,
@@ -55556,11 +55631,11 @@
               field: "_vtable_rowSeries_number_" + index
             }, seriesNumber),
             cellType: null !== (_a = seriesNumber.cellType) && void 0 !== _a ? _a : "text",
-            headerType: null !== (_b = rowSeriesNumber.cellType) && void 0 !== _b ? _b : "text",
+            headerType: "checkbox" === seriesNumber.cellType ? "checkbox" : "text",
             style: seriesNumber.style,
             width: seriesNumber.width,
             format: seriesNumber.format,
-            field: null !== (_c = seriesNumber.field) && void 0 !== _c ? _c : "_vtable_rowSeries_number_" + index,
+            field: null !== (_b = seriesNumber.field) && void 0 !== _b ? _b : "_vtable_rowSeries_number_" + index,
             icon: seriesNumber.icon,
             headerIcon: seriesNumber.headerIcon,
             isChildNode: !1
@@ -55572,7 +55647,7 @@
             field: "_vtable_rowSeries_number"
           }, rowSeriesNumber),
           cellType: null !== (_a = rowSeriesNumber.cellType) && void 0 !== _a ? _a : "text",
-          headerType: null !== (_b = rowSeriesNumber.cellType) && void 0 !== _b ? _b : "text",
+          headerType: "checkbox" === rowSeriesNumber.cellType ? "checkbox" : "text",
           style: rowSeriesNumber.style,
           width: rowSeriesNumber.width,
           format: rowSeriesNumber.format,
@@ -65212,7 +65287,7 @@
         themes: themes$1
     });
 
-    const version = "1.17.3-alpha.10";
+    const version = "1.17.3-alpha.12";
 
     exports.Gantt = Gantt;
     exports.TYPES = index$3;