@progress/kendo-angular-gantt 21.4.1-develop.1 → 22.0.0-develop.1

package/esm2022/timeline/timeline-year-view.service.mjs

@@ -1,57 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Injectable } from "@angular/core";
-import { IntlService } from "@progress/kendo-angular-intl";
-import { addMonths, firstDayOfMonth, getDate, lastDayOfMonth } from "@progress/kendo-date-math";
-import { MappingService } from "../common/mapping.service";
-import { TimelineBaseViewService } from "./timeline-base-view.service";
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-intl";
-import * as i2 from "../common/mapping.service";
-/**
- * @hidden
- */
-export class TimeLineYearViewService extends TimelineBaseViewService {
-    constructor(intlService, mapper) {
-        super(intlService, mapper);
-    }
-    getTableWidth(tasks) {
-        const timeSlots = this.getSlots(tasks)[1];
-        const slotWidth = this.options.slotWidth;
-        return Math.round(timeSlots.length * slotWidth);
-    }
-    getStartOffset(rangeStart) {
-        const monthStart = firstDayOfMonth(rangeStart);
-        return addMonths(getDate(monthStart), -1);
-    }
-    /**
-     *
-     */
-    getEndOffset(rangeEnd) {
-        const monthEnd = lastDayOfMonth(rangeEnd);
-        return addMonths(getDate(monthEnd), 1);
-    }
-    /**
-     *
-     * @param tasks - The tasks which are going to be rendered in the table
-     * @returns {Array<Object>} - A collection containing the years and months slots
-     *
-     * Used to render the number of columns and the header
-     */
-    getSlots(tasks) {
-        // will return the header rows slots
-        const slots = [];
-        const { start, end } = this.getRange(tasks);
-        const years = this.getYears(start, end, this.options.timelineHeadersDateFormat?.groupHeaderDateFormat);
-        const months = this.getMonths(start, end, false, this.options.timelineHeadersDateFormat?.columnHeaderDateFormat);
-        slots.push(years, months);
-        return slots;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TimeLineYearViewService, deps: [{ token: i1.IntlService }, { token: i2.MappingService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TimeLineYearViewService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TimeLineYearViewService, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: i1.IntlService }, { type: i2.MappingService }] });

package/esm2022/timeline/view-base.mjs

@@ -1,73 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Directive, Input } from '@angular/core';
-import { anyChanged } from '@progress/kendo-angular-common';
-import { DependencyDomService } from '../dependencies/dependency-dom.service';
-import { OptionChangesService } from '../common/option-changes.service';
-import * as i0 from "@angular/core";
-import * as i1 from "../common/option-changes.service";
-import * as i2 from "../dependencies/dependency-dom.service";
-/**
- * Serves as the base class for the timeline view components of the Gantt.
- *
- * @example
- * ```typescript
- * export class CustomTimelineViewComponent extends ViewBase {
- *   public readonly type: TimelineViewType = 'custom';
- * }
- * ```
- */
-export class ViewBase {
-    optionChangesService;
-    dependencyDomService;
-    /**
-     * Sets the width of the time slot headers in pixels.
-     *
-     * @default 100
-     */
-    slotWidth = 100;
-    /**
-     * Sets the date format for the Grouped and Column headers.
-     */
-    timelineHeadersDateFormat;
-    /**
-     * Specifies the current time marker settings.
-     * If you do not set a value, the component uses the value from the Gantt component
-     * [`currentTimeMarker`]({% slug api_gantt_ganttcomponent %}#toc-currentTimeMarker) property.
-     */
-    currentTimeMarker;
-    /**
-     *
-     * @hidden
-     */
-    constructor(optionChangesService, dependencyDomService) {
-        this.optionChangesService = optionChangesService;
-        this.dependencyDomService = dependencyDomService;
-    }
-    ngOnChanges(changes) {
-        if (anyChanged(['slotWidth'], changes)) {
-            this.optionChangesService.notifyColumnChanges();
-            this.dependencyDomService.notifyChanges();
-        }
-        if (anyChanged(['timelineHeadersDateFormat'], changes)) {
-            this.optionChangesService.notifyDateFormatChanges();
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ViewBase, deps: [{ token: i1.OptionChangesService }, { token: i2.DependencyDomService }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: ViewBase, selector: "kendo-gantt-view-base", inputs: { slotWidth: "slotWidth", timelineHeadersDateFormat: "timelineHeadersDateFormat", currentTimeMarker: "currentTimeMarker" }, usesOnChanges: true, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ViewBase, decorators: [{
-            type: Directive,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/directive-selector
-                    selector: 'kendo-gantt-view-base'
-                }]
-        }], ctorParameters: () => [{ type: i1.OptionChangesService }, { type: i2.DependencyDomService }], propDecorators: { slotWidth: [{
-                type: Input
-            }], timelineHeadersDateFormat: [{
-                type: Input
-            }], currentTimeMarker: [{
-                type: Input
-            }] } });

package/esm2022/toolbar/toolbar-navigation.service.mjs

@@ -1,29 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Injectable, Renderer2 } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * @hidden
- */
-export class ToolbarNavigationService {
-    renderer;
-    focusableContent;
-    focusIndex = 0;
-    constructor(renderer) {
-        this.renderer = renderer;
-    }
-    updateFocus() {
-        this.focusableContent.forEach(el => {
-            this.renderer.setAttribute(el, 'tabindex', '-1');
-        });
-        this.renderer.setAttribute(this.focusableContent[this.focusIndex], 'tabindex', '0');
-        this.focusableContent[this.focusIndex].focus();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolbarNavigationService, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolbarNavigationService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolbarNavigationService, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: i0.Renderer2 }] });

package/esm2022/toolbar/toolbar-template.directive.mjs

@@ -1,56 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Directive, TemplateRef, Optional, Input } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Represents the toolbar template of the Gantt.
- *
- * The template context includes:
- * - `position`—The position where the toolbar template renders. Possible values are `'top'` and `'bottom'`.
- *
- * @example
- * ```html
- * <kendo-gantt [kendoGanttHierarchyBinding]="data" [style.height.px]="400">
- *  <ng-template kendoGanttToolbarTemplate [position]="position" let-position="position">
- *    <button kendoButton (click)="onClick()">Custom action</button>
- *  </ng-template>
- * </kendo-gantt>
- * ```
- */
-export class ToolbarTemplateDirective {
-    templateRef;
-    _position = "top";
-    /**
-     * Sets the Gantt Toolbar that uses this template.
-     *
-     * Possible values:
-     * - `top`&mdash;Renders the template in the top toolbar (if present) only.
-     * - `bottom`&mdash;Renders the template in the bottom toolbar (if present) only.
-     * - `both`&mdash;Renders the template in both toolbars (if present).
-     */
-    set position(position) {
-        this._position = position;
-    }
-    get position() {
-        return this._position;
-    }
-    constructor(templateRef) {
-        this.templateRef = templateRef;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolbarTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: ToolbarTemplateDirective, isStandalone: true, selector: "[kendoGanttToolbarTemplate]", inputs: { position: "position" }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolbarTemplateDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoGanttToolbarTemplate]',
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i0.TemplateRef, decorators: [{
-                    type: Optional
-                }] }], propDecorators: { position: [{
-                type: Input,
-                args: ['position']
-            }] } });

package/esm2022/toolbar/toolbar.component.mjs

@@ -1,181 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { ToolbarTemplateDirective } from './toolbar-template.directive';
-import { Component, Input, HostBinding, Output, EventEmitter, HostListener, ElementRef } from '@angular/core';
-import { ToolbarNavigationService } from './toolbar-navigation.service';
-import { closest, focusableSelector, isDocumentAvailable, isFocusable, isVisible } from '@progress/kendo-angular-common';
-import { ViewSelectorComponent } from './view-selector.component';
-import { GanttAddTaskComponent } from '../editing/add-task.component';
-import { NgTemplateOutlet } from '@angular/common';
-import * as i0 from "@angular/core";
-import * as i1 from "./toolbar-navigation.service";
-/**
- * @hidden
- */
-export class ToolbarComponent {
-    hostEl;
-    navigationService;
-    context = {};
-    role = 'toolbar';
-    hostClasses = true;
-    clickHandler(ev) {
-        if (this.navigable) {
-            const closestFocusable = closest(ev.target, isFocusable);
-            const targetIndex = this.navigationService.focusableContent.indexOf(closestFocusable);
-            if (targetIndex > -1) {
-                this.navigationService.focusIndex = targetIndex;
-            }
-            this.navigationService.updateFocus();
-        }
-    }
-    arrowLeftListener() {
-        if (this.navigable && isDocumentAvailable()) {
-            this.navigationService.focusIndex--;
-            if (this.navigationService.focusIndex < 0) {
-                this.navigationService.focusIndex = this.navigationService.focusableContent.length - 1;
-            }
-            this.navigationService.updateFocus();
-        }
-    }
-    arrowRightListener() {
-        if (this.navigable && isDocumentAvailable()) {
-            this.navigationService.focusIndex++;
-            if (this.navigationService.focusIndex >= this.navigationService.focusableContent.length) {
-                this.navigationService.focusIndex = 0;
-            }
-            this.navigationService.updateFocus();
-        }
-    }
-    activeViewChange = new EventEmitter();
-    showAddTask;
-    showViewSelector;
-    views;
-    activeView;
-    toolbarTemplate;
-    navigable;
-    set position(value) {
-        this.context.position = this._position = value;
-    }
-    get position() {
-        return this._position;
-    }
-    get toolbarTemplateRef() {
-        return this.toolbarTemplate ? this.toolbarTemplate.templateRef : undefined;
-    }
-    get renderTemplate() {
-        const ganttToolbarTemplate = this.toolbarTemplate;
-        const templatePosition = ganttToolbarTemplate ? ganttToolbarTemplate.position : null;
-        return ganttToolbarTemplate && (templatePosition === 'both' || templatePosition === this.position);
-    }
-    _position;
-    constructor(hostEl, navigationService) {
-        this.hostEl = hostEl;
-        this.navigationService = navigationService;
-    }
-    handleViewChange(view) {
-        this.activeViewChange.emit(view);
-    }
-    ngAfterViewInit() {
-        if (isDocumentAvailable()) {
-            const focusableElements = Array.from(this.hostEl.nativeElement.querySelectorAll(focusableSelector) || [])
-                .filter(el => isVisible(el));
-            if (focusableElements.length) {
-                this.navigationService.focusableContent = focusableElements;
-            }
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolbarComponent, deps: [{ token: i0.ElementRef }, { token: i1.ToolbarNavigationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ToolbarComponent, isStandalone: true, selector: "kendo-gantt-toolbar", inputs: { showAddTask: "showAddTask", showViewSelector: "showViewSelector", views: "views", activeView: "activeView", toolbarTemplate: "toolbarTemplate", navigable: "navigable", position: "position" }, outputs: { activeViewChange: "activeViewChange" }, host: { listeners: { "click": "clickHandler($event)", "keydown.arrowleft": "arrowLeftListener($event)", "keydown.arrowright": "arrowRightListener($event)" }, properties: { "attr.role": "this.role", "class.k-gantt-toolbar": "this.hostClasses", "class.k-toolbar": "this.hostClasses", "class.k-toolbar-md": "this.hostClasses", "class.k-toolbar-solid": "this.hostClasses" } }, providers: [ToolbarNavigationService], ngImport: i0, template: `
-        @if (!renderTemplate) {
-          @if (showAddTask) {
-            <kendo-gantt-add-task></kendo-gantt-add-task>
-          }
-          <span class="k-spacer k-toolbar-spacer"></span>
-          @if (showViewSelector) {
-            <kendo-gantt-view-selector
-              [views]="views"
-              [activeView]="activeView"
-            (activeViewChange)="handleViewChange($event)"></kendo-gantt-view-selector>
-          }
-        }
-        @if (renderTemplate) {
-          <ng-template
-            [ngTemplateOutlet]="toolbarTemplateRef"
-            [ngTemplateOutletContext]="context"
-            >
-          </ng-template>
-        }
-        `, isInline: true, dependencies: [{ kind: "component", type: GanttAddTaskComponent, selector: "kendo-gantt-add-task", inputs: ["data", "icon", "svgIcon"] }, { kind: "component", type: ViewSelectorComponent, selector: "kendo-gantt-view-selector", inputs: ["views", "activeView"], outputs: ["activeViewChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolbarComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-gantt-toolbar',
-                    providers: [ToolbarNavigationService],
-                    template: `
-        @if (!renderTemplate) {
-          @if (showAddTask) {
-            <kendo-gantt-add-task></kendo-gantt-add-task>
-          }
-          <span class="k-spacer k-toolbar-spacer"></span>
-          @if (showViewSelector) {
-            <kendo-gantt-view-selector
-              [views]="views"
-              [activeView]="activeView"
-            (activeViewChange)="handleViewChange($event)"></kendo-gantt-view-selector>
-          }
-        }
-        @if (renderTemplate) {
-          <ng-template
-            [ngTemplateOutlet]="toolbarTemplateRef"
-            [ngTemplateOutletContext]="context"
-            >
-          </ng-template>
-        }
-        `,
-                    standalone: true,
-                    imports: [GanttAddTaskComponent, ViewSelectorComponent, NgTemplateOutlet]
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.ToolbarNavigationService }], propDecorators: { role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-gantt-toolbar']
-            }, {
-                type: HostBinding,
-                args: ['class.k-toolbar']
-            }, {
-                type: HostBinding,
-                args: ['class.k-toolbar-md']
-            }, {
-                type: HostBinding,
-                args: ['class.k-toolbar-solid']
-            }], clickHandler: [{
-                type: HostListener,
-                args: ['click', ['$event']]
-            }], arrowLeftListener: [{
-                type: HostListener,
-                args: ['keydown.arrowleft', ['$event']]
-            }], arrowRightListener: [{
-                type: HostListener,
-                args: ['keydown.arrowright', ['$event']]
-            }], activeViewChange: [{
-                type: Output
-            }], showAddTask: [{
-                type: Input
-            }], showViewSelector: [{
-                type: Input
-            }], views: [{
-                type: Input
-            }], activeView: [{
-                type: Input
-            }], toolbarTemplate: [{
-                type: Input
-            }], navigable: [{
-                type: Input
-            }], position: [{
-                type: Input
-            }] } });

package/esm2022/toolbar/view-selector.component.mjs

@@ -1,112 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Component, EventEmitter, Input, Output, HostBinding } from '@angular/core';
-import { LocalizationService } from '@progress/kendo-angular-l10n';
-import { ReactiveFormsModule } from '@angular/forms';
-import { ButtonComponent, ButtonGroupComponent } from '@progress/kendo-angular-buttons';
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-l10n";
-import * as i2 from "@angular/forms";
-/**
- * The Gantt ViewSelector component. Shows the current view type and lets you switch to another view type.
- */
-export class ViewSelectorComponent {
-    localizationService;
-    hostClass = true;
-    /**
-     * Lists the timeline view types in the current Gantt configuration.
-     */
-    views;
-    /**
-     * Sets the current view type.
-     * @default 'week'
-     */
-    activeView = 'week';
-    /**
-     * Fires when the user selects a different view type. The event data contains the type of the new view.
-     */
-    activeViewChange = new EventEmitter();
-    constructor(localizationService) {
-        this.localizationService = localizationService;
-    }
-    /**
-     * @hidden
-     */
-    onClick(viewType) {
-        if (viewType !== this.activeView) {
-            this.activeViewChange.emit(viewType);
-        }
-    }
-    /**
-     * @hidden
-     */
-    getViewTypeText(viewType) {
-        return this.localizationService.get(`${viewType}ViewText`);
-    }
-    /**
-     * @hidden
-     */
-    onActiveViewChange(event) {
-        this.activeViewChange.emit(event.target.value);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ViewSelectorComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ViewSelectorComponent, isStandalone: true, selector: "kendo-gantt-view-selector", inputs: { views: "views", activeView: "activeView" }, outputs: { activeViewChange: "activeViewChange" }, host: { properties: { "class.k-gantt-views-wrapper": "this.hostClass" } }, ngImport: i0, template: `
-        <select
-          class="k-dropdownlist k-picker k-rounded-md k-views-dropdown"
-          aria-label="View Selector"
-          [value]="activeView"
-          (change)="onActiveViewChange($event)">
-          @for (view of views; track view) {
-            <option [value]="view">{{getViewTypeText(view)}}</option>
-          }
-        </select>
-        <kendo-buttongroup class="k-gantt-views" selection="single" [navigable]="false">
-          @for (view of views; track view) {
-            <button
-              kendoButton
-              type="button"
-              [selected]="view === activeView"
-            (click)="onClick(view)">{{getViewTypeText(view)}}</button>
-          }
-        </kendo-buttongroup>
-        `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex", "navigable"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ViewSelectorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-gantt-view-selector',
-                    template: `
-        <select
-          class="k-dropdownlist k-picker k-rounded-md k-views-dropdown"
-          aria-label="View Selector"
-          [value]="activeView"
-          (change)="onActiveViewChange($event)">
-          @for (view of views; track view) {
-            <option [value]="view">{{getViewTypeText(view)}}</option>
-          }
-        </select>
-        <kendo-buttongroup class="k-gantt-views" selection="single" [navigable]="false">
-          @for (view of views; track view) {
-            <button
-              kendoButton
-              type="button"
-              [selected]="view === activeView"
-            (click)="onClick(view)">{{getViewTypeText(view)}}</button>
-          }
-        </kendo-buttongroup>
-        `,
-                    standalone: true,
-                    imports: [ReactiveFormsModule, ButtonGroupComponent, ButtonComponent]
-                }]
-        }], ctorParameters: () => [{ type: i1.LocalizationService }], propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-gantt-views-wrapper']
-            }], views: [{
-                type: Input
-            }], activeView: [{
-                type: Input
-            }], activeViewChange: [{
-                type: Output
-            }] } });