@progress/kendo-react-gantt 6.1.1 → 7.0.0-develop.2

package/dist/es/components/BaseView.js

@@ -1,253 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import * as React from 'react';
-import { useGanttPropsContext, useGanttTaskModelFieldsContext, useGanttTaskDataContext, useGanttDependencyDataContext, useGanttRowHeightContext, useGanttToolbarHeightContext, useGanttEventsContext, useGanttDependencyModelFieldsContext } from './../context/GanttContext';
-import { GanttViewContext } from '../context/GanttViewContext';
-import { GanttTask } from './GanttTask';
-import { useDictionaryStore } from '../hooks/useDictionaryStore';
-import { GanttDependency } from './GanttDependency';
-import { getTimelineHeader, getTimelineContent, getTimelineWidth } from '../utils';
-import { readColumns, mapColumns } from '@progress/kendo-react-data-tools';
-import { DEFAULT_COLUMN_WIDTH, DEPENDENCY_DRAG_HANDLE, TASK_ID_ATT } from '../constants';
-import { GanttTreeList } from './GanttTreelist';
-import { getter, guid } from '@progress/kendo-react-common';
-export var BaseView = React.forwardRef(function (props, ref) {
-    var slotLevels = props.slotLevels, slotWidth = props.slotWidth, timelineHeaderCell = props.timelineHeaderCell;
-    var _a = useGanttPropsContext(), columns = _a.columns, noRecords = _a.noRecords, resizable = _a.resizable, reorderable = _a.reorderable, sortable = _a.sortable, sort = _a.sort, filter = _a.filter, columnMenuFilter = _a.columnMenuFilter, columnMenu = _a.columnMenu, navigatable = _a.navigatable, row = _a.row, selectable = _a.selectable;
-    var _b = useGanttEventsContext(), onDataStateChange = _b.onDataStateChange, onSortChange = _b.onSortChange, onFilterChange = _b.onFilterChange, onColumnMenuFilterChange = _b.onColumnMenuFilterChange, onExpandChange = _b.onExpandChange, onRowClick = _b.onRowClick, onRowDoubleClick = _b.onRowDoubleClick, onRowContextMenu = _b.onRowContextMenu, onColumnResize = _b.onColumnResize, onColumnReorder = _b.onColumnReorder, onDependencyCreate = _b.onDependencyCreate, onKeyDown = _b.onKeyDown, onSelectionChange = _b.onSelectionChange, onHeaderSelectionChange = _b.onHeaderSelectionChange;
-    var rowHeight = useGanttRowHeightContext();
-    var toolbarHeight = useGanttToolbarHeightContext();
-    var taskModelFields = useGanttTaskModelFieldsContext();
-    var dependencyModelFields = useGanttDependencyModelFieldsContext();
-    var tasksData = useGanttTaskDataContext();
-    var dependenciesData = useGanttDependencyDataContext();
-    var timelineHeaderRef = React.useRef(null);
-    var timelineContentRef = React.useRef(null);
-    var treelistRef = React.useRef(null);
-    var timelineSvgRef = React.useRef(null);
-    var svgLeftRef = React.useRef(0);
-    var idPrefixRef = React.useRef(guid());
-    var contentRef = React.useRef(null);
-    var baseViewRef = React.useRef(null);
-    var scrollIntoView = React.useCallback(function (options) {
-        if (treelistRef.current) {
-            treelistRef.current.scrollIntoView(options);
-        }
-    }, []);
-    React.useImperativeHandle(baseViewRef, function () { return ({ scrollIntoView: scrollIntoView }); });
-    React.useImperativeHandle(ref, function () { return baseViewRef.current; });
-    var initialXRef = React.useRef(0);
-    var initialYRef = React.useRef(0);
-    var offsetXRef = React.useRef(0);
-    var offsetYRef = React.useRef(0);
-    var startIdRef = React.useRef(null);
-    var startDirectionRef = React.useRef(null);
-    var _c = React.useState(null), coordinates = _c[0], setCoordinates = _c[1];
-    var timelineHeader = getTimelineHeader(slotLevels, timelineHeaderRef, timelineHeaderCell);
-    var timelineContent = getTimelineContent(slotLevels, timelineContentRef);
-    var timelineWidth = getTimelineWidth(slotLevels, slotWidth);
-    var _d = React.useMemo(function () {
-        var extendedCols = readColumns(__spreadArray(__spreadArray([], columns, true), [
-            {
-                title: '',
-                sortable: false,
-                resizable: false,
-                reorderable: false,
-                width: timelineWidth,
-                headerCell: function () { return timelineHeader; },
-                cell: GanttTask,
-                orderIndex: Number.MAX_SAFE_INTEGER,
-                navigatable: false
-            }
-        ], false), { prevId: 0, idPrefix: idPrefixRef.current });
-        var columnsWidthSum = 0;
-        extendedCols.forEach(function (column, index, array) {
-            var isLast = index + 1 === array.length;
-            var isLeaf = column.children.length === 0;
-            if (!isLast) {
-                column.locked = true;
-                if (isLeaf) {
-                    column.width = column.width || DEFAULT_COLUMN_WIDTH;
-                }
-            }
-            else {
-                column.isAccessible = false;
-            }
-            if (isLeaf) {
-                columnsWidthSum += parseFloat(String(column.width));
-            }
-        });
-        return {
-            extendedColumns: extendedCols,
-            columnsWidth: columnsWidthSum,
-            columnsMap: mapColumns(extendedCols)
-        };
-    }, [columns, timelineWidth]), extendedColumns = _d.extendedColumns, columnsWidth = _d.columnsWidth, columnsMap = _d.columnsMap;
-    var _e = useDictionaryStore(), tasksStore = _e[0], dispatchTaskRef = _e[1];
-    var getTimelineHeaderElement = React.useCallback(function () { return timelineHeaderRef.current && timelineHeaderRef.current.parentElement; }, []);
-    var positionTimelineContent = function () {
-        var timelineHeaderElement = getTimelineHeaderElement();
-        var timelineContentElement = timelineContentRef.current;
-        var treelistTbodyElement = treelistRef.current && treelistRef.current.tbodyElement;
-        if (!timelineHeaderElement || !timelineContentElement || !treelistTbodyElement) {
-            return;
-        }
-        var contentTop = treelistTbodyElement.offsetTop;
-        var contentLeft = timelineHeaderElement.offsetLeft;
-        var contentWidth = timelineWidth;
-        timelineContentElement.style.top = contentTop + 'px';
-        timelineContentElement.style.left = contentLeft + 'px';
-        timelineContentElement.style.width = contentWidth + 'px';
-        timelineContentElement.style.height = treelistTbodyElement.offsetHeight + 'px';
-    };
-    var getSvgLeft = function () {
-        var timelineHeaderElement = getTimelineHeaderElement();
-        if (!timelineHeaderElement) {
-            return;
-        }
-        // Better be extracted as ColumnResizeStart event
-        svgLeftRef.current = timelineHeaderElement.offsetLeft;
-    };
-    React.useEffect(positionTimelineContent);
-    React.useEffect(getSvgLeft);
-    var onColumnResizeHandler = React.useCallback(function (event) {
-        if (!timelineSvgRef.current) {
-            return;
-        }
-        var currentColumns = event.columns.slice(0, event.columns.length - 1);
-        if (event.end) {
-            timelineSvgRef.current.style.left = '0px';
-        }
-        else {
-            var timelineHeaderElement = getTimelineHeaderElement();
-            if (!timelineHeaderElement) {
-                return;
-            }
-            timelineSvgRef.current.style.left = timelineHeaderElement.offsetLeft - svgLeftRef.current + 'px';
-            positionTimelineContent();
-        }
-        onColumnResize(__assign(__assign({}, event), { columns: currentColumns }));
-    }, [onColumnResize]);
-    var onColumnReorderHandler = React.useCallback(function (event) {
-        var currentColumns = event.columns.slice(0, event.columns.length - 1);
-        onColumnReorder(__assign(__assign({}, event), { columns: currentColumns }));
-    }, [onColumnResize]);
-    var handleDependencyHandlePress = React.useCallback(function (dragEvent) {
-        var ownerDocument = contentRef.current && contentRef.current.ownerDocument ? contentRef.current.ownerDocument : document;
-        var targetElement = ownerDocument.elementFromPoint(dragEvent.clientX, dragEvent.clientY);
-        var contentElement = contentRef.current;
-        if (!targetElement || !targetElement.parentElement || !contentElement) {
-            return;
-        }
-        var ganttWrapperElement = contentElement.parentElement;
-        var scrollableContainer = contentElement.firstElementChild;
-        if (!ganttWrapperElement || !scrollableContainer) {
-            return;
-        }
-        var dragDirection = targetElement.getAttribute(DEPENDENCY_DRAG_HANDLE);
-        if (dragDirection) {
-            var contentOffsetTop = contentElement.offsetTop;
-            var contentOffsetLeft = contentElement.offsetLeft;
-            var ganttOffsetTop = ganttWrapperElement.offsetTop;
-            var ganttOffsetLeft = ganttWrapperElement.offsetLeft;
-            var scrollTop = scrollableContainer.scrollTop;
-            var scrollLeft = scrollableContainer.scrollLeft;
-            offsetXRef.current = contentOffsetLeft + ganttOffsetLeft;
-            offsetYRef.current = contentOffsetTop + ganttOffsetTop;
-            initialXRef.current = dragEvent.clientX - offsetXRef.current + scrollLeft;
-            initialYRef.current = dragEvent.clientY - offsetYRef.current + scrollTop;
-            startIdRef.current = targetElement.parentElement.getAttribute(TASK_ID_ATT);
-            startDirectionRef.current = dragDirection;
-        }
-    }, []);
-    var handleDependencyHandleDrag = React.useCallback(function (dragEvent) {
-        var contentElement = contentRef.current;
-        if (!contentElement) {
-            return;
-        }
-        var scrollableContainer = contentElement.firstElementChild;
-        if (!scrollableContainer) {
-            return;
-        }
-        var scrollTop = scrollableContainer.scrollTop;
-        var scrollLeft = scrollableContainer.scrollLeft;
-        var endX = dragEvent.clientX - offsetXRef.current + scrollLeft;
-        var endY = dragEvent.clientY - offsetYRef.current + scrollTop;
-        if (Math.abs(initialXRef.current - endX) < 10 && Math.abs(initialYRef.current - endY) < 10) {
-            return;
-        }
-        setCoordinates({
-            startX: initialXRef.current,
-            startY: initialYRef.current,
-            endX: endX,
-            endY: endY
-        });
-    }, []);
-    var handleDependencyHandleRelease = React.useCallback(function (dragEvent) {
-        var ownerDocument = contentRef.current && contentRef.current.ownerDocument ? contentRef.current.ownerDocument : document;
-        var targetElement = ownerDocument.elementFromPoint(dragEvent.clientX, dragEvent.clientY);
-        if (!targetElement || !targetElement.parentElement) {
-            return;
-        }
-        var currentId = targetElement.parentElement.getAttribute(TASK_ID_ATT);
-        var currentDragDirection = targetElement.getAttribute(DEPENDENCY_DRAG_HANDLE);
-        if (currentDragDirection && currentId !== startIdRef.current) {
-            if (onDependencyCreate) {
-                // 0 - Finish-Finish
-                // 1 - Finish-Start`
-                // 2 - Start-Finish
-                // 3 - Start-Start`
-                var dependencyType = void 0;
-                if (startDirectionRef.current === 'start') {
-                    dependencyType = currentDragDirection === 'start' ? 3 : 2;
-                }
-                else {
-                    dependencyType = currentDragDirection === 'start' ? 1 : 0;
-                }
-                onDependencyCreate({
-                    fromId: startIdRef.current,
-                    toId: currentId,
-                    type: dependencyType
-                });
-            }
-        }
-        initialXRef.current = 0;
-        initialYRef.current = 0;
-        offsetXRef.current = 0;
-        offsetYRef.current = 0;
-        startIdRef.current = null;
-        startDirectionRef.current = null;
-        setCoordinates(null);
-    }, [onDependencyCreate, setCoordinates]);
-    return (React.createElement(GanttViewContext, { tasksStore: [tasksStore, dispatchTaskRef], timelineWidth: timelineWidth, dependencyDrag: {
-            isEnabled: Boolean(onDependencyCreate),
-            draggedId: startIdRef.current,
-            onDependencyHandlePress: handleDependencyHandlePress,
-            onDependencyHandleDrag: handleDependencyHandleDrag,
-            onDependencyHandleRelease: handleDependencyHandleRelease
-        } },
-        React.createElement("div", { className: 'k-gantt-content', ref: contentRef, style: { height: "calc(100% - ".concat(toolbarHeight, "px)") } },
-            React.createElement(GanttTreeList, { ref: treelistRef, extendedColumns: extendedColumns, columnsMap: columnsMap, dataItemKey: taskModelFields.id, data: tasksData, idPrefix: idPrefixRef.current, navigatable: navigatable, expandField: taskModelFields.isExpanded, subItemsField: taskModelFields.children, editField: taskModelFields.isInEdit, selectedField: taskModelFields.isSelected, onDataStateChange: onDataStateChange, onSortChange: onSortChange, onFilterChange: onFilterChange, onExpandChange: onExpandChange, onRowClick: onRowClick, onRowDoubleClick: onRowDoubleClick, onRowContextMenu: onRowContextMenu, onColumnResize: onColumnResizeHandler, onColumnReorder: onColumnReorderHandler, onColumnMenuFilterChange: onColumnMenuFilterChange, onKeyDown: onKeyDown, onSelectionChange: onSelectionChange, onHeaderSelectionChange: onHeaderSelectionChange, tableProps: { style: { width: columnsWidth }, className: 'k-table k-table-md k-table-layout-fixed' }, noRecords: noRecords, rowHeight: rowHeight, resizable: resizable, reorderable: reorderable, sortable: sortable, sort: sort, filter: filter, columnMenuFilter: columnMenuFilter, columnMenu: columnMenu, row: row, selectable: selectable, afterContent: (React.createElement(React.Fragment, null,
-                    React.createElement("svg", { className: 'k-gantt-dependencies-svg', ref: timelineSvgRef, style: { left: 0, top: 0 } }, dependenciesData.map(function (dependency) { return React.createElement(GanttDependency, { key: getter(dependencyModelFields.id)(dependency), dependency: dependency }); })),
-                    React.createElement("svg", { className: 'k-gantt-dependencies-svg', style: { left: 0, top: 0, zIndex: 3 } }, coordinates && (React.createElement("polyline", { points: "".concat(coordinates.startX, ",").concat(coordinates.startY, " ").concat(coordinates.endX, ",").concat(coordinates.endY) }))),
-                    tasksData && tasksData.length ? timelineContent : null)) }))));
-});
-BaseView.displayName = 'KendoReactGanttBaseView';

package/dist/es/components/GanttDependency.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-/** @hidden */
-export interface GanttDependencyProps {
-    dependency: any;
-}
-/** @hidden */
-export declare const GanttDependency: {
-    (props: GanttDependencyProps): JSX.Element;
-    displayName: string;
-};

package/dist/es/components/GanttDependency.js

@@ -1,56 +0,0 @@
-import * as React from 'react';
-import { useGanttDependencyModelFieldsContext, useGanttRowHeightContext } from './../context/GanttContext';
-import { dependencyCoordinates } from '../utils';
-import { getter } from '@progress/kendo-react-common';
-import { useGanttViewTasksContext } from '../context/GanttViewContext';
-/** @hidden */
-export var GanttDependency = function (props) {
-    var dependency = props.dependency;
-    var tasksStore = useGanttViewTasksContext()[0];
-    var element = React.useRef(null);
-    var dependencyModelFields = useGanttDependencyModelFieldsContext();
-    var rowHeight = useGanttRowHeightContext();
-    var _a = React.useState(false), display = _a[0], setDisplay = _a[1];
-    var drawCanvas = function () {
-        if (element.current === null || tasksStore.current === null) {
-            setDisplay(false);
-            return;
-        }
-        var fromId = tasksStore.current[getter(dependencyModelFields.fromId)(dependency)];
-        var toId = tasksStore.current[getter(dependencyModelFields.toId)(dependency)];
-        if (!fromId || !toId) {
-            setDisplay(false);
-            return;
-        }
-        var fromElement = fromId.element;
-        var toElement = toId.element;
-        if (!fromElement || !toElement) {
-            setDisplay(false);
-            return;
-        }
-        if (display === false) {
-            setDisplay(true);
-            return; // avoid calculating coordinates twice
-        }
-        var fromCoordinates = {
-            top: fromElement.offsetTop + (fromElement.offsetHeight / 2),
-            start: fromElement.offsetLeft,
-            end: fromElement.offsetLeft + fromElement.offsetWidth
-        };
-        var toCoordinates = {
-            top: toElement.offsetTop + (toElement.offsetHeight / 2),
-            start: toElement.offsetLeft,
-            end: toElement.offsetLeft + toElement.offsetWidth
-        };
-        var type = getter(dependencyModelFields.type)(dependency);
-        var points = dependencyCoordinates(fromCoordinates, toCoordinates, rowHeight, type);
-        if (points && points.length) {
-            element.current.setAttribute('points', points.map(function (point) { return "".concat(point.left, ",").concat(point.top); }).join(' '));
-        }
-    };
-    React.useEffect(drawCanvas);
-    return (React.createElement("polyline", { ref: element, style: {
-            display: display ? undefined : 'none'
-        } }));
-};
-GanttDependency.displayName = 'KendoReactGanttDependency';

package/dist/es/components/GanttTask.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import { TreeListCellProps } from '@progress/kendo-react-treelist';
-/** @hidden */
-export interface GanttTaskProps extends TreeListCellProps {
-}
-/** @hidden */
-export interface GanttTaskHandle {
-    element: HTMLDivElement | null;
-    dataItem: any;
-}
-/** @hidden */
-export declare const GanttTask: React.ForwardRefExoticComponent<GanttTaskProps & React.RefAttributes<GanttTaskHandle>>;

package/dist/es/components/GanttTask.js

@@ -1,164 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import * as React from 'react';
-import { useGanttTaskModelFieldsContext, useGanttDateRangeContext, useGanttTaskEventsContext } from './../context/GanttContext';
-import { isInRange } from '../utils';
-import { classNames, getter, IconWrap, useDraggable } from '@progress/kendo-react-common';
-import { xIcon } from '@progress/kendo-svg-icons';
-import { useGanttViewDependencyDragContext, useGanttViewTimelineWidthContext } from '../context/GanttViewContext';
-import { useGanttTask } from '../hooks/useGanttTask';
-import { DEPENDENCY_DRAG_HANDLE_FINISH_ATT, DEPENDENCY_DRAG_HANDLE_START_ATT, MILESTONE_OFFSET, TASK_ID_ATT } from '../constants';
-/** @hidden */
-export var GanttTask = React.forwardRef(function (props, ref) {
-    var _a, _b;
-    var range = useGanttDateRangeContext();
-    var taskModelFields = useGanttTaskModelFieldsContext();
-    var timelineWidth = useGanttViewTimelineWidthContext();
-    var dependencyDrag = useGanttViewDependencyDragContext();
-    var taskEvents = useGanttTaskEventsContext();
-    var taskElementRef = React.useRef(null);
-    var completeElementRef = React.useRef(null);
-    useGanttTask(props.dataItem, getter(taskModelFields.id)(props.dataItem), ref, taskElementRef);
-    var slotElementRef = React.useRef(null);
-    var taskId = getter(taskModelFields.id)(props.dataItem);
-    var taskStart = getter(taskModelFields.start)(props.dataItem);
-    var taskEnd = getter(taskModelFields.end)(props.dataItem);
-    var taskTitle = getter(taskModelFields.title)(props.dataItem);
-    var percentComplete = getter(taskModelFields.percentComplete)(props.dataItem);
-    var taskChildren = getter(taskModelFields.children)(props.dataItem);
-    var taskSelected = getter(taskModelFields.isSelected)(props.dataItem);
-    var taskStartTime = taskStart && taskStart.getTime();
-    var taskEndTime = taskEnd && taskEnd.getTime();
-    var isSummaryTask = taskChildren && taskChildren.length;
-    var isMilestone = !isSummaryTask && taskStartTime === taskEndTime;
-    var display = taskStartTime && taskEndTime && isInRange(range.start, range.end, taskStart, taskEnd);
-    var _c = React.useState(false), visible = _c[0], setVisible = _c[1];
-    var dependencyStartElementRef = React.useRef(null);
-    var dependencyEndElementRef = React.useRef(null);
-    useDraggable(dependencyStartElementRef, {
-        onPress: dependencyDrag.onDependencyHandlePress,
-        onDrag: dependencyDrag.onDependencyHandleDrag,
-        onRelease: dependencyDrag.onDependencyHandleRelease
-    });
-    useDraggable(dependencyEndElementRef, {
-        onPress: dependencyDrag.onDependencyHandlePress,
-        onDrag: dependencyDrag.onDependencyHandleDrag,
-        onRelease: dependencyDrag.onDependencyHandleRelease
-    });
-    var onClickHandler = React.useCallback(function (event) {
-        if (taskEvents.onTaskClick) {
-            taskEvents.onTaskClick({
-                dataItem: props.dataItem,
-                level: props.level,
-                nativeEvent: event && event.nativeEvent,
-                syntheticEvent: event,
-                target: null
-            });
-        }
-    }, [props.dataItem, props.level]);
-    var onDoubleClickHandler = React.useCallback(function (event) {
-        if (taskEvents.onTaskDoubleClick) {
-            taskEvents.onTaskDoubleClick({
-                dataItem: props.dataItem,
-                level: props.level,
-                nativeEvent: event && event.nativeEvent,
-                syntheticEvent: event,
-                target: null
-            });
-        }
-    }, [props.dataItem, props.level]);
-    var onContextMenuHandler = React.useCallback(function (event) {
-        if (taskEvents.onTaskContextMenu) {
-            taskEvents.onTaskContextMenu({
-                dataItem: props.dataItem,
-                level: props.level,
-                nativeEvent: event && event.nativeEvent,
-                syntheticEvent: event,
-                target: null
-            });
-        }
-    }, [props.dataItem, props.level]);
-    var onRemoveHandler = React.useCallback(function (event) {
-        if (taskEvents.onTaskRemoveClick) {
-            taskEvents.onTaskRemoveClick({
-                dataItem: props.dataItem,
-                level: props.level,
-                nativeEvent: event && event.nativeEvent,
-                syntheticEvent: event,
-                target: null
-            });
-        }
-    }, [props.dataItem, props.level]);
-    var position = React.useCallback(function () {
-        var slotStart = range.start;
-        var slotEnd = range.end;
-        var slotElement = slotElementRef.current;
-        var taskElement = taskElementRef.current;
-        var completeElement = completeElementRef.current;
-        if (!display || slotElement === null || taskElement === null) {
-            return;
-        }
-        var pxPerMillisecond = slotElement.clientWidth / (slotEnd.getTime() - slotStart.getTime());
-        var left = (taskStart.getTime() - slotStart.getTime()) * pxPerMillisecond;
-        var width = (taskEnd.getTime() - taskStart.getTime()) * pxPerMillisecond;
-        var top = (slotElement.offsetHeight - taskElement.offsetHeight) / 2;
-        taskElement.style.left = "".concat(Math.round(isMilestone ? left - MILESTONE_OFFSET : left), "px");
-        taskElement.style.top = "".concat(Math.round(top), "px");
-        if (!isMilestone) {
-            taskElement.style.width = "".concat(Math.round(width), "px");
-            if (completeElement !== null) {
-                completeElement.style.width = "".concat(Math.round(width * (percentComplete || 0)), "px");
-            }
-        }
-        setVisible(true);
-    }, [range.start.getTime(), range.end.getTime(), taskStartTime, taskEndTime, display, percentComplete, timelineWidth]);
-    React.useEffect(position, [position]);
-    var taskStyles = {
-        visibility: visible ? undefined : 'hidden',
-        display: display ? undefined : 'none'
-    };
-    var dependencyDragStyles = {
-        userSelect: 'none',
-        display: dependencyDrag.draggedId === String(taskId) ? 'block' : undefined
-    };
-    return (React.createElement("td", { ref: slotElementRef, key: taskId, role: 'presentation' }, isMilestone ?
-        (React.createElement("div", __assign({ "aria-hidden": true, className: classNames({
-                'k-task': true,
-                'k-task-milestone': true,
-                'k-selected': taskSelected && !Array.isArray(taskSelected)
-            }), style: taskStyles, ref: taskElementRef }, (_a = {}, _a[TASK_ID_ATT] = taskId, _a), { onClick: onClickHandler, onDoubleClick: onDoubleClickHandler, onContextMenu: onContextMenuHandler }),
-            React.createElement("div", { className: 'k-task-milestone-content' }),
-            dependencyDrag.isEnabled &&
-                (React.createElement("div", __assign({ className: 'k-task-dot k-task-start', ref: dependencyStartElementRef, style: dependencyDragStyles }, DEPENDENCY_DRAG_HANDLE_START_ATT))),
-            dependencyDrag.isEnabled &&
-                (React.createElement("div", __assign({ className: 'k-task-dot k-task-end', ref: dependencyEndElementRef, style: dependencyDragStyles }, DEPENDENCY_DRAG_HANDLE_FINISH_ATT))))) :
-        (React.createElement("div", __assign({ "aria-hidden": true, className: classNames({
-                'k-task': true,
-                'k-task-summary': isSummaryTask,
-                'k-task-single': !isSummaryTask,
-                'k-selected': taskSelected && !Array.isArray(taskSelected)
-            }), ref: taskElementRef, style: taskStyles }, (_b = {}, _b[TASK_ID_ATT] = taskId, _b), { onClick: onClickHandler, onDoubleClick: onDoubleClickHandler, onContextMenu: onContextMenuHandler }),
-            isSummaryTask ?
-                (React.createElement("div", { className: 'k-task-summary-progress', ref: completeElementRef },
-                    React.createElement("div", { className: 'k-task-summary-complete' }))) :
-                (React.createElement("div", { className: 'k-task-complete', ref: completeElementRef })),
-            !isSummaryTask && (React.createElement(React.Fragment, null,
-                React.createElement("div", { className: 'k-task-content' }, taskTitle),
-                taskEvents.onTaskRemoveClick ? (React.createElement("span", { className: 'k-task-actions' },
-                    React.createElement("span", { onClick: onRemoveHandler, className: 'k-link k-task-delete', "aria-label": "Delete" },
-                        React.createElement(IconWrap, { name: "x", icon: xIcon })))) : null)),
-            dependencyDrag.isEnabled &&
-                React.createElement("div", __assign({ className: 'k-task-dot k-task-start', ref: dependencyStartElementRef, style: dependencyDragStyles }, DEPENDENCY_DRAG_HANDLE_START_ATT)),
-            dependencyDrag.isEnabled &&
-                React.createElement("div", __assign({ className: 'k-task-dot k-task-end', ref: dependencyEndElementRef, style: dependencyDragStyles }, DEPENDENCY_DRAG_HANDLE_FINISH_ATT))))));
-});
-GanttTask.displayName = 'KendoReactGanttTask';

package/dist/es/components/GanttTreelist.d.ts

@@ -1,138 +0,0 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { CommonDragLogic, ExtendedColumnProps, TableKeyboardNavigationContextType } from '@progress/kendo-react-data-tools';
-import { TreeListProps } from '@progress/kendo-react-treelist';
-import { GanttCellProps } from '../interfaces/GanttCellProps';
-import { GanttHeaderCellProps } from '../interfaces/GanttHeaderCellProps';
-import { GanttFilterCellProps } from '../interfaces/GanttFilterCellProps';
-/**
- * @hidden
- */
-export interface GanttTreeListProps extends TreeListProps {
-    extendedColumns: ExtendedColumnProps<GanttCellProps, GanttHeaderCellProps, GanttFilterCellProps>[];
-    columnsMap: number[][];
-    afterContent: any;
-    dataItemKey: string;
-    navigatable?: boolean;
-    idPrefix: string;
-}
-/**
- * @hidden
- */
-export declare class GanttTreeList extends React.Component<GanttTreeListProps, {}> {
-    /**
-     * @hidden
-     */
-    static propTypes: {
-        data: PropTypes.Requireable<any[]>;
-        resizable: PropTypes.Requireable<boolean>;
-        reorderable: PropTypes.Requireable<boolean>;
-        sortable: PropTypes.Requireable<NonNullable<boolean | PropTypes.InferProps<{
-            mode: PropTypes.Requireable<string>;
-            allowUnsort: PropTypes.Requireable<boolean>;
-        }> | null | undefined>>;
-        onSortChange: PropTypes.Requireable<(...args: any[]) => any>;
-        sort: PropTypes.Requireable<any[]>;
-        columns: PropTypes.Requireable<(object | null | undefined)[]>;
-        columnVirtualization: PropTypes.Requireable<boolean>;
-        filter: PropTypes.Requireable<any[]>;
-        onFilterChange: PropTypes.Requireable<(...args: any[]) => any>;
-        filterRow: PropTypes.Requireable<any>;
-        toolbar: PropTypes.Requireable<any>;
-        noRecords: PropTypes.Requireable<any>;
-        onExpandChange: PropTypes.Requireable<(...args: any[]) => any>;
-        expandField: PropTypes.Requireable<string>;
-        subItemsField: PropTypes.Requireable<string>;
-        selectedField: PropTypes.Requireable<string>;
-        onSelectionChange: PropTypes.Requireable<(...args: any[]) => any>;
-        onHeaderSelectionChange: PropTypes.Requireable<(...args: any[]) => any>;
-        onRowClick: PropTypes.Requireable<(...args: any[]) => any>;
-        onItemChange: PropTypes.Requireable<(...args: any[]) => any>;
-        editField: PropTypes.Requireable<string>;
-        scrollable: PropTypes.Requireable<string>;
-        rowHeight: PropTypes.Requireable<number>;
-        style: PropTypes.Requireable<object>;
-        tableProps: PropTypes.Requireable<object>;
-        pager: PropTypes.Requireable<any>;
-        skip: PropTypes.Requireable<number>;
-        take: PropTypes.Requireable<number>;
-        onPageChange: PropTypes.Requireable<(...args: any[]) => any>;
-        onDataStateChange: PropTypes.Requireable<(...args: any[]) => any>;
-        onColumnResize: PropTypes.Requireable<(...args: any[]) => any>;
-        onColumnReorder: PropTypes.Requireable<(...args: any[]) => any>;
-        extendedColumns: PropTypes.Requireable<(object | null | undefined)[]>;
-        columnsMap: PropTypes.Requireable<(any[] | null | undefined)[]>;
-        dataItemKey: PropTypes.Validator<string>;
-        afterContent: PropTypes.Requireable<any>;
-        navigatable: PropTypes.Requireable<boolean>;
-        idPrefix: PropTypes.Requireable<string>;
-    };
-    /** @hidden */
-    static contextType: React.Context<TableKeyboardNavigationContextType | undefined>;
-    state: TableKeyboardNavigationContextType;
-    tableElement: HTMLTableElement | null;
-    tbodyElement: HTMLTableSectionElement | null;
-    private wrapperScrollLeft;
-    private wrapperScrollTop;
-    private updateOnScroll;
-    private tbodyOffsetTop;
-    private prevData;
-    private flattedData;
-    private columnResize;
-    private element;
-    protected dragLogic: CommonDragLogic<GanttCellProps, GanttHeaderCellProps, GanttFilterCellProps>;
-    private _treeListId;
-    private get document();
-    private contextStateRef;
-    private navigationStateRef;
-    constructor(props: GanttTreeListProps);
-    scrollIntoView: (options: {
-        rowIndex?: number | undefined;
-    }) => void;
-    /**
-     * @hidden
-     */
-    componentDidMount(): void;
-    /**
-     * @hidden
-     */
-    getSnapshotBeforeUpdate(): null;
-    /**
-     * @hidden
-     */
-    componentDidUpdate(prevProps: TreeListProps): void;
-    /**
-     * @hidden
-     */
-    componentWillUnmount(): void;
-    /**
-     * @hidden
-     */
-    render(): JSX.Element;
-    private getColumns;
-    private get flatData();
-    private onKeyDown;
-    private onFocus;
-    private onRowDrag;
-    private onRowDrop;
-    private onColumnReorder;
-    private onColumnResize;
-    private onScroll;
-    private calculateSizes;
-    private onItemChange;
-    private onSelectionChange;
-    private onHeaderSelectionChange;
-    private selectionRelease;
-    private onSortChange;
-    private onFilterChange;
-    private onColumnMenuFilterChange;
-    private onExpandChange;
-    private onRowClick;
-    private rowDoubleClick;
-    private rowContextMenu;
-    private onPageChange;
-    private onDataStateChange;
-    private getDataState;
-    private getEventArguments;
-    private getLeafDataItems;
-}