@worktile/gantt 19.0.5 → 19.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import { CdkDrag, CdkDragDrop, CdkDragEnd, CdkDragMove, CdkDragStart } from '@angular/cdk/drag-drop';
2
- import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, QueryList, TemplateRef } from '@angular/core';
2
+ import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, OnInit, QueryList, TemplateRef } from '@angular/core';
3
3
  import { GanttGroupInternal, GanttItemInternal, GanttSelectedEvent, GanttTableDragDroppedEvent, GanttTableDragEndedEvent, GanttTableDragEnterPredicateContext, GanttTableDragStartedEvent } from '../../../class';
4
4
  import { GanttAbstractComponent } from '../../../gantt-abstract';
5
5
  import { GanttUpper } from '../../../gantt-upper';
@@ -11,7 +11,6 @@ export declare class GanttTableBodyComponent implements OnInit, OnDestroy, After
11
11
  private cdr;
12
12
  private document;
13
13
  protected elementRef: ElementRef<HTMLElement>;
14
- private ngZone;
15
14
  private _viewportItems;
16
15
  set viewportItems(data: (GanttGroupInternal | GanttItemInternal)[]);
17
16
  get viewportItems(): (GanttGroupInternal | GanttItemInternal)[];
@@ -37,15 +36,9 @@ export declare class GanttTableBodyComponent implements OnInit, OnDestroy, After
37
36
  private itemDragMoved;
38
37
  private itemDropTarget;
39
38
  private destroy$;
40
- sideContainer: Element;
41
- headerContainer: Element;
42
- footerContainer: Element;
43
- tableScrollbarContainer: Element;
44
- constructor(gantt: GanttAbstractComponent, ganttUpper: GanttUpper, cdr: ChangeDetectorRef, document: Document, elementRef: ElementRef<HTMLElement>, ngZone: NgZone);
39
+ constructor(gantt: GanttAbstractComponent, ganttUpper: GanttUpper, cdr: ChangeDetectorRef, document: Document, elementRef: ElementRef<HTMLElement>);
45
40
  ngOnInit(): void;
46
41
  ngAfterViewInit(): void;
47
- initialize(): void;
48
- private monitorScrollChange;
49
42
  expandGroup(group: GanttGroupInternal): void;
50
43
  expandChildren(event: MouseEvent, item: GanttItemInternal): void;
51
44
  onItemDragStarted(event: CdkDragStart<GanttItemInternal>): void;
@@ -0,0 +1,22 @@
1
+ import { OnDestroy, OnInit } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ export declare class GanttSyncScrollXDirective implements OnInit, OnDestroy {
4
+ readonly syncScrollX: import("@angular/core").InputSignal<string>;
5
+ private elementRef;
6
+ private syncScrollService;
7
+ constructor();
8
+ ngOnInit(): void;
9
+ ngOnDestroy(): void;
10
+ static ɵfac: i0.ɵɵFactoryDeclaration<GanttSyncScrollXDirective, never>;
11
+ static ɵdir: i0.ɵɵDirectiveDeclaration<GanttSyncScrollXDirective, "[syncScrollX]", never, { "syncScrollX": { "alias": "syncScrollX"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
12
+ }
13
+ export declare class GanttSyncScrollYDirective implements OnInit, OnDestroy {
14
+ readonly syncScrollY: import("@angular/core").InputSignal<string>;
15
+ private syncScrollService;
16
+ private elementRef;
17
+ constructor();
18
+ ngOnInit(): void;
19
+ ngOnDestroy(): void;
20
+ static ɵfac: i0.ɵɵFactoryDeclaration<GanttSyncScrollYDirective, never>;
21
+ static ɵdir: i0.ɵɵDirectiveDeclaration<GanttSyncScrollYDirective, "[syncScrollY]", never, { "syncScrollY": { "alias": "syncScrollY"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
22
+ }
@@ -4,11 +4,11 @@ import * as i1$1 from '@angular/cdk/scrolling';
4
4
  import { CdkScrollable, CdkVirtualScrollViewport, CdkFixedSizeVirtualScroll, CdkVirtualForOf, ScrollingModule } from '@angular/cdk/scrolling';
5
5
  import { isPlatformServer, NgTemplateOutlet, NgStyle, NgClass, DOCUMENT, CommonModule } from '@angular/common';
6
6
  import * as i0 from '@angular/core';
7
- import { InjectionToken, inject, Inject, Injectable, EventEmitter, HostBinding, ContentChild, Output, Input, Directive, signal, PLATFORM_ID, effect, ViewChildren, ViewChild, Component, Pipe, ElementRef, HostListener, Optional, forwardRef, ContentChildren, ChangeDetectionStrategy, NgModule } from '@angular/core';
7
+ import { InjectionToken, inject, Inject, Injectable, EventEmitter, HostBinding, ContentChild, Output, Input, Directive, signal, PLATFORM_ID, effect, ViewChildren, ViewChild, Component, Pipe, NgZone, input, ElementRef, HostListener, Optional, forwardRef, ContentChildren, ChangeDetectionStrategy, NgModule } from '@angular/core';
8
+ import { BehaviorSubject, Subject, from, fromEvent, Observable, merge, EMPTY, interval, animationFrameScheduler, take as take$1, takeUntil as takeUntil$1, combineLatest, startWith as startWith$1, auditTime as auditTime$1, filter } from 'rxjs';
9
+ import { take, takeUntil, skip, map, pairwise, auditTime, startWith, switchMap, debounceTime, finalize } from 'rxjs/operators';
8
10
  import { fromUnixTime, getWeek, getDaysInMonth, differenceInCalendarDays, setDate, addSeconds, addMinutes, addHours, addDays, addWeeks, addMonths, addQuarters, addYears, startOfMinute, startOfHour, startOfDay, startOfWeek, startOfMonth, startOfQuarter, startOfYear, endOfMinute, endOfHour, endOfDay, endOfWeek, endOfMonth, endOfQuarter, endOfYear, getUnixTime, format, isWeekend, isToday, differenceInHours, differenceInMinutes, differenceInDays, differenceInCalendarQuarters, eachMonthOfInterval, eachYearOfInterval, eachWeekOfInterval, eachDayOfInterval, differenceInCalendarYears, eachHourOfInterval, setDefaultOptions } from 'date-fns';
9
11
  export { addDays, addHours, addMinutes, addMonths, addQuarters, addSeconds, addWeeks, addYears, differenceInCalendarDays, differenceInCalendarQuarters, differenceInDays, differenceInMinutes, eachDayOfInterval, eachHourOfInterval, eachMonthOfInterval, eachWeekOfInterval, endOfDay, endOfHour, endOfMinute, endOfMonth, endOfQuarter, endOfWeek, endOfYear, format, fromUnixTime, getDaysInMonth, getUnixTime, getWeek, isToday, isWeekend, setDate, startOfDay, startOfHour, startOfMinute, startOfMonth, startOfQuarter, startOfWeek, startOfYear } from 'date-fns';
10
- import { BehaviorSubject, Subject, from, fromEvent, merge, Observable, EMPTY, interval, animationFrameScheduler, take as take$1, takeUntil as takeUntil$1, combineLatest, startWith as startWith$1, auditTime as auditTime$1, filter } from 'rxjs';
11
- import { take, takeUntil, skip, map, pairwise, auditTime, startWith, switchMap, debounceTime, finalize } from 'rxjs/operators';
12
12
  import { TZDate } from '@date-fns/tz';
13
13
  import { de, ru } from 'date-fns/locale';
14
14
  import { SelectionModel } from '@angular/cdk/collections';
@@ -1307,6 +1307,10 @@ class GanttConfigService {
1307
1307
  if (this.config.dateOptions?.timeZone) {
1308
1308
  setDefaultTimeZone(this.config.dateOptions.timeZone);
1309
1309
  }
1310
+ setDefaultOptions({
1311
+ locale: this.getDateLocale(),
1312
+ weekStartsOn: this.config?.dateOptions?.weekStartsOn
1313
+ });
1310
1314
  }
1311
1315
  setLocale(locale) {
1312
1316
  this.config.locale = locale;
@@ -1412,7 +1416,7 @@ class GanttUpper {
1412
1416
  this.view = createViewFactory(this.viewType, viewDate.start, viewDate.end, this.viewOptions);
1413
1417
  }
1414
1418
  setupGroups() {
1415
- const collapsedIds = this.groups.filter((group) => group.expanded === false).map((group) => group.id);
1419
+ const collapsedIds = this.originGroups.filter((group) => group.expanded === false).map((group) => group.id);
1416
1420
  this.groupsMap = {};
1417
1421
  this.groups = [];
1418
1422
  this.originGroups.forEach((origin) => {
@@ -1898,38 +1902,6 @@ class GanttDomService {
1898
1902
  this.visibleRangeX = signal({ min: 0, max: 0 });
1899
1903
  this.unsubscribe$ = new Subject();
1900
1904
  }
1901
- monitorScrollChange() {
1902
- const scrollObservers = [
1903
- fromEvent(this.mainContainer, 'scroll', passiveListenerOptions),
1904
- fromEvent(this.sideContainer, 'scroll', passiveListenerOptions)
1905
- ];
1906
- this.mainFooter && scrollObservers.push(fromEvent(this.mainFooter, 'scroll', passiveListenerOptions));
1907
- this.mainScrollbar && scrollObservers.push(fromEvent(this.mainScrollbar, 'scroll', passiveListenerOptions));
1908
- this.ngZone.runOutsideAngular(() => merge(...scrollObservers)
1909
- .pipe(takeUntil(this.unsubscribe$))
1910
- .subscribe((event) => {
1911
- this.syncScroll(event);
1912
- }));
1913
- }
1914
- syncScroll(event) {
1915
- const target = event.currentTarget;
1916
- const classList = target.classList;
1917
- if (!classList.contains('gantt-side-container')) {
1918
- this.mainContainer.scrollLeft = target.scrollLeft;
1919
- this.calendarHeader.scrollLeft = target.scrollLeft;
1920
- this.calendarOverlay.scrollLeft = target.scrollLeft;
1921
- this.mainScrollbar && (this.mainScrollbar.scrollLeft = target.scrollLeft);
1922
- this.mainFooter && (this.mainFooter.scrollLeft = target.scrollLeft);
1923
- if (classList.contains('gantt-main-container')) {
1924
- this.sideContainer.scrollTop = target.scrollTop;
1925
- this.mainContainer.scrollTop = target.scrollTop;
1926
- }
1927
- }
1928
- else {
1929
- this.sideContainer.scrollTop = target.scrollTop;
1930
- this.mainContainer.scrollTop = target.scrollTop;
1931
- }
1932
- }
1933
1905
  disableBrowserWheelEvent() {
1934
1906
  const container = this.mainContainer;
1935
1907
  this.ngZone.runOutsideAngular(() => fromEvent(container, 'wheel')
@@ -1959,7 +1931,6 @@ class GanttDomService {
1959
1931
  this.mainItems = mainItems || mainGroups;
1960
1932
  this.calendarHeader = this.root.getElementsByClassName('gantt-calendar-header')[0];
1961
1933
  this.calendarOverlay = this.root.getElementsByClassName('gantt-calendar-grid')[0];
1962
- this.monitorScrollChange();
1963
1934
  this.disableBrowserWheelEvent();
1964
1935
  }
1965
1936
  /**
@@ -3634,6 +3605,102 @@ function setStyleWithVendorPrefix({ element, style, value }) {
3634
3605
  }
3635
3606
  }
3636
3607
 
3608
+ class GanttSyncScrollService {
3609
+ constructor() {
3610
+ this.ngZone = inject(NgZone);
3611
+ this.scrollGroupsMap = new Map();
3612
+ }
3613
+ registerScrollEvent(groupName, element, direction) {
3614
+ const group = this.scrollGroupsMap.get(groupName) || { elements: [], destroy$: new Subject(), direction };
3615
+ group.elements.push(element);
3616
+ this.scrollGroupsMap.set(groupName, group);
3617
+ this.monitorScrollChange(group);
3618
+ }
3619
+ unregisterScrollEvent(groupName, element) {
3620
+ const group = this.scrollGroupsMap.get(groupName);
3621
+ if (group) {
3622
+ group.elements = group.elements.filter((el) => el !== element);
3623
+ if (!group.elements.length) {
3624
+ this.scrollGroupsMap.delete(groupName);
3625
+ }
3626
+ else {
3627
+ this.scrollGroupsMap.set(groupName, group);
3628
+ }
3629
+ this.monitorScrollChange(group);
3630
+ }
3631
+ }
3632
+ monitorScrollChange(group) {
3633
+ const { elements, destroy$, direction } = group;
3634
+ destroy$.next();
3635
+ destroy$.complete();
3636
+ if (elements.length) {
3637
+ const scrollObservers = elements.map((el) => fromEvent(el, 'scroll', passiveListenerOptions));
3638
+ this.ngZone.runOutsideAngular(() => merge(...scrollObservers)
3639
+ .pipe(takeUntil$1(destroy$))
3640
+ .subscribe((event) => {
3641
+ elements.forEach((el) => {
3642
+ if (direction === 'x') {
3643
+ el.scrollLeft = event.currentTarget.scrollLeft;
3644
+ }
3645
+ else {
3646
+ el.scrollTop = event.currentTarget.scrollTop;
3647
+ }
3648
+ });
3649
+ }));
3650
+ }
3651
+ }
3652
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttSyncScrollService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
3653
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttSyncScrollService }); }
3654
+ }
3655
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttSyncScrollService, decorators: [{
3656
+ type: Injectable
3657
+ }], ctorParameters: () => [] });
3658
+
3659
+ class GanttSyncScrollXDirective {
3660
+ constructor() {
3661
+ this.syncScrollX = input();
3662
+ this.elementRef = inject((ElementRef));
3663
+ this.syncScrollService = inject(GanttSyncScrollService);
3664
+ }
3665
+ ngOnInit() {
3666
+ this.syncScrollService.registerScrollEvent(this.syncScrollX(), this.elementRef.nativeElement, 'x');
3667
+ }
3668
+ ngOnDestroy() {
3669
+ this.syncScrollService.unregisterScrollEvent(this.syncScrollX(), this.elementRef.nativeElement);
3670
+ }
3671
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttSyncScrollXDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
3672
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.3", type: GanttSyncScrollXDirective, isStandalone: true, selector: "[syncScrollX]", inputs: { syncScrollX: { classPropertyName: "syncScrollX", publicName: "syncScrollX", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
3673
+ }
3674
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttSyncScrollXDirective, decorators: [{
3675
+ type: Directive,
3676
+ args: [{
3677
+ selector: '[syncScrollX]',
3678
+ standalone: true
3679
+ }]
3680
+ }], ctorParameters: () => [] });
3681
+ class GanttSyncScrollYDirective {
3682
+ constructor() {
3683
+ this.syncScrollY = input();
3684
+ this.syncScrollService = inject(GanttSyncScrollService);
3685
+ this.elementRef = inject((ElementRef));
3686
+ }
3687
+ ngOnInit() {
3688
+ this.syncScrollService.registerScrollEvent(this.syncScrollY(), this.elementRef.nativeElement, 'y');
3689
+ }
3690
+ ngOnDestroy() {
3691
+ this.syncScrollService.unregisterScrollEvent(this.syncScrollY(), this.elementRef.nativeElement);
3692
+ }
3693
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttSyncScrollYDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
3694
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.3", type: GanttSyncScrollYDirective, isStandalone: true, selector: "[syncScrollY]", inputs: { syncScrollY: { classPropertyName: "syncScrollY", publicName: "syncScrollY", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
3695
+ }
3696
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttSyncScrollYDirective, decorators: [{
3697
+ type: Directive,
3698
+ args: [{
3699
+ selector: '[syncScrollY]',
3700
+ standalone: true
3701
+ }]
3702
+ }], ctorParameters: () => [] });
3703
+
3637
3704
  const defaultColumnWidth = 100;
3638
3705
  const minColumnWidth = 80;
3639
3706
  class GanttTableHeaderComponent {
@@ -3752,11 +3819,11 @@ class GanttTableHeaderComponent {
3752
3819
  this.unsubscribe$.complete();
3753
3820
  }
3754
3821
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttTableHeaderComponent, deps: [{ token: i0.ElementRef }, { token: GANTT_ABSTRACT_TOKEN }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
3755
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GanttTableHeaderComponent, isStandalone: true, selector: "gantt-table-header", inputs: { columns: "columns" }, host: { properties: { "class": "this.className", "style.height": "this.height", "style.line-height": "this.lineHeight" } }, viewQueries: [{ propertyName: "resizeLineElementRef", first: true, predicate: ["resizeLine"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"gantt-table-header-container\" [style.width.px]=\"tableWidth\" cdkScrollable>\n @for (column of columns; track $index) {\n <div class=\"gantt-table-column\" [style.width]=\"column.columnWidth\">\n @if (column.headerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"column.headerTemplateRef\"> </ng-container>\n } @else {\n {{ column.name }}\n }\n <div\n class=\"column-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event, column)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onResizeEnded($event, column)\"\n ></div>\n </div>\n }\n <div class=\"gantt-table-column gantt-table-column-placeholder\"></div>\n</div>\n\n@if (gantt?.table?.settingsSlot) {\n <ng-template [ngTemplateOutlet]=\"gantt?.table?.settingsSlot\"></ng-template>\n}\n\n<div\n class=\"table-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onOverallResizeEnded($event)\"\n></div>\n\n<div #resizeLine class=\"table-resize-auxiliary-line\"></div>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }] }); }
3822
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GanttTableHeaderComponent, isStandalone: true, selector: "gantt-table-header", inputs: { columns: "columns" }, host: { properties: { "class": "this.className", "style.height": "this.height", "style.line-height": "this.lineHeight" } }, viewQueries: [{ propertyName: "resizeLineElementRef", first: true, predicate: ["resizeLine"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"gantt-table-header-container\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableWidth\" cdkScrollable>\n @for (column of columns; track $index) {\n <div class=\"gantt-table-column\" [style.width]=\"column.columnWidth\">\n @if (column.headerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"column.headerTemplateRef\"> </ng-container>\n } @else {\n {{ column.name }}\n }\n <div\n class=\"column-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event, column)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onResizeEnded($event, column)\"\n ></div>\n </div>\n }\n <div class=\"gantt-table-column gantt-table-column-placeholder\"></div>\n</div>\n\n@if (gantt?.table?.settingsSlot) {\n <ng-template [ngTemplateOutlet]=\"gantt?.table?.settingsSlot\"></ng-template>\n}\n\n<div\n class=\"table-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onOverallResizeEnded($event)\"\n></div>\n\n<div #resizeLine class=\"table-resize-auxiliary-line\"></div>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: GanttSyncScrollXDirective, selector: "[syncScrollX]", inputs: ["syncScrollX"] }] }); }
3756
3823
  }
3757
3824
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttTableHeaderComponent, decorators: [{
3758
3825
  type: Component,
3759
- args: [{ selector: 'gantt-table-header', imports: [NgTemplateOutlet, CdkDrag], template: "<div class=\"gantt-table-header-container\" [style.width.px]=\"tableWidth\" cdkScrollable>\n @for (column of columns; track $index) {\n <div class=\"gantt-table-column\" [style.width]=\"column.columnWidth\">\n @if (column.headerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"column.headerTemplateRef\"> </ng-container>\n } @else {\n {{ column.name }}\n }\n <div\n class=\"column-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event, column)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onResizeEnded($event, column)\"\n ></div>\n </div>\n }\n <div class=\"gantt-table-column gantt-table-column-placeholder\"></div>\n</div>\n\n@if (gantt?.table?.settingsSlot) {\n <ng-template [ngTemplateOutlet]=\"gantt?.table?.settingsSlot\"></ng-template>\n}\n\n<div\n class=\"table-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onOverallResizeEnded($event)\"\n></div>\n\n<div #resizeLine class=\"table-resize-auxiliary-line\"></div>\n" }]
3826
+ args: [{ selector: 'gantt-table-header', imports: [NgTemplateOutlet, CdkDrag, GanttSyncScrollXDirective], template: "<div class=\"gantt-table-header-container\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableWidth\" cdkScrollable>\n @for (column of columns; track $index) {\n <div class=\"gantt-table-column\" [style.width]=\"column.columnWidth\">\n @if (column.headerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"column.headerTemplateRef\"> </ng-container>\n } @else {\n {{ column.name }}\n }\n <div\n class=\"column-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event, column)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onResizeEnded($event, column)\"\n ></div>\n </div>\n }\n <div class=\"gantt-table-column gantt-table-column-placeholder\"></div>\n</div>\n\n@if (gantt?.table?.settingsSlot) {\n <ng-template [ngTemplateOutlet]=\"gantt?.table?.settingsSlot\"></ng-template>\n}\n\n<div\n class=\"table-resize-handle\"\n cdkDrag\n cdkDragLockAxis=\"x\"\n cdkDragBoundary=\".gantt\"\n (cdkDragMoved)=\"onResizeMoved($event)\"\n (cdkDragStarted)=\"onResizeStarted($event)\"\n (cdkDragEnded)=\"onOverallResizeEnded($event)\"\n></div>\n\n<div #resizeLine class=\"table-resize-auxiliary-line\"></div>\n" }]
3760
3827
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: undefined, decorators: [{
3761
3828
  type: Inject,
3762
3829
  args: [GANTT_ABSTRACT_TOKEN]
@@ -3788,13 +3855,12 @@ class GanttTableBodyComponent {
3788
3855
  get viewportItems() {
3789
3856
  return this._viewportItems;
3790
3857
  }
3791
- constructor(gantt, ganttUpper, cdr, document, elementRef, ngZone) {
3858
+ constructor(gantt, ganttUpper, cdr, document, elementRef) {
3792
3859
  this.gantt = gantt;
3793
3860
  this.ganttUpper = ganttUpper;
3794
3861
  this.cdr = cdr;
3795
3862
  this.document = document;
3796
3863
  this.elementRef = elementRef;
3797
- this.ngZone = ngZone;
3798
3864
  this.draggable = false;
3799
3865
  this.dragDropped = new EventEmitter();
3800
3866
  this.dragStarted = new EventEmitter();
@@ -3824,7 +3890,6 @@ class GanttTableBodyComponent {
3824
3890
  });
3825
3891
  }
3826
3892
  ngAfterViewInit() {
3827
- this.initialize();
3828
3893
  this.cdkDrags.changes
3829
3894
  .pipe(startWith$1(this.cdkDrags), takeUntil$1(this.destroy$))
3830
3895
  .subscribe((drags) => {
@@ -3844,29 +3909,6 @@ class GanttTableBodyComponent {
3844
3909
  this.onItemDragMoved(event);
3845
3910
  });
3846
3911
  }
3847
- initialize() {
3848
- this.sideContainer = this.document.getElementsByClassName('gantt-side-container')[0];
3849
- this.headerContainer = this.document.getElementsByClassName('gantt-table-header-container')[0];
3850
- this.footerContainer = this.document.getElementsByClassName('gantt-table-footer')[0];
3851
- this.tableScrollbarContainer = this.document.getElementsByClassName('gantt-table-scrollbar')[0];
3852
- this.monitorScrollChange();
3853
- }
3854
- monitorScrollChange() {
3855
- const scrollObservers = [
3856
- fromEvent(this.sideContainer, 'scroll', passiveListenerOptions),
3857
- fromEvent(this.headerContainer, 'scroll', passiveListenerOptions),
3858
- fromEvent(this.tableScrollbarContainer, 'scroll', passiveListenerOptions)
3859
- ];
3860
- this.ngZone.runOutsideAngular(() => merge(...scrollObservers)
3861
- .pipe(takeUntil$1(this.destroy$))
3862
- .subscribe((event) => {
3863
- const target = event.currentTarget;
3864
- this.headerContainer && (this.headerContainer.scrollLeft = target.scrollLeft);
3865
- this.sideContainer && (this.sideContainer.scrollLeft = target.scrollLeft);
3866
- this.tableScrollbarContainer && (this.tableScrollbarContainer.scrollLeft = target.scrollLeft);
3867
- this.footerContainer && (this.footerContainer.scrollLeft = target.scrollLeft);
3868
- }));
3869
- }
3870
3912
  expandGroup(group) {
3871
3913
  this.gantt.expandGroup(group);
3872
3914
  }
@@ -4061,7 +4103,7 @@ class GanttTableBodyComponent {
4061
4103
  this.document.querySelectorAll('.drop-position-after').forEach((element) => element.classList.remove('drop-position-after'));
4062
4104
  this.document.querySelectorAll('.drop-position-inside').forEach((element) => element.classList.remove('drop-position-inside'));
4063
4105
  }
4064
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttTableBodyComponent, deps: [{ token: GANTT_ABSTRACT_TOKEN }, { token: GANTT_UPPER_TOKEN }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
4106
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttTableBodyComponent, deps: [{ token: GANTT_ABSTRACT_TOKEN }, { token: GANTT_UPPER_TOKEN }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
4065
4107
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GanttTableBodyComponent, isStandalone: true, selector: "gantt-table-body", inputs: { viewportItems: "viewportItems", flatItems: "flatItems", columns: "columns", groupTemplate: "groupTemplate", emptyTemplate: "emptyTemplate", rowBeforeTemplate: "rowBeforeTemplate", rowAfterTemplate: "rowAfterTemplate", draggable: "draggable", dropEnterPredicate: "dropEnterPredicate" }, outputs: { dragDropped: "dragDropped", dragStarted: "dragStarted", dragEnded: "dragEnded", itemClick: "itemClick" }, host: { properties: { "class.gantt-table-draggable": "this.draggable", "class.gantt-table-body": "this.ganttTableClass", "class.gantt-table-empty": "this.ganttTableEmptyClass", "class.gantt-table-dragging": "this.ganttTableDragging" } }, viewQueries: [{ propertyName: "cdkDrags", predicate: (CdkDrag), descendants: true }], ngImport: i0, template: "<div\n class=\"gantt-table-body-container\"\n cdkDropList\n [cdkDropListAutoScrollStep]=\"6\"\n [cdkDropListData]=\"viewportItems\"\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onListDropped($event)\"\n>\n @if (!viewportItems?.length) {\n @if (!emptyTemplate) {\n <gantt-icon class=\"empty-icon\" iconName=\"empty\"></gantt-icon>\n <div class=\"empty-text\">\u6CA1\u6709\u6570\u636E</div>\n }\n <ng-template [ngTemplateOutlet]=\"emptyTemplate\"></ng-template>\n }\n\n @if (viewportItems && viewportItems.length > 0) {\n @for (item of viewportItems; track trackBy($index, item)) {\n @if (item | isGanttGroup) {\n <div class=\"gantt-table-group\" [style.height.px]=\"gantt.styles.lineHeight\" [ngClass]=\"item.class\">\n <div class=\"gantt-table-group-title\" [class.expanded]=\"item.expanded\" (click)=\"expandGroup(item)\">\n <gantt-icon class=\"expand-icon\" [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"></gantt-icon>\n @if (groupTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, group: item.origin }\"\n ></ng-template>\n } @else {\n <span class=\"group-title\">{{ item.title }}</span>\n }\n </div>\n </div>\n }\n @if (!(item | isGanttGroup)) {\n <div\n (click)=\"itemClick.emit({ event: $event, current: item.origin, selectedValue: item.origin })\"\n cdkDrag\n [cdkDragData]=\"item\"\n [cdkDragDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n (cdkDragStarted)=\"onItemDragStarted($event)\"\n (cdkDragEnded)=\"onItemDragEnded($event)\"\n (cdkDragMoved)=\"emitItemDragMoved($event)\"\n class=\"gantt-table-item\"\n [class.gantt-table-item-with-group]=\"hasGroup\"\n [class.gantt-table-item-first-level-group]=\"item.level === 0 && (item.type | isGanttRangeItem)\"\n [style.height.px]=\"gantt.styles.lineHeight\"\n [style.lineHeight.px]=\"gantt.styles.lineHeight\"\n [class.gantt-table-item-active]=\"ganttUpper.isSelected(item.id)\"\n >\n <ng-template\n [ngTemplateOutlet]=\"rowBeforeTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n @for (column of columns; track $index; let first = $first) {\n <div [classList]=\"column.classList\" [style.width]=\"column.columnWidth\">\n <!-- drag icon -->\n @if (first && draggable) {\n <gantt-icon\n class=\"gantt-drag-handle\"\n iconName=\"drag\"\n cdkDragHandle\n [cdkDragHandleDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n ></gantt-icon>\n }\n <!-- expand icon -->\n @if (column?.showExpandIcon || (!hasExpandIcon && first)) {\n <div class=\"gantt-expand-icon\" [style.marginLeft.px]=\"item.level * 20\">\n @if (item.level < gantt.maxLevel - 1 && ((gantt.async && item.expandable) || item.children?.length > 0)) {\n @if (!item.loading) {\n <gantt-icon\n class=\"expand-icon\"\n [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"\n (click)=\"expandChildren($event, item)\"\n >\n </gantt-icon>\n }\n @if (item.loading) {\n <gantt-icon [iconName]=\"'loading'\"></gantt-icon>\n }\n }\n </div>\n }\n <!-- column content -->\n <div class=\"gantt-table-column-content\">\n <ng-template\n [ngTemplateOutlet]=\"column.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </div>\n }\n <div class=\"gantt-table-column gantt-table-column-placeholder\"></div>\n <ng-template\n [ngTemplateOutlet]=\"rowAfterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n }\n }\n }\n</div>\n", dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: GanttIconComponent, selector: "gantt-icon", inputs: ["iconName"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "pipe", type: IsGanttRangeItemPipe, name: "isGanttRangeItem" }, { kind: "pipe", type: IsGanttGroupPipe, name: "isGanttGroup" }] }); }
4066
4108
  }
4067
4109
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttTableBodyComponent, decorators: [{
@@ -4076,7 +4118,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
4076
4118
  }] }, { type: i0.ChangeDetectorRef }, { type: Document, decorators: [{
4077
4119
  type: Inject,
4078
4120
  args: [DOCUMENT]
4079
- }] }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { viewportItems: [{
4121
+ }] }, { type: i0.ElementRef }], propDecorators: { viewportItems: [{
4080
4122
  type: Input
4081
4123
  }], flatItems: [{
4082
4124
  type: Input
@@ -4156,11 +4198,11 @@ class GanttScrollbarComponent {
4156
4198
  this.hasFooter = false;
4157
4199
  }
4158
4200
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttScrollbarComponent, deps: [{ token: GANTT_UPPER_TOKEN }], target: i0.ɵɵFactoryTarget.Component }); }
4159
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: GanttScrollbarComponent, isStandalone: true, selector: "gantt-scrollbar", inputs: { hasFooter: "hasFooter", tableWidth: "tableWidth", ganttRoot: "ganttRoot" }, ngImport: i0, template: "<div\n class=\"gantt-scrollbar\"\n [ngClass]=\"{ 'gantt-scrollbar-bg': hasFooter }\"\n [style.height.px]=\"ganttRoot?.horizontalScrollbarHeight + 1\"\n [style.right.px]=\"ganttRoot?.verticalScrollbarWidth\"\n>\n <div class=\"gantt-table-scrollbar\" [class.with-scrollbar]=\"ganttRoot?.horizontalScrollbarHeight\" [style.width.px]=\"tableWidth\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot.ganttUpper['ganttTableBody']?.elementRef?.nativeElement?.offsetWidth - 1 || 0\"></div>\n </div>\n <div class=\"gantt-main-scrollbar\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot['view']?.width\"></div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
4201
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: GanttScrollbarComponent, isStandalone: true, selector: "gantt-scrollbar", inputs: { hasFooter: "hasFooter", tableWidth: "tableWidth", ganttRoot: "ganttRoot" }, ngImport: i0, template: "<div\n class=\"gantt-scrollbar\"\n [ngClass]=\"{ 'gantt-scrollbar-bg': hasFooter }\"\n [style.height.px]=\"ganttRoot?.horizontalScrollbarHeight + 1\"\n [style.right.px]=\"ganttRoot?.verticalScrollbarWidth\"\n>\n <div\n class=\"gantt-table-scrollbar\"\n syncScrollX=\"ganttTableXScroll\"\n [class.with-scrollbar]=\"ganttRoot?.horizontalScrollbarHeight\"\n [style.width.px]=\"tableWidth\"\n >\n <div class=\"h-100\" [style.width.px]=\"ganttRoot.ganttUpper['ganttTableBody']?.elementRef?.nativeElement?.offsetWidth - 1 || 0\"></div>\n </div>\n <div class=\"gantt-main-scrollbar\" syncScrollX=\"ganttMainXScroll\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot['view']?.width\"></div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: GanttSyncScrollXDirective, selector: "[syncScrollX]", inputs: ["syncScrollX"] }] }); }
4160
4202
  }
4161
4203
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttScrollbarComponent, decorators: [{
4162
4204
  type: Component,
4163
- args: [{ selector: 'gantt-scrollbar', imports: [NgClass], template: "<div\n class=\"gantt-scrollbar\"\n [ngClass]=\"{ 'gantt-scrollbar-bg': hasFooter }\"\n [style.height.px]=\"ganttRoot?.horizontalScrollbarHeight + 1\"\n [style.right.px]=\"ganttRoot?.verticalScrollbarWidth\"\n>\n <div class=\"gantt-table-scrollbar\" [class.with-scrollbar]=\"ganttRoot?.horizontalScrollbarHeight\" [style.width.px]=\"tableWidth\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot.ganttUpper['ganttTableBody']?.elementRef?.nativeElement?.offsetWidth - 1 || 0\"></div>\n </div>\n <div class=\"gantt-main-scrollbar\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot['view']?.width\"></div>\n </div>\n</div>\n" }]
4205
+ args: [{ selector: 'gantt-scrollbar', imports: [NgClass, GanttSyncScrollXDirective], template: "<div\n class=\"gantt-scrollbar\"\n [ngClass]=\"{ 'gantt-scrollbar-bg': hasFooter }\"\n [style.height.px]=\"ganttRoot?.horizontalScrollbarHeight + 1\"\n [style.right.px]=\"ganttRoot?.verticalScrollbarWidth\"\n>\n <div\n class=\"gantt-table-scrollbar\"\n syncScrollX=\"ganttTableXScroll\"\n [class.with-scrollbar]=\"ganttRoot?.horizontalScrollbarHeight\"\n [style.width.px]=\"tableWidth\"\n >\n <div class=\"h-100\" [style.width.px]=\"ganttRoot.ganttUpper['ganttTableBody']?.elementRef?.nativeElement?.offsetWidth - 1 || 0\"></div>\n </div>\n <div class=\"gantt-main-scrollbar\" syncScrollX=\"ganttMainXScroll\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot['view']?.width\"></div>\n </div>\n</div>\n" }]
4164
4206
  }], ctorParameters: () => [{ type: GanttUpper, decorators: [{
4165
4207
  type: Inject,
4166
4208
  args: [GANTT_UPPER_TOKEN]
@@ -4383,11 +4425,11 @@ class NgxGanttRootComponent {
4383
4425
  this.dom.scrollMainContainer(x);
4384
4426
  }
4385
4427
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NgxGanttRootComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: GanttDomService }, { token: GanttDragContainer }, { token: GANTT_UPPER_TOKEN }, { token: GanttPrintService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
4386
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: NgxGanttRootComponent, isStandalone: true, selector: "ngx-gantt-root", inputs: { sideWidth: "sideWidth" }, host: { listeners: { "window:resize": "onWindowResize()" }, classAttribute: "gantt" }, providers: [GanttDomService, GanttDragContainer], queries: [{ propertyName: "sideTemplate", first: true, predicate: ["sideTemplate"], descendants: true, static: true }, { propertyName: "mainTemplate", first: true, predicate: ["mainTemplate"], descendants: true, static: true }], viewQueries: [{ propertyName: "backdrop", first: true, predicate: GanttDragBackdropComponent, descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "@if (sideTemplate) {\n <div class=\"gantt-side\" [style.width.px]=\"sideWidth\" [style.padding-bottom.px]=\"horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" cdkScrollable>\n <ng-template [ngTemplateOutlet]=\"sideTemplate\"></ng-template>\n </div>\n </div>\n}\n@if (mainTemplate) {\n <div class=\"gantt-container\">\n <gantt-calendar-header [style.padding-right.px]=\"verticalScrollbarWidth\"></gantt-calendar-header>\n <gantt-calendar-grid\n [style.padding-right.px]=\"verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <gantt-drag-backdrop></gantt-drag-backdrop>\n <div class=\"gantt-main\">\n <ng-template [ngTemplateOutlet]=\"mainTemplate\"></ng-template>\n </div>\n </div>\n}\n<ng-content></ng-content>\n@if (ganttUpper.showToolbar || ganttUpper.toolbarTemplate) {\n <gantt-toolbar [template]=\"ganttUpper.toolbarTemplate\"> </gantt-toolbar>\n}\n", dependencies: [{ kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: GanttCalendarHeaderComponent, selector: "gantt-calendar-header" }, { kind: "component", type: GanttCalendarGridComponent, selector: "gantt-calendar-grid" }, { kind: "component", type: GanttDragBackdropComponent, selector: "gantt-drag-backdrop" }, { kind: "component", type: NgxGanttToolbarComponent, selector: "ngx-gantt-toolbar,gantt-toolbar", inputs: ["template"] }] }); }
4428
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: NgxGanttRootComponent, isStandalone: true, selector: "ngx-gantt-root", inputs: { sideWidth: "sideWidth" }, host: { listeners: { "window:resize": "onWindowResize()" }, classAttribute: "gantt" }, providers: [GanttDomService, GanttDragContainer, GanttSyncScrollService], queries: [{ propertyName: "sideTemplate", first: true, predicate: ["sideTemplate"], descendants: true, static: true }, { propertyName: "mainTemplate", first: true, predicate: ["mainTemplate"], descendants: true, static: true }], viewQueries: [{ propertyName: "backdrop", first: true, predicate: GanttDragBackdropComponent, descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "@if (sideTemplate) {\n <div class=\"gantt-side\" [style.width.px]=\"sideWidth\" [style.padding-bottom.px]=\"horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\" cdkScrollable>\n <ng-template [ngTemplateOutlet]=\"sideTemplate\"></ng-template>\n </div>\n </div>\n}\n@if (mainTemplate) {\n <div class=\"gantt-container\">\n <gantt-calendar-header syncScrollX=\"ganttMainXScroll\" [style.padding-right.px]=\"verticalScrollbarWidth\"></gantt-calendar-header>\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <gantt-drag-backdrop></gantt-drag-backdrop>\n <div class=\"gantt-main\">\n <div class=\"gantt-main-container\" syncScrollX=\"ganttMainXScroll\" syncScrollY=\"ganttMainYScroll\">\n <ng-template [ngTemplateOutlet]=\"mainTemplate\"></ng-template>\n </div>\n </div>\n </div>\n}\n<ng-content></ng-content>\n@if (ganttUpper.showToolbar || ganttUpper.toolbarTemplate) {\n <gantt-toolbar [template]=\"ganttUpper.toolbarTemplate\"> </gantt-toolbar>\n}\n", dependencies: [{ kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: GanttCalendarHeaderComponent, selector: "gantt-calendar-header" }, { kind: "component", type: GanttCalendarGridComponent, selector: "gantt-calendar-grid" }, { kind: "component", type: GanttDragBackdropComponent, selector: "gantt-drag-backdrop" }, { kind: "component", type: NgxGanttToolbarComponent, selector: "ngx-gantt-toolbar,gantt-toolbar", inputs: ["template"] }, { kind: "directive", type: GanttSyncScrollXDirective, selector: "[syncScrollX]", inputs: ["syncScrollX"] }, { kind: "directive", type: GanttSyncScrollYDirective, selector: "[syncScrollY]", inputs: ["syncScrollY"] }] }); }
4387
4429
  }
4388
4430
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NgxGanttRootComponent, decorators: [{
4389
4431
  type: Component,
4390
- args: [{ selector: 'ngx-gantt-root', providers: [GanttDomService, GanttDragContainer], host: {
4432
+ args: [{ selector: 'ngx-gantt-root', providers: [GanttDomService, GanttDragContainer, GanttSyncScrollService], host: {
4391
4433
  class: 'gantt'
4392
4434
  }, imports: [
4393
4435
  CdkScrollable,
@@ -4395,8 +4437,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
4395
4437
  GanttCalendarHeaderComponent,
4396
4438
  GanttCalendarGridComponent,
4397
4439
  GanttDragBackdropComponent,
4398
- NgxGanttToolbarComponent
4399
- ], template: "@if (sideTemplate) {\n <div class=\"gantt-side\" [style.width.px]=\"sideWidth\" [style.padding-bottom.px]=\"horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" cdkScrollable>\n <ng-template [ngTemplateOutlet]=\"sideTemplate\"></ng-template>\n </div>\n </div>\n}\n@if (mainTemplate) {\n <div class=\"gantt-container\">\n <gantt-calendar-header [style.padding-right.px]=\"verticalScrollbarWidth\"></gantt-calendar-header>\n <gantt-calendar-grid\n [style.padding-right.px]=\"verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <gantt-drag-backdrop></gantt-drag-backdrop>\n <div class=\"gantt-main\">\n <ng-template [ngTemplateOutlet]=\"mainTemplate\"></ng-template>\n </div>\n </div>\n}\n<ng-content></ng-content>\n@if (ganttUpper.showToolbar || ganttUpper.toolbarTemplate) {\n <gantt-toolbar [template]=\"ganttUpper.toolbarTemplate\"> </gantt-toolbar>\n}\n" }]
4440
+ NgxGanttToolbarComponent,
4441
+ GanttSyncScrollXDirective,
4442
+ GanttSyncScrollYDirective
4443
+ ], template: "@if (sideTemplate) {\n <div class=\"gantt-side\" [style.width.px]=\"sideWidth\" [style.padding-bottom.px]=\"horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\" cdkScrollable>\n <ng-template [ngTemplateOutlet]=\"sideTemplate\"></ng-template>\n </div>\n </div>\n}\n@if (mainTemplate) {\n <div class=\"gantt-container\">\n <gantt-calendar-header syncScrollX=\"ganttMainXScroll\" [style.padding-right.px]=\"verticalScrollbarWidth\"></gantt-calendar-header>\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <gantt-drag-backdrop></gantt-drag-backdrop>\n <div class=\"gantt-main\">\n <div class=\"gantt-main-container\" syncScrollX=\"ganttMainXScroll\" syncScrollY=\"ganttMainYScroll\">\n <ng-template [ngTemplateOutlet]=\"mainTemplate\"></ng-template>\n </div>\n </div>\n </div>\n}\n<ng-content></ng-content>\n@if (ganttUpper.showToolbar || ganttUpper.toolbarTemplate) {\n <gantt-toolbar [template]=\"ganttUpper.toolbarTemplate\"> </gantt-toolbar>\n}\n" }]
4400
4444
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: GanttDomService }, { type: GanttDragContainer }, { type: GanttUpper, decorators: [{
4401
4445
  type: Inject,
4402
4446
  args: [GANTT_UPPER_TOKEN]
@@ -4782,7 +4826,7 @@ class NgxGanttComponent extends GanttUpper {
4782
4826
  provide: GANTT_ABSTRACT_TOKEN,
4783
4827
  useExisting: forwardRef(() => NgxGanttComponent)
4784
4828
  }
4785
- ], queries: [{ propertyName: "table", first: true, predicate: NgxGanttTableComponent, descendants: true }, { propertyName: "tableEmptyTemplate", first: true, predicate: ["tableEmpty"], descendants: true, static: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true, static: true }, { propertyName: "columns", predicate: NgxGanttTableColumnComponent, descendants: true }], viewQueries: [{ propertyName: "ganttRoot", first: true, predicate: ["ganttRoot"], descendants: true }, { propertyName: "virtualScroll", first: true, predicate: CdkVirtualScrollViewport, descendants: true }, { propertyName: "ganttTableBody", first: true, predicate: ["ganttTableBody"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n", dependencies: [{ kind: "component", type: NgxGanttRootComponent, selector: "ngx-gantt-root", inputs: ["sideWidth"] }, { kind: "component", type: GanttTableHeaderComponent, selector: "gantt-table-header", inputs: ["columns"] }, { kind: "component", type: GanttCalendarHeaderComponent, selector: "gantt-calendar-header" }, { kind: "component", type: GanttLoaderComponent, selector: "gantt-loader" }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: GanttTableBodyComponent, selector: "gantt-table-body", inputs: ["viewportItems", "flatItems", "columns", "groupTemplate", "emptyTemplate", "rowBeforeTemplate", "rowAfterTemplate", "draggable", "dropEnterPredicate"], outputs: ["dragDropped", "dragStarted", "dragEnded", "itemClick"] }, { kind: "component", type: GanttCalendarGridComponent, selector: "gantt-calendar-grid" }, { kind: "component", type: GanttMainComponent, selector: "gantt-main", inputs: ["viewportItems", "flatItems", "groupHeaderTemplate", "itemTemplate", "barTemplate", "rangeTemplate", "baselineTemplate", "ganttRoot", "quickTimeFocus"], outputs: ["barClick", "lineClick"] }, { kind: "component", type: GanttDragBackdropComponent, selector: "gantt-drag-backdrop" }, { kind: "component", type: GanttScrollbarComponent, selector: "gantt-scrollbar", inputs: ["hasFooter", "tableWidth", "ganttRoot"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4829
+ ], queries: [{ propertyName: "table", first: true, predicate: NgxGanttTableComponent, descendants: true }, { propertyName: "tableEmptyTemplate", first: true, predicate: ["tableEmpty"], descendants: true, static: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true, static: true }, { propertyName: "columns", predicate: NgxGanttTableColumnComponent, descendants: true }], viewQueries: [{ propertyName: "ganttRoot", first: true, predicate: ["ganttRoot"], descendants: true }, { propertyName: "virtualScroll", first: true, predicate: CdkVirtualScrollViewport, descendants: true }, { propertyName: "ganttTableBody", first: true, predicate: ["ganttTableBody"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n ></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n syncScrollX=\"ganttMainXScroll\"\n syncScrollY=\"ganttMainYScroll\"\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\" syncScrollX=\"ganttMainXScroll\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n", dependencies: [{ kind: "component", type: NgxGanttRootComponent, selector: "ngx-gantt-root", inputs: ["sideWidth"] }, { kind: "component", type: GanttTableHeaderComponent, selector: "gantt-table-header", inputs: ["columns"] }, { kind: "component", type: GanttCalendarHeaderComponent, selector: "gantt-calendar-header" }, { kind: "component", type: GanttLoaderComponent, selector: "gantt-loader" }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: GanttTableBodyComponent, selector: "gantt-table-body", inputs: ["viewportItems", "flatItems", "columns", "groupTemplate", "emptyTemplate", "rowBeforeTemplate", "rowAfterTemplate", "draggable", "dropEnterPredicate"], outputs: ["dragDropped", "dragStarted", "dragEnded", "itemClick"] }, { kind: "component", type: GanttCalendarGridComponent, selector: "gantt-calendar-grid" }, { kind: "component", type: GanttMainComponent, selector: "gantt-main", inputs: ["viewportItems", "flatItems", "groupHeaderTemplate", "itemTemplate", "barTemplate", "rangeTemplate", "baselineTemplate", "ganttRoot", "quickTimeFocus"], outputs: ["barClick", "lineClick"] }, { kind: "component", type: GanttDragBackdropComponent, selector: "gantt-drag-backdrop" }, { kind: "component", type: GanttScrollbarComponent, selector: "gantt-scrollbar", inputs: ["hasFooter", "tableWidth", "ganttRoot"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: GanttSyncScrollXDirective, selector: "[syncScrollX]", inputs: ["syncScrollX"] }, { kind: "directive", type: GanttSyncScrollYDirective, selector: "[syncScrollY]", inputs: ["syncScrollY"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4786
4830
  }
4787
4831
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NgxGanttComponent, decorators: [{
4788
4832
  type: Component,
@@ -4809,8 +4853,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
4809
4853
  GanttMainComponent,
4810
4854
  GanttDragBackdropComponent,
4811
4855
  GanttScrollbarComponent,
4812
- NgTemplateOutlet
4813
- ], template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n" }]
4856
+ NgTemplateOutlet,
4857
+ GanttSyncScrollXDirective,
4858
+ GanttSyncScrollYDirective
4859
+ ], template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n ></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n syncScrollX=\"ganttMainXScroll\"\n syncScrollY=\"ganttMainYScroll\"\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\" syncScrollX=\"ganttMainXScroll\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n" }]
4814
4860
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1$1.ViewportRuler }, { type: undefined, decorators: [{
4815
4861
  type: Inject,
4816
4862
  args: [GANTT_GLOBAL_CONFIG]
@@ -4862,13 +4908,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
4862
4908
  }] } });
4863
4909
 
4864
4910
  class NgxGanttModule {
4865
- constructor() {
4866
- const configService = inject(GanttConfigService);
4867
- setDefaultOptions({
4868
- locale: configService.getDateLocale(),
4869
- weekStartsOn: configService.config?.dateOptions?.weekStartsOn
4870
- });
4871
- }
4911
+ constructor() { }
4872
4912
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NgxGanttModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
4873
4913
  static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.3", ngImport: i0, type: NgxGanttModule, imports: [CommonModule,
4874
4914
  DragDropModule,