@worktile/gantt 12.2.0-next.0 → 12.2.1

package/gantt-drag-container.d.ts

@@ -1,9 +1,23 @@
 import { EventEmitter } from '@angular/core';
 import { GanttDragEvent, GanttLinkDragEvent } from './class/event';
 import { GanttItemInternal } from './class/item';
+import { GanttUpper } from './gantt-upper';
 import * as i0 from "@angular/core";
-export declare type LinkDragFrom = 'source' | 'target';
+export declare enum InBarPosition {
+    start = "start",
+    finish = "finish"
+}
+export declare type LinkDragPosition = {
+    element: HTMLElement;
+    item: GanttItemInternal;
+    pos?: InBarPosition;
+};
+export interface LinkDragPath {
+    from?: LinkDragPosition;
+    to?: LinkDragPosition;
+}
 export declare class GanttDragContainer {
+    ganttUpper: GanttUpper;
     dragStarted: EventEmitter<GanttDragEvent<unknown>>;
     dragMoved: EventEmitter<GanttDragEvent<unknown>>;
     dragEnded: EventEmitter<GanttDragEvent<unknown>>;
@@ -11,14 +25,12 @@ export declare class GanttDragContainer {
     linkDragEntered: EventEmitter<GanttLinkDragEvent<unknown>>;
     linkDragEnded: EventEmitter<GanttLinkDragEvent<unknown>>;
     linkDraggingId: string;
-    private linkDragSource;
-    private linkDragTarget;
-    private linkDragFrom;
-    constructor();
-    emitLinkDragStarted(from: LinkDragFrom, item: GanttItemInternal): void;
-    emitLinkDragEntered(item: GanttItemInternal): void;
+    linkDragPath: LinkDragPath;
+    constructor(ganttUpper: GanttUpper);
+    emitLinkDragStarted(from: LinkDragPosition): void;
+    emitLinkDragEntered(to: LinkDragPosition): void;
     emitLinkDragLeaved(): void;
-    emitLinkDragEnded(): void;
+    emitLinkDragEnded(to: LinkDragPosition): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GanttDragContainer, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<GanttDragContainer>;
 }

package/gantt-upper.d.ts

@@ -5,12 +5,15 @@ import { GanttView, GanttViewOptions } from './views/view';
 import { GanttStyles } from './gantt.styles';
 import { GanttDragContainer } from './gantt-drag-container';
 import { GanttGlobalConfig } from './gantt.config';
+import { GanttLinkOptions } from './class/link';
+import { SelectionModel } from '@angular/cdk/collections';
+import { BooleanInput } from '@angular/cdk/coercion';
 import * as i0 from "@angular/core";
 export declare abstract class GanttUpper {
     protected elementRef: ElementRef<HTMLElement>;
     protected cdr: ChangeDetectorRef;
     protected ngZone: NgZone;
-    protected config: GanttGlobalConfig;
+    config: GanttGlobalConfig;
     originItems: GanttItem[];
     originGroups: GanttGroup[];
     viewType: GanttViewType;
@@ -20,7 +23,13 @@ export declare abstract class GanttUpper {
     draggable: boolean;
     styles: GanttStyles;
     viewOptions: GanttViewOptions;
+    set linkOptions(options: GanttLinkOptions);
+    get linkOptions(): GanttLinkOptions;
     disabledLoadOnScroll: boolean;
+    set selectable(value: BooleanInput);
+    get selectable(): boolean;
+    set multiple(value: BooleanInput);
+    get multiple(): boolean;
     loadOnScroll: EventEmitter<GanttLoadOnScrollEvent>;
     dragStarted: EventEmitter<GanttDragEvent<unknown>>;
     dragMoved: EventEmitter<GanttDragEvent<unknown>>;
@@ -42,7 +51,11 @@ export declare abstract class GanttUpper {
     firstChange: boolean;
     dragContainer: GanttDragContainer;
     unsubscribe$: Subject<unknown>;
+    selectionModel: SelectionModel<string>;
     private groupsMap;
+    private _selectable;
+    private _multiple;
+    private _linkOptions;
     ganttClass: boolean;
     constructor(elementRef: ElementRef<HTMLElement>, cdr: ChangeDetectorRef, ngZone: NgZone, config: GanttGlobalConfig);
     private createView;
@@ -52,6 +65,7 @@ export declare abstract class GanttUpper {
     private getViewDate;
     computeRefs(): void;
     private expandGroups;
+    private initSelectionModel;
     onInit(): void;
     onChanges(changes: SimpleChanges): void;
     onDestroy(): void;
@@ -63,7 +77,8 @@ export declare abstract class GanttUpper {
     collapseAll(): void;
     getGanttItem(id: string): GanttItemInternal;
     getGanttItems(ids: string[]): GanttItemInternal[];
+    isSelected(id: string): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<GanttUpper, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<GanttUpper, never, never, { "originItems": "items"; "originGroups": "groups"; "viewType": "viewType"; "start": "start"; "end": "end"; "showTodayLine": "showTodayLine"; "draggable": "draggable"; "styles": "styles"; "viewOptions": "viewOptions"; "disabledLoadOnScroll": "disabledLoadOnScroll"; }, { "loadOnScroll": "loadOnScroll"; "dragStarted": "dragStarted"; "dragMoved": "dragMoved"; "dragEnded": "dragEnded"; "barClick": "barClick"; }, ["barTemplate", "rangeTemplate", "itemTemplate", "groupTemplate", "groupHeaderTemplate"]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<GanttUpper, never, never, { "originItems": "items"; "originGroups": "groups"; "viewType": "viewType"; "start": "start"; "end": "end"; "showTodayLine": "showTodayLine"; "draggable": "draggable"; "styles": "styles"; "viewOptions": "viewOptions"; "linkOptions": "linkOptions"; "disabledLoadOnScroll": "disabledLoadOnScroll"; "selectable": "selectable"; "multiple": "multiple"; }, { "loadOnScroll": "loadOnScroll"; "dragStarted": "dragStarted"; "dragMoved": "dragMoved"; "dragEnded": "dragEnded"; "barClick": "barClick"; }, ["barTemplate", "rangeTemplate", "itemTemplate", "groupTemplate", "groupHeaderTemplate"]>;
 }
 export declare const GANTT_UPPER_TOKEN: InjectionToken<GanttUpper>;

package/gantt.component.d.ts

@@ -1,7 +1,7 @@
 import { OnInit, ElementRef, EventEmitter, ChangeDetectorRef, NgZone, OnChanges, OnDestroy, SimpleChanges, QueryList, AfterViewInit, TemplateRef } from '@angular/core';
 import { Observable } from 'rxjs';
 import { GanttUpper } from './gantt-upper';
-import { GanttLinkDragEvent, GanttLineClickEvent, GanttItemInternal, GanttItem } from './class';
+import { GanttLinkDragEvent, GanttLineClickEvent, GanttItemInternal, GanttItem, GanttSelectedEvent } from './class';
 import { NgxGanttTableColumnComponent } from './table/gantt-column.component';
 import { NgxGanttTableComponent } from './table/gantt-table.component';
 import { GanttGlobalConfig } from './gantt.config';
@@ -14,6 +14,7 @@ export declare class NgxGanttComponent extends GanttUpper implements OnInit, Aft
     linkDragStarted: EventEmitter<GanttLinkDragEvent<unknown>>;
     linkDragEnded: EventEmitter<GanttLinkDragEvent<unknown>>;
     lineClick: EventEmitter<GanttLineClickEvent<unknown>>;
+    selectedChange: EventEmitter<GanttSelectedEvent<unknown>>;
     table: NgxGanttTableComponent;
     columns: QueryList<NgxGanttTableColumnComponent>;
     tableEmptyTemplate: TemplateRef<any>;
@@ -24,7 +25,8 @@ export declare class NgxGanttComponent extends GanttUpper implements OnInit, Aft
     ngAfterViewInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     expandChildren(item: GanttItemInternal): void;
+    selectItem(selectEvent: GanttSelectedEvent): void;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgxGanttComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgxGanttComponent, "ngx-gantt", never, { "maxLevel": "maxLevel"; "async": "async"; "childrenResolve": "childrenResolve"; "linkable": "linkable"; }, { "linkDragStarted": "linkDragStarted"; "linkDragEnded": "linkDragEnded"; "lineClick": "lineClick"; }, ["table", "tableEmptyTemplate", "columns"], never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgxGanttComponent, "ngx-gantt", never, { "maxLevel": "maxLevel"; "async": "async"; "childrenResolve": "childrenResolve"; "linkable": "linkable"; }, { "linkDragStarted": "linkDragStarted"; "linkDragEnded": "linkDragEnded"; "lineClick": "lineClick"; "selectedChange": "selectedChange"; }, ["table", "tableEmptyTemplate", "columns"], never>;
 }

package/gantt.config.d.ts

@@ -1,3 +1,4 @@
+import { GanttLinkType, GanttLinkOptions, GanttLinkLineType } from './class/link';
 import { InjectionToken } from '@angular/core';
 export interface GanttDateFormat {
     week?: string;
@@ -9,6 +10,7 @@ export interface GanttDateFormat {
 }
 export interface GanttGlobalConfig {
     dateFormat?: GanttDateFormat;
+    linkOptions?: GanttLinkOptions;
 }
 export declare const defaultConfig: {
     dateFormat: {
@@ -19,5 +21,10 @@ export declare const defaultConfig: {
         yearMonth: string;
         yearQuarter: string;
     };
+    linkOptions: {
+        dependencyTypes: GanttLinkType[];
+        showArrow: boolean;
+        lineType: GanttLinkLineType;
+    };
 };
 export declare const GANTT_GLOBAL_CONFIG: InjectionToken<GanttGlobalConfig>;

package/main.bundle.scss

@@ -119,7 +119,12 @@ $gantt-table-header-drag-line-color: #348fe4 !default;
             border-bottom: 1px solid $gantt-border-color;
             box-sizing: border-box;
             position: relative;
+
+            &.gantt-main-item-active {
+                background-color: rgba($color: $gantt-table-header-drag-line-color, $alpha: 0.1);
+            }
         }
+
     }
 }
 
@@ -258,6 +263,13 @@ $gantt-table-header-drag-line-color: #348fe4 !default;
       &:hover {
         background-color: $gantt-container-background-color;
       }
+
+      &-active {
+        background-color: rgba($color: $gantt-table-header-drag-line-color, $alpha: 0.1);
+        &:hover {
+          background-color: rgba($color: $gantt-table-header-drag-line-color, $alpha: 0.1);
+        }
+      }
     }
 
     .gantt-expand-icon {
@@ -398,6 +410,7 @@ $gantt-table-header-drag-line-color: #348fe4 !default;
 $gantt-bar-layer-append-width: 32px;
 $gantt-bar-layer-append-height: 42px;
 $gantt-bar-link-height: 16px;
+$gantt-bar-link-handle-size: 16px;
 $gantt-bar-link-drop-border: 5px;
 
 @mixin link-handles {
@@ -541,6 +554,7 @@ $gantt-bar-link-drop-border: 5px;
         background: $gantt-bar-background-color;
         overflow: hidden;
         box-sizing: border-box;
+
         .gantt-bar-content-progress {
             position: absolute;
             left: 0;
@@ -554,7 +568,7 @@ $gantt-bar-link-drop-border: 5px;
         @include active-bar();
     }
 
-    &-link-drop {
+    &-single-drop-active {
         .gantt-bar-border {
             display: block;
         }
@@ -563,6 +577,34 @@ $gantt-bar-link-drop-border: 5px;
             box-shadow: none;
         }
     }
+
+    &-drop-active {
+        @include active-bar();
+
+        .gantt-bar-layer {
+            .link-handles {
+                .handle {
+                    width: $gantt-bar-link-handle-size + 10px;
+                    height: 100%;
+
+                    &:first-child {
+                        left: -$gantt-bar-link-handle-size - 5px;
+                    }
+
+                    &:last-child {
+                        right: -$gantt-bar-link-handle-size - 5px;
+                    }
+
+                    &:hover {
+                        .point {
+                            width: 12px;
+                            height: 12px;
+                        }
+                    }
+                }
+            }
+        }
+    }
 }
 
 .gantt-range {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worktile/gantt",
-  "version": "12.2.0-next.0",
+  "version": "12.2.1",
   "schematics": "./schematics/collection.json",
   "peerDependencies": {
     "@angular/common": "^12.0.0",