import * as momentImported from 'moment';
import { Component, ContentChild, EventEmitter, Inject, Input, Optional, Output, TemplateRef } from '@angular/core';
import { CHARTS_CONFIG } from '../../config/charts-config.contants';
import { GanttSeriesTooltipTemplateDirective } from '../../directives/gantt-templates.directive';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "ngx-bootstrap/tooltip";
const moment = momentImported;
let identifier = 0;
export class GanttChartComponent {
    constructor(config) {
        this.tooltipPlacement = 'left';
        this.maxHeight = 0;
        this.showFooter = false;
        this.showTodayIndicator = true;
        this.onSelect = new EventEmitter();
        this.identifier = `gantt-chart-${identifier++}`;
        this.locale = 'en-us';
        this.emptyMessage = 'No results found at this moment.';
        this.showingMouseIndicator = false;
        this.mouseMovingLastMonth = false;
        this.colors = [
            '#8270fa',
            '#4d5b66',
            '#4fd1a1',
            '#fe3cae',
            '#ffca22',
            '#ff9f41',
            '#5aaaff',
            '#498acb',
            '#27cfc2',
            '#ff6982',
            '#f44336',
            '#cddc39',
            '#607d8b',
            '#795548'
        ];
        Object.assign(this, config);
    }
    ngOnInit() {
        this.initData();
        this.initMonths();
        this.initTimelineSizes();
        this.initTodayIndicator();
    }
    onResize() {
        this.handleTimelineSizes();
        this.initTodayIndicator();
    }
    onSerieSelected(item, serie) {
        this.onSelect.emit({
            item,
            serie
        });
    }
    onTimelineMouseMove(event) {
        if (!this.showingMouseIndicator)
            return;
        let offset = $(`#${this.identifier} .gantt-timeline .timeline`).offset();
        this.mouseIndicatorCoordinateX = event.pageX - offset.left;
        let monthWidth = $(`#${this.identifier} .gantt-timeline .timeline .item:first-child`).children('.box:first-child').width();
        let monthIndexBeingHovered = Math.floor(this.mouseIndicatorCoordinateX / (monthWidth + 2));
        let date = new Date(this.currentYear, monthIndexBeingHovered, 1);
        let daysInMonth = moment(date).daysInMonth();
        let dayWidth = monthWidth / daysInMonth;
        let dayBeignHovered = Math.floor((this.mouseIndicatorCoordinateX - ((monthWidth + 2) * monthIndexBeingHovered)) / dayWidth) + 1;
        if (dayBeignHovered <= 0 || dayBeignHovered > daysInMonth)
            return;
        this.dateIndicator = new Date(this.currentYear, monthIndexBeingHovered, dayBeignHovered);
        this.mouseMovingLastMonth = monthIndexBeingHovered == 11;
    }
    onTimelineMouseEnter() {
        this.showingMouseIndicator = true;
    }
    onTimelineMouseLeave() {
        this.showingMouseIndicator = false;
    }
    initData() {
        if (!this.externalData || this.externalData.length == 0)
            return;
        this.internalData = new Array();
        for (let i = 0; i < this.externalData.length; i++) {
            let colorIndex = Math.round(Math.random() * (this.colors.length - 1));
            this.internalData.push({
                label: this.externalData[i].label,
                series: this.externalData[i].series.map(s => {
                    return {
                        color: s.color || this.colors[colorIndex],
                        startDate: s.startDate,
                        endDate: s.endDate,
                        data: s.data,
                        left: 0,
                        width: 0,
                        daysDiff: this.daysDiffFromSerie(s),
                        label: s.label
                    };
                })
            });
        }
    }
    daysDiffFromSerie(serie) {
        var start = moment(serie.startDate);
        var end = moment(serie.endDate);
        return end.diff(start, 'days') + 1;
    }
    monthsDiffFromSerie(serie) {
        var start = moment(serie.startDate);
        var end = moment(serie.endDate);
        return end.diff(start, 'months');
    }
    initMonths() {
        moment.locale(this.locale);
        let today = new Date();
        if (!this.currentYear) {
            this.currentYear = today.getFullYear();
        }
        let referenceDate = new Date(this.currentYear, today.getMonth(), today.getDay());
        this.dayLabel = moment.localeData().relativeTime(1, false, 'd', false).split(' ')[1];
        this.monthLabel = moment.localeData().relativeTime(1, false, 'M', false).split(' ')[1];
        this.yearLabel = moment.localeData().relativeTime(1, false, 'y', false).split(' ')[1];
        this.currentMonth = referenceDate.getMonth();
        this.months = moment.monthsShort('-MMM-');
    }
    initTimelineSizes() {
        setTimeout(() => {
            this.handleTimelineSizes();
        }, 0);
    }
    initTodayIndicator() {
        setTimeout(() => {
            let monthWidth = $(`#${this.identifier} .gantt-timeline .timeline .item:first-child`).children('.box:first-child').width();
            let referenceDate = new Date();
            let day = referenceDate.getDate();
            let month = referenceDate.getMonth() + 1;
            let firstDayWidth = monthWidth / moment(referenceDate).daysInMonth();
            this.todayIndicatorCoordinateX = ((month - 1) * monthWidth) + ((day - 1) * firstDayWidth) + ((month - 1) * 2);
        }, 0);
    }
    handleTimelineSizes() {
        if (!this.internalData || this.internalData.length == 0)
            return;
        let monthWidth = $(`#${this.identifier} .gantt-timeline .timeline .item:first-child`).children('.box:first-child').width();
        for (let i = 0; i < this.internalData.length; i++) {
            if (!this.internalData[i].series || this.internalData[i].series.length == 0)
                continue;
            for (let s = 0; s < this.internalData[i].series.length; s++) {
                let serieTotalWidth = 0;
                let day = this.internalData[i].series[s].startDate.getDate();
                let month = this.internalData[i].series[s].startDate.getMonth() + 1;
                let daysDiff = this.internalData[i].series[s].daysDiff;
                let startDate = this.internalData[i].series[s].startDate;
                let firstDayWidth = monthWidth / moment(startDate).daysInMonth();
                let monthsDiff = this.monthsDiffFromSerie(this.internalData[i].series[s]);
                for (let d = 0; d < daysDiff; d++) {
                    let date = moment(startDate).add({ days: d }).toDate();
                    let daysInMonth = moment(date).daysInMonth();
                    let dayWidth = monthWidth / daysInMonth;
                    serieTotalWidth += dayWidth;
                }
                this.internalData[i].series[s].left = ((month - 1) * monthWidth) + ((day - 1) * firstDayWidth) + ((month - 1) * 2);
                this.internalData[i].series[s].width = serieTotalWidth + (monthsDiff * 2);
            }
        }
    }
}
GanttChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GanttChartComponent, deps: [{ token: CHARTS_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
GanttChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: GanttChartComponent, selector: "gantt-chart", inputs: { externalData: ["data", "externalData"], caption: "caption", tooltipPlacement: "tooltipPlacement", maxHeight: "maxHeight", showFooter: "showFooter", showTodayIndicator: "showTodayIndicator", currentYear: "currentYear" }, outputs: { onSelect: "onSelect" }, host: { listeners: { "window:resize": "onResize()" } }, queries: [{ propertyName: "seriesTooltipTemplate", first: true, predicate: GanttSeriesTooltipTemplateDirective, descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<div id=\"{{identifier}}\" class=\"ui-gantt-chart\">\n    <div class=\"gantt-container\" *ngIf=\"internalData?.length > 0\" [ngStyle]=\"{'maxHeight.px': maxHeight > 0 ? maxHeight : 'auto'}\">\n        <div class=\"gantt-labels\">\n            <div class=\"header\">\n                <div class=\"title\">{{caption}}</div>\n                <div class=\"legends\">\n                    <span class=\"year\">{{yearLabel}}</span>\n                    <span class=\"month\">{{monthLabel}}</span>\n                </div>\n            </div>\n            <div class=\"labels\">\n                <div class=\"label\" *ngFor=\"let item of internalData\">\n                    {{item.label}}\n                </div>\n            </div>\n            <div class=\"footer\" *ngIf=\"showFooter\">\n                <div class=\"title\">{{caption}}</div>\n                <div class=\"legends\">\n                    <span class=\"month\">{{monthLabel}}</span>\n                    <span class=\"year\">{{yearLabel}}</span>\n                </div>\n            </div>\n        </div>\n        <div class=\"gantt-timeline\">\n            <div class=\"header\">\n                <div class=\"year\">{{currentYear}}</div>\n                <div class=\"months\">\n                    <div class=\"month\" *ngFor=\"let item of months\">{{item | uppercase}}</div>\n                </div>\n                <div class=\"date-indicator\" *ngIf=\"showingMouseIndicator\" [ngStyle]=\"{\n                    'left.px': mouseIndicatorCoordinateX - (mouseMovingLastMonth ? 150 : 75)\n                }\">\n                    <i class=\"fa fa-calendar\"></i> {{dateIndicator | date}}\n                </div>\n            </div>\n            <div class=\"timeline\" (mouseenter)=\"onTimelineMouseEnter()\" (mouseleave)=\"onTimelineMouseLeave()\" (mousemove)=\"onTimelineMouseMove($event)\">\n                <div class=\"item\" *ngFor=\"let item of internalData\">\n                    <div class=\"box\" *ngFor=\"let month of months\"></div>\n\n                    <div class=\"serie-container\"  *ngFor=\"let serie of item.series\">\n                        <ng-template #tooltipTemplate>\n                            <ng-container \n                                [ngTemplateOutlet]=\"seriesTooltipTemplate\"\n                                [ngTemplateOutletContext]=\"{\n                                    serie: serie,\n                                    item: item\n                                }\">\n                            </ng-container>\n                        </ng-template>\n\n                        <div class=\"serie\" \n                            [placement]=\"tooltipPlacement\"\n                            [tooltip]=\"seriesTooltipTemplate ? tooltipTemplate : null\"\n                            container=\"body\"\n                            (click)=\"onSerieSelected(item, serie)\"\n                            [ngClass]=\"{\n                                'highlighted': showingMouseIndicator && mouseIndicatorCoordinateX >= serie.left && mouseIndicatorCoordinateX <= (serie.left + serie.width)\n                            }\"\n                            [ngStyle]=\"{\n                                'backgroundColor': serie.color,\n                                'left.px': serie.left,\n                                'width.px': serie.width\n                            }\">\n                            <span class=\"text-truncate\">{{serie.label || serie.daysDiff}}</span>\n                            <div class=\"left-border\"></div>\n                            <div class=\"top-border\"></div>\n                            <div class=\"right-border\"></div>\n                            <div class=\"bottom-border\"></div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"mouse-indicator\" *ngIf=\"showingMouseIndicator\" [ngStyle]=\"{'left.px': mouseIndicatorCoordinateX}\"></div>\n                <div class=\"mouse-indicator today\" *ngIf=\"showTodayIndicator\" [ngStyle]=\"{'left.px': todayIndicatorCoordinateX}\"></div>\n            </div>\n            <div class=\"footer\" *ngIf=\"showFooter\">\n                <div class=\"months\">\n                    <div class=\"month\" *ngFor=\"let item of months\">{{item | uppercase}}</div>\n                </div>\n                <div class=\"year\">{{currentYear}}</div>\n                <div class=\"date-indicator\" *ngIf=\"showingMouseIndicator\" [ngStyle]=\"{\n                    'left.px': mouseIndicatorCoordinateX - (mouseMovingLastMonth ? 150 : 75)\n                }\">\n                    <i class=\"fa fa-calendar\"></i> {{dateIndicator | date}}\n                </div>\n            </div>\n        </div>\n    </div>\n\n    <p *ngIf=\"!internalData || internalData.length == 0\">{{emptyMessage}}</p>\n</div>\n", styles: ["@keyframes pulse{0%{opacity:.7}50%{opacity:1}to{opacity:.7}}.ui-gantt-chart{width:100%;border:1px solid #eeeeee}.ui-gantt-chart .gantt-container{display:flex;overflow-y:auto}.ui-gantt-chart .gantt-container .gantt-labels .header,.ui-gantt-chart .gantt-container .gantt-labels .footer,.ui-gantt-chart .gantt-container .gantt-timeline .header,.ui-gantt-chart .gantt-container .gantt-timeline .footer{display:flex;height:70px;box-shadow:0 .125rem .25rem #00000013}.ui-gantt-chart .gantt-container .gantt-labels .footer,.ui-gantt-chart .gantt-container .gantt-timeline .footer{box-shadow:0 -.125rem .25rem #00000013}.ui-gantt-chart .gantt-container .gantt-labels{width:300px;flex-shrink:0;position:relative}.ui-gantt-chart .gantt-container .gantt-labels .header,.ui-gantt-chart .gantt-container .gantt-labels .footer{justify-content:space-between;align-items:center;border-right:2px solid #eeeeee;padding:0 20px;background-color:#fff;position:sticky;top:0;z-index:10}.ui-gantt-chart .gantt-container .gantt-labels .header .title,.ui-gantt-chart .gantt-container .gantt-labels .footer .title{color:#717274;font-weight:600;font-size:18px}.ui-gantt-chart .gantt-container .gantt-labels .header .legends,.ui-gantt-chart .gantt-container .gantt-labels .footer .legends{text-align:right}.ui-gantt-chart .gantt-container .gantt-labels .header .legends span,.ui-gantt-chart .gantt-container .gantt-labels .footer .legends span{color:#717274;display:block;font-size:13px;font-weight:700;padding:4px 0;text-transform:capitalize}.ui-gantt-chart .gantt-container .gantt-labels .footer{top:inherit;bottom:0}.ui-gantt-chart .gantt-container .gantt-labels .labels .label{display:flex;align-items:center;font-weight:600;line-height:1.2;background-color:#f1f5f8;border-bottom:1px solid #dfe8ef;border-right:2px solid #dfe8ef;padding:0 20px;height:50px}.ui-gantt-chart .gantt-container .gantt-timeline{flex-grow:1;position:relative}.ui-gantt-chart .gantt-container .gantt-timeline .header,.ui-gantt-chart .gantt-container .gantt-timeline .footer{display:flex;flex-direction:column;justify-content:center;min-width:700px;background-color:#fff;position:sticky;top:0;z-index:10}.ui-gantt-chart .gantt-container .gantt-timeline .header .year,.ui-gantt-chart .gantt-container .gantt-timeline .footer .year{text-align:center;color:#717274;font-size:13px;font-weight:700;padding:4px 0}.ui-gantt-chart .gantt-container .gantt-timeline .header .months,.ui-gantt-chart .gantt-container .gantt-timeline .footer .months{display:flex;padding:4px 0}.ui-gantt-chart .gantt-container .gantt-timeline .header .months .month,.ui-gantt-chart .gantt-container .gantt-timeline .footer .months .month{color:#717274;text-align:center;flex-grow:1;font-size:13px;font-weight:600}.ui-gantt-chart .gantt-container .gantt-timeline .header .date-indicator,.ui-gantt-chart .gantt-container .gantt-timeline .footer .date-indicator{position:absolute;bottom:8px;background-color:#327ace;color:#fff;padding:3px 10px;border-radius:10px;border:1px solid #00559A;font-size:13px;width:150px;text-align:center;transition:left .2s ease-out}.ui-gantt-chart .gantt-container .gantt-timeline .footer{top:inherit;bottom:0}.ui-gantt-chart .gantt-container .gantt-timeline .footer .date-indicator{bottom:35px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline{position:relative;min-width:700px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item{display:flex;position:relative;transition:background-color .2s ease-in-out}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .box{flex-grow:1;transition:background-color .2s ease-in-out;border-bottom:1px solid #eeeeee;border-right:2px solid #eeeeee;height:50px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .box:last-child{border-right:0}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .box:hover{background-color:#f0f0f0}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie{cursor:pointer;position:absolute;display:flex;align-items:center;color:#fff;font-size:13px;font-weight:600;top:5px;bottom:6px;padding:0 5px;transition:opacity .3s ease-in-out,width .8s ease-out;z-index:9}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie:hover{opacity:.8}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .left-border,.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .top-border,.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .right-border,.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .bottom-border{position:absolute;background-color:#333;opacity:.5;z-index:11}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .left-border{top:2px;left:0;bottom:2px;width:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .top-border{top:0;right:0;left:0;height:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .right-border{top:2px;right:0;bottom:2px;width:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .bottom-border{bottom:0;right:0;left:0;height:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie.highlighted{animation:pulse 1s infinite ease-in-out}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item:hover{background-color:#f9f9f9}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator{position:absolute;top:0;bottom:0;width:0;border-right:1px dashed #327ACE;z-index:8;-webkit-user-select:none;user-select:none;outline:none}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator.today{border-right:1px dashed #327ACE;z-index:10}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator.today:before{content:\"\";position:absolute;top:0;left:-4.5px;width:0;height:0;z-index:8;border-top:5px solid #327ACE;border-right:5px solid transparent;border-left:5px solid transparent}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator.today:after{content:\"\";position:absolute;bottom:0;left:-4.5px;width:0;height:0;z-index:8;border-bottom:5px solid #327ACE;border-right:5px solid transparent;border-left:5px solid transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["containerClass", "tooltipAnimation", "tooltipFadeDuration", "isOpen", "tooltipHtml", "tooltip", "tooltipPlacement", "placement", "tooltipIsOpen", "tooltipEnable", "isDisabled", "tooltipAppendToBody", "container", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "delay", "tooltipTrigger", "triggers", "adaptivePosition"], outputs: ["tooltipChange", "tooltipStateChanged", "onShown", "onHidden"], exportAs: ["bs-tooltip"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GanttChartComponent, decorators: [{
            type: Component,
            args: [{ selector: 'gantt-chart', host: {
                        '(window:resize)': 'onResize()'
                    }, template: "<div id=\"{{identifier}}\" class=\"ui-gantt-chart\">\n    <div class=\"gantt-container\" *ngIf=\"internalData?.length > 0\" [ngStyle]=\"{'maxHeight.px': maxHeight > 0 ? maxHeight : 'auto'}\">\n        <div class=\"gantt-labels\">\n            <div class=\"header\">\n                <div class=\"title\">{{caption}}</div>\n                <div class=\"legends\">\n                    <span class=\"year\">{{yearLabel}}</span>\n                    <span class=\"month\">{{monthLabel}}</span>\n                </div>\n            </div>\n            <div class=\"labels\">\n                <div class=\"label\" *ngFor=\"let item of internalData\">\n                    {{item.label}}\n                </div>\n            </div>\n            <div class=\"footer\" *ngIf=\"showFooter\">\n                <div class=\"title\">{{caption}}</div>\n                <div class=\"legends\">\n                    <span class=\"month\">{{monthLabel}}</span>\n                    <span class=\"year\">{{yearLabel}}</span>\n                </div>\n            </div>\n        </div>\n        <div class=\"gantt-timeline\">\n            <div class=\"header\">\n                <div class=\"year\">{{currentYear}}</div>\n                <div class=\"months\">\n                    <div class=\"month\" *ngFor=\"let item of months\">{{item | uppercase}}</div>\n                </div>\n                <div class=\"date-indicator\" *ngIf=\"showingMouseIndicator\" [ngStyle]=\"{\n                    'left.px': mouseIndicatorCoordinateX - (mouseMovingLastMonth ? 150 : 75)\n                }\">\n                    <i class=\"fa fa-calendar\"></i> {{dateIndicator | date}}\n                </div>\n            </div>\n            <div class=\"timeline\" (mouseenter)=\"onTimelineMouseEnter()\" (mouseleave)=\"onTimelineMouseLeave()\" (mousemove)=\"onTimelineMouseMove($event)\">\n                <div class=\"item\" *ngFor=\"let item of internalData\">\n                    <div class=\"box\" *ngFor=\"let month of months\"></div>\n\n                    <div class=\"serie-container\"  *ngFor=\"let serie of item.series\">\n                        <ng-template #tooltipTemplate>\n                            <ng-container \n                                [ngTemplateOutlet]=\"seriesTooltipTemplate\"\n                                [ngTemplateOutletContext]=\"{\n                                    serie: serie,\n                                    item: item\n                                }\">\n                            </ng-container>\n                        </ng-template>\n\n                        <div class=\"serie\" \n                            [placement]=\"tooltipPlacement\"\n                            [tooltip]=\"seriesTooltipTemplate ? tooltipTemplate : null\"\n                            container=\"body\"\n                            (click)=\"onSerieSelected(item, serie)\"\n                            [ngClass]=\"{\n                                'highlighted': showingMouseIndicator && mouseIndicatorCoordinateX >= serie.left && mouseIndicatorCoordinateX <= (serie.left + serie.width)\n                            }\"\n                            [ngStyle]=\"{\n                                'backgroundColor': serie.color,\n                                'left.px': serie.left,\n                                'width.px': serie.width\n                            }\">\n                            <span class=\"text-truncate\">{{serie.label || serie.daysDiff}}</span>\n                            <div class=\"left-border\"></div>\n                            <div class=\"top-border\"></div>\n                            <div class=\"right-border\"></div>\n                            <div class=\"bottom-border\"></div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"mouse-indicator\" *ngIf=\"showingMouseIndicator\" [ngStyle]=\"{'left.px': mouseIndicatorCoordinateX}\"></div>\n                <div class=\"mouse-indicator today\" *ngIf=\"showTodayIndicator\" [ngStyle]=\"{'left.px': todayIndicatorCoordinateX}\"></div>\n            </div>\n            <div class=\"footer\" *ngIf=\"showFooter\">\n                <div class=\"months\">\n                    <div class=\"month\" *ngFor=\"let item of months\">{{item | uppercase}}</div>\n                </div>\n                <div class=\"year\">{{currentYear}}</div>\n                <div class=\"date-indicator\" *ngIf=\"showingMouseIndicator\" [ngStyle]=\"{\n                    'left.px': mouseIndicatorCoordinateX - (mouseMovingLastMonth ? 150 : 75)\n                }\">\n                    <i class=\"fa fa-calendar\"></i> {{dateIndicator | date}}\n                </div>\n            </div>\n        </div>\n    </div>\n\n    <p *ngIf=\"!internalData || internalData.length == 0\">{{emptyMessage}}</p>\n</div>\n", styles: ["@keyframes pulse{0%{opacity:.7}50%{opacity:1}to{opacity:.7}}.ui-gantt-chart{width:100%;border:1px solid #eeeeee}.ui-gantt-chart .gantt-container{display:flex;overflow-y:auto}.ui-gantt-chart .gantt-container .gantt-labels .header,.ui-gantt-chart .gantt-container .gantt-labels .footer,.ui-gantt-chart .gantt-container .gantt-timeline .header,.ui-gantt-chart .gantt-container .gantt-timeline .footer{display:flex;height:70px;box-shadow:0 .125rem .25rem #00000013}.ui-gantt-chart .gantt-container .gantt-labels .footer,.ui-gantt-chart .gantt-container .gantt-timeline .footer{box-shadow:0 -.125rem .25rem #00000013}.ui-gantt-chart .gantt-container .gantt-labels{width:300px;flex-shrink:0;position:relative}.ui-gantt-chart .gantt-container .gantt-labels .header,.ui-gantt-chart .gantt-container .gantt-labels .footer{justify-content:space-between;align-items:center;border-right:2px solid #eeeeee;padding:0 20px;background-color:#fff;position:sticky;top:0;z-index:10}.ui-gantt-chart .gantt-container .gantt-labels .header .title,.ui-gantt-chart .gantt-container .gantt-labels .footer .title{color:#717274;font-weight:600;font-size:18px}.ui-gantt-chart .gantt-container .gantt-labels .header .legends,.ui-gantt-chart .gantt-container .gantt-labels .footer .legends{text-align:right}.ui-gantt-chart .gantt-container .gantt-labels .header .legends span,.ui-gantt-chart .gantt-container .gantt-labels .footer .legends span{color:#717274;display:block;font-size:13px;font-weight:700;padding:4px 0;text-transform:capitalize}.ui-gantt-chart .gantt-container .gantt-labels .footer{top:inherit;bottom:0}.ui-gantt-chart .gantt-container .gantt-labels .labels .label{display:flex;align-items:center;font-weight:600;line-height:1.2;background-color:#f1f5f8;border-bottom:1px solid #dfe8ef;border-right:2px solid #dfe8ef;padding:0 20px;height:50px}.ui-gantt-chart .gantt-container .gantt-timeline{flex-grow:1;position:relative}.ui-gantt-chart .gantt-container .gantt-timeline .header,.ui-gantt-chart .gantt-container .gantt-timeline .footer{display:flex;flex-direction:column;justify-content:center;min-width:700px;background-color:#fff;position:sticky;top:0;z-index:10}.ui-gantt-chart .gantt-container .gantt-timeline .header .year,.ui-gantt-chart .gantt-container .gantt-timeline .footer .year{text-align:center;color:#717274;font-size:13px;font-weight:700;padding:4px 0}.ui-gantt-chart .gantt-container .gantt-timeline .header .months,.ui-gantt-chart .gantt-container .gantt-timeline .footer .months{display:flex;padding:4px 0}.ui-gantt-chart .gantt-container .gantt-timeline .header .months .month,.ui-gantt-chart .gantt-container .gantt-timeline .footer .months .month{color:#717274;text-align:center;flex-grow:1;font-size:13px;font-weight:600}.ui-gantt-chart .gantt-container .gantt-timeline .header .date-indicator,.ui-gantt-chart .gantt-container .gantt-timeline .footer .date-indicator{position:absolute;bottom:8px;background-color:#327ace;color:#fff;padding:3px 10px;border-radius:10px;border:1px solid #00559A;font-size:13px;width:150px;text-align:center;transition:left .2s ease-out}.ui-gantt-chart .gantt-container .gantt-timeline .footer{top:inherit;bottom:0}.ui-gantt-chart .gantt-container .gantt-timeline .footer .date-indicator{bottom:35px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline{position:relative;min-width:700px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item{display:flex;position:relative;transition:background-color .2s ease-in-out}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .box{flex-grow:1;transition:background-color .2s ease-in-out;border-bottom:1px solid #eeeeee;border-right:2px solid #eeeeee;height:50px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .box:last-child{border-right:0}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .box:hover{background-color:#f0f0f0}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie{cursor:pointer;position:absolute;display:flex;align-items:center;color:#fff;font-size:13px;font-weight:600;top:5px;bottom:6px;padding:0 5px;transition:opacity .3s ease-in-out,width .8s ease-out;z-index:9}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie:hover{opacity:.8}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .left-border,.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .top-border,.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .right-border,.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .bottom-border{position:absolute;background-color:#333;opacity:.5;z-index:11}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .left-border{top:2px;left:0;bottom:2px;width:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .top-border{top:0;right:0;left:0;height:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .right-border{top:2px;right:0;bottom:2px;width:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie .bottom-border{bottom:0;right:0;left:0;height:2px}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item .serie.highlighted{animation:pulse 1s infinite ease-in-out}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .item:hover{background-color:#f9f9f9}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator{position:absolute;top:0;bottom:0;width:0;border-right:1px dashed #327ACE;z-index:8;-webkit-user-select:none;user-select:none;outline:none}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator.today{border-right:1px dashed #327ACE;z-index:10}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator.today:before{content:\"\";position:absolute;top:0;left:-4.5px;width:0;height:0;z-index:8;border-top:5px solid #327ACE;border-right:5px solid transparent;border-left:5px solid transparent}.ui-gantt-chart .gantt-container .gantt-timeline .timeline .mouse-indicator.today:after{content:\"\";position:absolute;bottom:0;left:-4.5px;width:0;height:0;z-index:8;border-bottom:5px solid #327ACE;border-right:5px solid transparent;border-left:5px solid transparent}\n"] }]
        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                    type: Inject,
                    args: [CHARTS_CONFIG]
                }, {
                    type: Optional
                }] }]; }, propDecorators: { externalData: [{
                type: Input,
                args: ['data']
            }], caption: [{
                type: Input
            }], tooltipPlacement: [{
                type: Input
            }], maxHeight: [{
                type: Input
            }], showFooter: [{
                type: Input
            }], showTodayIndicator: [{
                type: Input
            }], currentYear: [{
                type: Input
            }], onSelect: [{
                type: Output
            }], seriesTooltipTemplate: [{
                type: ContentChild,
                args: [GanttSeriesTooltipTemplateDirective, { read: TemplateRef, static: true }]
            }] } });
//# sourceMappingURL=data:application/json;base64, 