@progress/kendo-angular-gantt 0.3.0-dev.202201111723 → 1.0.0

package/dist/npm/gantt.module.js

@@ -7,11 +7,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var core_1 = require("@angular/core");
 var common_1 = require("@angular/common");
+var forms_1 = require("@angular/forms");
 var kendo_angular_layout_1 = require("@progress/kendo-angular-layout");
 var kendo_angular_treelist_1 = require("@progress/kendo-angular-treelist");
 var kendo_angular_buttons_1 = require("@progress/kendo-angular-buttons");
 var kendo_angular_common_1 = require("@progress/kendo-angular-common");
 var kendo_angular_dialog_1 = require("@progress/kendo-angular-dialog");
+var kendo_angular_label_1 = require("@progress/kendo-angular-label");
+var kendo_angular_inputs_1 = require("@progress/kendo-angular-inputs");
+var kendo_angular_dateinputs_1 = require("@progress/kendo-angular-dateinputs");
+var kendo_angular_l10n_1 = require("@progress/kendo-angular-l10n");
+var kendo_angular_popup_1 = require("@progress/kendo-angular-popup");
+var kendo_common_1 = require("@progress/kendo-common");
+var touch_enabled_1 = require("./common/touch-enabled");
 var gantt_component_1 = require("./gantt.component");
 var gantt_timeline_component_1 = require("./timeline/gantt-timeline.component");
 var gantt_tasks_table_body_component_1 = require("./rendering/gantt-tasks-table-body.component");
@@ -30,17 +38,15 @@ var toolbar_component_1 = require("./toolbar/toolbar.component");
 var toolbar_template_directive_1 = require("./toolbar/toolbar-template.directive");
 var view_selector_component_1 = require("./toolbar/view-selector.component");
 var gantt_dependency_directive_1 = require("./dependencies/gantt-dependency.directive");
+var dependency_drag_create_directive_1 = require("./dragging/dependency-drag-create.directive");
+var drag_validation_tooltip_component_1 = require("./dragging/drag-validation-tooltip.component");
+var timeline_scroll_directive_1 = require("./scrolling/timeline-scroll.directive");
 var columns_1 = require("./columns/columns");
 var timeline_day_view_component_1 = require("./timeline/timeline-day-view.component");
 var timeline_week_view_component_1 = require("./timeline/timeline-week-view.component");
 var timeline_month_view_component_1 = require("./timeline/timeline-month-view.component");
 var edit_dialog_component_1 = require("./editing/edit-dialog.component");
-var forms_1 = require("@angular/forms");
-var kendo_angular_label_1 = require("@progress/kendo-angular-label");
-var kendo_angular_inputs_1 = require("@progress/kendo-angular-inputs");
-var kendo_angular_dateinputs_1 = require("@progress/kendo-angular-dateinputs");
 var custom_messages_component_1 = require("./localization/custom-messages.component");
-var kendo_angular_l10n_1 = require("@progress/kendo-angular-l10n");
 var localized_messages_directive_1 = require("./localization/localized-messages.directive");
 var add_task_component_1 = require("./editing/add-task.component");
 var kendo_angular_grid_1 = require("@progress/kendo-angular-grid");
@@ -59,6 +65,8 @@ var IMPORTED_MODULES = [
     kendo_angular_buttons_1.ButtonsModule,
     kendo_angular_dialog_1.DialogModule,
     kendo_angular_common_1.EventsModule,
+    kendo_angular_popup_1.PopupModule,
+    kendo_angular_common_1.DraggableModule,
     kendo_angular_layout_1.TabStripModule,
     kendo_angular_grid_1.GridModule,
     kendo_angular_dropdowns_1.DropDownsModule
@@ -91,6 +99,7 @@ var DECLARATIONS = [
     columns_1.FooterTemplateDirective,
     expandable_directive_1.GanttExpandableDirective,
     gantt_dependency_directive_1.GanttDependencyDirective,
+    dependency_drag_create_directive_1.DependencyDragCreateDirective,
     timeline_day_view_component_1.TimelineDayViewComponent,
     timeline_week_view_component_1.TimelineWeekViewComponent,
     timeline_month_view_component_1.TimelineMonthViewComponent,
@@ -99,9 +108,13 @@ var DECLARATIONS = [
     custom_messages_component_1.CustomMessagesComponent,
     localized_messages_directive_1.LocalizedMessagesDirective,
     add_task_component_1.GanttAddTaskComponent,
+    drag_validation_tooltip_component_1.DragValidationTooltipComponent,
+    timeline_scroll_directive_1.TimelineScrollableDirective,
     dependencies_table_component_1.DependenciesTableComponent,
     task_fields_component_1.TaskFieldsComponent
 ];
+var ɵ0 = kendo_common_1.touchEnabled;
+exports.ɵ0 = ɵ0;
 /**
  * Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
  * definition for the Gantt component.
@@ -141,9 +154,13 @@ var GanttModule = /** @class */ (function () {
             imports: IMPORTED_MODULES.slice(),
             declarations: DECLARATIONS.slice(),
             exports: DECLARATIONS.slice(),
+            entryComponents: [drag_validation_tooltip_component_1.DragValidationTooltipComponent],
             providers: [{
                     provide: kendo_angular_l10n_1.L10N_PREFIX,
                     useValue: 'kendo.gantt'
+                }, {
+                    provide: touch_enabled_1.TOUCH_ENABLED,
+                    useValue: ɵ0
                 }]
         })
     ], GanttModule);

package/dist/npm/index.js

@@ -13,10 +13,14 @@ var mapping_service_1 = require("./common/mapping.service");
 exports.MappingService = mapping_service_1.MappingService
 var option_changes_service_1 = require("./common/option-changes.service");
 exports.OptionChangesService = option_changes_service_1.OptionChangesService
+var touch_enabled_1 = require("./common/touch-enabled");
+exports.TOUCH_ENABLED = touch_enabled_1.TOUCH_ENABLED
 var dependency_dom_service_1 = require("./dependencies/dependency-dom.service");
 exports.DependencyDomService = dependency_dom_service_1.DependencyDomService
 var gantt_dependency_directive_1 = require("./dependencies/gantt-dependency.directive");
 exports.GanttDependencyDirective = gantt_dependency_directive_1.GanttDependencyDirective
+var drag_validation_tooltip_component_1 = require("./dragging/drag-validation-tooltip.component");
+exports.DragValidationTooltipComponent = drag_validation_tooltip_component_1.DragValidationTooltipComponent
 var add_task_component_1 = require("./editing/add-task.component");
 exports.GanttAddTaskComponent = add_task_component_1.GanttAddTaskComponent
 var dependencies_table_component_1 = require("./editing/dependencies-table.component");
@@ -37,6 +41,8 @@ var messages_1 = require("./localization/messages");
 exports.Messages = messages_1.Messages
 var preventable_event_1 = require("./models/events/preventable-event");
 exports.PreventableEvent = preventable_event_1.PreventableEvent
+var navigation_service_1 = require("./navigation/navigation.service");
+exports.NavigationService = navigation_service_1.NavigationService
 var gantt_header_table_body_component_1 = require("./rendering/gantt-header-table-body.component");
 exports.GanttHeaderTableBodyComponent = gantt_header_table_body_component_1.GanttHeaderTableBodyComponent
 var gantt_milestone_task_component_1 = require("./rendering/gantt-milestone-task.component");
@@ -51,6 +57,10 @@ var gantt_tasks_table_body_component_1 = require("./rendering/gantt-tasks-table-
 exports.GanttTasksTableBodyComponent = gantt_tasks_table_body_component_1.GanttTasksTableBodyComponent
 var scroll_sync_service_1 = require("./scrolling/scroll-sync.service");
 exports.ScrollSyncService = scroll_sync_service_1.ScrollSyncService
+var timeline_scroll_directive_1 = require("./scrolling/timeline-scroll.directive");
+exports.TimelineScrollableDirective = timeline_scroll_directive_1.TimelineScrollableDirective
+var timeline_scroll_service_1 = require("./scrolling/timeline-scroll.service");
+exports.TimelineScrollService = timeline_scroll_service_1.TimelineScrollService
 var gantt_timeline_component_1 = require("./timeline/gantt-timeline.component");
 exports.GanttTimelineComponent = gantt_timeline_component_1.GanttTimelineComponent
 var timeline_base_view_service_1 = require("./timeline/timeline-base-view.service");

package/dist/npm/main.js

@@ -15,6 +15,8 @@ var flat_binding_directive_1 = require("./binding-directives/flat-binding.direct
 exports.GanttFlatBindingDirective = flat_binding_directive_1.GanttFlatBindingDirective;
 var expandable_directive_1 = require("./expanded-state/expandable.directive");
 exports.GanttExpandableDirective = expandable_directive_1.GanttExpandableDirective;
+var dependency_drag_create_directive_1 = require("./dragging/dependency-drag-create.directive");
+exports.DependencyDragCreateDirective = dependency_drag_create_directive_1.DependencyDragCreateDirective;
 var task_template_directive_1 = require("./template-directives/task-template.directive");
 exports.GanttTaskTemplateDirective = task_template_directive_1.GanttTaskTemplateDirective;
 var task_content_template_directive_1 = require("./template-directives/task-content-template.directive");

package/dist/npm/models/events/dependency-add-event.interface.js

@@ -0,0 +1,6 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/npm/models/events/task-delete-event.interface.js

@@ -0,0 +1,6 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/npm/models/view-item.interface.js

@@ -0,0 +1,6 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/npm/navigation/navigation-models.js

@@ -0,0 +1,6 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/npm/navigation/navigation.service.js

@@ -0,0 +1,392 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var core_1 = require("@angular/core");
+var kendo_angular_common_1 = require("@progress/kendo-angular-common");
+var rxjs_1 = require("rxjs");
+var scroll_sync_service_1 = require("../scrolling/scroll-sync.service");
+var utils_1 = require("../utils");
+var utils_2 = require("./utils");
+/**
+ * @hidden
+ */
+var NavigationService = /** @class */ (function () {
+    function NavigationService(zone, renderer, scrollSyncService) {
+        this.zone = zone;
+        this.renderer = renderer;
+        this.scrollSyncService = scrollSyncService;
+        /**
+         * Notifies when the tasks' focused and interactive (tabindex) state has changed.
+         *
+         * All tasks are rendered with tabindex="-1".
+         * When one is clicked, or when some navigation key keyboard key is pressed, it should be focused, assigned the focus class, and its tabindex updated to 0.
+         * All other tasks should get -1 tabindex and have the focus class removed from them.
+         */
+        this.taskStatusChanges = new rxjs_1.Subject();
+        /**
+         * Keeps track of whether the Timeline part is focused.
+         * Used when the index of the task elements change (tasks are changed, pushed to, spliced from, etc.)
+         * and their status should be updated accordingly.
+         */
+        this.isTimelineFocused = false;
+        /**
+         * Keeps track of which part has last been focused.
+         * Used when calling `gantt.focus()` to determine which part of the component should receive focus.
+         */
+        this.treeListLastActive = false;
+        /**
+         * Keeps track of which part has last been focused.
+         * Used when calling `gantt.focus()` to determine which part of the component should receive focus.
+         */
+        this.timelineLastActive = false;
+        this._enabled = false;
+        this._activeTimelineIndex = 0;
+        this._activeTreeListCell = { rowIndex: 0, colIndex: 0 };
+    }
+    Object.defineProperty(NavigationService.prototype, "enabled", {
+        /**
+         * Specifies whether navigation is enabled.
+         */
+        get: function () {
+            return this._enabled;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(NavigationService.prototype, "activeTask", {
+        /**
+         * Used to retrieve read-only data about the currently active task.
+         */
+        get: function () {
+            return {
+                activeIndex: this.activeTimelineIndex,
+                isFocused: this.isTimelineFocused
+            };
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(NavigationService.prototype, "activeTreeListCell", {
+        get: function () {
+            var firstAvailableIndex = 0;
+            var lastAvailableRowIndex = this.treeListHeaderRowsCount + this.gantt.treeList.view.data.length - 1;
+            var rowIndex = utils_1.fitToRange(this._activeTreeListCell.rowIndex, firstAvailableIndex, lastAvailableRowIndex);
+            var lastAvailableColIndex = this.gantt.columns.length;
+            var colIndex = utils_1.fitToRange(this._activeTreeListCell.colIndex, firstAvailableIndex, lastAvailableColIndex);
+            return { rowIndex: rowIndex, colIndex: colIndex };
+        },
+        /**
+         * Persists the expected TreeList focused cell coords.
+         * When the tasks in the Timeline are navigated through, the expected TreeList focus target should also change,
+         * in order to allow back-tabbing from the Timeline to the same row in the TreeList.
+         */
+        set: function (cell) {
+            this._activeTreeListCell = cell;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(NavigationService.prototype, "activeTimelineIndex", {
+        get: function () {
+            var firstAvailableIndex = 0;
+            var lastAvailableIndex = this.gantt.treeList.view.data.length - 1;
+            return utils_1.fitToRange(this._activeTimelineIndex, firstAvailableIndex, lastAvailableIndex);
+        },
+        /**
+         * Persists the expected Timeline focused task index.
+         * When the cells in the TreeList are navigated through, the expected Timeline focus target should also change,
+         * in order to allow tabbing from the TreeList to the same row in the Timeline.
+         */
+        set: function (index) {
+            this._activeTimelineIndex = index;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(NavigationService.prototype, "treeListHeaderRowsCount", {
+        /**
+         * The TreeList row index takes into account the header and filter rows.
+         * Used when translating Timeline task indices to TreeList row indices.
+         */
+        get: function () {
+            // captures nested group header rows + filter row if we start supporting it at some point
+            return this.treeListElement.querySelectorAll('.k-grid-header tr').length;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    NavigationService.prototype.initialize = function (_a) {
+        var _this = this;
+        var gantt = _a.gantt, host = _a.host, treeListElement = _a.treeListElement, timelineElement = _a.timelineElement;
+        // no private property setters in TypeScript, so use a getter and a poorly named private prop for this value
+        this._enabled = true;
+        this.gantt = gantt;
+        this.host = host;
+        this.treeListElement = treeListElement;
+        this.timelineElement = timelineElement;
+        // TODO: fix in the splitter package and remove
+        // move the splitbar HTML element between the two panes to keep the visial tabbing order in tact
+        var splitbar = this.host.querySelector('.k-splitbar');
+        if (utils_1.isPresent(splitbar) && utils_1.isPresent(splitbar.previousElementSibling) && utils_1.isPresent(splitbar.after)) {
+            splitbar.after(splitbar.previousElementSibling);
+        }
+        this.zone.runOutsideAngular(function () {
+            _this.eventListenerDisposers = [
+                _this.renderer.listen(_this.host, 'keydown', _this.handleKeydown.bind(_this)),
+                _this.renderer.listen(_this.treeListElement, 'mousedown', _this.focusTreeList.bind(_this)),
+                _this.renderer.listen(_this.treeListElement, 'focusin', _this.handleTreeListFocusIn.bind(_this)),
+                _this.renderer.listen(_this.timelineElement, 'mousedown', _this.handleTimelineMousedown.bind(_this)),
+                _this.renderer.listen(_this.timelineElement, 'focusin', _this.handleTimelineFocusIn.bind(_this)),
+                _this.renderer.listen(_this.timelineElement, 'focusout', _this.handleTimelineFocusOut.bind(_this))
+            ];
+        });
+    };
+    NavigationService.prototype.ngOnDestroy = function () {
+        if (utils_1.isPresent(this.eventListenerDisposers)) {
+            this.eventListenerDisposers.forEach(function (removeListener) { return removeListener(); });
+            this.eventListenerDisposers = null;
+        }
+        this.gantt = null;
+        this.host = null;
+        this.treeListElement = null;
+        this.timelineElement = null;
+    };
+    /**
+     * Focuses either the last active TreeList cell, or the last active Timeline task,
+     * dependening on which of the two last held focus.
+     *
+     * Focuses the first TreeList cell by default.
+     */
+    NavigationService.prototype.focusLastActiveItem = function () {
+        if (this.gantt.data.length === 0 || (!this.treeListLastActive && !this.timelineLastActive)) {
+            this.focusCell(0, 0);
+        }
+        else if (this.treeListLastActive) {
+            var _a = this.activeTreeListCell, rowIndex = _a.rowIndex, colIndex = _a.colIndex;
+            this.gantt.treeList.focusCell(rowIndex, colIndex);
+        }
+        else if (this.timelineLastActive) {
+            this.focusTask(this.activeTimelineIndex);
+        }
+    };
+    /**
+     * Focuses the targeted TreeList cell regardless of the last peresisted target.
+     */
+    NavigationService.prototype.focusCell = function (rowIndex, colIndex) {
+        this.activeTreeListCell = { rowIndex: rowIndex, colIndex: colIndex };
+        this.activeTimelineIndex = rowIndex - this.treeListHeaderRowsCount;
+        this.gantt.treeList.focusCell(this.activeTreeListCell.rowIndex, this.activeTreeListCell.colIndex);
+    };
+    /**
+     * Focuses the targeted Timeline task regardless of the last peresisted target.
+     */
+    NavigationService.prototype.focusTask = function (index) {
+        this.activeTimelineIndex = index;
+        this.isTimelineFocused = true;
+        this.activeTreeListCell = {
+            rowIndex: index + this.treeListHeaderRowsCount,
+            colIndex: this.activeTreeListCell.colIndex
+        };
+        this.notifyTaskStatusChange();
+    };
+    /**
+     * Updates the focus target flags and notifies the active task to update its focused state.
+     */
+    NavigationService.prototype.handleTimelineFocusIn = function (_a) {
+        var target = _a.target;
+        this.treeListLastActive = false;
+        this.timelineLastActive = true;
+        this.isTimelineFocused = true;
+        if (utils_1.isTask(target, this.timelineElement)) {
+            this.notifyTaskStatusChange();
+        }
+    };
+    /**
+     * Updates the timeline focus state flag and notifies the active task to update its focused state.
+     */
+    NavigationService.prototype.handleTimelineFocusOut = function (_a) {
+        var relatedTarget = _a.relatedTarget;
+        this.isTimelineFocused = this.timelineElement.contains(relatedTarget);
+        // update the task element only if the new focus target is not in the Timeline - focus change between tasks is handled in the focusin handler
+        if (!utils_1.isTask(relatedTarget, this.timelineElement)) {
+            this.notifyTaskStatusChange();
+        }
+    };
+    /**
+     * Updates the focus target flags and corrects the TreeList focus target if needed.
+     * As the TreeList will keep its last focused cell with tabindex="0",
+     * this methods forcefully focuses the correct cell,
+     * when navigating in the Timeline has updated the expected TreeList focus target.
+     */
+    NavigationService.prototype.handleTreeListFocusIn = function (event) {
+        this.treeListLastActive = true;
+        this.timelineLastActive = false;
+        // if the previous focus target was in the TreeList, rely on its component navigation and just record the focused item index
+        if (this.treeListElement.contains(event.relatedTarget)) {
+            var _a = this.gantt.treeList.activeCell, colIndex = _a.colIndex, rowIndex = _a.rowIndex;
+            this.activeTreeListCell = { colIndex: colIndex, rowIndex: rowIndex };
+        }
+        else {
+            // if the previous focus target was outside the TreeList, ensure the expected focus coords are used
+            var _b = this.activeTreeListCell, rowIndex = _b.rowIndex, colIndex = _b.colIndex;
+            this.gantt.treeList.focusCell(rowIndex, colIndex); // activates the target cell even if it has tabindex="-1"
+        }
+        this.activeTimelineIndex = this.gantt.treeList.activeCell.dataRowIndex;
+        this.notifyTaskStatusChange();
+        if (this.gantt.treeList.activeCell.dataRowIndex >= 0) {
+            this.scrollHorizontallyToTask(this.activeTimelineIndex);
+            this.scrollSyncService.syncScrollTop('treelist', 'timeline');
+        }
+    };
+    NavigationService.prototype.handleKeydown = function (event) {
+        var _this = this;
+        var _a = event, keyCode = _a.keyCode, target = _a.target, altKey = _a.altKey;
+        var isTimelineActive = this.timelineElement.contains(target);
+        if (isTimelineActive) {
+            if (utils_2.isArrowUpDownKey(keyCode)) {
+                var direction = keyCode === kendo_angular_common_1.Keys.ArrowUp ? -1 : 1;
+                this.activeTimelineIndex = this.activeTimelineIndex + direction;
+                this.activeTreeListCell = {
+                    rowIndex: this.activeTimelineIndex + this.treeListHeaderRowsCount,
+                    colIndex: this.activeTreeListCell.colIndex
+                };
+            }
+            else if (keyCode === kendo_angular_common_1.Keys.Home) {
+                this.activeTimelineIndex = 0;
+                this.activeTreeListCell = {
+                    rowIndex: this.activeTimelineIndex + this.treeListHeaderRowsCount,
+                    colIndex: this.activeTreeListCell.colIndex
+                };
+            }
+            else if (keyCode === kendo_angular_common_1.Keys.End) {
+                var lastAvailableIndex = this.gantt.treeList.view.data.length - 1;
+                this.activeTimelineIndex = lastAvailableIndex;
+                this.activeTreeListCell = {
+                    rowIndex: this.activeTimelineIndex + this.treeListHeaderRowsCount,
+                    colIndex: this.activeTreeListCell.colIndex
+                };
+            }
+            if (utils_2.isNavigationKey(keyCode)) {
+                this.scrollHorizontallyToTask(this.activeTimelineIndex);
+                this.scrollSyncService.syncScrollTop('timeline', 'treelist');
+                this.notifyTaskStatusChange();
+                event.preventDefault();
+            }
+            if (keyCode === kendo_angular_common_1.Keys.Space && kendo_angular_common_1.hasObservers(this.gantt.selectionChange)) {
+                var task_1 = this.gantt.renderedTreeListItems[this.activeTimelineIndex];
+                var selectionAction_1 = this.gantt.getSelectionAction(event, task_1);
+                if (utils_1.isPresent(task_1) && !this.gantt.isSameSelection(selectionAction_1, task_1)) {
+                    this.zone.run(function () {
+                        return _this.gantt.notifySelectionChange(task_1, selectionAction_1);
+                    });
+                }
+                event.preventDefault();
+            }
+            if (keyCode === kendo_angular_common_1.Keys.Enter && kendo_angular_common_1.hasObservers(this.gantt.taskClick)) {
+                var task_2 = this.gantt.renderedTreeListItems[this.activeTimelineIndex];
+                if (utils_1.isPresent(task_2)) {
+                    this.zone.run(function () {
+                        return _this.gantt.notifyTaskClick(event, task_2, _this.activeTimelineIndex);
+                    });
+                }
+                event.preventDefault();
+            }
+            if (utils_2.isExpandCollapseKey(keyCode, altKey)) {
+                var task_3 = this.gantt.renderedTreeListItems[this.activeTimelineIndex];
+                if (utils_1.isPresent(task_3) && this.gantt.hasChildren(task_3)) {
+                    var shouldExpand_1 = keyCode === kendo_angular_common_1.Keys.ArrowRight;
+                    var isExpanded = this.gantt.isExpanded(task_3);
+                    var sameState = shouldExpand_1 === isExpanded;
+                    if (!sameState) {
+                        this.zone.run(function () {
+                            var expandEvent = { dataItem: task_3 };
+                            // order is not arbitrary
+                            // the TreeList emits the individual events first, then the combined `expandStateChange` event
+                            var individualEmitter = shouldExpand_1 ? _this.gantt.rowExpand : _this.gantt.rowCollapse;
+                            individualEmitter.emit(expandEvent);
+                            _this.gantt.expandStateChange.emit(tslib_1.__assign({}, expandEvent, { expand: shouldExpand_1 }));
+                            _this.gantt.updateView();
+                            _this.scrollHorizontallyToTask(_this.activeTimelineIndex);
+                        });
+                    }
+                }
+                event.preventDefault();
+            }
+        }
+        var isTreeListActive = this.treeListElement.contains(target);
+        if (keyCode === kendo_angular_common_1.Keys.Delete && (isTimelineActive || isTreeListActive) && kendo_angular_common_1.hasObservers(this.gantt.taskDelete)) {
+            var taskIndex = isTreeListActive ?
+                this.gantt.treeList.activeCell.dataRowIndex :
+                this.activeTimelineIndex;
+            var task_4 = this.gantt.renderedTreeListItems[taskIndex];
+            if (utils_1.isPresent(task_4)) {
+                this.zone.run(function () {
+                    return _this.gantt.notifyTaskDelete(task_4);
+                });
+            }
+        }
+        if (utils_2.isViewDigitKey(keyCode) && !utils_1.isToolbar(target, this.host) && !this.gantt.isInEditMode) {
+            var targetViewIndex = utils_2.getIndexFromViewDigitKeyCode(keyCode);
+            var availableViews = this.gantt.views.toArray();
+            var targetView_1 = availableViews[targetViewIndex];
+            if (utils_1.isPresent(targetView_1) && targetView_1.type !== this.gantt.activeView) {
+                this.zone.run(function () {
+                    return _this.gantt.changeActiveView(targetView_1.type);
+                });
+            }
+        }
+    };
+    /**
+     * Filters for task mousedown in the Timeline.
+     */
+    NavigationService.prototype.handleTimelineMousedown = function (_a) {
+        var target = _a.target;
+        if (utils_1.isTask(target, this.host) && !utils_1.isClearButton(target, this.host)) {
+            var taskIndex = utils_1.getClosestTaskIndex(target, this.host);
+            this.focusTask(taskIndex);
+        }
+    };
+    /**
+     * Scrolls horizontally to the beginning of the target task if the beginning of its content is not in the viewport.
+     */
+    NavigationService.prototype.scrollHorizontallyToTask = function (index) {
+        var task = this.timelineElement.querySelectorAll('.k-task-wrap').item(index);
+        if (!utils_1.isPresent(task)) {
+            return;
+        }
+        // scroll horizontally to the item if less than 200px from the beginning of its content are visible
+        var targetVisibleWidth = 200;
+        var isScrollBeforeTask = (this.timelineElement.clientWidth + this.timelineElement.scrollLeft) < (task.offsetLeft + targetVisibleWidth);
+        var isScrollAfterTask = this.timelineElement.scrollLeft > task.offsetLeft;
+        if (isScrollBeforeTask || isScrollAfterTask) {
+            this.timelineElement.scrollLeft = task.offsetLeft;
+        }
+    };
+    /**
+     * Focus the TreeList on TreeList mousedown.
+     * A nasty hack to trick `handleTreeListFocusIn` into regarding the previous focus target as again the TreeList.
+     * Otherwise cell clicks are wrongly overwritten in `handleTreeListFocusIn` and the click focus target is not respected.
+     */
+    NavigationService.prototype.focusTreeList = function () {
+        this.gantt.treeList.focus();
+    };
+    /**
+     * Fires the `taskStatusChanges` event with active and focused status retrieved from
+     * `this.activeTimelineIndex` and `this.isTimelineFocused`.
+     */
+    NavigationService.prototype.notifyTaskStatusChange = function () {
+        this.taskStatusChanges.next(this.activeTask);
+    };
+    NavigationService = tslib_1.__decorate([
+        core_1.Injectable(),
+        tslib_1.__metadata("design:paramtypes", [core_1.NgZone,
+            core_1.Renderer2,
+            scroll_sync_service_1.ScrollSyncService])
+    ], NavigationService);
+    return NavigationService;
+}());
+exports.NavigationService = NavigationService;

package/dist/npm/navigation/utils.js

@@ -0,0 +1,79 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var kendo_angular_common_1 = require("@progress/kendo-angular-common");
+// TODO: add those keys to `import { Keys } from '@progress/kendo-angular-common';`
+var NumpadKeys;
+(function (NumpadKeys) {
+    NumpadKeys[NumpadKeys["Digit1"] = 97] = "Digit1";
+    NumpadKeys[NumpadKeys["Digit2"] = 98] = "Digit2";
+    NumpadKeys[NumpadKeys["Digit3"] = 99] = "Digit3";
+    NumpadKeys[NumpadKeys["Digit4"] = 100] = "Digit4";
+})(NumpadKeys || (NumpadKeys = {}));
+/**
+ * @hidden
+ */
+exports.isArrowUpDownKey = function (keyCode) { return [
+    kendo_angular_common_1.Keys.ArrowUp,
+    kendo_angular_common_1.Keys.ArrowDown
+].some(function (arrowKeyCode) {
+    return keyCode === arrowKeyCode;
+}); };
+/**
+ * @hidden
+ */
+exports.isNavigationKey = function (keyCode) { return [
+    kendo_angular_common_1.Keys.ArrowUp,
+    kendo_angular_common_1.Keys.ArrowDown,
+    kendo_angular_common_1.Keys.Home,
+    kendo_angular_common_1.Keys.End
+].some(function (navigationKeyCode) {
+    return keyCode === navigationKeyCode;
+}); };
+/**
+ * @hidden
+ */
+exports.isExpandCollapseKey = function (keyCode, altKey) {
+    return altKey && [
+        kendo_angular_common_1.Keys.ArrowLeft,
+        kendo_angular_common_1.Keys.ArrowRight
+    ].some(function (navigationKeyCode) {
+        return keyCode === navigationKeyCode;
+    });
+};
+/**
+ * @hidden
+ */
+exports.isViewDigitKey = function (keyCode) { return [
+    kendo_angular_common_1.Keys.Digit1,
+    NumpadKeys.Digit1,
+    kendo_angular_common_1.Keys.Digit2,
+    NumpadKeys.Digit2,
+    kendo_angular_common_1.Keys.Digit3,
+    NumpadKeys.Digit3,
+    kendo_angular_common_1.Keys.Digit4,
+    NumpadKeys.Digit4
+].some(function (digitKeyCode) {
+    return keyCode === digitKeyCode;
+}); };
+/**
+ * @hidden
+ *
+ * Returns the corresponding view index for the pressed digit key (Digit 1 => 0, Digit 2 => 1, etc.).
+ */
+exports.getIndexFromViewDigitKeyCode = function (keyCode) {
+    switch (keyCode) {
+        case NumpadKeys.Digit1:
+        case kendo_angular_common_1.Keys.Digit1: return 0;
+        case NumpadKeys.Digit2:
+        case kendo_angular_common_1.Keys.Digit2: return 1;
+        case NumpadKeys.Digit3:
+        case kendo_angular_common_1.Keys.Digit3: return 2;
+        case NumpadKeys.Digit4:
+        case kendo_angular_common_1.Keys.Digit4: return 3;
+        default: return null;
+    }
+};

package/dist/npm/package-metadata.js

@@ -11,7 +11,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-angular-gantt',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1641921322,
+    publishDate: 1642606888,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };