@seniorsistemas/angular-components 17.8.3 → 17.8.4

package/fesm5/seniorsistemas-angular-components.js

@@ -1,5 +1,5 @@
 import { __decorate, __assign, __extends, __spread, __awaiter, __generator, __param, __values, __rest, __read } from 'tslib';
-import { EventEmitter, Input, Output, Component, ContentChildren, ViewChild, HostListener, forwardRef, NgModule, ɵɵdefineInjectable, Injectable, ElementRef, ApplicationRef, ComponentFactoryResolver, Injector, Directive, KeyValueDiffers, HostBinding, Renderer2, TemplateRef, InjectionToken, Inject, ViewEncapsulation, ViewContainerRef, ChangeDetectorRef, Pipe, ɵɵinject, Optional, ContentChild, ViewChildren } from '@angular/core';
+import { EventEmitter, Input, Output, Component, ContentChildren, ViewChild, HostListener, forwardRef, NgModule, ɵɵdefineInjectable, Injectable, ElementRef, ApplicationRef, ComponentFactoryResolver, Injector, Directive, KeyValueDiffers, HostBinding, Renderer2, TemplateRef, InjectionToken, Inject, ViewEncapsulation, ViewContainerRef, ChangeDetectorRef, Pipe, ɵɵinject, ContentChild, Optional, ViewChildren } from '@angular/core';
 import { trigger, transition, style as style$7, animate, state, group, query, animateChild } from '@angular/animations';
 import { Subject, of, from, ReplaySubject, throwError, forkJoin } from 'rxjs';
 import { takeUntil, tap, map, switchMap, catchError, first, filter, take, delay, debounceTime, repeat, finalize } from 'rxjs/operators';
@@ -50,11 +50,11 @@ import { MessageService, ConfirmationService } from 'primeng/api';
 import { ProgressBarModule as ProgressBarModule$1 } from 'primeng/progressbar';
 import { DomSanitizer } from '@angular/platform-browser';
 import { Clipboard } from '@angular/cdk/clipboard';
-import marked from 'marked';
+import { ConfirmDialogModule } from 'primeng/confirmdialog';
 import Cropper from 'cropperjs';
+import marked from 'marked';
 import { moveItemInArray, transferArrayItem, DragDropModule } from '@angular/cdk/drag-drop';
 import * as elementResizeDetectorMaker_ from 'element-resize-detector';
-import { ConfirmDialogModule } from 'primeng/confirmdialog';
 import { FocusTrapFactory, A11yModule } from '@angular/cdk/a11y';
 import { ScrollPanelModule } from 'primeng/scrollpanel';
 import { Sidebar, SidebarModule as SidebarModule$1 } from 'primeng/sidebar';
@@ -4410,6 +4410,7 @@ var FieldType;
     FieldType["Text"] = "Text";
     FieldType["TextIA"] = "TextIA";
     FieldType["Time"] = "Time";
+    FieldType["ProfilePicture"] = "ProfilePicture";
 })(FieldType || (FieldType = {}));
 
 var FieldSize = /** @class */ (function () {
@@ -5016,6 +5017,29 @@ var CountryPhonePickerField = /** @class */ (function (_super) {
     return CountryPhonePickerField;
 }(Field));
 
+var ProfilePictureField = /** @class */ (function (_super) {
+    __extends(ProfilePictureField, _super);
+    function ProfilePictureField(config) {
+        var _this = _super.call(this, config) || this;
+        _this.simpleTitle = config.simpleTitle;
+        _this.actionTitle = config.actionTitle;
+        _this.subtitle = config.subtitle;
+        _this.aspectRatio = config.aspectRatio;
+        _this.cropperLabelsConfig = config.cropperLabelsConfig;
+        _this.removeButtonLabel = config.removeButtonLabel;
+        _this.changeButtonLabel = config.changeButtonLabel;
+        _this.confirmationTexts = config.confirmationTexts;
+        _this.maxFileSize = config.maxFileSize;
+        _this.accept = config.accept;
+        _this.supportedExtensions = config.supportedExtensions;
+        _this.onChangeImage = config.onChangeImage;
+        _this.onRemovedImage = config.onRemovedImage;
+        _this.onInvalidFile = config.onInvalidFile;
+        return _this;
+    }
+    return ProfilePictureField;
+}(Field));
+
 var FormField = /** @class */ (function () {
     function FormField(config) {
         switch (config.type) {
@@ -5059,6 +5083,8 @@ var FormField = /** @class */ (function () {
                 return new BlobField(config);
             case FieldType.Slider:
                 return new SliderField(config);
+            case FieldType.ProfilePicture:
+                return new ProfilePictureField(config);
             case FieldType.Custom:
                 var CustomFieldClass = config.CustomFieldClass, otherConfigs = __rest(config, ["CustomFieldClass"]);
                 return new CustomFieldClass(otherConfigs);
@@ -9812,6 +9838,23 @@ var TextFieldComponent = /** @class */ (function (_super) {
     return TextFieldComponent;
 }(BaseFieldComponent));
 
+var ProfilePictureFieldComponent = /** @class */ (function () {
+    function ProfilePictureFieldComponent() {
+    }
+    __decorate([
+        Input()
+    ], ProfilePictureFieldComponent.prototype, "field", void 0);
+    __decorate([
+        Input()
+    ], ProfilePictureFieldComponent.prototype, "formControl", void 0);
+    ProfilePictureFieldComponent = __decorate([
+        Component({
+            template: "<s-profile-picture-picker\n    [formControl]=\"formControl\"\n    [simpleTitle]=\"field.simpleTitle\"\n    [actionTitle]=\"field.actionTitle\"\n    [subtitle]=\"field.subtitle\"\n    [aspectRatio]=\"field.aspectRatio\"\n    [cropperLabelsConfig]=\"field.cropperLabelsConfig\"\n    [removeButtonLabel]=\"field.removeButtonLabel\"\n    [changeButtonLabel]=\"field.changeButtonLabel\"\n    [confirmationTexts]=\"field.confirmationTexts\"\n    [maxFileSize]=\"field.maxFileSize\"\n    [accept]=\"field\"\n    [supportedExtensions]=\"field.supportedExtensions\"\n    (changedImage)=\"field.onChangeImage ? field.onChangeImage($event) : null\"\n    (removedImage)=\"field.onRemovedImage ? field.onRemovedImage() : null\"\n    (invalidFile)=\"field.onInvalidFile ? field.onInvalidFile($event) : null\">\n</s-profile-picture-picker>"
+        })
+    ], ProfilePictureFieldComponent);
+    return ProfilePictureFieldComponent;
+}());
+
 var DynamicForm = /** @class */ (function () {
     function DynamicForm(_a) {
         var group = _a.group, errorMessages = _a.errorMessages;
@@ -9894,6 +9937,8 @@ var DynamicField = /** @class */ (function (_super) {
                 return FileUploadComponent$1;
             case FieldType.Slider:
                 return SliderFieldComponent;
+            case FieldType.ProfilePicture:
+                return ProfilePictureFieldComponent;
             case FieldType.Custom:
                 return this.field.CustomFieldComponentClass;
             default:
@@ -10247,155 +10292,896 @@ var NumberFieldModule$1 = /** @class */ (function () {
     return NumberFieldModule;
 }());
 
-var DynamicFormModule = /** @class */ (function () {
-    function DynamicFormModule() {
+var HeaderComponent = /** @class */ (function () {
+    function HeaderComponent() {
     }
-    DynamicFormModule = __decorate([
+    HeaderComponent = __decorate([
+        Component({
+            selector: "s-header",
+            template: "<ng-content></ng-content>"
+        })
+    ], HeaderComponent);
+    return HeaderComponent;
+}());
+
+var FooterComponent = /** @class */ (function () {
+    function FooterComponent() {
+    }
+    FooterComponent = __decorate([
+        Component({
+            selector: "s-footer",
+            template: "<ng-content></ng-content>"
+        })
+    ], FooterComponent);
+    return FooterComponent;
+}());
+
+var StructureModule = /** @class */ (function () {
+    function StructureModule() {
+    }
+    StructureModule = __decorate([
         NgModule({
-            imports: [
-                AutoCompleteModule,
-                BignumberInputModule,
-                ButtonModule,
-                CalendarMaskModule,
-                CalendarModule,
-                CheckboxModule,
-                ChipsModule,
-                CommonModule,
-                ControlErrorsModule,
-                CountryPhonePickerModule,
-                DialogModule,
-                DropdownModule,
-                EmptyStateModule,
-                FormsModule,
-                HotkeyModule,
-                InputMaskModule,
-                InputTextareaModule,
-                InputTextModule,
-                KeyFilterModule,
-                LoadingStateModule,
-                LocaleModule,
-                LocalizedNumberInputModule,
-                PanelModule$1,
-                ButtonModule$1,
-                TableModule$1,
-                MultiSelectModule,
-                NumberInputModule,
-                RadioButtonModule,
-                ReactiveFormsModule,
-                TooltipModule,
-                FieldsetModule,
-                TableHeaderCheckboxModule,
-                FileUploadModule,
-                TableModule,
-                InfoSignModule,
-                MaskFormatterModule,
-                HotkeyModule.forRoot(),
-                MouseEventsModule,
-                SwitchModule,
-                PasswordStrengthModule,
-                SliderModule,
-                TranslateModule.forChild(),
-                PasswordFieldModule,
-                TextFieldModule,
-                NumberFieldModule,
-                CurrencyFieldModule,
-                NumberFieldModule$1,
-            ],
-            declarations: [
-                AutocompleteFieldComponent,
-                BooleanFieldComponent,
-                BooleanSwitchFieldComponent,
-                CalendarFieldComponent,
-                ChipsFieldComponent,
-                CountryPhonePickerFieldComponent,
-                DynamicFieldComponent,
-                DynamicFormComponent,
-                DynamicFormDirective,
-                FieldsetComponent,
-                FileUploadComponent$1,
-                LookupComponent,
-                LookupFieldComponent,
-                RadioButtonComponent,
-                RowComponent,
-                SectionComponent,
-                SelectFieldComponent,
-                SliderFieldComponent,
-                TextAreaFieldComponent,
-                TextAreaIAFieldComponent,
-            ],
-            exports: [DynamicFormComponent, LookupComponent],
-            entryComponents: [
-                AutocompleteFieldComponent,
-                BooleanFieldComponent,
-                BooleanSwitchFieldComponent,
-                CalendarFieldComponent,
-                ChipsFieldComponent,
-                CountryPhonePickerFieldComponent,
-                FieldsetComponent,
-                FileUploadComponent$1,
-                LookupFieldComponent,
-                RadioButtonComponent,
-                RowComponent,
-                SectionComponent,
-                SelectFieldComponent,
-                SliderFieldComponent,
-                TextAreaFieldComponent,
-                TextAreaIAFieldComponent,
-            ],
-            providers: [
-                HotkeysService,
-                IAssistService,
-            ]
+            imports: [CommonModule],
+            declarations: [HeaderComponent, FooterComponent],
+            exports: [HeaderComponent, FooterComponent],
         })
-    ], DynamicFormModule);
-    return DynamicFormModule;
+    ], StructureModule);
+    return StructureModule;
 }());
 
-var CustomFieldsService = /** @class */ (function () {
-    function CustomFieldsService(http) {
-        this.http = http;
+var ImageCropperComponent = /** @class */ (function () {
+    function ImageCropperComponent() {
+        this.id = "s-image-cropper-" + ImageCropperComponent_1.nextId++;
+        this.visible = false;
+        this.header = "Recortar imagem";
+        this.cropLabel = "Recortar";
+        this.selectAnotherLabel = "Trocar";
+        this.removeLabel = "Remover";
+        this.cancelLabel = "Cancelar";
+        this.emptyStateTitle = "Selecione uma foto, em seguida você poderá ajustá-la";
+        this.emptyStateActionLabel = "Escolher imagem";
+        this.emptyStateIconClass = "fa fa-picture-o";
+        this.aspectRatio = NaN;
+        this.rounded = false;
+        this.allowSelectAnother = true;
+        this.allowRemove = true;
+        this.allowCancel = true;
+        this.visibleChange = new EventEmitter();
+        this.changeImage = new EventEmitter();
+        this.croppedImage = new EventEmitter();
+        this.croppedCanvas = new EventEmitter();
+        this.removedImage = new EventEmitter();
+        this.cancel = new EventEmitter();
     }
-    CustomFieldsService.prototype.getCustomFields = function (domain, service, entity, endpoint) {
-        var entityDto = { entityId: { domain_: domain, service_: service, id: entity } };
-        return this.http.post(endpoint, entityDto);
+    ImageCropperComponent_1 = ImageCropperComponent;
+    ImageCropperComponent.prototype.ngOnInit = function () {
+        if (this.imageSource)
+            this.initCropper();
     };
-    CustomFieldsService.prototype.getFileLocationUrl = function (dto, endpoint) {
-        return this.http.post(endpoint, dto);
+    ImageCropperComponent.prototype.ngOnChanges = function (changes) {
+        if (changes.imageSource && changes.imageSource.currentValue) {
+            this.initCropper();
+        }
     };
-    CustomFieldsService.prototype.uploadTempFile = function (location, file) {
-        return this.http.put(location, file, {
-            reportProgress: true,
-            observe: "events",
-            headers: { "Content-Type": file.type }
+    ImageCropperComponent.prototype.initCropper = function () {
+        if (this.cropper) {
+            this.cropper.destroy();
+        }
+        this.image.nativeElement.src = this.imageSource;
+        this.cropper = new Cropper(this.image.nativeElement, {
+            aspectRatio: this.rounded ? 1 : this.aspectRatio,
+            guides: false,
+            dragMode: "move",
+            minCropBoxHeight: 2,
+            minCropBoxWidth: 2,
+            toggleDragModeOnDblclick: false,
         });
     };
-    CustomFieldsService.prototype.requestAccess = function (objectId, endpoint) {
-        return this.http.post(endpoint, { objectId: objectId });
+    ImageCropperComponent.prototype.getRoundedCanvas = function (sourceCanvas) {
+        var canvas = document.createElement("canvas");
+        var context = canvas.getContext("2d");
+        var width = sourceCanvas.width;
+        var height = sourceCanvas.height;
+        canvas.width = width;
+        canvas.height = height;
+        context.imageSmoothingEnabled = true;
+        context.drawImage(sourceCanvas, 0, 0, width, height);
+        context.globalCompositeOperation = "destination-in";
+        context.beginPath();
+        context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);
+        context.fill();
+        return canvas;
     };
-    CustomFieldsService.prototype.getFile = function (permanentUrl) {
-        return this.http.get(permanentUrl, { responseType: "blob" });
+    ImageCropperComponent.prototype.onCropImage = function () {
+        if (!this.imageSource) {
+            this.croppedImage.emit();
+            this.croppedCanvas.emit();
+        }
+        else {
+            var _croppedCanvas = this.rounded ? this.getRoundedCanvas(this.cropper.getCroppedCanvas()) : this.cropper.getCroppedCanvas();
+            this.croppedCanvas.emit(_croppedCanvas);
+            this.croppedImage.emit(_croppedCanvas.toDataURL());
+        }
+        this.visibleChange.emit(false);
     };
-    CustomFieldsService.ctorParameters = function () { return [
-        { type: HttpClient }
-    ]; };
-    CustomFieldsService = __decorate([
-        Injectable()
-    ], CustomFieldsService);
-    return CustomFieldsService;
-}());
-
-var CustomFieldType;
-(function (CustomFieldType) {
-    CustomFieldType["String"] = "String";
-    CustomFieldType["Boolean"] = "Boolean";
-    CustomFieldType["Integer"] = "Integer";
-    CustomFieldType["Double"] = "Double";
-    CustomFieldType["Date"] = "Date";
-    CustomFieldType["DateTime"] = "DateTime";
-    CustomFieldType["LocalDateTime"] = "LocalDateTime";
-    CustomFieldType["Time"] = "Time";
-    CustomFieldType["Money"] = "Money";
-    CustomFieldType["Blob"] = "Blob";
+    ImageCropperComponent.prototype.onChangeImage = function () {
+        this.changeImage.emit();
+    };
+    ImageCropperComponent.prototype.onRemoveImage = function () {
+        this.imageSource = undefined;
+        this.removedImage.emit();
+    };
+    ImageCropperComponent.prototype.onCancel = function () {
+        this.visibleChange.emit(false);
+        this.cancel.emit();
+    };
+    ImageCropperComponent.prototype.onModalVisibleChange = function (visible) {
+        if (!visible)
+            this.onCancel();
+        this.visibleChange.emit(visible);
+    };
+    var ImageCropperComponent_1;
+    ImageCropperComponent.nextId = 0;
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "id", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "visible", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "header", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "cropLabel", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "selectAnotherLabel", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "removeLabel", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "cancelLabel", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "emptyStateTitle", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "emptyStateActionLabel", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "emptyStateIconClass", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "aspectRatio", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "rounded", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "allowSelectAnother", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "allowRemove", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "allowCancel", void 0);
+    __decorate([
+        Input()
+    ], ImageCropperComponent.prototype, "imageSource", void 0);
+    __decorate([
+        Output()
+    ], ImageCropperComponent.prototype, "visibleChange", void 0);
+    __decorate([
+        Output()
+    ], ImageCropperComponent.prototype, "changeImage", void 0);
+    __decorate([
+        Output()
+    ], ImageCropperComponent.prototype, "croppedImage", void 0);
+    __decorate([
+        Output()
+    ], ImageCropperComponent.prototype, "croppedCanvas", void 0);
+    __decorate([
+        Output()
+    ], ImageCropperComponent.prototype, "removedImage", void 0);
+    __decorate([
+        Output()
+    ], ImageCropperComponent.prototype, "cancel", void 0);
+    __decorate([
+        ViewChild("image", { static: true })
+    ], ImageCropperComponent.prototype, "image", void 0);
+    __decorate([
+        ContentChild(HeaderComponent, { static: true })
+    ], ImageCropperComponent.prototype, "headerSection", void 0);
+    __decorate([
+        ContentChild(FooterComponent, { static: true })
+    ], ImageCropperComponent.prototype, "footerSection", void 0);
+    ImageCropperComponent = ImageCropperComponent_1 = __decorate([
+        Component({
+            selector: "s-image-cropper",
+            template: "<div [id]=\"id\">\n    <p-dialog\n        styleClass=\"s-image-cropper {{rounded ? 's-image-cropper--rounded' : ''}}\"\n        [header]=\"headerSection ? '' : header\"\n        [visible]=\"visible\"\n        (visibleChange)=\"onModalVisibleChange($event)\"\n        [modal]=\"true\"\n        [blockScroll]=\"true\"\n        [draggable]=\"false\"\n        [resizable]=\"false\"\n        [closeOnEscape]=\"allowCancel\"\n        [closable]=\"allowCancel\"\n        appendTo=\"body\">\n\n        <p-header *ngIf=\"headerSection\">\n            <ng-content select=\"s-header\"></ng-content>\n        </p-header>\n\n        <s-empty-state\n            [id]=\"id + '-empty-state'\"\n            *ngIf=\"!imageSource\"\n            [title]=\"emptyStateTitle\"\n            [iconClass]=\"emptyStateIconClass\"\n            [primaryActionLabel]=\"emptyStateActionLabel\"\n            (primaryAction)=\"onChangeImage()\">\n        </s-empty-state>\n\n        <div [attr.data-hidden]=\"!imageSource\" class=\"image-container\">\n            <img\n                [id]=\"id + '-cropper'\"\n                #image\n                [src]=\"imageSource || ''\"\n                alt=\"cropped image\"/>\n        </div>\n\n        <p-footer>\n            <div class=\"ui-fluid\" *ngIf=\"!footerSection\">\n                <div class=\"ui-g button-container\">\n\n                    <div *ngIf=\"allowCancel\" class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-cancel-button'\"\n                            type=\"button\"\n                            priority=\"link\"\n                            [label]=\"cancelLabel\"\n                            (onClick)=\"onCancel()\">\n                        </s-button>\n                    </div>\n\n                    <div *ngIf=\"imageSource && allowRemove\" class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-remove-button'\"\n                            type=\"button\"\n                            priority=\"secondary\"\n                            [label]=\"removeLabel\"\n                            (onClick)=\"onRemoveImage()\">\n                        </s-button>\n                    </div>\n\n                    <div *ngIf=\"imageSource && allowSelectAnother\" class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-select-another-button'\"\n                            type=\"button\"\n                            priority=\"secondary\"\n                            [label]=\"selectAnotherLabel\"\n                            (onClick)=\"onChangeImage()\">\n                        </s-button>\n                    </div>\n\n                    <div class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-crop-button'\"\n                            type=\"button\"\n                            [label]=\"cropLabel\"\n                            (onClick)=\"onCropImage()\">\n                        </s-button>\n                    </div>\n                </div>\n            </div>\n\n            <ng-content select=\"s-footer\" *ngIf=\"footerSection\"></ng-content>\n        </p-footer>\n    </p-dialog>\n</div>",
+            encapsulation: ViewEncapsulation.None,
+            styles: ["/*!\n * Cropper.js v1.6.2\n * https://fengyuanchen.github.io/cropperjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2024-04-21T07:43:02.731Z\n */.cropper-container{-webkit-touch-callout:none;direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{bottom:0;left:0;position:absolute;right:0;top:0}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:rgba(51,153,255,.75) solid 1px;overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:\" \";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media (min-width:768px){.cropper-point.point-se{height:15px;width:15px}}@media (min-width:992px){.cropper-point.point-se{height:10px;width:10px}}@media (min-width:1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:\" \";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}", ".s-image-cropper{border-radius:0!important;height:80%!important;max-width:100%!important;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:column;flex-direction:column}.s-image-cropper .ui-dialog-content{overflow:hidden;height:auto!important;-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.s-image-cropper .ui-dialog-footer,.s-image-cropper .ui-dialog-header{-ms-flex-negative:0;flex-shrink:0;direction:ltr}.s-image-cropper .image-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:100%}.s-image-cropper img{max-width:100%;max-height:100%}.s-image-cropper .button-container{-ms-flex-flow:wrap-reverse;flex-flow:wrap-reverse;-ms-flex-pack:end;justify-content:flex-end}.s-image-cropper .cropper-view-box{outline:#fff dashed 2px}.s-image-cropper .cropper-line{opacity:0}.s-image-cropper .cropper-point{background-color:#fff;opacity:1;height:15px;width:15px;border-radius:50%}.s-image-cropper .cropper-point.point-e{right:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-n{top:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-w{left:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-s{bottom:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-ne{right:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-nw{left:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-sw{left:-8.5px;bottom:-8.5px}.s-image-cropper .cropper-point.point-se{right:-8.5px;bottom:-8.5px}.s-image-cropper--rounded .cropper-face,.s-image-cropper--rounded .cropper-view-box{border-radius:50%}.s-image-cropper--rounded .cropper-view-box{outline:rgba(255,255,255,.3) dashed 1px}.s-image-cropper--rounded .cropper-view-box:after{border:2px dashed #fff;border-radius:50%;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}@media (max-width:767px){.s-image-cropper{border:none!important;top:0!important;left:0!important;width:100%!important;height:100%!important}}@media (min-width:768px){.s-image-cropper{width:80%!important}}@media (min-width:1200px){.s-image-cropper{width:60%!important}}"]
+        })
+    ], ImageCropperComponent);
+    return ImageCropperComponent;
+}());
+
+var ImageCropperModule = /** @class */ (function () {
+    function ImageCropperModule() {
+    }
+    ImageCropperModule = __decorate([
+        NgModule({
+            imports: [CommonModule, DialogModule, ButtonModule, EmptyStateModule, StructureModule],
+            declarations: [ImageCropperComponent],
+            exports: [ImageCropperComponent, StructureModule],
+            entryComponents: [ImageCropperComponent],
+        })
+    ], ImageCropperModule);
+    return ImageCropperModule;
+}());
+
+var ImageCropperService = /** @class */ (function () {
+    function ImageCropperService(componentFactoryResolver, appRef, injector) {
+        this.componentFactoryResolver = componentFactoryResolver;
+        this.appRef = appRef;
+        this.injector = injector;
+    }
+    ImageCropperService.prototype.show = function (config) {
+        var _this = this;
+        if (this.activeCropper)
+            this.destroy(this.activeCropper);
+        var activeCropper = {
+            componentRef: this.componentFactoryResolver.resolveComponentFactory(ImageCropperComponent).create(this.injector),
+            ngUnsubscribe: new Subject(),
+        };
+        this.activeCropper = activeCropper;
+        this.appRef.attachView(activeCropper.componentRef.hostView);
+        var domElem = activeCropper.componentRef.hostView.rootNodes[0];
+        document.body.appendChild(domElem);
+        this.configureInstance(activeCropper, config);
+        activeCropper.componentRef.instance.visible = true;
+        activeCropper.componentRef.instance.visibleChange
+            .pipe(takeUntil(this.activeCropper.ngUnsubscribe), delay(1000))
+            .subscribe(function (visible) {
+            if (!visible)
+                _this.destroy(activeCropper);
+        });
+    };
+    ImageCropperService.prototype.configureInstance = function (activeCropper, config) {
+        var instance = activeCropper.componentRef.instance;
+        if (config) {
+            Object.keys(config).forEach(function (key) {
+                var value = config[key];
+                if (typeof value !== "function")
+                    instance[key] = value;
+                else if (typeof value === "function") {
+                    instance[key].pipe(takeUntil(activeCropper.ngUnsubscribe)).subscribe(function () {
+                        var param = [];
+                        for (var _i = 0; _i < arguments.length; _i++) {
+                            param[_i] = arguments[_i];
+                        }
+                        return config[key].apply(config, __spread(param));
+                    });
+                }
+            });
+        }
+        instance.visibleChange.pipe(takeUntil(activeCropper.ngUnsubscribe)).subscribe(function (visible) { return (instance.visible = visible); });
+    };
+    ImageCropperService.prototype.destroy = function (activeCropper) {
+        activeCropper.ngUnsubscribe.next();
+        activeCropper.ngUnsubscribe.complete();
+        this.appRef.detachView(activeCropper.componentRef.hostView);
+        activeCropper.componentRef.destroy();
+    };
+    ImageCropperService.ctorParameters = function () { return [
+        { type: ComponentFactoryResolver },
+        { type: ApplicationRef },
+        { type: Injector }
+    ]; };
+    ImageCropperService = __decorate([
+        Injectable()
+    ], ImageCropperService);
+    return ImageCropperService;
+}());
+
+var ThumbnailSize;
+(function (ThumbnailSize) {
+    ThumbnailSize["Small"] = "small";
+    ThumbnailSize["Medium"] = "medium";
+    ThumbnailSize["Large"] = "large";
+})(ThumbnailSize || (ThumbnailSize = {}));
+
+var ThumbnailService = /** @class */ (function () {
+    function ThumbnailService() {
+    }
+    ThumbnailService.prototype.getBinaryFile = function (img) {
+        var _this = this;
+        return new Promise(function (resolve) {
+            var getOrientation = _this.getOrientation.bind(_this);
+            var http = new XMLHttpRequest();
+            http.addEventListener("load", function () {
+                if (http.readyState === 4 && (http.status == 200 || http.status === 0)) {
+                    var orientation_1 = getOrientation(http.response);
+                    http = null;
+                    resolve(orientation_1);
+                }
+            });
+            http.addEventListener("error", function () {
+                http = null;
+                throw new Error("Não foi possível carregar a imagem");
+            });
+            http.open("GET", img.src, true);
+            http.responseType = "arraybuffer";
+            http.send(null);
+        });
+    };
+    /**
+     * Retorna a tag da orientação EXIF {-1} Não definido, {-2} Não é formato JPEG, {1, 2, 3, 4, 5, 6, 7, 8} valores da orientação.
+     */
+    ThumbnailService.prototype.getOrientation = function (file) {
+        var view = new DataView(file);
+        if (view.getUint16(0, false) != 0xffd8)
+            return -2; // not jpeg
+        var length = view.byteLength;
+        var offset = 2;
+        while (offset < length) {
+            var marker = view.getUint16(offset, false);
+            offset += 2;
+            if (marker == 0xffe1) {
+                if (view.getUint32((offset += 2), false) != 0x45786966) {
+                    return -1; // not defined
+                }
+                var little = view.getUint16((offset += 6), false) == 0x4949;
+                offset += view.getUint32(offset + 4, little);
+                var tags = view.getUint16(offset, little);
+                offset += 2;
+                for (var i = 0; i < tags; i++)
+                    if (view.getUint16(offset + i * 12, little) == 0x0112)
+                        return view.getUint16(offset + i * 12 + 8, little);
+                // tslint:disable-next-line: no-bitwise
+            }
+            else if ((marker & 0xff00) != 0xff00)
+                break;
+            else
+                offset += view.getUint16(offset, false);
+        }
+        return -1; // not defined
+    };
+    ThumbnailService = __decorate([
+        Injectable()
+    ], ThumbnailService);
+    return ThumbnailService;
+}());
+
+var ThumbnailComponent = /** @class */ (function () {
+    function ThumbnailComponent(thumbnailService) {
+        this.thumbnailService = thumbnailService;
+        this.fallback = false;
+        this.id = "s-thumbnail-" + ThumbnailComponent_1.nextId++;
+        this.size = ThumbnailSize.Medium;
+        this.iconClass = "far fa-image";
+        this.hasAction = false;
+        this.actionIconClass = "fas fa-camera";
+        this.isTile = false;
+        this.isBrand = false;
+        this.ngUnsubscribe = new Subject();
+    }
+    ThumbnailComponent_1 = ThumbnailComponent;
+    ThumbnailComponent.prototype.ngOnDestroy = function () {
+        this.ngUnsubscribe.next();
+        this.ngUnsubscribe.complete();
+    };
+    ThumbnailComponent.prototype.ngAfterViewInit = function () {
+        var _this = this;
+        if (this.imgEl) {
+            this.imgEl.nativeElement.addEventListener("load", function () {
+                from(_this.thumbnailService.getBinaryFile(_this.imgEl.nativeElement))
+                    .pipe(takeUntil(_this.ngUnsubscribe))
+                    .subscribe(function (orientation) { return (_this.orientation = orientation); });
+            });
+        }
+    };
+    var ThumbnailComponent_1;
+    ThumbnailComponent.nextId = 0;
+    ThumbnailComponent.ctorParameters = function () { return [
+        { type: ThumbnailService }
+    ]; };
+    __decorate([
+        ViewChild("img", { static: false })
+    ], ThumbnailComponent.prototype, "imgEl", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "id", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "size", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "imageSource", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "imageFallback", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "imageAlt", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "iconClass", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "hasAction", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "actionIconClass", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "isTile", void 0);
+    __decorate([
+        Input()
+    ], ThumbnailComponent.prototype, "isBrand", void 0);
+    ThumbnailComponent = ThumbnailComponent_1 = __decorate([
+        Component({
+            selector: "s-thumbnail",
+            template: "<div\n    [id]=\"id\"\n    class=\"thumbnail-container thumbnail-container--{{size}}\"\n    [ngClass]=\"{\n        'thumbnail-container--with-action': hasAction,\n        'thumbnail-container--brand': isBrand\n    }\">\n    <div\n        [id]=\"id + '-image-container'\"\n        *ngIf=\"imageSource || imageFallback\"\n        class=\"image-container\"\n        [ngClass]=\"{\n            'image-container--rounded': !isBrand\n        }\">\n        <img\n            #img\n            [id]=\"id + '-image'\"\n            (error)=\"fallback = true\"\n            [src]=\"imageSource\"\n            [alt]=\"imageAlt\"\n            *ngIf=\"!fallback\"\n            [ngClass]=\"{\n                'smallThumbnail': isTile,\n                'exif-orientation-2': orientation == 2,\n                'exif-orientation-3': orientation == 3,\n                'exif-orientation-4': orientation == 4,\n                'exif-orientation-5': orientation == 5,\n                'exif-orientation-6': orientation == 6,\n                'exif-orientation-7': orientation == 7,\n                'exif-orientation-8': orientation == 8\n            }\"/>\n\n        <img\n            #img\n            [id]=\"id + '-image-fallback'\"\n            (error)=\"imageFallback = undefined\"\n            [src]=\"imageFallback\"\n            [alt]=\"imageAlt\"\n            *ngIf=\"fallback && imageFallback\"\n            [ngClass]=\"{\n                'smallThumbnail': isTile,\n                'exif-orientation-2': orientation == 2,\n                'exif-orientation-3': orientation == 3,\n                'exif-orientation-4': orientation == 4,\n                'exif-orientation-5': orientation == 5,\n                'exif-orientation-6': orientation == 6,\n                'exif-orientation-7': orientation == 7,\n                'exif-orientation-8': orientation == 8\n            }\"/>\n\n        <i\n            *ngIf=\"fallback && !imageFallback\"\n            ngClass=\"far fa-image\"\n            class=\"fallback-img-color\">\n        </i>\n    </div>\n    <div\n        [id]=\"id + '-action-icon-container'\"\n        *ngIf=\"hasAction\"\n        class=\"action-icon-container action-icon-container--{{size}}\">\n        <span\n            [id]=\"id + '-action-icon'\"\n            [class]=\"actionIconClass\"\n            aria-hidden=\"true\">\n        </span>\n    </div>\n    <div\n        [id]=\"id + '-icon-container'\"\n        *ngIf=\"!imageSource && !imageFallback\"\n        class=\"icon-container icon-container--{{size}}\"\n        [ngClass]=\"{'image-container--rounded': !isBrand}\">\n        <span\n            [id]=\"id + '-icon'\"\n            [class]=\"iconClass\"\n            aria-hidden=\"true\">\n        </span>\n    </div>\n\n    <ng-content></ng-content>\n</div>\n",
+            styles: [":host{display:inline-block}.thumbnail-container{color:#fff;position:relative;text-align:center}.thumbnail-container--large{font-size:50px;height:100px;width:100px}.thumbnail-container--large.thumbnail-container--brand{width:200px}.thumbnail-container--medium{font-size:40px;height:70px;width:70px}.thumbnail-container--medium.thumbnail-container--brand{width:140px}.thumbnail-container--small{font-size:22px;height:40px;width:40px}.thumbnail-container--small.thumbnail-container--brand{width:80px}.thumbnail-container--with-action{cursor:pointer}.action-icon-container{background-color:#428bca;border-radius:50%;bottom:0;position:absolute;right:0}.action-icon-container--large,.action-icon-container--medium{font-size:10pt;height:25px;padding:3px;width:25px}.action-icon-container--small{font-size:6pt;height:16px;padding:2px;width:16px}.icon-container,.image-container{-ms-flex-align:center;align-items:center;height:100%;overflow:hidden;width:100%}.icon-container--rounded,.image-container--rounded{border-radius:50%}.smallThumbnail{height:40px!important}.icon-container{background-color:#ccc;color:#fff}.icon-container--large{line-height:98px}.icon-container--medium{line-height:68px}.icon-container--small{line-height:38px}.image-container{-ms-flex-align:center;align-items:center;background-color:#ccc;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.image-container img{width:100%}.image-container img.exif-orientation-2{transform:rotateY(180deg)}.image-container img.exif-orientation-3{transform:rotate(180deg)}.image-container img.exif-orientation-4{transform:rotate(180deg) rotateY(180deg)}.image-container img.exif-orientation-5{transform:rotate(270deg) rotateY(180deg)}.image-container img.exif-orientation-6{transform:rotate(90deg)}.image-container img.exif-orientation-7{transform:rotate(90deg) rotateY(180deg)}.image-container img.exif-orientation-8{transform:rotate(270deg)}.fallback-img-color{color:#fff}"]
+        })
+    ], ThumbnailComponent);
+    return ThumbnailComponent;
+}());
+
+var ThumbnailModule = /** @class */ (function () {
+    function ThumbnailModule() {
+    }
+    ThumbnailModule = __decorate([
+        NgModule({
+            imports: [CommonModule],
+            declarations: [ThumbnailComponent],
+            exports: [ThumbnailComponent],
+            providers: [ThumbnailService],
+        })
+    ], ThumbnailModule);
+    return ThumbnailModule;
+}());
+
+var FileValidation;
+(function (FileValidation) {
+    FileValidation["MaxFileSize"] = "maxFileSize";
+    FileValidation["MaxFileLimit"] = "maxFileLimit";
+    FileValidation["TypeInvalid"] = "typeInvalid";
+    FileValidation["UnsupportedExtension"] = "unsupportedExtension";
+})(FileValidation || (FileValidation = {}));
+
+var ProfilePicturePickerComponent = /** @class */ (function () {
+    function ProfilePicturePickerComponent(imageCropperService, confirmationService, translateService) {
+        this.imageCropperService = imageCropperService;
+        this.confirmationService = confirmationService;
+        this.translateService = translateService;
+        this.aspectRatio = 1;
+        this.confirmationTexts = {
+            removalHeader: this.translateService.instant("platform.angular_components.remove_image"),
+            removalMessage: this.translateService.instant("platform.angular_components.confirmation_remove_image"),
+            removalAcceptLabel: this.translateService.instant("platform.angular_components.remove"),
+            removalRejectLabel: this.translateService.instant("platform.angular_components.cancel"),
+        };
+        this.supportedExtensions = [];
+        this.changedImage = new EventEmitter();
+        this.removedImage = new EventEmitter();
+        this.invalidFile = new EventEmitter();
+    }
+    ProfilePicturePickerComponent_1 = ProfilePicturePickerComponent;
+    ProfilePicturePickerComponent.prototype.writeValue = function (value) {
+        this._value = value;
+    };
+    ProfilePicturePickerComponent.prototype.registerOnChange = function (onChange) {
+        this._onChange = onChange;
+    };
+    ProfilePicturePickerComponent.prototype.registerOnTouched = function (onTouched) {
+        this._onTouched = onTouched;
+    };
+    ProfilePicturePickerComponent.prototype.ngOnInit = function () {
+        this._normalizeSuportedExtensions();
+    };
+    ProfilePicturePickerComponent.prototype.onDragOver = function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+    };
+    ProfilePicturePickerComponent.prototype.onDragLeave = function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+    };
+    ProfilePicturePickerComponent.prototype.onDrop = function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+        var files = [];
+        var dataTransferFiles = event.dataTransfer.files;
+        for (var i = 0; i < dataTransferFiles.length; i++) {
+            files.push(dataTransferFiles.item(i));
+        }
+        this._showImageCropper(files);
+    };
+    // Verificando o redimensionamento para ajustar o design para ficar responsivo.
+    ProfilePicturePickerComponent.prototype.onResize = function () {
+        if (this.uploadPicture && this.info && this.thumbnail) {
+            var uploadPictureWidth = this._getWidthElement(this.uploadPicture);
+            var infoWidth = this._getWidthElement(this.info);
+            var thumbnailWidth = this._getWidthElement(this.thumbnail);
+            if (thumbnailWidth + infoWidth > uploadPictureWidth) {
+                this.uploadPicture.nativeElement.classList.add("upload-picture--small");
+            }
+            else {
+                this.uploadPicture.nativeElement.classList.remove("upload-picture--small");
+            }
+        }
+    };
+    ProfilePicturePickerComponent.prototype.selectPhoto = function () {
+        var fileInputElement = this.fileInput.nativeElement;
+        fileInputElement.value = "";
+        fileInputElement.click();
+    };
+    ProfilePicturePickerComponent.prototype.removePhoto = function () {
+        var _this = this;
+        this.confirmationService.confirm({
+            message: this.confirmationTexts.removalMessage,
+            acceptLabel: this.confirmationTexts.removalAcceptLabel,
+            rejectLabel: this.confirmationTexts.removalRejectLabel,
+            header: this.confirmationTexts.removalHeader,
+            accept: function () {
+                var fileInputElement = _this.fileInput.nativeElement;
+                fileInputElement.value = "";
+                _this.image = "";
+                _this.removedImage.emit();
+            },
+        });
+    };
+    ProfilePicturePickerComponent.prototype.photoSelected = function (event) {
+        this._showImageCropper(event.srcElement.files);
+    };
+    ProfilePicturePickerComponent.prototype._showImageCropper = function (files) {
+        var _this = this;
+        if (!this._validateData(files)) {
+            return;
+        }
+        var file = files[0];
+        var fileReader = new FileReader();
+        fileReader.readAsDataURL(file);
+        fileReader.onloadend = function (fileEvent) {
+            _this.imageCropperService.show(__assign({ imageSource: fileEvent.target.result, croppedImage: function (image) {
+                    _this.image = image;
+                    _this.changedImage.emit(image);
+                    _this._value = { sourceFile: file, base64: image };
+                    _this._onChange(_this._value);
+                }, changeImage: function () { return _this.selectPhoto(); }, allowSelectAnother: false, aspectRatio: _this.aspectRatio }, _this.cropperLabelsConfig));
+        };
+    };
+    ProfilePicturePickerComponent.prototype._normalizeSuportedExtensions = function () {
+        var _a;
+        this.supportedExtensions = (_a = this.supportedExtensions) === null || _a === void 0 ? void 0 : _a.map(function (extension) { return extension.replace(".", "").toLocaleLowerCase(); });
+    };
+    ProfilePicturePickerComponent.prototype._validateData = function (files) {
+        if (!files.length) {
+            return false;
+        }
+        if (files.length > 1) {
+            this.invalidFile.emit({ file: null, validation: FileValidation.MaxFileLimit });
+            return false;
+        }
+        var file = files[0];
+        if (!file.type.includes("image")) {
+            this.invalidFile.emit({ file: file, validation: FileValidation.TypeInvalid });
+            return false;
+        }
+        if (!this._validateFileExtension(file)) {
+            this.invalidFile.emit({ file: file, validation: FileValidation.UnsupportedExtension });
+            return false;
+        }
+        if (!this._validateFileSize(file)) {
+            this.invalidFile.emit({ file: file, validation: FileValidation.MaxFileSize });
+            return false;
+        }
+        return true;
+    };
+    ProfilePicturePickerComponent.prototype._validateFileExtension = function (file) {
+        var _a;
+        if ((_a = this.supportedExtensions) === null || _a === void 0 ? void 0 : _a.length) {
+            var extension = file.name.split(".").pop().toLowerCase();
+            return this.supportedExtensions.includes(extension);
+        }
+        return true;
+    };
+    ProfilePicturePickerComponent.prototype._validateFileSize = function (file) {
+        if (this.maxFileSize) {
+            return file.size > this.maxFileSize;
+        }
+        return true;
+    };
+    ProfilePicturePickerComponent.prototype._getWidthElement = function (element) {
+        var _a = element.nativeElement.getBoundingClientRect(), left = _a.left, right = _a.right;
+        return right - left;
+    };
+    var ProfilePicturePickerComponent_1;
+    ProfilePicturePickerComponent.ctorParameters = function () { return [
+        { type: ImageCropperService },
+        { type: ConfirmationService },
+        { type: TranslateService }
+    ]; };
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "simpleTitle", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "actionTitle", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "subtitle", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "aspectRatio", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "cropperLabelsConfig", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "removeButtonLabel", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "changeButtonLabel", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "confirmationTexts", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "maxFileSize", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "accept", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "supportedExtensions", void 0);
+    __decorate([
+        Input()
+    ], ProfilePicturePickerComponent.prototype, "image", void 0);
+    __decorate([
+        ViewChild("uploadPicture")
+    ], ProfilePicturePickerComponent.prototype, "uploadPicture", void 0);
+    __decorate([
+        ViewChild("info")
+    ], ProfilePicturePickerComponent.prototype, "info", void 0);
+    __decorate([
+        ViewChild("thumbnail", { read: ElementRef })
+    ], ProfilePicturePickerComponent.prototype, "thumbnail", void 0);
+    __decorate([
+        ViewChild("fileInput", { read: ElementRef })
+    ], ProfilePicturePickerComponent.prototype, "fileInput", void 0);
+    __decorate([
+        Output()
+    ], ProfilePicturePickerComponent.prototype, "changedImage", void 0);
+    __decorate([
+        Output()
+    ], ProfilePicturePickerComponent.prototype, "removedImage", void 0);
+    __decorate([
+        Output()
+    ], ProfilePicturePickerComponent.prototype, "invalidFile", void 0);
+    __decorate([
+        HostListener("dragover", ["$event"])
+    ], ProfilePicturePickerComponent.prototype, "onDragOver", null);
+    __decorate([
+        HostListener("dragleave", ["$event"])
+    ], ProfilePicturePickerComponent.prototype, "onDragLeave", null);
+    __decorate([
+        HostListener("drop", ["$event"])
+    ], ProfilePicturePickerComponent.prototype, "onDrop", null);
+    __decorate([
+        HostListener("window:resize")
+    ], ProfilePicturePickerComponent.prototype, "onResize", null);
+    ProfilePicturePickerComponent = ProfilePicturePickerComponent_1 = __decorate([
+        Component({
+            selector: "s-profile-picture-picker",
+            template: "<p-confirmDialog></p-confirmDialog>\n\n<input #fileInput [accept]=\"accept\" class=\"file-input\" type=\"file\" (change)=\"photoSelected($event)\">\n<div #uploadPicture class=\"upload-picture\">\n   <s-thumbnail\n      #thumbnail\n      iconClass=\"far fa-user\"\n      [imageSource]=\"image\"\n      [hasAction]=\"!image\"\n      (click)=\"selectPhoto()\">\n   </s-thumbnail>\n   <div #info class=\"info\">\n      <ng-container *ngIf=\"image; then withImage; else noImage\"></ng-container>\n      <p class=\"subtitle\">{{ subtitle }}</p>\n   </div>\n</div>\n\n<ng-template #withImage>\n   <div class=\"buttons\">\n      <s-button\n         [label]=\"changeButtonLabel || 'platform.angular_components.change_photo' | translate\"\n         priority=\"primary\"\n         (onClick)=\"selectPhoto()\">\n      </s-button>\n      <s-button\n         [label]=\"removeButtonLabel || 'platform.angular_components.remove' | translate\"\n         priority=\"secondary\"\n         (onClick)=\"removePhoto()\">\n      </s-button>\n   </div>\n</ng-template>\n\n<ng-template #noImage>\n   <p class=\"title\">\n      {{ simpleTitle || 'platform.angular_components.drag_your_photo_or' | translate }}\n      <span\n         class=\"action-title\"\n         (click)=\"selectPhoto()\">\n         {{ actionTitle || 'platform.angular_components.select_a_file' | translate }}\n      </span>\n   </p>\n</ng-template>",
+            providers: [{
+                    provide: NG_VALUE_ACCESSOR,
+                    useExisting: forwardRef(function () { return ProfilePicturePickerComponent_1; }),
+                    multi: true,
+                }],
+            styles: [".file-input{display:none}.upload-picture{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.upload-picture .info{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:12px 20px;-ms-flex-align:start;align-items:flex-start}.upload-picture .info .title{font-family:\"Open Sans\",sans-serif;font-weight:700;font-size:.875rem;line-height:150%;color:#333}.upload-picture .info .title .action-title{cursor:pointer;color:#428bca}.upload-picture .info .buttons{display:-ms-flexbox;display:flex;gap:8px}.upload-picture .info .buttons s-button{margin:0}.upload-picture .info .subtitle{padding:6px 0;font-family:\"Open Sans\",sans-serif;font-weight:400;font-size:.75rem;line-height:150%;color:#697882;text-align:center}.upload-picture--small .info{-ms-flex-align:center;align-items:center}.upload-picture--small .info .subtitle,.upload-picture--small .info .title{text-align:center}.upload-picture--small .info .buttons{-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap}"]
+        })
+    ], ProfilePicturePickerComponent);
+    return ProfilePicturePickerComponent;
+}());
+
+var ProfilePicturePickerModule = /** @class */ (function () {
+    function ProfilePicturePickerModule() {
+    }
+    ProfilePicturePickerModule = __decorate([
+        NgModule({
+            imports: [
+                CommonModule,
+                TranslateModule,
+                ButtonModule,
+                ThumbnailModule,
+                ImageCropperModule,
+                ConfirmDialogModule,
+            ],
+            declarations: [ProfilePicturePickerComponent],
+            exports: [ProfilePicturePickerComponent],
+            providers: [
+                ImageCropperService,
+                ConfirmationService,
+            ],
+        })
+    ], ProfilePicturePickerModule);
+    return ProfilePicturePickerModule;
+}());
+
+var ProfilePictureModule = /** @class */ (function () {
+    function ProfilePictureModule() {
+    }
+    ProfilePictureModule = __decorate([
+        NgModule({
+            imports: [
+                CommonModule,
+                FormsModule,
+                ReactiveFormsModule,
+                ProfilePicturePickerModule,
+            ],
+            declarations: [ProfilePictureFieldComponent],
+            exports: [ProfilePictureFieldComponent],
+        })
+    ], ProfilePictureModule);
+    return ProfilePictureModule;
+}());
+
+var DynamicFormModule = /** @class */ (function () {
+    function DynamicFormModule() {
+    }
+    DynamicFormModule = __decorate([
+        NgModule({
+            imports: [
+                AutoCompleteModule,
+                BignumberInputModule,
+                ButtonModule,
+                CalendarMaskModule,
+                CalendarModule,
+                CheckboxModule,
+                ChipsModule,
+                CommonModule,
+                ControlErrorsModule,
+                CountryPhonePickerModule,
+                DialogModule,
+                DropdownModule,
+                EmptyStateModule,
+                FormsModule,
+                HotkeyModule,
+                InputMaskModule,
+                InputTextareaModule,
+                InputTextModule,
+                KeyFilterModule,
+                LoadingStateModule,
+                LocaleModule,
+                LocalizedNumberInputModule,
+                PanelModule$1,
+                ButtonModule$1,
+                TableModule$1,
+                MultiSelectModule,
+                NumberInputModule,
+                RadioButtonModule,
+                ReactiveFormsModule,
+                TooltipModule,
+                FieldsetModule,
+                TableHeaderCheckboxModule,
+                FileUploadModule,
+                TableModule,
+                InfoSignModule,
+                MaskFormatterModule,
+                HotkeyModule.forRoot(),
+                MouseEventsModule,
+                SwitchModule,
+                PasswordStrengthModule,
+                SliderModule,
+                TranslateModule.forChild(),
+                PasswordFieldModule,
+                TextFieldModule,
+                NumberFieldModule,
+                CurrencyFieldModule,
+                NumberFieldModule$1,
+                ProfilePictureModule,
+            ],
+            declarations: [
+                AutocompleteFieldComponent,
+                BooleanFieldComponent,
+                BooleanSwitchFieldComponent,
+                CalendarFieldComponent,
+                ChipsFieldComponent,
+                CountryPhonePickerFieldComponent,
+                DynamicFieldComponent,
+                DynamicFormComponent,
+                DynamicFormDirective,
+                FieldsetComponent,
+                FileUploadComponent$1,
+                LookupComponent,
+                LookupFieldComponent,
+                RadioButtonComponent,
+                RowComponent,
+                SectionComponent,
+                SelectFieldComponent,
+                SliderFieldComponent,
+                TextAreaFieldComponent,
+                TextAreaIAFieldComponent,
+            ],
+            exports: [DynamicFormComponent, LookupComponent],
+            entryComponents: [
+                AutocompleteFieldComponent,
+                BooleanFieldComponent,
+                BooleanSwitchFieldComponent,
+                CalendarFieldComponent,
+                ChipsFieldComponent,
+                CountryPhonePickerFieldComponent,
+                FieldsetComponent,
+                FileUploadComponent$1,
+                LookupFieldComponent,
+                RadioButtonComponent,
+                RowComponent,
+                SectionComponent,
+                SelectFieldComponent,
+                SliderFieldComponent,
+                TextAreaFieldComponent,
+                TextAreaIAFieldComponent,
+            ],
+            providers: [
+                HotkeysService,
+                IAssistService,
+            ]
+        })
+    ], DynamicFormModule);
+    return DynamicFormModule;
+}());
+
+var CustomFieldsService = /** @class */ (function () {
+    function CustomFieldsService(http) {
+        this.http = http;
+    }
+    CustomFieldsService.prototype.getCustomFields = function (domain, service, entity, endpoint) {
+        var entityDto = { entityId: { domain_: domain, service_: service, id: entity } };
+        return this.http.post(endpoint, entityDto);
+    };
+    CustomFieldsService.prototype.getFileLocationUrl = function (dto, endpoint) {
+        return this.http.post(endpoint, dto);
+    };
+    CustomFieldsService.prototype.uploadTempFile = function (location, file) {
+        return this.http.put(location, file, {
+            reportProgress: true,
+            observe: "events",
+            headers: { "Content-Type": file.type }
+        });
+    };
+    CustomFieldsService.prototype.requestAccess = function (objectId, endpoint) {
+        return this.http.post(endpoint, { objectId: objectId });
+    };
+    CustomFieldsService.prototype.getFile = function (permanentUrl) {
+        return this.http.get(permanentUrl, { responseType: "blob" });
+    };
+    CustomFieldsService.ctorParameters = function () { return [
+        { type: HttpClient }
+    ]; };
+    CustomFieldsService = __decorate([
+        Injectable()
+    ], CustomFieldsService);
+    return CustomFieldsService;
+}());
+
+var CustomFieldType;
+(function (CustomFieldType) {
+    CustomFieldType["String"] = "String";
+    CustomFieldType["Boolean"] = "Boolean";
+    CustomFieldType["Integer"] = "Integer";
+    CustomFieldType["Double"] = "Double";
+    CustomFieldType["Date"] = "Date";
+    CustomFieldType["DateTime"] = "DateTime";
+    CustomFieldType["LocalDateTime"] = "LocalDateTime";
+    CustomFieldType["Time"] = "Time";
+    CustomFieldType["Money"] = "Money";
+    CustomFieldType["Blob"] = "Blob";
     CustomFieldType["Binary"] = "Binary";
     CustomFieldType["Any"] = "Any";
     CustomFieldType["Enum"] = "Enum";
@@ -11937,1985 +12723,1532 @@ var Gantt = /** @class */ (function () {
             // uids
             if (!task.id) {
                 task.id = generate_id(task);
-            }
-            return task;
-        });
-        this.setup_dependencies();
-    };
-    Gantt.prototype.setup_dependencies = function () {
-        var e_1, _a, e_2, _b;
-        this.dependency_map = {};
-        try {
-            for (var _c = __values(this.tasks), _d = _c.next(); !_d.done; _d = _c.next()) {
-                var t = _d.value;
-                try {
-                    for (var _e = (e_2 = void 0, __values(t.dependencies)), _f = _e.next(); !_f.done; _f = _e.next()) {
-                        var d = _f.value;
-                        this.dependency_map[d] = this.dependency_map[d] || [];
-                        this.dependency_map[d].push(t.id);
-                    }
-                }
-                catch (e_2_1) { e_2 = { error: e_2_1 }; }
-                finally {
-                    try {
-                        if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
-                    }
-                    finally { if (e_2) throw e_2.error; }
-                }
-            }
-        }
-        catch (e_1_1) { e_1 = { error: e_1_1 }; }
-        finally {
-            try {
-                if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
-            }
-            finally { if (e_1) throw e_1.error; }
-        }
-    };
-    Gantt.prototype.refresh = function (tasks) {
-        this.setup_tasks(tasks);
-        this.change_view_mode();
-    };
-    Gantt.prototype.change_view_mode = function (mode) {
-        if (mode === void 0) { mode = this.options.viewMode; }
-        this.setup_gantt_dates();
-        this.update_view_scale(mode);
-        this.setup_dates();
-        this.render();
-        // fire viewmode_change event
-        this.trigger_event("onViewChange", [mode]);
-    };
-    Gantt.prototype.update_view_scale = function (view_mode) {
-        this.options.viewMode = view_mode;
-        // this.isHourView = false;
-        if (view_mode === ViewMode.QuarterHour) {
-            this.options.step = 24 / 24 / 4;
-            this.options.columnWidth = 50;
-        }
-        else if (view_mode === ViewMode.Hour) {
-            this.options.step = 24 / 24;
-            this.options.columnWidth = 50;
-        }
-        else if (view_mode === ViewMode.Day) {
-            this.options.step = 24;
-            this.options.columnWidth = 50;
-        }
-        else if (view_mode === ViewMode.HalfDay) {
-            this.options.step = 24 / 2;
-            this.options.columnWidth = 50;
-        }
-        else if (view_mode === ViewMode.QuarterDay) {
-            this.options.step = 24 / 4;
-            this.options.columnWidth = 50;
-        }
-        else if (view_mode === ViewMode.Week) {
-            this.options.step = 24 * 7;
-            this.options.columnWidth = 140;
-        }
-        else if (view_mode === ViewMode.Month) {
-            this.options.step = 24 * 30;
-            this.options.columnWidth = 120;
-        }
-        else if (view_mode === ViewMode.Year) {
-            this.options.step = 24 * 365;
-            this.options.columnWidth = 120;
-        }
-    };
-    Gantt.prototype.setup_dates = function () {
-        this.setup_date_values();
-    };
-    Gantt.prototype.setup_gantt_dates = function () {
-        var e_3, _a;
-        var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
-        this._minDate = null;
-        this._maxDate = null;
-        try {
-            for (var _t = __values(this.tasks), _u = _t.next(); !_u.done; _u = _t.next()) {
-                var task = _u.value;
-                // set global start and end date
-                if (!this.minDate || task.start < this.minDate) {
-                    this._minDate = DateUtils.startOf(task.start, 'day');
-                }
-                if (!this.maxDate || task.end > this.maxDate) {
-                    this._maxDate = task.end;
-                }
-            }
-        }
-        catch (e_3_1) { e_3 = { error: e_3_1 }; }
-        finally {
-            try {
-                if (_u && !_u.done && (_a = _t.return)) _a.call(_t);
-            }
-            finally { if (e_3) throw e_3.error; }
-        }
-        switch (this.options.viewMode) {
-            case ViewMode.QuarterHour:
-                this._minDate = DateUtils.add(this.minDate, -((_b = this.options.marginBeforeStart) !== null && _b !== void 0 ? _b : 15), "minutes");
-                this._maxDate = DateUtils.add(this.maxDate, (_c = this.options.marginAfterEnd) !== null && _c !== void 0 ? _c : 15, "minutes");
-            case ViewMode.Hour:
-                this._minDate = DateUtils.add(this.minDate, -((_d = this.options.marginBeforeStart) !== null && _d !== void 0 ? _d : 1), "hour");
-                this._maxDate = DateUtils.add(this.maxDate, (_e = this.options.marginAfterEnd) !== null && _e !== void 0 ? _e : 1, "hour");
-                break;
-            case ViewMode.QuarterDay:
-                this._minDate = DateUtils.add(this.minDate, -((_f = this.options.marginBeforeStart) !== null && _f !== void 0 ? _f : 6), "hour");
-                this._maxDate = DateUtils.add(this.maxDate, (_g = this.options.marginAfterEnd) !== null && _g !== void 0 ? _g : 6, "hour");
-                break;
-            case ViewMode.HalfDay:
-                this._minDate = DateUtils.add(this.minDate, -((_h = this.options.marginBeforeStart) !== null && _h !== void 0 ? _h : 12), "hour");
-                this._maxDate = DateUtils.add(this.maxDate, (_j = this.options.marginAfterEnd) !== null && _j !== void 0 ? _j : 12, "hour");
-                break;
-            case ViewMode.Day:
-                this._minDate = DateUtils.add(this.minDate, -((_k = this.options.marginBeforeStart) !== null && _k !== void 0 ? _k : 1), "day");
-                this._maxDate = DateUtils.add(this.maxDate, (_l = this.options.marginAfterEnd) !== null && _l !== void 0 ? _l : 1, "day");
-                break;
-            case ViewMode.Week:
-                this._minDate = DateUtils.add(this.minDate, -((_m = this.options.marginBeforeStart) !== null && _m !== void 0 ? _m : 1), "week");
-                this._maxDate = DateUtils.add(this.maxDate, (_o = this.options.marginAfterEnd) !== null && _o !== void 0 ? _o : 1, "week");
-                break;
-            case ViewMode.Month:
-                this._minDate = DateUtils.add(this.minDate, -((_p = this.options.marginBeforeStart) !== null && _p !== void 0 ? _p : 1), "month");
-                this._maxDate = DateUtils.add(this.maxDate, (_q = this.options.marginAfterEnd) !== null && _q !== void 0 ? _q : 1, "month");
-                break;
-            case ViewMode.Year:
-                this._minDate = DateUtils.add(this.minDate, -((_r = this.options.marginBeforeStart) !== null && _r !== void 0 ? _r : 1), "year");
-                this._maxDate = DateUtils.add(this.maxDate, (_s = this.options.marginAfterEnd) !== null && _s !== void 0 ? _s : 1, "year");
-                break;
-        }
-    };
-    Gantt.prototype.setup_date_values = function () {
-        this.dates = [];
-        var cur_date = null;
-        while (cur_date === null || cur_date < this.maxDate) {
-            if (!cur_date) {
-                cur_date = DateUtils.clone(this.minDate);
-            }
-            else {
-                if (this.view_is(ViewMode.Year)) {
-                    cur_date = DateUtils.add(cur_date, 1, "year");
-                }
-                else if (this.view_is(ViewMode.Month)) {
-                    cur_date = DateUtils.add(cur_date, 1, "month");
-                }
-                else {
-                    cur_date = DateUtils.add(cur_date, this.options.step, 'hour');
-                }
-            }
-            this.dates.push(cur_date);
-        }
-        if (this.options.containerWidth) {
-            var columnWidth = (this.options.containerWidth - 1) / this.dates.length;
-            this.options.columnWidth = columnWidth < 45 ? 45 : columnWidth;
-        }
-    };
-    Gantt.prototype.bind_events = function () {
-        this.bind_grid_click();
-        this.bind_bar_events();
-    };
-    Gantt.prototype.render = function () {
-        this.clear();
-        this.setup_layers();
-        this.make_grid();
-        this.make_dates();
-        this.make_bars();
-        this.make_arrows();
-        this.map_arrows_on_bars();
-        this.set_width();
-        this.set_scroll_position();
+            }
+            return task;
+        });
+        this.setup_dependencies();
     };
-    Gantt.prototype.setup_layers = function () {
-        var e_4, _a;
-        this.layers = {};
-        var layers = ["grid", "date", "arrow", "progress", "bar", "details"];
+    Gantt.prototype.setup_dependencies = function () {
+        var e_1, _a, e_2, _b;
+        this.dependency_map = {};
         try {
-            // make group layers
-            for (var layers_1 = __values(layers), layers_1_1 = layers_1.next(); !layers_1_1.done; layers_1_1 = layers_1.next()) {
-                var layer = layers_1_1.value;
-                this.layers[layer] = createSVG('g', {
-                    class: layer,
-                    append_to: this.$svg,
-                });
+            for (var _c = __values(this.tasks), _d = _c.next(); !_d.done; _d = _c.next()) {
+                var t = _d.value;
+                try {
+                    for (var _e = (e_2 = void 0, __values(t.dependencies)), _f = _e.next(); !_f.done; _f = _e.next()) {
+                        var d = _f.value;
+                        this.dependency_map[d] = this.dependency_map[d] || [];
+                        this.dependency_map[d].push(t.id);
+                    }
+                }
+                catch (e_2_1) { e_2 = { error: e_2_1 }; }
+                finally {
+                    try {
+                        if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
+                    }
+                    finally { if (e_2) throw e_2.error; }
+                }
             }
         }
-        catch (e_4_1) { e_4 = { error: e_4_1 }; }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
         finally {
             try {
-                if (layers_1_1 && !layers_1_1.done && (_a = layers_1.return)) _a.call(layers_1);
+                if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
             }
-            finally { if (e_4) throw e_4.error; }
+            finally { if (e_1) throw e_1.error; }
         }
     };
-    Gantt.prototype.make_grid = function () {
-        this.make_grid_background();
-        this.make_grid_rows();
-        this.make_grid_header();
-        this.make_grid_highlights();
-        this.make_grid_ticks();
+    Gantt.prototype.refresh = function (tasks) {
+        this.setup_tasks(tasks);
+        this.change_view_mode();
     };
-    Gantt.prototype.make_grid_background = function () {
-        var grid_width = this.dates.length * this.options.columnWidth;
-        if (this.options.containerWidth) {
-            grid_width = this.options.containerWidth;
-        }
-        var distinct_rows = __spread(new Set(this.tasks.map(function (x) { return x._row_id; })));
-        var grid_height = this.options.headerHeight +
-            this.options.padding / 2 +
-            (this.options.barHeight + this.options.padding) *
-                distinct_rows.length;
-        createSVG("rect", {
-            x: 0,
-            y: 0,
-            width: grid_width,
-            height: grid_height,
-            class: "grid-background",
-            append_to: this.layers.grid,
-        });
-        $.attr(this.$svg, {
-            height: grid_height,
-            width: "100%",
-        }, null);
+    Gantt.prototype.change_view_mode = function (mode) {
+        if (mode === void 0) { mode = this.options.viewMode; }
+        this.setup_gantt_dates();
+        this.update_view_scale(mode);
+        this.setup_dates();
+        this.render();
+        // fire viewmode_change event
+        this.trigger_event("onViewChange", [mode]);
     };
-    Gantt.prototype.make_grid_rows = function () {
-        var _this = this;
-        var rows_layer = createSVG("g", { append_to: this.layers.grid });
-        var lines_layer = createSVG("g", { append_to: this.layers.grid });
-        var row_width = this.dates.length * this.options.columnWidth;
-        var row_height = this.options.barHeight + this.options.padding;
-        //TODO:  ajustar o posicionamento das linhas
-        var row_y = this.options.headerHeight + this.options.padding / 2;
-        this.tasks.forEach(function (_) {
-            createSVG("rect", {
-                x: 0,
-                y: row_y,
-                width: row_width,
-                height: row_height,
-                class: "grid-row",
-                append_to: rows_layer,
-            });
-            createSVG("line", {
-                x1: 0,
-                y1: row_y + row_height,
-                x2: row_width,
-                y2: row_y + row_height,
-                class: "row-line",
-                append_to: lines_layer,
-            });
-            row_y += _this.options.barHeight + _this.options.padding;
-        });
+    Gantt.prototype.update_view_scale = function (view_mode) {
+        this.options.viewMode = view_mode;
+        // this.isHourView = false;
+        if (view_mode === ViewMode.QuarterHour) {
+            this.options.step = 24 / 24 / 4;
+            this.options.columnWidth = 50;
+        }
+        else if (view_mode === ViewMode.Hour) {
+            this.options.step = 24 / 24;
+            this.options.columnWidth = 50;
+        }
+        else if (view_mode === ViewMode.Day) {
+            this.options.step = 24;
+            this.options.columnWidth = 50;
+        }
+        else if (view_mode === ViewMode.HalfDay) {
+            this.options.step = 24 / 2;
+            this.options.columnWidth = 50;
+        }
+        else if (view_mode === ViewMode.QuarterDay) {
+            this.options.step = 24 / 4;
+            this.options.columnWidth = 50;
+        }
+        else if (view_mode === ViewMode.Week) {
+            this.options.step = 24 * 7;
+            this.options.columnWidth = 140;
+        }
+        else if (view_mode === ViewMode.Month) {
+            this.options.step = 24 * 30;
+            this.options.columnWidth = 120;
+        }
+        else if (view_mode === ViewMode.Year) {
+            this.options.step = 24 * 365;
+            this.options.columnWidth = 120;
+        }
     };
-    Gantt.prototype.make_grid_header = function () {
-        // const addIsHourView = this.isHourView ? 25 : 10
-        var header_width = this.dates.length * this.options.columnWidth;
-        var header_height = this.options.headerHeight + 10;
-        createSVG("rect", {
-            x: 0,
-            y: 0,
-            width: header_width,
-            height: header_height,
-            class: "grid-header",
-            append_to: this.layers.grid,
-        });
+    Gantt.prototype.setup_dates = function () {
+        this.setup_date_values();
     };
-    Gantt.prototype.make_grid_ticks = function () {
-        var e_5, _a;
-        var tick_x = 0;
-        var tick_y = this.options.headerHeight + this.options.padding / 2;
-        var tick_height = (this.options.barHeight + this.options.padding) *
-            this.tasks.length;
+    Gantt.prototype.setup_gantt_dates = function () {
+        var e_3, _a;
+        var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+        this._minDate = null;
+        this._maxDate = null;
         try {
-            for (var _b = __values(this.dates), _c = _b.next(); !_c.done; _c = _b.next()) {
-                var date = _c.value;
-                var tick_class = "tick";
-                if (this.view_is(ViewMode.QuarterHour) && date.getHours() === 0 && date.getMinutes() === 0) {
-                    // thick tick for first hour of day.
-                    tick_class += " thick";
-                }
-                else if (this.view_is([ViewMode.Hour, ViewMode.QuarterDay, ViewMode.HalfDay]) && date.getHours() === 0) {
-                    // thick tick for first hour of day.
-                    tick_class += " thick";
-                }
-                else if (this.view_is(ViewMode.Day) && date.getDate() === 1) {
-                    // thick tick for monday
-                    tick_class += " thick";
-                }
-                else if (this.view_is(ViewMode.Week) && date.getDate() >= 1 && date.getDate() < 8) {
-                    // thick tick for first week
-                    tick_class += " thick";
-                }
-                else if (this.view_is(ViewMode.Month) && date.getMonth() % 3 === 0) {
-                    // thick ticks for quarters
-                    tick_class += " thick";
-                }
-                createSVG("path", {
-                    d: "M " + tick_x + " " + tick_y + " v " + tick_height,
-                    class: tick_class,
-                    append_to: this.layers.grid,
-                });
-                if (this.view_is(ViewMode.Month)) {
-                    tick_x +=
-                        (DateUtils.getDaysInMonth(date) *
-                            this.options.columnWidth) /
-                            30;
-                }
-                else {
-                    tick_x += this.options.columnWidth;
+            for (var _t = __values(this.tasks), _u = _t.next(); !_u.done; _u = _t.next()) {
+                var task = _u.value;
+                // set global start and end date
+                if (!this.minDate || task.start < this.minDate) {
+                    this._minDate = DateUtils.startOf(task.start, 'day');
                 }
-            }
-        }
-        catch (e_5_1) { e_5 = { error: e_5_1 }; }
-        finally {
-            try {
-                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-            }
-            finally { if (e_5) throw e_5.error; }
-        }
-    };
-    Gantt.prototype.make_grid_highlights = function () {
-        var e_6, _a;
-        if (this.view_is(ViewMode.Day)) {
-            var width = this.options.columnWidth;
-            var height = (this.options.barHeight + this.options.padding) *
-                this.tasks.length +
-                this.options.headerHeight +
-                this.options.padding / 2;
-            var x = 0;
-            try {
-                for (var _b = __values(this.dates), _c = _b.next(); !_c.done; _c = _b.next()) {
-                    var date = _c.value;
-                    var y = (this.options.headerHeight + this.options.padding) / 2;
-                    var isToday = date == DateUtils.today();
-                    var isWeekend = (date.getDay() == 0 || date.getDay() == 6);
-                    var className = void 0;
-                    if (isToday) {
-                        className = "today-highlight";
-                        y = (this.options.headerHeight + this.options.padding) / 2;
-                    }
-                    else if (isWeekend) {
-                        className = "weekend-highlight";
-                    }
-                    var rx = 3;
-                    var ry = 3;
-                    if (isToday || isWeekend) {
-                        createSVG("rect", {
-                            x: x,
-                            y: y,
-                            rx: rx,
-                            ry: ry,
-                            width: width,
-                            height: height,
-                            class: className,
-                            append_to: this.layers.grid
-                        });
-                    }
-                    x += this.options.columnWidth;
+                if (!this.maxDate || task.end > this.maxDate) {
+                    this._maxDate = task.end;
                 }
             }
-            catch (e_6_1) { e_6 = { error: e_6_1 }; }
-            finally {
-                try {
-                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-                }
-                finally { if (e_6) throw e_6.error; }
+        }
+        catch (e_3_1) { e_3 = { error: e_3_1 }; }
+        finally {
+            try {
+                if (_u && !_u.done && (_a = _t.return)) _a.call(_t);
             }
+            finally { if (e_3) throw e_3.error; }
+        }
+        switch (this.options.viewMode) {
+            case ViewMode.QuarterHour:
+                this._minDate = DateUtils.add(this.minDate, -((_b = this.options.marginBeforeStart) !== null && _b !== void 0 ? _b : 15), "minutes");
+                this._maxDate = DateUtils.add(this.maxDate, (_c = this.options.marginAfterEnd) !== null && _c !== void 0 ? _c : 15, "minutes");
+            case ViewMode.Hour:
+                this._minDate = DateUtils.add(this.minDate, -((_d = this.options.marginBeforeStart) !== null && _d !== void 0 ? _d : 1), "hour");
+                this._maxDate = DateUtils.add(this.maxDate, (_e = this.options.marginAfterEnd) !== null && _e !== void 0 ? _e : 1, "hour");
+                break;
+            case ViewMode.QuarterDay:
+                this._minDate = DateUtils.add(this.minDate, -((_f = this.options.marginBeforeStart) !== null && _f !== void 0 ? _f : 6), "hour");
+                this._maxDate = DateUtils.add(this.maxDate, (_g = this.options.marginAfterEnd) !== null && _g !== void 0 ? _g : 6, "hour");
+                break;
+            case ViewMode.HalfDay:
+                this._minDate = DateUtils.add(this.minDate, -((_h = this.options.marginBeforeStart) !== null && _h !== void 0 ? _h : 12), "hour");
+                this._maxDate = DateUtils.add(this.maxDate, (_j = this.options.marginAfterEnd) !== null && _j !== void 0 ? _j : 12, "hour");
+                break;
+            case ViewMode.Day:
+                this._minDate = DateUtils.add(this.minDate, -((_k = this.options.marginBeforeStart) !== null && _k !== void 0 ? _k : 1), "day");
+                this._maxDate = DateUtils.add(this.maxDate, (_l = this.options.marginAfterEnd) !== null && _l !== void 0 ? _l : 1, "day");
+                break;
+            case ViewMode.Week:
+                this._minDate = DateUtils.add(this.minDate, -((_m = this.options.marginBeforeStart) !== null && _m !== void 0 ? _m : 1), "week");
+                this._maxDate = DateUtils.add(this.maxDate, (_o = this.options.marginAfterEnd) !== null && _o !== void 0 ? _o : 1, "week");
+                break;
+            case ViewMode.Month:
+                this._minDate = DateUtils.add(this.minDate, -((_p = this.options.marginBeforeStart) !== null && _p !== void 0 ? _p : 1), "month");
+                this._maxDate = DateUtils.add(this.maxDate, (_q = this.options.marginAfterEnd) !== null && _q !== void 0 ? _q : 1, "month");
+                break;
+            case ViewMode.Year:
+                this._minDate = DateUtils.add(this.minDate, -((_r = this.options.marginBeforeStart) !== null && _r !== void 0 ? _r : 1), "year");
+                this._maxDate = DateUtils.add(this.maxDate, (_s = this.options.marginAfterEnd) !== null && _s !== void 0 ? _s : 1, "year");
+                break;
         }
     };
-    Gantt.prototype.make_dates = function () {
-        var dates = this.get_dates_to_draw();
-        for (var i = 0; i < dates.length; i++) {
-            var date = dates[i];
-            createSVG("text", {
-                x: date.lower_x,
-                y: date.lower_y + 20,
-                innerHTML: date.lower_text,
-                class: "title-2",
-                append_to: this.layers.date,
-            });
-            if (date.middle_text) {
-                createSVG("text", {
-                    x: date.middle_x,
-                    y: date.middle_y,
-                    innerHTML: date.middle_text,
-                    class: "middle-text",
-                    append_to: this.layers.date,
-                });
+    Gantt.prototype.setup_date_values = function () {
+        this.dates = [];
+        var cur_date = null;
+        while (cur_date === null || cur_date < this.maxDate) {
+            if (!cur_date) {
+                cur_date = DateUtils.clone(this.minDate);
             }
-            if (date.upper_text) {
-                var $upper_text = createSVG("text", {
-                    x: date.upper_x,
-                    y: date.upper_y,
-                    innerHTML: date.upper_text,
-                    class: "upper-text",
-                    append_to: this.layers.date,
-                });
-                // remove out-of-bound dates
-                if ($upper_text.getBBox().x2 > this.layers.grid.getBBox().width) {
-                    $upper_text.remove();
+            else {
+                if (this.view_is(ViewMode.Year)) {
+                    cur_date = DateUtils.add(cur_date, 1, "year");
+                }
+                else if (this.view_is(ViewMode.Month)) {
+                    cur_date = DateUtils.add(cur_date, 1, "month");
+                }
+                else {
+                    cur_date = DateUtils.add(cur_date, this.options.step, 'hour');
                 }
             }
+            this.dates.push(cur_date);
         }
-    };
-    Gantt.prototype.get_dates_to_draw = function () {
-        var _this = this;
-        var last_date = null;
-        var dates = this.dates.map(function (date, i) {
-            var d = _this.get_date_info(date, last_date, i);
-            last_date = date;
-            return d;
-        });
-        return dates;
-    };
-    Gantt.prototype.get_date_info = function (date, last_date, i) {
-        if (!last_date) {
-            last_date = DateUtils.add(date, 1, "year");
+        if (this.options.containerWidth) {
+            var columnWidth = (this.options.containerWidth - 1) / this.dates.length;
+            this.options.columnWidth = columnWidth < 45 ? 45 : columnWidth;
         }
-        var date_text = {
-            // quarter hour
-            quarterHourUpper: date.getDate() !== last_date.getDate()
-                ? DateUtils.format(date, "D MMM", this.options.language)
-                : "",
-            quarterHourLower: DateUtils.format(date, "HH:mm", this.options.language),
-            // hour
-            hourUpper: date.getDate() !== last_date.getDate()
-                ? DateUtils.format(date, "D MMM", this.options.language)
-                : "",
-            hourLower: DateUtils.format(date, "HH:mm", this.options.language),
-            // quarter day
-            quarterDayUpper: date.getDate() !== last_date.getDate()
-                ? DateUtils.format(date, "D MMM", this.options.language)
-                : "",
-            quarterDayLower: DateUtils.format(date, "HH:mm", this.options.language),
-            // half day
-            halfDayUpper: (date.getDate() !== last_date.getDate())
-                ? (((date.getMonth() !== last_date.getMonth()) || i < 2)
-                    ? DateUtils.format(date, "D MMM", this.options.language)
-                    : DateUtils.format(date, "D", this.options.language))
-                : "",
-            halfDayLower: DateUtils.format(date, "HH:mm", this.options.language),
-            // day
-            dayUpper: ((date.getMonth() !== last_date.getMonth()) || i === 0)
-                ? DateUtils.format(date, "MMMM", this.options.language)
-                : "",
-            dayMiddle: DateUtils.format(date, "ddd", this.options.language),
-            dayLower: DateUtils.format(date, "D", this.options.language),
-            // week
-            weekUpper: date.getMonth() !== last_date.getMonth()
-                ? DateUtils.format(date, "MMMM", this.options.language)
-                : "",
-            weekLower: date.getMonth() !== last_date.getMonth()
-                ? DateUtils.format(date, "D MMM", this.options.language)
-                : DateUtils.format(date, "D", this.options.language),
-            // month
-            monthUpper: date.getFullYear() !== last_date.getFullYear()
-                ? DateUtils.format(date, "YYYY", this.options.language)
-                : "",
-            monthLower: DateUtils.format(date, "MMMM", this.options.language),
-            // year
-            yearUpper: date.getFullYear() !== last_date.getFullYear()
-                ? DateUtils.format(date, "YYYY", this.options.language)
-                : "",
-            yearLower: DateUtils.format(date, "YYYY", this.options.language),
-        };
-        // Descontando 20 para adcionar uma segunda linha de informação no cabeçalho
-        var base_pos = {
-            x: i * this.options.columnWidth,
-            upper_y: this.options.headerHeight - 20 - 25,
-            middle_y: this.options.headerHeight - 20,
-            lower_y: this.options.headerHeight - 20,
-        };
-        var x_pos = {
-            quarterHourUpper: (this.dates.length < 14) ? (this.options.columnWidth) : (this.options.columnWidth * 24 / 2),
-            quarterHourMiddle: this.options.columnWidth / 2,
-            quarterHourLower: this.options.columnWidth / 2,
-            hourUpper: (this.dates.length < 14) ? (this.options.columnWidth) : (this.options.columnWidth * 24 / 2),
-            hourMiddle: this.options.columnWidth / 2,
-            hourLower: this.options.columnWidth / 2,
-            quarterDayUpper: this.options.columnWidth * 4 / 2,
-            quarterDayMiddle: this.options.columnWidth / 2,
-            quarterDayLower: this.options.columnWidth / 2,
-            halfDayUpper: this.options.columnWidth * 2 / 2,
-            halfDayMiddle: this.options.columnWidth / 2,
-            halfDayLower: this.options.columnWidth / 2,
-            dayUpper: (this.dates.length < 15) ? (this.options.columnWidth) : ((this.options.columnWidth * 30) / 2),
-            dayMiddle: this.options.columnWidth / 2 - 12,
-            dayLower: this.options.columnWidth / 2,
-            weekUpper: (this.options.columnWidth * 4) / 2,
-            weekMiddle: 0,
-            weekLower: 0,
-            monthUpper: (this.dates.length < 15) ? (this.options.columnWidth) : ((this.options.columnWidth * 12) / 2),
-            monthMiddle: 0,
-            monthLower: this.options.columnWidth / 2,
-            yearUpper: (this.options.columnWidth * 30) / 2,
-            yearMiddle: this.options.columnWidth / 2,
-            yearLower: this.options.columnWidth / 2,
-        };
-        return {
-            upper_text: date_text[this.options.viewMode + "Upper"],
-            middle_text: date_text[this.options.viewMode + "Middle"],
-            lower_text: date_text[this.options.viewMode + "Lower"],
-            upper_x: base_pos.x + x_pos[this.options.viewMode + "Upper"],
-            upper_y: base_pos.upper_y,
-            middle_x: base_pos.x + x_pos[this.options.viewMode + "Middle"],
-            middle_y: base_pos.middle_y,
-            lower_x: base_pos.x + x_pos[this.options.viewMode + "Lower"],
-            lower_y: base_pos.lower_y,
-            date: date,
-        };
     };
-    Gantt.prototype.make_bars = function () {
-        var _this = this;
-        this.bars = this.tasks.map(function (task) {
-            var bar = new Bar(_this, task);
-            _this.layers.bar.appendChild(bar.group);
-            return bar;
-        });
+    Gantt.prototype.bind_events = function () {
+        this.bind_grid_click();
+        this.bind_bar_events();
     };
-    Gantt.prototype.make_arrows = function () {
-        var e_7, _a;
-        var _this = this;
-        this.arrows = [];
-        var _loop_1 = function (task) {
-            var arrows = [];
-            arrows = task.dependencies
-                .map(function (task_id) {
-                var dependency = _this.get_task(task_id);
-                if (!dependency)
-                    return;
-                var arrow = new Arrow(_this, _this.bars[dependency._index], // from_task
-                _this.bars[task._index] // to_task
-                );
-                _this.layers.arrow.appendChild(arrow.element);
-                return arrow;
-            })
-                .filter(Boolean); // filter falsy values
-            this_1.arrows = this_1.arrows.concat(arrows);
-        };
-        var this_1 = this;
+    Gantt.prototype.render = function () {
+        this.clear();
+        this.setup_layers();
+        this.make_grid();
+        this.make_dates();
+        this.make_bars();
+        this.make_arrows();
+        this.map_arrows_on_bars();
+        this.set_width();
+        this.set_scroll_position();
+    };
+    Gantt.prototype.setup_layers = function () {
+        var e_4, _a;
+        this.layers = {};
+        var layers = ["grid", "date", "arrow", "progress", "bar", "details"];
         try {
-            for (var _b = __values(this.tasks), _c = _b.next(); !_c.done; _c = _b.next()) {
-                var task = _c.value;
-                _loop_1(task);
+            // make group layers
+            for (var layers_1 = __values(layers), layers_1_1 = layers_1.next(); !layers_1_1.done; layers_1_1 = layers_1.next()) {
+                var layer = layers_1_1.value;
+                this.layers[layer] = createSVG('g', {
+                    class: layer,
+                    append_to: this.$svg,
+                });
             }
         }
-        catch (e_7_1) { e_7 = { error: e_7_1 }; }
+        catch (e_4_1) { e_4 = { error: e_4_1 }; }
         finally {
             try {
-                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                if (layers_1_1 && !layers_1_1.done && (_a = layers_1.return)) _a.call(layers_1);
             }
-            finally { if (e_7) throw e_7.error; }
+            finally { if (e_4) throw e_4.error; }
         }
     };
-    Gantt.prototype.map_arrows_on_bars = function () {
-        var e_8, _a;
-        var _loop_2 = function (bar) {
-            bar.arrows = this_2.arrows.filter(function (arrow) {
-                return (arrow.fromTask.task.id === bar.task.id ||
-                    arrow.toTask.task.id === bar.task.id);
+    Gantt.prototype.make_grid = function () {
+        this.make_grid_background();
+        this.make_grid_rows();
+        this.make_grid_header();
+        this.make_grid_highlights();
+        this.make_grid_ticks();
+    };
+    Gantt.prototype.make_grid_background = function () {
+        var grid_width = this.dates.length * this.options.columnWidth;
+        if (this.options.containerWidth) {
+            grid_width = this.options.containerWidth;
+        }
+        var distinct_rows = __spread(new Set(this.tasks.map(function (x) { return x._row_id; })));
+        var grid_height = this.options.headerHeight +
+            this.options.padding / 2 +
+            (this.options.barHeight + this.options.padding) *
+                distinct_rows.length;
+        createSVG("rect", {
+            x: 0,
+            y: 0,
+            width: grid_width,
+            height: grid_height,
+            class: "grid-background",
+            append_to: this.layers.grid,
+        });
+        $.attr(this.$svg, {
+            height: grid_height,
+            width: "100%",
+        }, null);
+    };
+    Gantt.prototype.make_grid_rows = function () {
+        var _this = this;
+        var rows_layer = createSVG("g", { append_to: this.layers.grid });
+        var lines_layer = createSVG("g", { append_to: this.layers.grid });
+        var row_width = this.dates.length * this.options.columnWidth;
+        var row_height = this.options.barHeight + this.options.padding;
+        //TODO:  ajustar o posicionamento das linhas
+        var row_y = this.options.headerHeight + this.options.padding / 2;
+        this.tasks.forEach(function (_) {
+            createSVG("rect", {
+                x: 0,
+                y: row_y,
+                width: row_width,
+                height: row_height,
+                class: "grid-row",
+                append_to: rows_layer,
             });
-        };
-        var this_2 = this;
+            createSVG("line", {
+                x1: 0,
+                y1: row_y + row_height,
+                x2: row_width,
+                y2: row_y + row_height,
+                class: "row-line",
+                append_to: lines_layer,
+            });
+            row_y += _this.options.barHeight + _this.options.padding;
+        });
+    };
+    Gantt.prototype.make_grid_header = function () {
+        // const addIsHourView = this.isHourView ? 25 : 10
+        var header_width = this.dates.length * this.options.columnWidth;
+        var header_height = this.options.headerHeight + 10;
+        createSVG("rect", {
+            x: 0,
+            y: 0,
+            width: header_width,
+            height: header_height,
+            class: "grid-header",
+            append_to: this.layers.grid,
+        });
+    };
+    Gantt.prototype.make_grid_ticks = function () {
+        var e_5, _a;
+        var tick_x = 0;
+        var tick_y = this.options.headerHeight + this.options.padding / 2;
+        var tick_height = (this.options.barHeight + this.options.padding) *
+            this.tasks.length;
         try {
-            for (var _b = __values(this.bars), _c = _b.next(); !_c.done; _c = _b.next()) {
-                var bar = _c.value;
-                _loop_2(bar);
+            for (var _b = __values(this.dates), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var date = _c.value;
+                var tick_class = "tick";
+                if (this.view_is(ViewMode.QuarterHour) && date.getHours() === 0 && date.getMinutes() === 0) {
+                    // thick tick for first hour of day.
+                    tick_class += " thick";
+                }
+                else if (this.view_is([ViewMode.Hour, ViewMode.QuarterDay, ViewMode.HalfDay]) && date.getHours() === 0) {
+                    // thick tick for first hour of day.
+                    tick_class += " thick";
+                }
+                else if (this.view_is(ViewMode.Day) && date.getDate() === 1) {
+                    // thick tick for monday
+                    tick_class += " thick";
+                }
+                else if (this.view_is(ViewMode.Week) && date.getDate() >= 1 && date.getDate() < 8) {
+                    // thick tick for first week
+                    tick_class += " thick";
+                }
+                else if (this.view_is(ViewMode.Month) && date.getMonth() % 3 === 0) {
+                    // thick ticks for quarters
+                    tick_class += " thick";
+                }
+                createSVG("path", {
+                    d: "M " + tick_x + " " + tick_y + " v " + tick_height,
+                    class: tick_class,
+                    append_to: this.layers.grid,
+                });
+                if (this.view_is(ViewMode.Month)) {
+                    tick_x +=
+                        (DateUtils.getDaysInMonth(date) *
+                            this.options.columnWidth) /
+                            30;
+                }
+                else {
+                    tick_x += this.options.columnWidth;
+                }
             }
         }
-        catch (e_8_1) { e_8 = { error: e_8_1 }; }
+        catch (e_5_1) { e_5 = { error: e_5_1 }; }
         finally {
             try {
                 if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
             }
-            finally { if (e_8) throw e_8.error; }
-        }
-    };
-    Gantt.prototype.set_width = function () {
-        var cur_width = this.$svg.getBoundingClientRect().width;
-        var actual_width = this.$svg
-            .querySelector(".grid .grid-row")
-            .getAttribute("width");
-        if (cur_width < actual_width) {
-            this.$svg.setAttribute("width", actual_width);
+            finally { if (e_5) throw e_5.error; }
         }
     };
-    Gantt.prototype.set_scroll_position = function () {
-        var parent_element = this.$svg.parentElement;
-        if (!parent_element)
-            return;
-        var hours_before_first_task = DateUtils.diff(this.get_oldest_starting_date(), this.minDate, "hour");
-        var scroll_pos = (hours_before_first_task / this.options.step) *
-            this.options.columnWidth -
-            this.options.columnWidth;
-        parent_element.scrollLeft = scroll_pos;
-    };
-    Gantt.prototype.bind_grid_click = function () {
-        var _this = this;
-        $.on(this.$svg, this.options.popupTrigger, ".grid-row, .grid-header", function () {
-            _this.unselect_all();
-            _this.hide_popup();
-        });
-    };
-    Gantt.prototype.bind_bar_events = function () {
-        var _this = this;
-        var is_dragging = false;
-        var x_on_start = 0;
-        var is_resizing_left = false;
-        var is_resizing_right = false;
-        var parent_bar_id = null;
-        var bars = [];
-        this.bar_being_dragged = null;
-        function action_in_progress() {
-            return is_dragging || is_resizing_left || is_resizing_right;
-        }
-        $.on(this.$svg, "mousedown", ".bar-wrapper, .handle", function (e, element) {
-            var bar_wrapper = $.closest(".bar-wrapper", element);
-            if (element.classList.contains("left")) {
-                is_resizing_left = true;
-            }
-            else if (element.classList.contains("right")) {
-                is_resizing_right = true;
-            }
-            else if (element.classList.contains("bar-wrapper") && _this.options.allowMovement) {
-                is_dragging = true;
-            }
-            bar_wrapper.classList.add("active");
-            x_on_start = e.offsetX;
-            parent_bar_id = bar_wrapper.getAttribute("data-id");
-            var ids = __spread([
-                parent_bar_id
-            ], _this.get_all_dependent_tasks(parent_bar_id));
-            bars = ids.map(function (id) { return _this.get_bar(id); });
-            _this.bar_being_dragged = parent_bar_id;
-            bars.forEach(function (bar) {
-                var $bar = bar.element;
-                $bar.ox = $bar.getX();
-                $bar.oy = $bar.getY();
-                $bar.owidth = $bar.getWidth();
-                $bar.finaldx = 0;
-            });
-        });
-        $.on(this.$svg, "mousemove", function (e) {
-            if (!action_in_progress()) {
-                return;
-            }
-            var dx = e.offsetX - x_on_start;
-            bars.forEach(function (bar) {
-                var $bar = bar.element;
-                $bar.finaldx = _this.get_snap_position(dx);
-                _this.hide_popup();
-                if (is_resizing_left) {
-                    if (parent_bar_id === bar.task.id) {
-                        bar.updateBarPosition({
-                            x: $bar.ox + $bar.finaldx,
-                            width: $bar.owidth - $bar.finaldx,
-                        });
+    Gantt.prototype.make_grid_highlights = function () {
+        var e_6, _a;
+        if (this.view_is(ViewMode.Day)) {
+            var width = this.options.columnWidth;
+            var height = (this.options.barHeight + this.options.padding) *
+                this.tasks.length +
+                this.options.headerHeight +
+                this.options.padding / 2;
+            var x = 0;
+            try {
+                for (var _b = __values(this.dates), _c = _b.next(); !_c.done; _c = _b.next()) {
+                    var date = _c.value;
+                    var y = (this.options.headerHeight + this.options.padding) / 2;
+                    var isToday = date == DateUtils.today();
+                    var isWeekend = (date.getDay() == 0 || date.getDay() == 6);
+                    var className = void 0;
+                    if (isToday) {
+                        className = "today-highlight";
+                        y = (this.options.headerHeight + this.options.padding) / 2;
                     }
-                    else {
-                        bar.updateBarPosition({
-                            x: $bar.ox + $bar.finaldx,
-                        });
+                    else if (isWeekend) {
+                        className = "weekend-highlight";
                     }
-                }
-                else if (is_resizing_right) {
-                    if (parent_bar_id === bar.task.id) {
-                        bar.updateBarPosition({
-                            width: $bar.owidth + $bar.finaldx,
+                    var rx = 3;
+                    var ry = 3;
+                    if (isToday || isWeekend) {
+                        createSVG("rect", {
+                            x: x,
+                            y: y,
+                            rx: rx,
+                            ry: ry,
+                            width: width,
+                            height: height,
+                            class: className,
+                            append_to: this.layers.grid
                         });
                     }
+                    x += this.options.columnWidth;
                 }
-                else if (is_dragging) {
-                    bar.updateBarPosition({ x: $bar.ox + $bar.finaldx });
+            }
+            catch (e_6_1) { e_6 = { error: e_6_1 }; }
+            finally {
+                try {
+                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                 }
-            });
-        }, null);
-        document.addEventListener("mouseup", function (e) {
-            if (is_dragging || is_resizing_left || is_resizing_right || !_this.options.allowMovement) {
-                bars.forEach(function (bar) { return bar.group.classList.remove("active"); });
+                finally { if (e_6) throw e_6.error; }
             }
-            is_dragging = false;
-            is_resizing_left = false;
-            is_resizing_right = false;
-        });
-        $.on(this.$svg, "mouseup", function (e) {
-            _this.bar_being_dragged = null;
-            bars.forEach(function (bar) {
-                var $bar = bar.element;
-                if (!$bar.finaldx)
-                    return;
-                bar.dateChanged();
-                bar.setActionCompleted();
-            });
-        }, null);
-    };
-    Gantt.prototype.get_all_dependent_tasks = function (task_id) {
-        var _this = this;
-        var out = [];
-        var to_process = [task_id];
-        while (to_process.length) {
-            var deps = to_process.reduce(function (acc, curr) {
-                acc = acc.concat(_this.dependency_map[curr]);
-                return acc;
-            }, []);
-            out = out.concat(deps);
-            to_process = deps.filter(function (d) { return !to_process.includes(d); });
         }
-        return out.filter(Boolean);
     };
-    Gantt.prototype.get_snap_position = function (dx) {
-        var odx = dx, rem, position;
-        if (this.view_is(ViewMode.Hour)) {
-            rem = dx % (this.options.columnWidth / 6);
-            position = odx - rem + (rem < this.options.columnWidth / 12 ? 0 : this.options.columnWidth / 6);
-        }
-        else if (this.view_is(ViewMode.Week)) {
-            rem = dx % (this.options.columnWidth / 7);
-            position = odx - rem + (rem < this.options.columnWidth / 14 ? 0 : this.options.columnWidth / 7);
-        }
-        else if (this.view_is(ViewMode.Month)) {
-            rem = dx % (this.options.columnWidth / 30);
-            position = odx - rem + (rem < this.options.columnWidth / 60 ? 0 : this.options.columnWidth / 30);
-        }
-        else {
-            rem = dx % this.options.columnWidth;
-            position = odx - rem + (rem < this.options.columnWidth / 2 ? 0 : this.options.columnWidth);
+    Gantt.prototype.make_dates = function () {
+        var dates = this.get_dates_to_draw();
+        for (var i = 0; i < dates.length; i++) {
+            var date = dates[i];
+            createSVG("text", {
+                x: date.lower_x,
+                y: date.lower_y + 20,
+                innerHTML: date.lower_text,
+                class: "title-2",
+                append_to: this.layers.date,
+            });
+            if (date.middle_text) {
+                createSVG("text", {
+                    x: date.middle_x,
+                    y: date.middle_y,
+                    innerHTML: date.middle_text,
+                    class: "middle-text",
+                    append_to: this.layers.date,
+                });
+            }
+            if (date.upper_text) {
+                var $upper_text = createSVG("text", {
+                    x: date.upper_x,
+                    y: date.upper_y,
+                    innerHTML: date.upper_text,
+                    class: "upper-text",
+                    append_to: this.layers.date,
+                });
+                // remove out-of-bound dates
+                if ($upper_text.getBBox().x2 > this.layers.grid.getBBox().width) {
+                    $upper_text.remove();
+                }
+            }
         }
-        return position;
-    };
-    Gantt.prototype.unselect_all = function () {
-        __spread(this.$svg.querySelectorAll(".bar-wrapper")).forEach(function (el) {
-            el.classList.remove("active");
-        });
     };
-    Gantt.prototype.view_is = function (modes) {
+    Gantt.prototype.get_dates_to_draw = function () {
         var _this = this;
-        if (Array.isArray(modes)) {
-            return modes.some(function (mode) { return _this.options.viewMode === mode; });
-        }
-        return this.options.viewMode === modes;
-    };
-    Gantt.prototype.get_task = function (id) {
-        return this.tasks.find(function (task) {
-            return task.id === id;
-        });
-    };
-    Gantt.prototype.get_bar = function (id) {
-        return this.bars.find(function (bar) {
-            return bar.task.id === id;
+        var last_date = null;
+        var dates = this.dates.map(function (date, i) {
+            var d = _this.get_date_info(date, last_date, i);
+            last_date = date;
+            return d;
         });
+        return dates;
     };
-    Gantt.prototype.show_popup = function (options) {
-        if (!this.popup) {
-            this.popup = new Popup(this.popup_wrapper, this.options.customPopupHtml);
-        }
-        this.popup.show(options);
-    };
-    Gantt.prototype.hide_popup = function () {
-        this.popup && this.popup.hide();
-    };
-    Gantt.prototype.trigger_event = function (event, args) {
-        if (this.options[event]) {
-            this.options[event].apply(null, args);
+    Gantt.prototype.get_date_info = function (date, last_date, i) {
+        if (!last_date) {
+            last_date = DateUtils.add(date, 1, "year");
         }
+        var date_text = {
+            // quarter hour
+            quarterHourUpper: date.getDate() !== last_date.getDate()
+                ? DateUtils.format(date, "D MMM", this.options.language)
+                : "",
+            quarterHourLower: DateUtils.format(date, "HH:mm", this.options.language),
+            // hour
+            hourUpper: date.getDate() !== last_date.getDate()
+                ? DateUtils.format(date, "D MMM", this.options.language)
+                : "",
+            hourLower: DateUtils.format(date, "HH:mm", this.options.language),
+            // quarter day
+            quarterDayUpper: date.getDate() !== last_date.getDate()
+                ? DateUtils.format(date, "D MMM", this.options.language)
+                : "",
+            quarterDayLower: DateUtils.format(date, "HH:mm", this.options.language),
+            // half day
+            halfDayUpper: (date.getDate() !== last_date.getDate())
+                ? (((date.getMonth() !== last_date.getMonth()) || i < 2)
+                    ? DateUtils.format(date, "D MMM", this.options.language)
+                    : DateUtils.format(date, "D", this.options.language))
+                : "",
+            halfDayLower: DateUtils.format(date, "HH:mm", this.options.language),
+            // day
+            dayUpper: ((date.getMonth() !== last_date.getMonth()) || i === 0)
+                ? DateUtils.format(date, "MMMM", this.options.language)
+                : "",
+            dayMiddle: DateUtils.format(date, "ddd", this.options.language),
+            dayLower: DateUtils.format(date, "D", this.options.language),
+            // week
+            weekUpper: date.getMonth() !== last_date.getMonth()
+                ? DateUtils.format(date, "MMMM", this.options.language)
+                : "",
+            weekLower: date.getMonth() !== last_date.getMonth()
+                ? DateUtils.format(date, "D MMM", this.options.language)
+                : DateUtils.format(date, "D", this.options.language),
+            // month
+            monthUpper: date.getFullYear() !== last_date.getFullYear()
+                ? DateUtils.format(date, "YYYY", this.options.language)
+                : "",
+            monthLower: DateUtils.format(date, "MMMM", this.options.language),
+            // year
+            yearUpper: date.getFullYear() !== last_date.getFullYear()
+                ? DateUtils.format(date, "YYYY", this.options.language)
+                : "",
+            yearLower: DateUtils.format(date, "YYYY", this.options.language),
+        };
+        // Descontando 20 para adcionar uma segunda linha de informação no cabeçalho
+        var base_pos = {
+            x: i * this.options.columnWidth,
+            upper_y: this.options.headerHeight - 20 - 25,
+            middle_y: this.options.headerHeight - 20,
+            lower_y: this.options.headerHeight - 20,
+        };
+        var x_pos = {
+            quarterHourUpper: (this.dates.length < 14) ? (this.options.columnWidth) : (this.options.columnWidth * 24 / 2),
+            quarterHourMiddle: this.options.columnWidth / 2,
+            quarterHourLower: this.options.columnWidth / 2,
+            hourUpper: (this.dates.length < 14) ? (this.options.columnWidth) : (this.options.columnWidth * 24 / 2),
+            hourMiddle: this.options.columnWidth / 2,
+            hourLower: this.options.columnWidth / 2,
+            quarterDayUpper: this.options.columnWidth * 4 / 2,
+            quarterDayMiddle: this.options.columnWidth / 2,
+            quarterDayLower: this.options.columnWidth / 2,
+            halfDayUpper: this.options.columnWidth * 2 / 2,
+            halfDayMiddle: this.options.columnWidth / 2,
+            halfDayLower: this.options.columnWidth / 2,
+            dayUpper: (this.dates.length < 15) ? (this.options.columnWidth) : ((this.options.columnWidth * 30) / 2),
+            dayMiddle: this.options.columnWidth / 2 - 12,
+            dayLower: this.options.columnWidth / 2,
+            weekUpper: (this.options.columnWidth * 4) / 2,
+            weekMiddle: 0,
+            weekLower: 0,
+            monthUpper: (this.dates.length < 15) ? (this.options.columnWidth) : ((this.options.columnWidth * 12) / 2),
+            monthMiddle: 0,
+            monthLower: this.options.columnWidth / 2,
+            yearUpper: (this.options.columnWidth * 30) / 2,
+            yearMiddle: this.options.columnWidth / 2,
+            yearLower: this.options.columnWidth / 2,
+        };
+        return {
+            upper_text: date_text[this.options.viewMode + "Upper"],
+            middle_text: date_text[this.options.viewMode + "Middle"],
+            lower_text: date_text[this.options.viewMode + "Lower"],
+            upper_x: base_pos.x + x_pos[this.options.viewMode + "Upper"],
+            upper_y: base_pos.upper_y,
+            middle_x: base_pos.x + x_pos[this.options.viewMode + "Middle"],
+            middle_y: base_pos.middle_y,
+            lower_x: base_pos.x + x_pos[this.options.viewMode + "Lower"],
+            lower_y: base_pos.lower_y,
+            date: date,
+        };
     };
-    Gantt.prototype.get_oldest_starting_date = function () {
-        return this.tasks
-            .map(function (task) { return task._start; })
-            .reduce(function (prev_date, cur_date) {
-            return cur_date <= prev_date ? cur_date : prev_date;
-        });
-    };
-    Gantt.prototype.clear = function () {
-        this.$svg.innerHTML = '';
-    };
-    return Gantt;
-}());
-function generate_id(task) {
-    return task.name + "_" + Math.random().toString(36).slice(2, 12);
-}
-
-var GanttComponent = /** @class */ (function () {
-    function GanttComponent() {
-        this.multipleTaskPerLine = false;
-        this.showSideTable = true;
-        this.viewMode = ViewMode.Day;
-        this.allowMovement = true;
-        this.hasPopup = true;
-        this.fullWidth = false;
-        this.showOnlyHours = false;
-        this.showOnlyDays = false;
-        this.taskClicked = new EventEmitter();
-        this.taskDateChanged = new EventEmitter();
-        this.viewChanged = new EventEmitter();
-    }
-    GanttComponent.prototype.ngOnInit = function () {
-        this._validateViewMode();
-        this._validateTasks();
-    };
-    GanttComponent.prototype.ngAfterViewInit = function () {
+    Gantt.prototype.make_bars = function () {
         var _this = this;
-        if (this.fullWidth) {
-            this.containerWidth = this.outer.nativeElement.offsetWidth - this.side.nativeElement.offsetWidth;
-        }
-        this._gantt = new Gantt("#gantt", this._filterTask(this.tasks), {
-            viewMode: this.viewMode,
-            marginBeforeStart: this.marginBeforeStart,
-            marginAfterEnd: this.marginAfterEnd,
-            language: "pt-br",
-            allowMovement: this.allowMovement,
-            hasPopup: this.hasPopup,
-            containerWidth: this.containerWidth,
-            showOnlyHours: this.showOnlyHours,
-            showOnlyDays: this.showOnlyDays,
-            onClick: function (task) { return _this.taskClicked.emit(task); },
-            onDateChange: function (task, start, end) { return _this.taskDateChanged.emit({ task: task, start: start, end: end }); },
-            onViewChange: function (viewMode) { return _this.viewChanged.emit(viewMode); },
+        this.bars = this.tasks.map(function (task) {
+            var bar = new Bar(_this, task);
+            _this.layers.bar.appendChild(bar.group);
+            return bar;
         });
     };
-    GanttComponent.prototype.ngOnChanges = function (changes) {
-        if (!this._gantt) {
-            return;
-        }
-        if (changes.viewMode) {
-            this._gantt.options.viewMode = changes.viewMode.currentValue;
-            this._gantt.change_view_mode();
+    Gantt.prototype.make_arrows = function () {
+        var e_7, _a;
+        var _this = this;
+        this.arrows = [];
+        var _loop_1 = function (task) {
+            var arrows = [];
+            arrows = task.dependencies
+                .map(function (task_id) {
+                var dependency = _this.get_task(task_id);
+                if (!dependency)
+                    return;
+                var arrow = new Arrow(_this, _this.bars[dependency._index], // from_task
+                _this.bars[task._index] // to_task
+                );
+                _this.layers.arrow.appendChild(arrow.element);
+                return arrow;
+            })
+                .filter(Boolean); // filter falsy values
+            this_1.arrows = this_1.arrows.concat(arrows);
+        };
+        var this_1 = this;
+        try {
+            for (var _b = __values(this.tasks), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var task = _c.value;
+                _loop_1(task);
+            }
         }
-        if (changes.tasks) {
-            this._gantt.refresh(this._filterTask(changes.tasks.currentValue));
+        catch (e_7_1) { e_7 = { error: e_7_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_7) throw e_7.error; }
         }
     };
-    GanttComponent.prototype._filterTask = function (tasksGroups) {
-        var tasks = [];
-        if (this.multipleTaskPerLine) {
-            tasksGroups.forEach(function (group, index) {
-                tasks.push.apply(tasks, __spread(group.tasks.map(function (task) {
-                    return __assign(__assign({}, task), { _row_id: index });
-                })));
-            }, []);
+    Gantt.prototype.map_arrows_on_bars = function () {
+        var e_8, _a;
+        var _loop_2 = function (bar) {
+            bar.arrows = this_2.arrows.filter(function (arrow) {
+                return (arrow.fromTask.task.id === bar.task.id ||
+                    arrow.toTask.task.id === bar.task.id);
+            });
+        };
+        var this_2 = this;
+        try {
+            for (var _b = __values(this.bars), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var bar = _c.value;
+                _loop_2(bar);
+            }
         }
-        else {
-            var i_1 = 0;
-            tasksGroups.forEach(function (group) {
-                tasks.push.apply(tasks, __spread(group.tasks.map(function (task) {
-                    return __assign(__assign({}, task), { _row_id: i_1++ });
-                })));
-            }, []);
+        catch (e_8_1) { e_8 = { error: e_8_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_8) throw e_8.error; }
         }
-        return tasks;
     };
-    GanttComponent.prototype._validateViewMode = function () {
-        if (![
-            ViewMode.QuarterHour,
-            ViewMode.Hour,
-            ViewMode.QuarterDay,
-            ViewMode.HalfDay,
-            ViewMode.Day,
-            ViewMode.Week,
-            ViewMode.Month,
-            ViewMode.Year,
-        ].includes(this.viewMode)) {
-            throw new Error("Invalid gantt view mode");
+    Gantt.prototype.set_width = function () {
+        var cur_width = this.$svg.getBoundingClientRect().width;
+        var actual_width = this.$svg
+            .querySelector(".grid .grid-row")
+            .getAttribute("width");
+        if (cur_width < actual_width) {
+            this.$svg.setAttribute("width", actual_width);
         }
     };
-    GanttComponent.prototype._validateTasks = function () {
-        this.tasks.forEach(function (group) {
-            group.tasks.forEach(function (task) {
-                if (task.start > task.end) {
-                    throw new Error("invalid task. The start date must be less than the end date.");
-                }
-            });
-        });
-    };
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "columnTitle", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "multipleTaskPerLine", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "showSideTable", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "viewMode", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "tasks", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "marginBeforeStart", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "marginAfterEnd", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "allowMovement", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "hasPopup", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "containerWidth", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "fullWidth", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "showOnlyHours", void 0);
-    __decorate([
-        Input()
-    ], GanttComponent.prototype, "showOnlyDays", void 0);
-    __decorate([
-        Output()
-    ], GanttComponent.prototype, "taskClicked", void 0);
-    __decorate([
-        Output()
-    ], GanttComponent.prototype, "taskDateChanged", void 0);
-    __decorate([
-        Output()
-    ], GanttComponent.prototype, "viewChanged", void 0);
-    __decorate([
-        ViewChild('outer')
-    ], GanttComponent.prototype, "outer", void 0);
-    __decorate([
-        ViewChild('side')
-    ], GanttComponent.prototype, "side", void 0);
-    GanttComponent = __decorate([
-        Component({
-            selector: "s-gantt",
-            template: "<div class=\"outer\" #outer>\n    <div #side>\n        <gantt-side-table\n            *ngIf=\"showSideTable\"\n            [tasks]=\"tasks\"\n            [columnTitle]=\"columnTitle\"\n            [multipleTaskPerLine]=\"multipleTaskPerLine\">\n        </gantt-side-table>\n    </div>\n    <svg id=\"gantt\"></svg>\n</div>\n",
-            encapsulation: ViewEncapsulation.None,
-            styles: [".outer{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:start;align-items:flex-start;-ms-flex-line-pack:center;align-content:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-direction:row;flex-direction:row}", ".gantt{border:1px solid #e0e0e0}.gantt .weekend-highlight{fill:#b8c2cc;opacity:.5;stroke:#ebeff2;stroke-width:1}.gantt .grid-background{fill:none}.gantt .grid-header,.gantt .grid-row{fill:#fff}.gantt .grid-row:nth-child(even){fill:#f5f5f5}.gantt .row-line{stroke:#ebeff2}.gantt .tick{stroke:#e0e0e0;stroke-width:.4}.gantt .tick.thick{stroke:#428bca;stroke-width:2}.gantt .today-highlight{fill:#ffe979;opacity:.5}.gantt .arrow{fill:none;stroke:#666;stroke-width:1.4}.gantt .bar{opacity:.8;stroke:#8d99a6;stroke-width:0;transition:stroke-width .3s;-webkit-user-select:none;-ms-user-select:none;user-select:none}.gantt .bar-invalid{fill:transparent;stroke:#8d99a6;stroke-dasharray:5;stroke-width:1}.gantt .bar-invalid~.bar-label{fill:#555}.gantt .bar-label{fill:#fff;text-anchor:middle;font-size:12px;font-weight:lighter}.gantt .bar-label.big{fill:#555;text-anchor:start}.gantt .bar-wrapper{cursor:pointer;outline:0}.gantt .bar-wrapper.active .bar,.gantt .bar-wrapper:hover .bar{opacity:1}.gantt .bar-wrapper.active .bar{stroke:#212533;stroke-width:2}.gantt .lower-text,.gantt .upper-text{font-size:12px;text-anchor:middle}.gantt .upper-text{fill:#555}.gantt .lower-text{fill:#333}.gantt .hide{display:none}.gantt-container{border-left:1px solid #e0e0e0;font-size:12px;overflow:auto;position:relative}.gantt-container .title-1{fill:#999;font-size:12px;font-weight:400;line-height:150%;text-anchor:middle}.gantt-container .title-2{fill:#333;font-size:14px;font-weight:400;line-height:150%;text-anchor:middle}.gantt-container .popup-wrapper{left:0;position:absolute;top:0}.gantt-container .popup-wrapper .popup{background:#0e1119;border-radius:2px;color:#fff;padding:8px;font-family:\"Open Sans\" sans-serif;line-height:150%;font-weight:400}.gantt-container .popup-wrapper .popup .wrp-title{border-bottom:1px solid #525966;padding-bottom:10px}.gantt-container .popup-wrapper .popup .wrp-title .title{font-size:14px}.gantt-container .popup-wrapper .popup .wrp-subtitle{color:#dfe2e5;padding-top:10px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.gantt-container .popup-wrapper .popup .wrp-subtitle .icon{margin-right:10px}.gantt-container .popup-wrapper .popup .wrp-subtitle .subtitle{font-size:12px}.gantt-container .popup-wrapper .popup .pointer{border:6px solid transparent;border-top-color:#0e1119;height:6px;margin-left:-4px;position:absolute}"]
-        })
-    ], GanttComponent);
-    return GanttComponent;
-}());
-
-var SideTableComponent = /** @class */ (function () {
-    function SideTableComponent() {
-        this.ROW_HEIGHT = 44;
-        this.multipleTaskPerLine = false;
-    }
-    SideTableComponent.prototype.ngOnInit = function () {
-        this._removeEmptyTasks();
-    };
-    SideTableComponent.prototype._removeEmptyTasks = function () {
-        this.tasks = this.tasks.filter(function (task) { return task.tasks.length; });
-    };
-    __decorate([
-        Input()
-    ], SideTableComponent.prototype, "columnTitle", void 0);
-    __decorate([
-        Input()
-    ], SideTableComponent.prototype, "tasks", void 0);
-    __decorate([
-        Input()
-    ], SideTableComponent.prototype, "multipleTaskPerLine", void 0);
-    SideTableComponent = __decorate([
-        Component({
-            selector: 'gantt-side-table',
-            template: "<div class=\"side-table\">\n    <div class=\"column-title\">\n        <span>{{ columnTitle }}</span>\n    </div>\n    <div class=\"tasks\" >\n        <div\n            *ngFor=\"let task of tasks; let i = index\"\n            class=\"task\"\n            [ngStyle]=\"{'height.px': multipleTaskPerLine\n                    ? ROW_HEIGHT\n                    : ROW_HEIGHT * task.tasks.length}\"\n            [sTooltip]=\"task.title.length > 20 || task.subtitle.length > 20 ? '<span><strong>' + task.title + ' </strong></br><span> ' + task.subtitle + ' </span></span>' : '' \"\n            [escape]=\"false\">\n                <div class=\"title\">\n                    {{ task.title }}\n                </div>\n                <div class=\"subtitle\">\n                    {{ task.subtitle }}\n                </div>\n        </div>\n    </div>\n</div>\n",
-            styles: [".side-table{background:#fff;height:100%;min-width:175px}.side-table .column-title{height:106px;border:1px solid #e0e0e0;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center;padding:8px}.side-table .column-title span{font-family:\"Open Sans\" sans-serif;font-size:14px;font-weight:700;line-height:150%}.side-table .task{-ms-flex-align:center;align-items:center;background-color:#fff;border:1px solid #e0e0e0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:\"Open Sans\",sans-serif;font-weight:400;-ms-flex-pack:center;justify-content:center;line-height:150%;padding:0 5px}.side-table .task .title{color:#333;font-size:14px;max-width:300px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.side-table .task .subtitle{color:#999;font-size:12px;max-width:300px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}"]
-        })
-    ], SideTableComponent);
-    return SideTableComponent;
-}());
-
-var GanttModule = /** @class */ (function () {
-    function GanttModule() {
-    }
-    GanttModule = __decorate([
-        NgModule({
-            imports: [CommonModule, TooltipModule],
-            declarations: [
-                GanttComponent,
-                SideTableComponent,
-            ],
-            exports: [GanttComponent],
-        })
-    ], GanttModule);
-    return GanttModule;
-}());
-
-var ThumbnailSize;
-(function (ThumbnailSize) {
-    ThumbnailSize["Small"] = "small";
-    ThumbnailSize["Medium"] = "medium";
-    ThumbnailSize["Large"] = "large";
-})(ThumbnailSize || (ThumbnailSize = {}));
-
-var ThumbnailService = /** @class */ (function () {
-    function ThumbnailService() {
-    }
-    ThumbnailService.prototype.getBinaryFile = function (img) {
+    Gantt.prototype.set_scroll_position = function () {
+        var parent_element = this.$svg.parentElement;
+        if (!parent_element)
+            return;
+        var hours_before_first_task = DateUtils.diff(this.get_oldest_starting_date(), this.minDate, "hour");
+        var scroll_pos = (hours_before_first_task / this.options.step) *
+            this.options.columnWidth -
+            this.options.columnWidth;
+        parent_element.scrollLeft = scroll_pos;
+    };
+    Gantt.prototype.bind_grid_click = function () {
         var _this = this;
-        return new Promise(function (resolve) {
-            var getOrientation = _this.getOrientation.bind(_this);
-            var http = new XMLHttpRequest();
-            http.addEventListener("load", function () {
-                if (http.readyState === 4 && (http.status == 200 || http.status === 0)) {
-                    var orientation_1 = getOrientation(http.response);
-                    http = null;
-                    resolve(orientation_1);
-                }
-            });
-            http.addEventListener("error", function () {
-                http = null;
-                throw new Error("Não foi possível carregar a imagem");
-            });
-            http.open("GET", img.src, true);
-            http.responseType = "arraybuffer";
-            http.send(null);
+        $.on(this.$svg, this.options.popupTrigger, ".grid-row, .grid-header", function () {
+            _this.unselect_all();
+            _this.hide_popup();
         });
     };
-    /**
-     * Retorna a tag da orientação EXIF {-1} Não definido, {-2} Não é formato JPEG, {1, 2, 3, 4, 5, 6, 7, 8} valores da orientação.
-     */
-    ThumbnailService.prototype.getOrientation = function (file) {
-        var view = new DataView(file);
-        if (view.getUint16(0, false) != 0xffd8)
-            return -2; // not jpeg
-        var length = view.byteLength;
-        var offset = 2;
-        while (offset < length) {
-            var marker = view.getUint16(offset, false);
-            offset += 2;
-            if (marker == 0xffe1) {
-                if (view.getUint32((offset += 2), false) != 0x45786966) {
-                    return -1; // not defined
+    Gantt.prototype.bind_bar_events = function () {
+        var _this = this;
+        var is_dragging = false;
+        var x_on_start = 0;
+        var is_resizing_left = false;
+        var is_resizing_right = false;
+        var parent_bar_id = null;
+        var bars = [];
+        this.bar_being_dragged = null;
+        function action_in_progress() {
+            return is_dragging || is_resizing_left || is_resizing_right;
+        }
+        $.on(this.$svg, "mousedown", ".bar-wrapper, .handle", function (e, element) {
+            var bar_wrapper = $.closest(".bar-wrapper", element);
+            if (element.classList.contains("left")) {
+                is_resizing_left = true;
+            }
+            else if (element.classList.contains("right")) {
+                is_resizing_right = true;
+            }
+            else if (element.classList.contains("bar-wrapper") && _this.options.allowMovement) {
+                is_dragging = true;
+            }
+            bar_wrapper.classList.add("active");
+            x_on_start = e.offsetX;
+            parent_bar_id = bar_wrapper.getAttribute("data-id");
+            var ids = __spread([
+                parent_bar_id
+            ], _this.get_all_dependent_tasks(parent_bar_id));
+            bars = ids.map(function (id) { return _this.get_bar(id); });
+            _this.bar_being_dragged = parent_bar_id;
+            bars.forEach(function (bar) {
+                var $bar = bar.element;
+                $bar.ox = $bar.getX();
+                $bar.oy = $bar.getY();
+                $bar.owidth = $bar.getWidth();
+                $bar.finaldx = 0;
+            });
+        });
+        $.on(this.$svg, "mousemove", function (e) {
+            if (!action_in_progress()) {
+                return;
+            }
+            var dx = e.offsetX - x_on_start;
+            bars.forEach(function (bar) {
+                var $bar = bar.element;
+                $bar.finaldx = _this.get_snap_position(dx);
+                _this.hide_popup();
+                if (is_resizing_left) {
+                    if (parent_bar_id === bar.task.id) {
+                        bar.updateBarPosition({
+                            x: $bar.ox + $bar.finaldx,
+                            width: $bar.owidth - $bar.finaldx,
+                        });
+                    }
+                    else {
+                        bar.updateBarPosition({
+                            x: $bar.ox + $bar.finaldx,
+                        });
+                    }
                 }
-                var little = view.getUint16((offset += 6), false) == 0x4949;
-                offset += view.getUint32(offset + 4, little);
-                var tags = view.getUint16(offset, little);
-                offset += 2;
-                for (var i = 0; i < tags; i++)
-                    if (view.getUint16(offset + i * 12, little) == 0x0112)
-                        return view.getUint16(offset + i * 12 + 8, little);
-                // tslint:disable-next-line: no-bitwise
+                else if (is_resizing_right) {
+                    if (parent_bar_id === bar.task.id) {
+                        bar.updateBarPosition({
+                            width: $bar.owidth + $bar.finaldx,
+                        });
+                    }
+                }
+                else if (is_dragging) {
+                    bar.updateBarPosition({ x: $bar.ox + $bar.finaldx });
+                }
+            });
+        }, null);
+        document.addEventListener("mouseup", function (e) {
+            if (is_dragging || is_resizing_left || is_resizing_right || !_this.options.allowMovement) {
+                bars.forEach(function (bar) { return bar.group.classList.remove("active"); });
             }
-            else if ((marker & 0xff00) != 0xff00)
-                break;
-            else
-                offset += view.getUint16(offset, false);
-        }
-        return -1; // not defined
-    };
-    ThumbnailService = __decorate([
-        Injectable()
-    ], ThumbnailService);
-    return ThumbnailService;
-}());
-
-var ThumbnailComponent = /** @class */ (function () {
-    function ThumbnailComponent(thumbnailService) {
-        this.thumbnailService = thumbnailService;
-        this.fallback = false;
-        this.id = "s-thumbnail-" + ThumbnailComponent_1.nextId++;
-        this.size = ThumbnailSize.Medium;
-        this.iconClass = "far fa-image";
-        this.hasAction = false;
-        this.actionIconClass = "fas fa-camera";
-        this.isTile = false;
-        this.isBrand = false;
-        this.ngUnsubscribe = new Subject();
-    }
-    ThumbnailComponent_1 = ThumbnailComponent;
-    ThumbnailComponent.prototype.ngOnDestroy = function () {
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
+            is_dragging = false;
+            is_resizing_left = false;
+            is_resizing_right = false;
+        });
+        $.on(this.$svg, "mouseup", function (e) {
+            _this.bar_being_dragged = null;
+            bars.forEach(function (bar) {
+                var $bar = bar.element;
+                if (!$bar.finaldx)
+                    return;
+                bar.dateChanged();
+                bar.setActionCompleted();
+            });
+        }, null);
     };
-    ThumbnailComponent.prototype.ngAfterViewInit = function () {
+    Gantt.prototype.get_all_dependent_tasks = function (task_id) {
         var _this = this;
-        if (this.imgEl) {
-            this.imgEl.nativeElement.addEventListener("load", function () {
-                from(_this.thumbnailService.getBinaryFile(_this.imgEl.nativeElement))
-                    .pipe(takeUntil(_this.ngUnsubscribe))
-                    .subscribe(function (orientation) { return (_this.orientation = orientation); });
-            });
+        var out = [];
+        var to_process = [task_id];
+        while (to_process.length) {
+            var deps = to_process.reduce(function (acc, curr) {
+                acc = acc.concat(_this.dependency_map[curr]);
+                return acc;
+            }, []);
+            out = out.concat(deps);
+            to_process = deps.filter(function (d) { return !to_process.includes(d); });
         }
+        return out.filter(Boolean);
     };
-    var ThumbnailComponent_1;
-    ThumbnailComponent.nextId = 0;
-    ThumbnailComponent.ctorParameters = function () { return [
-        { type: ThumbnailService }
-    ]; };
-    __decorate([
-        ViewChild("img", { static: false })
-    ], ThumbnailComponent.prototype, "imgEl", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "id", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "size", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "imageSource", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "imageFallback", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "imageAlt", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "iconClass", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "hasAction", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "actionIconClass", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "isTile", void 0);
-    __decorate([
-        Input()
-    ], ThumbnailComponent.prototype, "isBrand", void 0);
-    ThumbnailComponent = ThumbnailComponent_1 = __decorate([
-        Component({
-            selector: "s-thumbnail",
-            template: "<div\n    [id]=\"id\"\n    class=\"thumbnail-container thumbnail-container--{{size}}\"\n    [ngClass]=\"{\n        'thumbnail-container--with-action': hasAction,\n        'thumbnail-container--brand': isBrand\n    }\">\n    <div\n        [id]=\"id + '-image-container'\"\n        *ngIf=\"imageSource || imageFallback\"\n        class=\"image-container\"\n        [ngClass]=\"{\n            'image-container--rounded': !isBrand\n        }\">\n        <img\n            #img\n            [id]=\"id + '-image'\"\n            (error)=\"fallback = true\"\n            [src]=\"imageSource\"\n            [alt]=\"imageAlt\"\n            *ngIf=\"!fallback\"\n            [ngClass]=\"{\n                'smallThumbnail': isTile,\n                'exif-orientation-2': orientation == 2,\n                'exif-orientation-3': orientation == 3,\n                'exif-orientation-4': orientation == 4,\n                'exif-orientation-5': orientation == 5,\n                'exif-orientation-6': orientation == 6,\n                'exif-orientation-7': orientation == 7,\n                'exif-orientation-8': orientation == 8\n            }\"/>\n\n        <img\n            #img\n            [id]=\"id + '-image-fallback'\"\n            (error)=\"imageFallback = undefined\"\n            [src]=\"imageFallback\"\n            [alt]=\"imageAlt\"\n            *ngIf=\"fallback && imageFallback\"\n            [ngClass]=\"{\n                'smallThumbnail': isTile,\n                'exif-orientation-2': orientation == 2,\n                'exif-orientation-3': orientation == 3,\n                'exif-orientation-4': orientation == 4,\n                'exif-orientation-5': orientation == 5,\n                'exif-orientation-6': orientation == 6,\n                'exif-orientation-7': orientation == 7,\n                'exif-orientation-8': orientation == 8\n            }\"/>\n\n        <i\n            *ngIf=\"fallback && !imageFallback\"\n            ngClass=\"far fa-image\"\n            class=\"fallback-img-color\">\n        </i>\n    </div>\n    <div\n        [id]=\"id + '-action-icon-container'\"\n        *ngIf=\"hasAction\"\n        class=\"action-icon-container action-icon-container--{{size}}\">\n        <span\n            [id]=\"id + '-action-icon'\"\n            [class]=\"actionIconClass\"\n            aria-hidden=\"true\">\n        </span>\n    </div>\n    <div\n        [id]=\"id + '-icon-container'\"\n        *ngIf=\"!imageSource && !imageFallback\"\n        class=\"icon-container icon-container--{{size}}\"\n        [ngClass]=\"{'image-container--rounded': !isBrand}\">\n        <span\n            [id]=\"id + '-icon'\"\n            [class]=\"iconClass\"\n            aria-hidden=\"true\">\n        </span>\n    </div>\n\n    <ng-content></ng-content>\n</div>\n",
-            styles: [":host{display:inline-block}.thumbnail-container{color:#fff;position:relative;text-align:center}.thumbnail-container--large{font-size:50px;height:100px;width:100px}.thumbnail-container--large.thumbnail-container--brand{width:200px}.thumbnail-container--medium{font-size:40px;height:70px;width:70px}.thumbnail-container--medium.thumbnail-container--brand{width:140px}.thumbnail-container--small{font-size:22px;height:40px;width:40px}.thumbnail-container--small.thumbnail-container--brand{width:80px}.thumbnail-container--with-action{cursor:pointer}.action-icon-container{background-color:#428bca;border-radius:50%;bottom:0;position:absolute;right:0}.action-icon-container--large,.action-icon-container--medium{font-size:10pt;height:25px;padding:3px;width:25px}.action-icon-container--small{font-size:6pt;height:16px;padding:2px;width:16px}.icon-container,.image-container{-ms-flex-align:center;align-items:center;height:100%;overflow:hidden;width:100%}.icon-container--rounded,.image-container--rounded{border-radius:50%}.smallThumbnail{height:40px!important}.icon-container{background-color:#ccc;color:#fff}.icon-container--large{line-height:98px}.icon-container--medium{line-height:68px}.icon-container--small{line-height:38px}.image-container{-ms-flex-align:center;align-items:center;background-color:#ccc;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.image-container img{width:100%}.image-container img.exif-orientation-2{transform:rotateY(180deg)}.image-container img.exif-orientation-3{transform:rotate(180deg)}.image-container img.exif-orientation-4{transform:rotate(180deg) rotateY(180deg)}.image-container img.exif-orientation-5{transform:rotate(270deg) rotateY(180deg)}.image-container img.exif-orientation-6{transform:rotate(90deg)}.image-container img.exif-orientation-7{transform:rotate(90deg) rotateY(180deg)}.image-container img.exif-orientation-8{transform:rotate(270deg)}.fallback-img-color{color:#fff}"]
-        })
-    ], ThumbnailComponent);
-    return ThumbnailComponent;
-}());
-
-var GlobalSearchSizeEnum;
-(function (GlobalSearchSizeEnum) {
-    GlobalSearchSizeEnum["STANDARD"] = "STANDARD";
-    GlobalSearchSizeEnum["MEDIUM"] = "MEDIUM";
-    GlobalSearchSizeEnum["SMALL"] = "SMALL";
-})(GlobalSearchSizeEnum || (GlobalSearchSizeEnum = {}));
-
-var GlobalSearchDropdownItemComponent = /** @class */ (function () {
-    function GlobalSearchDropdownItemComponent() {
-        this.id = "s-global-search-dropdown-item-" + GlobalSearchDropdownItemComponent_1.nextId++;
-        this.size = GlobalSearchSizeEnum.STANDARD;
-        this.buttonClick = new EventEmitter();
-    }
-    GlobalSearchDropdownItemComponent_1 = GlobalSearchDropdownItemComponent;
-    GlobalSearchDropdownItemComponent.prototype.isStandardSize = function () {
-        return this.size === GlobalSearchSizeEnum.STANDARD;
+    Gantt.prototype.get_snap_position = function (dx) {
+        var odx = dx, rem, position;
+        if (this.view_is(ViewMode.Hour)) {
+            rem = dx % (this.options.columnWidth / 6);
+            position = odx - rem + (rem < this.options.columnWidth / 12 ? 0 : this.options.columnWidth / 6);
+        }
+        else if (this.view_is(ViewMode.Week)) {
+            rem = dx % (this.options.columnWidth / 7);
+            position = odx - rem + (rem < this.options.columnWidth / 14 ? 0 : this.options.columnWidth / 7);
+        }
+        else if (this.view_is(ViewMode.Month)) {
+            rem = dx % (this.options.columnWidth / 30);
+            position = odx - rem + (rem < this.options.columnWidth / 60 ? 0 : this.options.columnWidth / 30);
+        }
+        else {
+            rem = dx % this.options.columnWidth;
+            position = odx - rem + (rem < this.options.columnWidth / 2 ? 0 : this.options.columnWidth);
+        }
+        return position;
     };
-    GlobalSearchDropdownItemComponent.prototype.isMediumSize = function () {
-        return this.size === GlobalSearchSizeEnum.MEDIUM;
+    Gantt.prototype.unselect_all = function () {
+        __spread(this.$svg.querySelectorAll(".bar-wrapper")).forEach(function (el) {
+            el.classList.remove("active");
+        });
     };
-    GlobalSearchDropdownItemComponent.prototype.isSmallSize = function () {
-        return this.size === GlobalSearchSizeEnum.SMALL;
+    Gantt.prototype.view_is = function (modes) {
+        var _this = this;
+        if (Array.isArray(modes)) {
+            return modes.some(function (mode) { return _this.options.viewMode === mode; });
+        }
+        return this.options.viewMode === modes;
     };
-    GlobalSearchDropdownItemComponent.prototype.getImageSize = function () {
-        return this.isStandardSize() ? "medium" : "small";
+    Gantt.prototype.get_task = function (id) {
+        return this.tasks.find(function (task) {
+            return task.id === id;
+        });
     };
-    var GlobalSearchDropdownItemComponent_1;
-    GlobalSearchDropdownItemComponent.nextId = 0;
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "id", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "primaryLabel", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "secondaryEmptyLabel", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "tertiaryEmptyLabel", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "imageSource", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "imageAlt", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "iconClass", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "secondaryLabel", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "tertiaryLabel", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "size", void 0);
-    __decorate([
-        Input()
-    ], GlobalSearchDropdownItemComponent.prototype, "template", void 0);
-    __decorate([
-        Output()
-    ], GlobalSearchDropdownItemComponent.prototype, "buttonClick", void 0);
-    __decorate([
-        ContentChild(ThumbnailComponent, { static: true })
-    ], GlobalSearchDropdownItemComponent.prototype, "thumbnailComponent", void 0);
-    __decorate([
-        ViewChild(TemplateRef, { static: true })
-    ], GlobalSearchDropdownItemComponent.prototype, "content", void 0);
-    GlobalSearchDropdownItemComponent = GlobalSearchDropdownItemComponent_1 = __decorate([
-        Component({
-            selector: "s-global-search-dropdown-item",
-            template: "<ng-template>\n    <div class=\"{{isSmallSize() ? 'ui-g container' : 'container'}}\">\n        <ng-content select=\"s-thumbnail\"></ng-content>\n        <s-thumbnail [id]=\"id + '-thumbnail'\"\n            *ngIf=\"!thumbnailComponent && (imageSource || iconClass) && !isSmallSize()\" [imageSource]=\"imageSource\"\n            [imageAlt]=\"imageAlt || primaryLabel\" [iconClass]=\"iconClass\" [size]=\"getImageSize()\"></s-thumbnail>\n\n        <div class=\"global-search-item__container {{!isSmallSize() ? 'global-search-item__container--width-60' : ''}}\">\n            <div #titleTemplate>\n                <ng-content select=\"[titleTemplate]\"></ng-content>\n            </div>\n            <s-button styleClass=\"no-padding\" class=\"{{isSmallSize() ? 'ui-g-6 no-padding' : ''}}\" [id]=\"id + '-title'\"\n                *ngIf=\"!titleTemplate.children.length\" priority=\"link\" [pTooltip]=\"primaryLabel\" [label]=\"primaryLabel\"\n                size=\"small\" (onClick)=\"buttonClick.emit($event)\">\n            </s-button>\n\n            <div #labelTemplate>\n                <ng-content select=\"[labelTemplate]\"></ng-content>\n            </div>\n            <span [id]=\"id + '-label'\" [ngClass]=\"{'ui-g-6 global-search-item__text-align--right': isSmallSize(), 'global-search-item__italic' : !secondaryLabel}\"\n                class=\"label\" *ngIf=\"!labelTemplate.children.length\"\n                [pTooltip]=\"secondaryLabel\" tooltipPosition=\"top\" showDelay=\"500\">{{ secondaryLabel ? secondaryLabel : secondaryEmptyLabel }}</span>\n\n            <div #descriptionTemplate>\n                <ng-content select=\"[descriptionTemplate]\"></ng-content>\n            </div>\n            <span [id]=\"id + '-description'\" class=\"description\"\n                [ngClass]=\"{'global-search-item__italic' : !secondaryLabel}\"\n                *ngIf=\" !descriptionTemplate.children.length && !isMediumSize() && !isSmallSize()\"\n                [pTooltip]=\"tertiaryLabel\" tooltipPosition=\"top\" showDelay=\"500\">{{ tertiaryLabel ? tertiaryLabel : tertiaryEmptyLabel }}</span>\n        </div>\n        <div class=\"global-search-item__container--width-40 global-search__dropdown--template\" *ngIf=\"!isSmallSize()\">\n            <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n        </div>\n    </div>\n</ng-template>\n",
-            styles: [".container{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;height:100%;border-bottom:1px solid #ccc;padding:15px 5px;margin:0 10px}::ng-deep .no-padding{padding:0!important;min-width:0!important}::ng-deep .s-button-with-text{min-width:0!important}.global-search-item__italic{font-style:italic}.global-search-item__container{margin-left:10px;width:100%}.global-search-item__container,.global-search-item__container span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.global-search-item__container .label{color:#333;display:block}.global-search-item__container .description{color:#999;display:block}.global-search-item__container--width-60{width:60%}.global-search-item__container--width-40{width:40%}.global-search-item__text-align--right{text-align:right;padding:2px 0 0 15px}.global-search__dropdown--template{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;text-align:right!important}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.global-search-item__container{-ms-flex:1;flex:1}}@media (max-width:767px){.global-search-item__container,.global-search-item__container span{white-space:normal}}.global-search-item__container:only-child{margin-left:0}"]
-        })
-    ], GlobalSearchDropdownItemComponent);
-    return GlobalSearchDropdownItemComponent;
-}());
-
-var GlobalSearchComponent = /** @class */ (function () {
-    function GlobalSearchComponent(cdr) {
-        this.cdr = cdr;
-        this.id = "s-global-search-" + GlobalSearchDropdownItemComponent.nextId++;
-        this.delay = 500;
-        this.isLoading = false;
-        this.showFooter = true;
-        this.onSearch = new EventEmitter();
-        this.onFocus = new EventEmitter();
-        this.onShowMore = new EventEmitter();
-        this.wasSearched = false;
-        this.isModalLoading = false;
-        this.expanded = true;
-    }
-    GlobalSearchComponent.prototype.onChange = function () {
-        var _this = this;
-        var search = this.search;
-        setTimeout(function () {
-            if (_this.search === search) {
-                _this.canShowGlobalSearchActive();
-                _this.onSearch.emit(_this.search);
-            }
-        }, this.delay);
+    Gantt.prototype.get_bar = function (id) {
+        return this.bars.find(function (bar) {
+            return bar.task.id === id;
+        });
     };
-    GlobalSearchComponent.prototype.focusIn = function () {
-        this.onFocus.emit(true);
+    Gantt.prototype.show_popup = function (options) {
+        if (!this.popup) {
+            this.popup = new Popup(this.popup_wrapper, this.options.customPopupHtml);
+        }
+        this.popup.show(options);
     };
-    GlobalSearchComponent.prototype.focusOut = function () {
-        this.onFocus.emit(false);
+    Gantt.prototype.hide_popup = function () {
+        this.popup && this.popup.hide();
     };
-    GlobalSearchComponent.prototype.showMore = function () {
-        this.onShowMore.emit();
+    Gantt.prototype.trigger_event = function (event, args) {
+        if (this.options[event]) {
+            this.options[event].apply(null, args);
+        }
     };
-    GlobalSearchComponent.prototype.removeActiveClassByGlobalSearch = function () {
-        ExportUtils.removeClass(this.globalSearch, "global-search__input-active");
+    Gantt.prototype.get_oldest_starting_date = function () {
+        return this.tasks
+            .map(function (task) { return task._start; })
+            .reduce(function (prev_date, cur_date) {
+            return cur_date <= prev_date ? cur_date : prev_date;
+        });
     };
-    GlobalSearchComponent.prototype.close = function () {
-        this.search = null;
-        this.wasSearched = false;
-        this.dropdownItens = null;
-        this.isModalLoading = false;
-        this.removeActiveClassByGlobalSearch();
+    Gantt.prototype.clear = function () {
+        this.$svg.innerHTML = '';
     };
-    GlobalSearchComponent.prototype.canShowGlobalSearchActive = function () {
-        this.wasSearched = !!this.search;
-        if (this.search) {
-            ExportUtils.addClass(this.globalSearch, "global-search__input-active");
+    return Gantt;
+}());
+function generate_id(task) {
+    return task.name + "_" + Math.random().toString(36).slice(2, 12);
+}
+
+var GanttComponent = /** @class */ (function () {
+    function GanttComponent() {
+        this.multipleTaskPerLine = false;
+        this.showSideTable = true;
+        this.viewMode = ViewMode.Day;
+        this.allowMovement = true;
+        this.hasPopup = true;
+        this.fullWidth = false;
+        this.showOnlyHours = false;
+        this.showOnlyDays = false;
+        this.taskClicked = new EventEmitter();
+        this.taskDateChanged = new EventEmitter();
+        this.viewChanged = new EventEmitter();
+    }
+    GanttComponent.prototype.ngOnInit = function () {
+        this._validateViewMode();
+        this._validateTasks();
+    };
+    GanttComponent.prototype.ngAfterViewInit = function () {
+        var _this = this;
+        if (this.fullWidth) {
+            this.containerWidth = this.outer.nativeElement.offsetWidth - this.side.nativeElement.offsetWidth;
+        }
+        this._gantt = new Gantt("#gantt", this._filterTask(this.tasks), {
+            viewMode: this.viewMode,
+            marginBeforeStart: this.marginBeforeStart,
+            marginAfterEnd: this.marginAfterEnd,
+            language: "pt-br",
+            allowMovement: this.allowMovement,
+            hasPopup: this.hasPopup,
+            containerWidth: this.containerWidth,
+            showOnlyHours: this.showOnlyHours,
+            showOnlyDays: this.showOnlyDays,
+            onClick: function (task) { return _this.taskClicked.emit(task); },
+            onDateChange: function (task, start, end) { return _this.taskDateChanged.emit({ task: task, start: start, end: end }); },
+            onViewChange: function (viewMode) { return _this.viewChanged.emit(viewMode); },
+        });
+    };
+    GanttComponent.prototype.ngOnChanges = function (changes) {
+        if (!this._gantt) {
+            return;
+        }
+        if (changes.viewMode) {
+            this._gantt.options.viewMode = changes.viewMode.currentValue;
+            this._gantt.change_view_mode();
+        }
+        if (changes.tasks) {
+            this._gantt.refresh(this._filterTask(changes.tasks.currentValue));
+        }
+    };
+    GanttComponent.prototype._filterTask = function (tasksGroups) {
+        var tasks = [];
+        if (this.multipleTaskPerLine) {
+            tasksGroups.forEach(function (group, index) {
+                tasks.push.apply(tasks, __spread(group.tasks.map(function (task) {
+                    return __assign(__assign({}, task), { _row_id: index });
+                })));
+            }, []);
         }
         else {
-            this.removeActiveClassByGlobalSearch();
-            this.close();
+            var i_1 = 0;
+            tasksGroups.forEach(function (group) {
+                tasks.push.apply(tasks, __spread(group.tasks.map(function (task) {
+                    return __assign(__assign({}, task), { _row_id: i_1++ });
+                })));
+            }, []);
         }
-        this.cdr.detectChanges();
+        return tasks;
+    };
+    GanttComponent.prototype._validateViewMode = function () {
+        if (![
+            ViewMode.QuarterHour,
+            ViewMode.Hour,
+            ViewMode.QuarterDay,
+            ViewMode.HalfDay,
+            ViewMode.Day,
+            ViewMode.Week,
+            ViewMode.Month,
+            ViewMode.Year,
+        ].includes(this.viewMode)) {
+            throw new Error("Invalid gantt view mode");
+        }
+    };
+    GanttComponent.prototype._validateTasks = function () {
+        this.tasks.forEach(function (group) {
+            group.tasks.forEach(function (task) {
+                if (task.start > task.end) {
+                    throw new Error("invalid task. The start date must be less than the end date.");
+                }
+            });
+        });
     };
-    GlobalSearchComponent.nextId = 0;
-    GlobalSearchComponent.ctorParameters = function () { return [
-        { type: ChangeDetectorRef }
-    ]; };
     __decorate([
-        ViewChild("globalSearch", { static: false })
-    ], GlobalSearchComponent.prototype, "globalSearch", void 0);
+        Input()
+    ], GanttComponent.prototype, "columnTitle", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "id", void 0);
+    ], GanttComponent.prototype, "multipleTaskPerLine", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "delay", void 0);
+    ], GanttComponent.prototype, "showSideTable", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "totalItensLabel", void 0);
+    ], GanttComponent.prototype, "viewMode", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "showMoreLabel", void 0);
+    ], GanttComponent.prototype, "tasks", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "placeholder", void 0);
+    ], GanttComponent.prototype, "marginBeforeStart", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "isLoading", void 0);
+    ], GanttComponent.prototype, "marginAfterEnd", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "totalElements", void 0);
+    ], GanttComponent.prototype, "allowMovement", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "emptyTitle", void 0);
+    ], GanttComponent.prototype, "hasPopup", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "emptyDescription", void 0);
+    ], GanttComponent.prototype, "containerWidth", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "emptyIcon", void 0);
+    ], GanttComponent.prototype, "fullWidth", void 0);
     __decorate([
         Input()
-    ], GlobalSearchComponent.prototype, "showFooter", void 0);
+    ], GanttComponent.prototype, "showOnlyHours", void 0);
     __decorate([
-        ContentChildren(GlobalSearchDropdownItemComponent)
-    ], GlobalSearchComponent.prototype, "dropdownItens", void 0);
+        Input()
+    ], GanttComponent.prototype, "showOnlyDays", void 0);
     __decorate([
         Output()
-    ], GlobalSearchComponent.prototype, "onSearch", void 0);
+    ], GanttComponent.prototype, "taskClicked", void 0);
     __decorate([
         Output()
-    ], GlobalSearchComponent.prototype, "onFocus", void 0);
+    ], GanttComponent.prototype, "taskDateChanged", void 0);
     __decorate([
         Output()
-    ], GlobalSearchComponent.prototype, "onShowMore", void 0);
-    GlobalSearchComponent = __decorate([
+    ], GanttComponent.prototype, "viewChanged", void 0);
+    __decorate([
+        ViewChild('outer')
+    ], GanttComponent.prototype, "outer", void 0);
+    __decorate([
+        ViewChild('side')
+    ], GanttComponent.prototype, "side", void 0);
+    GanttComponent = __decorate([
         Component({
-            selector: "s-global-search",
-            template: "<div class=\"ui-inputgroup\">\n    <input #globalSearch class=\"global-search__input\" [(ngModel)]=\"search\" (ngModelChange)=\"onChange()\" pInputText\n        [placeholder]=\"placeholder\" (focus)=\"focusIn()\" (blur)=\"focusOut()\">\n    <span class=\"ui-inputgroup-addon global-search__span\"><em class=\"fas fa-search\"></em></span>\n    <div class=\"global-search__modal\" *ngIf=\"wasSearched\">\n        <div *sLoadingState=\"isLoading && !isModalLoading\" class=\"global-search__loader\">\n            <div class=\"global-search__container\" *ngIf=\"dropdownItens && dropdownItens.length > 0 || isLoading\">\n                <div *ngIf=\"dropdownItens && dropdownItens.length > 0\">\n                    <div class=\"global-search__modal--total-itens-title\">\n                        <span class=\"ui-g-11 no-space\">{{totalItensLabel}}</span>\n                        <span class=\"ui-g-1 no-space global-search__modal--total-itens-title-icon\" (click)=\"close()\"><em\n                                class=\"fas fa-times\"></em></span>\n                    </div>\n                    <div class=\"no-space global-search__dropdown--itens\"\n                        [@expandableContent]=\"expanded\">\n                        <ng-container *ngFor=\"let item of dropdownItens\">\n                            <div class=\"s-object-card-field no-space global-search__dropdown--itens-container\">\n                                <ng-container *ngTemplateOutlet=\"item.content\"></ng-container>\n                            </div>\n                        </ng-container>\n                    </div>\n                    <div *ngIf=\"showFooter\" class=\"ui-g-12 global-search__modal--footer\">\n                        <s-button class=\"global-search__show-more\" (click)=\"showMore()\" priority=\"link\">\n                            {{showMoreLabel}}\n                        </s-button>\n                    </div>\n                </div>\n            </div>\n            <s-empty-state *ngIf=\"(!dropdownItens || dropdownItens.length==0) && !isLoading\" [title]=\"emptyTitle\"\n                [description]=\"emptyDescription\" ngClass=\"global-search__empty-state--icon\"\n                [iconClass]=\"(emptyIcon ? emptyIcon : 'fas fa-search')\">\n            </s-empty-state>\n        </div>\n    </div>\n    <div *ngIf=\"wasSearched\" class=\"global-search__background\" (click)=\"close()\"></div>\n</div>\n",
-            animations: [
-                trigger("expandableContent", [
-                    state("*", style$7({
-                        height: "0",
-                    })),
-                    state("false", style$7({
-                        height: "0",
-                    })),
-                    state("true", style$7({
-                        height: "*",
-                    })),
-                    transition("* => true", animate("200ms ease-out")),
-                    transition("false <=> true", animate("200ms ease-out")),
-                ]),
-            ],
-            styles: [".global-search__input{border-radius:20px 0 0 20px;width:136px;cursor:pointer;padding:0 0 0 15px;transition:.3s}.ui-inputtext{min-height:25px!important;height:25px!important}.global-search__span{transition:.3s;background:0 0!important;border-left:none;border-radius:0 20px 20px 0!important;padding:1px 15px 0 0!important;height:25px!important}.global-search__input:active,.global-search__input:focus{width:466px;cursor:default;transition:.3s;border-top:1px solid #428bca;border-left:1px solid #428bca;border-bottom:1px solid #428bca}.global-search__input:active,.global-search__input:focus+.global-search__span{transition:.3s;border-left:none;border-top:1px solid #428bca!important;border-right:1px solid #428bca!important;border-bottom:1px solid #428bca!important}.global-search__input-active{width:466px;cursor:default;transition:.3s}.global-search__modal{box-shadow:0 2px 8px 0 rgba(0,0,0,.4);border-radius:5px;width:500px;background:#fff;position:absolute;margin-top:60px;z-index:6;min-height:50px}::ng-deep .global-search__loader{border-radius:5px!important;width:100%}.global-search__container{min-height:50px;width:100%}.global-search__modal--total-itens-title{padding:15px;color:#333;border-bottom:1px solid #ccc;font-weight:600;height:50px}.global-search__modal--footer{height:50px;border-top:1px solid #ccc}.global-search__dropdown--itens{max-height:510px;overflow:auto}.global-search__dropdown--itens-container:hover{background:#dbe0e4}.global-search__modal--total-itens-title-icon{text-align:right;cursor:pointer}.global-search__background{background:rgba(0,0,0,.4);width:100%;height:calc(100vh - 70px);position:absolute;left:0;margin-top:50px;z-index:5;cursor:pointer}.no-space{padding:0;margin:0}.global-search__show-more{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}body .global-search__show-more--button{color:#428bca!important}.modal{position:absolute;left:1%;width:98%;height:calc(100vh - 90px)}.global-search__empty-state--icon{margin:42px 134px}::ng-deep .global-search__empty-state--icon .container .icon{font-size:40px}::ng-deep .s-button-priority-link{color:#428bca}@media all and (max-width:900px){.global-search__modal{top:20px;width:98%;left:1%}.global-search__input-active,.global-search__input:active,.global-search__input:focus{position:absolute;width:calc(100% - 70px);left:2%}body .global-search__dropdown--itens{max-height:100%;overflow:auto}}@media all and (max-width:767px){.global-search__modal{top:15px}.global-search__input-active,.global-search__input:active,.global-search__input:focus{width:calc(100% - 55px)}}@media all and (max-width:600px){.global-search__modal--itens{height:calc(100vh - 100px);background:#fff}.global-search__input-active,.global-search__input:active,.global-search__input:focus{position:absolute;width:calc(100% - 53px);left:2%}body .global-search__dropdown--itens{max-height:100%;overflow:auto}.global-search__dropdown--itens{max-height:100%;background:#fff}.global-search__modal--footer{background:#fff;height:50px}.global-search__modal{top:17px;border-radius:0;margin-top:55px;box-shadow:none;left:0;width:100%}}"]
-        })
-    ], GlobalSearchComponent);
-    return GlobalSearchComponent;
-}());
-
-var ThumbnailModule = /** @class */ (function () {
-    function ThumbnailModule() {
-    }
-    ThumbnailModule = __decorate([
-        NgModule({
-            imports: [CommonModule],
-            declarations: [ThumbnailComponent],
-            exports: [ThumbnailComponent],
-            providers: [ThumbnailService],
+            selector: "s-gantt",
+            template: "<div class=\"outer\" #outer>\n    <div #side>\n        <gantt-side-table\n            *ngIf=\"showSideTable\"\n            [tasks]=\"tasks\"\n            [columnTitle]=\"columnTitle\"\n            [multipleTaskPerLine]=\"multipleTaskPerLine\">\n        </gantt-side-table>\n    </div>\n    <svg id=\"gantt\"></svg>\n</div>\n",
+            encapsulation: ViewEncapsulation.None,
+            styles: [".outer{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:start;align-items:flex-start;-ms-flex-line-pack:center;align-content:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-direction:row;flex-direction:row}", ".gantt{border:1px solid #e0e0e0}.gantt .weekend-highlight{fill:#b8c2cc;opacity:.5;stroke:#ebeff2;stroke-width:1}.gantt .grid-background{fill:none}.gantt .grid-header,.gantt .grid-row{fill:#fff}.gantt .grid-row:nth-child(even){fill:#f5f5f5}.gantt .row-line{stroke:#ebeff2}.gantt .tick{stroke:#e0e0e0;stroke-width:.4}.gantt .tick.thick{stroke:#428bca;stroke-width:2}.gantt .today-highlight{fill:#ffe979;opacity:.5}.gantt .arrow{fill:none;stroke:#666;stroke-width:1.4}.gantt .bar{opacity:.8;stroke:#8d99a6;stroke-width:0;transition:stroke-width .3s;-webkit-user-select:none;-ms-user-select:none;user-select:none}.gantt .bar-invalid{fill:transparent;stroke:#8d99a6;stroke-dasharray:5;stroke-width:1}.gantt .bar-invalid~.bar-label{fill:#555}.gantt .bar-label{fill:#fff;text-anchor:middle;font-size:12px;font-weight:lighter}.gantt .bar-label.big{fill:#555;text-anchor:start}.gantt .bar-wrapper{cursor:pointer;outline:0}.gantt .bar-wrapper.active .bar,.gantt .bar-wrapper:hover .bar{opacity:1}.gantt .bar-wrapper.active .bar{stroke:#212533;stroke-width:2}.gantt .lower-text,.gantt .upper-text{font-size:12px;text-anchor:middle}.gantt .upper-text{fill:#555}.gantt .lower-text{fill:#333}.gantt .hide{display:none}.gantt-container{border-left:1px solid #e0e0e0;font-size:12px;overflow:auto;position:relative}.gantt-container .title-1{fill:#999;font-size:12px;font-weight:400;line-height:150%;text-anchor:middle}.gantt-container .title-2{fill:#333;font-size:14px;font-weight:400;line-height:150%;text-anchor:middle}.gantt-container .popup-wrapper{left:0;position:absolute;top:0}.gantt-container .popup-wrapper .popup{background:#0e1119;border-radius:2px;color:#fff;padding:8px;font-family:\"Open Sans\" sans-serif;line-height:150%;font-weight:400}.gantt-container .popup-wrapper .popup .wrp-title{border-bottom:1px solid #525966;padding-bottom:10px}.gantt-container .popup-wrapper .popup .wrp-title .title{font-size:14px}.gantt-container .popup-wrapper .popup .wrp-subtitle{color:#dfe2e5;padding-top:10px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.gantt-container .popup-wrapper .popup .wrp-subtitle .icon{margin-right:10px}.gantt-container .popup-wrapper .popup .wrp-subtitle .subtitle{font-size:12px}.gantt-container .popup-wrapper .popup .pointer{border:6px solid transparent;border-top-color:#0e1119;height:6px;margin-left:-4px;position:absolute}"]
         })
-    ], ThumbnailModule);
-    return ThumbnailModule;
+    ], GanttComponent);
+    return GanttComponent;
 }());
 
-var InfiniteScrollDirective = /** @class */ (function () {
-    function InfiniteScrollDirective(el) {
-        this.el = el;
-        this.onScroll = new EventEmitter();
+var SideTableComponent = /** @class */ (function () {
+    function SideTableComponent() {
+        this.ROW_HEIGHT = 44;
+        this.multipleTaskPerLine = false;
     }
-    InfiniteScrollDirective.prototype.scroll = function () {
-        if (this.el.nativeElement.scrollTop > (this.el.nativeElement.scrollHeight - this.el.nativeElement.offsetHeight - 2)) {
-            this.onScroll.emit();
-        }
+    SideTableComponent.prototype.ngOnInit = function () {
+        this._removeEmptyTasks();
+    };
+    SideTableComponent.prototype._removeEmptyTasks = function () {
+        this.tasks = this.tasks.filter(function (task) { return task.tasks.length; });
     };
-    InfiniteScrollDirective.ctorParameters = function () { return [
-        { type: ElementRef }
-    ]; };
     __decorate([
-        Output()
-    ], InfiniteScrollDirective.prototype, "onScroll", void 0);
+        Input()
+    ], SideTableComponent.prototype, "columnTitle", void 0);
     __decorate([
-        HostListener("scroll")
-    ], InfiniteScrollDirective.prototype, "scroll", null);
-    InfiniteScrollDirective = __decorate([
-        Directive({
-            selector: "[sInfiniteScroll]"
-        })
-    ], InfiniteScrollDirective);
-    return InfiniteScrollDirective;
-}());
-
-var InfiniteScrollModule = /** @class */ (function () {
-    function InfiniteScrollModule() {
-    }
-    InfiniteScrollModule = __decorate([
-        NgModule({
-            declarations: [
-                InfiniteScrollDirective
-            ],
-            imports: [
-                CommonModule
-            ],
-            exports: [
-                InfiniteScrollDirective
-            ]
+        Input()
+    ], SideTableComponent.prototype, "tasks", void 0);
+    __decorate([
+        Input()
+    ], SideTableComponent.prototype, "multipleTaskPerLine", void 0);
+    SideTableComponent = __decorate([
+        Component({
+            selector: 'gantt-side-table',
+            template: "<div class=\"side-table\">\n    <div class=\"column-title\">\n        <span>{{ columnTitle }}</span>\n    </div>\n    <div class=\"tasks\" >\n        <div\n            *ngFor=\"let task of tasks; let i = index\"\n            class=\"task\"\n            [ngStyle]=\"{'height.px': multipleTaskPerLine\n                    ? ROW_HEIGHT\n                    : ROW_HEIGHT * task.tasks.length}\"\n            [sTooltip]=\"task.title.length > 20 || task.subtitle.length > 20 ? '<span><strong>' + task.title + ' </strong></br><span> ' + task.subtitle + ' </span></span>' : '' \"\n            [escape]=\"false\">\n                <div class=\"title\">\n                    {{ task.title }}\n                </div>\n                <div class=\"subtitle\">\n                    {{ task.subtitle }}\n                </div>\n        </div>\n    </div>\n</div>\n",
+            styles: [".side-table{background:#fff;height:100%;min-width:175px}.side-table .column-title{height:106px;border:1px solid #e0e0e0;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center;padding:8px}.side-table .column-title span{font-family:\"Open Sans\" sans-serif;font-size:14px;font-weight:700;line-height:150%}.side-table .task{-ms-flex-align:center;align-items:center;background-color:#fff;border:1px solid #e0e0e0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:\"Open Sans\",sans-serif;font-weight:400;-ms-flex-pack:center;justify-content:center;line-height:150%;padding:0 5px}.side-table .task .title{color:#333;font-size:14px;max-width:300px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.side-table .task .subtitle{color:#999;font-size:12px;max-width:300px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}"]
         })
-    ], InfiniteScrollModule);
-    return InfiniteScrollModule;
+    ], SideTableComponent);
+    return SideTableComponent;
 }());
 
-var GlobalSearchModule = /** @class */ (function () {
-    function GlobalSearchModule() {
+var GanttModule = /** @class */ (function () {
+    function GanttModule() {
     }
-    GlobalSearchModule = __decorate([
+    GanttModule = __decorate([
         NgModule({
-            declarations: [
-                GlobalSearchComponent,
-                GlobalSearchDropdownItemComponent
-            ],
-            imports: [
-                CommonModule,
-                InputTextModule,
-                FormsModule,
-                ReactiveFormsModule,
-                TooltipModule$1,
-                ThumbnailModule,
-                ButtonModule,
-                LoadingStateModule,
-                InfiniteScrollModule,
-                EmptyStateModule
-            ],
-            exports: [
-                GlobalSearchComponent,
-                GlobalSearchDropdownItemComponent,
-                TooltipModule$1,
-                ThumbnailModule,
-                ButtonModule,
-                LoadingStateModule,
-                EmptyStateModule
-            ],
-            entryComponents: [
-                GlobalSearchComponent,
-                GlobalSearchDropdownItemComponent
-            ]
-        })
-    ], GlobalSearchModule);
-    return GlobalSearchModule;
-}());
-
-var IAInsightCardComponent = /** @class */ (function () {
-    function IAInsightCardComponent(clipboard, messageService, translateService) {
-        this.clipboard = clipboard;
-        this.messageService = messageService;
-        this.translateService = translateService;
-        this.open = false;
-        this.isLoading = false;
-        this.likeSelected = false;
-        this.dislikeSelected = false;
-    }
-    IAInsightCardComponent.prototype.toggle = function () {
-        this.open = !this.open;
-        this._requestInsight();
-    };
-    IAInsightCardComponent.prototype.onLikeSelected = function () {
-        var _a, _b;
-        if (this.likeSelected) {
-            this.likeSelected = false;
-        }
-        else {
-            this.likeSelected = true;
-            this.dislikeSelected = false;
-            (_b = (_a = this.insight).onLikeSelected) === null || _b === void 0 ? void 0 : _b.call(_a);
-        }
-    };
-    IAInsightCardComponent.prototype.onDislikeSelected = function () {
-        var _a, _b;
-        if (this.dislikeSelected) {
-            this.dislikeSelected = false;
-        }
-        else {
-            this.dislikeSelected = true;
-            this.likeSelected = false;
-            (_b = (_a = this.insight).onDislikeSelected) === null || _b === void 0 ? void 0 : _b.call(_a);
-        }
-    };
-    IAInsightCardComponent.prototype.copyContent = function () {
-        var _a, _b;
-        (_b = (_a = this.insight).onCopy) === null || _b === void 0 ? void 0 : _b.call(_a, this.content);
-        if (this.clipboard.copy(this.content)) {
-            this.messageService.add({
-                severity: "info",
-                summary: this.translateService.instant("platform.angular_components.copied_to_clipboard"),
-            });
-        }
-    };
-    IAInsightCardComponent.prototype.reloadContent = function () {
-        this._requestInsight();
-    };
-    IAInsightCardComponent.prototype._requestInsight = function () {
-        var _this = this;
-        this.isLoading = true;
-        this.insight.request$
-            .pipe(first(), finalize(function () { return (_this.isLoading = false); }))
-            .subscribe(function (content) {
-            _this.content = marked.marked(content);
-        });
-    };
-    IAInsightCardComponent.ctorParameters = function () { return [
-        { type: Clipboard },
-        { type: MessageService },
-        { type: TranslateService }
-    ]; };
-    __decorate([
-        Input()
-    ], IAInsightCardComponent.prototype, "insight", void 0);
-    IAInsightCardComponent = __decorate([
-        Component({
-            selector: "s-ia-insight-card",
-            template: "<div class=\"ia-insight-card\" [ngClass]=\"{ 'ia-insight-card--close': !open }\">\n    <div class=\"header\" (click)=\"toggle()\">\n        <s-badge text=\"Insight\" iconClass=\"fal fa-lightbulb\"></s-badge>\n        <span class=\"insight-title\">{{ insight.title }}</span>\n        <span\n            class=\"toggle-icon fas\"\n            [ngClass]=\"{\n                'fa-angle-down': !open,\n                'fa-angle-up': open\n            }\"\n        >\n        </span>\n    </div>\n    <div class=\"content\">\n        <ng-container *ngIf=\"isLoading; then loadingBlock; else contentBlock\"></ng-container>\n        <ng-template #loadingBlock>\n            <s-ia-insight-card-loader></s-ia-insight-card-loader>\n        </ng-template>\n        <ng-template #contentBlock>\n            <ng-container *ngIf=\"content; then successBlock; else errorBlock\"></ng-container>\n\n            <ng-template #successBlock>\n                <span class=\"text\" [innerHTML]=\"content\"></span>\n            </ng-template>\n            <ng-template #errorBlock>\n                <span class=\"text text--error\">{{ \"platform.angular_components.error_loading_insight_alt\" | translate }}</span>\n            </ng-template>\n\n            <div class=\"options\">\n                <button [disabled]=\"!content\" (click)=\"copyContent()\" class=\"option fal fa-copy\"></button>\n                <button (click)=\"reloadContent()\" class=\"option fal fa-redo\"></button>\n                <button\n                    *ngIf=\"insight.onLikeSelected\"\n                    [disabled]=\"!content\"\n                    (click)=\"onLikeSelected()\"\n                    class=\"option\"\n                    [ngClass]=\"{\n                        'fal': !likeSelected,\n                        'fas': likeSelected,\n                        'fa-thumbs-up': true\n                    }\">\n                </button>\n                <button\n                    *ngIf=\"insight.onDislikeSelected\"\n                    [disabled]=\"!content\"\n                    (click)=\"onDislikeSelected()\"\n                    class=\"option\"\n                    [ngClass]=\"{\n                        'fal': !dislikeSelected,\n                        'fas': dislikeSelected,\n                        'fa-thumbs-down': true\n                    }\">\n                </button>\n            </div>\n        </ng-template>\n    </div>\n</div>\n",
-            styles: [".ia-insight-card{background-color:#fff;border:1px solid #9ecad4;border-radius:4px;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden}.ia-insight-card .header{-ms-flex-align:center;align-items:center;background-color:#f1f7f8;border-bottom:1px solid #9ecad4;display:-ms-flexbox;display:flex;gap:8px;min-height:60px;padding:8px 16px;-webkit-user-select:none;-ms-user-select:none;user-select:none}.ia-insight-card .header .insight-title{color:#428bca;-ms-flex-positive:1;flex-grow:1;font-family:\"Open Sans\",sans-serif;font-size:14px;line-height:150%}.ia-insight-card .header .toggle-icon{color:#888b99;font-size:20px}.ia-insight-card .content{-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;cursor:auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:16px;min-height:160px;padding:24px}.ia-insight-card .content .text{color:#212533;font-family:\"Open Sans\",sans-serif;font-size:14px;width:100%}.ia-insight-card .content .text--error{text-align:center}.ia-insight-card .content .options{display:-ms-flexbox;display:flex;gap:8px}.ia-insight-card .content .options .option{background-color:transparent;border:none;color:#428bca;cursor:pointer;font-size:12px}.ia-insight-card .content .options .option:disabled{color:#c1c1cc;cursor:auto}.ia-insight-card--close{border-color:#dedce5}.ia-insight-card--close .header{background-color:#fbfafc;border:#dedce5}.ia-insight-card--close .header .insight-title{color:#888b99}.ia-insight-card--close .content{display:none}"]
+            imports: [CommonModule, TooltipModule],
+            declarations: [
+                GanttComponent,
+                SideTableComponent,
+            ],
+            exports: [GanttComponent],
         })
-    ], IAInsightCardComponent);
-    return IAInsightCardComponent;
+    ], GanttModule);
+    return GanttModule;
 }());
 
-var IAInsightSidebarComponent = /** @class */ (function () {
-    function IAInsightSidebarComponent() {
-        this.insights = [];
-        this.opened = false;
+var GlobalSearchSizeEnum;
+(function (GlobalSearchSizeEnum) {
+    GlobalSearchSizeEnum["STANDARD"] = "STANDARD";
+    GlobalSearchSizeEnum["MEDIUM"] = "MEDIUM";
+    GlobalSearchSizeEnum["SMALL"] = "SMALL";
+})(GlobalSearchSizeEnum || (GlobalSearchSizeEnum = {}));
+
+var GlobalSearchDropdownItemComponent = /** @class */ (function () {
+    function GlobalSearchDropdownItemComponent() {
+        this.id = "s-global-search-dropdown-item-" + GlobalSearchDropdownItemComponent_1.nextId++;
+        this.size = GlobalSearchSizeEnum.STANDARD;
+        this.buttonClick = new EventEmitter();
     }
-    IAInsightSidebarComponent.prototype.toggle = function () {
-        this.opened = !this.opened;
+    GlobalSearchDropdownItemComponent_1 = GlobalSearchDropdownItemComponent;
+    GlobalSearchDropdownItemComponent.prototype.isStandardSize = function () {
+        return this.size === GlobalSearchSizeEnum.STANDARD;
     };
-    IAInsightSidebarComponent.prototype.open = function () {
-        this.opened = true;
+    GlobalSearchDropdownItemComponent.prototype.isMediumSize = function () {
+        return this.size === GlobalSearchSizeEnum.MEDIUM;
     };
-    IAInsightSidebarComponent.prototype.close = function () {
-        this.opened = false;
+    GlobalSearchDropdownItemComponent.prototype.isSmallSize = function () {
+        return this.size === GlobalSearchSizeEnum.SMALL;
+    };
+    GlobalSearchDropdownItemComponent.prototype.getImageSize = function () {
+        return this.isStandardSize() ? "medium" : "small";
     };
+    var GlobalSearchDropdownItemComponent_1;
+    GlobalSearchDropdownItemComponent.nextId = 0;
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "insights", void 0);
+    ], GlobalSearchDropdownItemComponent.prototype, "id", void 0);
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "hasPermission", void 0);
+    ], GlobalSearchDropdownItemComponent.prototype, "primaryLabel", void 0);
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "introText", void 0);
+    ], GlobalSearchDropdownItemComponent.prototype, "secondaryEmptyLabel", void 0);
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "introTemplate", void 0);
+    ], GlobalSearchDropdownItemComponent.prototype, "tertiaryEmptyLabel", void 0);
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "emptyText", void 0);
+    ], GlobalSearchDropdownItemComponent.prototype, "imageSource", void 0);
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "emptyTemplate", void 0);
+    ], GlobalSearchDropdownItemComponent.prototype, "imageAlt", void 0);
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "noPermissionText", void 0);
+    ], GlobalSearchDropdownItemComponent.prototype, "iconClass", void 0);
     __decorate([
         Input()
-    ], IAInsightSidebarComponent.prototype, "noPermissionTemplate", void 0);
-    IAInsightSidebarComponent = __decorate([
-        Component({
-            selector: "s-ia-insight-sidebar",
-            template: "<div\n    class=\"sidebar\"\n    [class.opened]=\"opened\">\n    <div class=\"header\">\n        <button (click)=\"close()\" class=\"option\">\n            <span class=\"far fa-chevron-double-right\"></span>\n        </button>\n        <div class=\"title\">\n            <span><ng-container [ngTemplateOutlet]=\"iassistIcon\"></ng-container></span>\n            <span>Insight</span>\n        </div>\n    </div>\n    <div class=\"intro\">\n        <ng-container *ngIf=\"hasPermission; then permissionBlock; else noPermissionBlock\"></ng-container>\n\n        <ng-template #permissionBlock>\n            <ng-container *ngIf=\"insights?.length; then introBlock; else emptyBlock\"></ng-container>\n        \n            <ng-template #introBlock>\n                <ng-container *ngIf=\"introTemplate; then introCustomBlock; else introTextBlock\"></ng-container>\n\n                <ng-template #introCustomBlock>\n                    <ng-container *ngTemplateOutlet=\"introTemplate\"></ng-container>\n                </ng-template>\n\n                <ng-template #introTextBlock>\n                    <span class=\"text\">{{ introText || \"platform.angular_components.insight_intro\" | translate }}</span>\n                </ng-template>\n            </ng-template>\n            \n            <ng-template #emptyBlock>\n                <ng-container *ngIf=\"emptyTemplate; then emptyCustomBlock; else emptyTextBlock\"></ng-container>\n\n                <ng-template #emptyCustomBlock>\n                    <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n                </ng-template>\n\n                <ng-template #emptyTextBlock>\n                    <span class=\"text\">{{ emptyText || \"platform.angular_components.insight_empty\" | translate }}</span>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n        \n        <ng-template #noPermissionBlock>\n            <ng-container *ngIf=\"noPermissionTemplate; then noPermissionCustomBlock; else noPermissionTextBlock\"></ng-container>\n\n            <ng-template #noPermissionCustomBlock>\n                <ng-container *ngTemplateOutlet=\"noPermissionTemplate\"></ng-container>\n            </ng-template>\n\n            <ng-template #noPermissionTextBlock>\n                <span>{{ noPermissionText || \"platform.angular_components.insight_no_permission\" | translate }}</span>\n            </ng-template>\n        </ng-template>\n    </div>\n    <div class=\"insights\">\n        <ng-container *ngIf=\"insights?.length\">\n            <s-ia-insight-card\n                *ngFor=\"let insight of insights\"\n                [insight]=\"insight\">\n            </s-ia-insight-card>\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #iassistIcon>\n    <div style=\"width: 28px; height: 28px;\">\n        <span *sSVGFactory=\"'iassist'\"></span>\n    </div>\n</ng-template>\n",
-            styles: [".sidebar{background-color:#fff;border-left:1px solid #dedce5;height:100%;overflow-x:hidden;position:fixed;right:-25%;transition:.5s;top:0;width:25%;z-index:1002}.sidebar .header{border-bottom:1px solid #dedce5;display:-ms-flexbox;display:flex;gap:16px;padding:12px 20px}.sidebar .header .option{background-color:transparent;border:none;color:#428bca;cursor:pointer;font-size:16px;padding:12px}.sidebar .header .title{-ms-flex-align:center;align-items:center;color:#212533;display:-ms-flexbox;display:flex;font-family:\"Open Sans\",sans-serif;font-size:16px;gap:16px;line-height:1;-webkit-user-select:none;-ms-user-select:none;user-select:none}.sidebar .intro{margin:8px 40px}.sidebar .intro .text{color:#212533;display:-ms-flexbox;display:flex;font-family:\"Open Sans\",sans-serif;font-size:14px;-ms-flex-pack:center;justify-content:center;line-height:1.5;text-align:center;-webkit-user-select:none;-ms-user-select:none;user-select:none}.sidebar.opened{right:0}.sidebar.opened .insights{padding:12px}.insights{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:12px}@media (max-width:1366px){.sidebar{right:-50%;width:50%}}@media (max-width:768px){.sidebar{right:-75%;width:75%}}@media (max-width:600px){.sidebar{right:-100%;width:100%}}"]
-        })
-    ], IAInsightSidebarComponent);
-    return IAInsightSidebarComponent;
-}());
-
-var IAInsightCardLoaderComponent = /** @class */ (function () {
-    function IAInsightCardLoaderComponent() {
-    }
-    IAInsightCardLoaderComponent = __decorate([
+    ], GlobalSearchDropdownItemComponent.prototype, "secondaryLabel", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchDropdownItemComponent.prototype, "tertiaryLabel", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchDropdownItemComponent.prototype, "size", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchDropdownItemComponent.prototype, "template", void 0);
+    __decorate([
+        Output()
+    ], GlobalSearchDropdownItemComponent.prototype, "buttonClick", void 0);
+    __decorate([
+        ContentChild(ThumbnailComponent, { static: true })
+    ], GlobalSearchDropdownItemComponent.prototype, "thumbnailComponent", void 0);
+    __decorate([
+        ViewChild(TemplateRef, { static: true })
+    ], GlobalSearchDropdownItemComponent.prototype, "content", void 0);
+    GlobalSearchDropdownItemComponent = GlobalSearchDropdownItemComponent_1 = __decorate([
         Component({
-            selector: "s-ia-insight-card-loader",
-            template: "<div class=\"ia-insight-card-loader\">\n    <div class=\"loader\">\n        <div class=\"loader-icon\">\n                <div *sSVGFactory=\"'iassist'\"></div>\n        </div>\n    </div>\n    \n    <span class=\"loader-label\">{{ \"platform.angular_components.loading_insight\" | translate }}</span>\n</div>\n",
-            styles: [".ia-insight-card-loader{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:24px}.ia-insight-card-loader .loader{-ms-flex-align:center;align-items:center;animation:2s linear infinite spin;border:2px solid #f1f7f8;border-top:2px solid #0fa389;border-radius:50%;display:-ms-flexbox;display:flex;height:48px;-ms-flex-pack:center;justify-content:center;width:48px}.ia-insight-card-loader .loader .loader-icon{animation:2s linear infinite reverse spin;height:32px;transform:translate(-50%,-50%)}.ia-insight-card-loader .loader-label{color:#888b99;font-family:\"Open Sans\",sans-serif;font-size:16px}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}"]
+            selector: "s-global-search-dropdown-item",
+            template: "<ng-template>\n    <div class=\"{{isSmallSize() ? 'ui-g container' : 'container'}}\">\n        <ng-content select=\"s-thumbnail\"></ng-content>\n        <s-thumbnail [id]=\"id + '-thumbnail'\"\n            *ngIf=\"!thumbnailComponent && (imageSource || iconClass) && !isSmallSize()\" [imageSource]=\"imageSource\"\n            [imageAlt]=\"imageAlt || primaryLabel\" [iconClass]=\"iconClass\" [size]=\"getImageSize()\"></s-thumbnail>\n\n        <div class=\"global-search-item__container {{!isSmallSize() ? 'global-search-item__container--width-60' : ''}}\">\n            <div #titleTemplate>\n                <ng-content select=\"[titleTemplate]\"></ng-content>\n            </div>\n            <s-button styleClass=\"no-padding\" class=\"{{isSmallSize() ? 'ui-g-6 no-padding' : ''}}\" [id]=\"id + '-title'\"\n                *ngIf=\"!titleTemplate.children.length\" priority=\"link\" [pTooltip]=\"primaryLabel\" [label]=\"primaryLabel\"\n                size=\"small\" (onClick)=\"buttonClick.emit($event)\">\n            </s-button>\n\n            <div #labelTemplate>\n                <ng-content select=\"[labelTemplate]\"></ng-content>\n            </div>\n            <span [id]=\"id + '-label'\" [ngClass]=\"{'ui-g-6 global-search-item__text-align--right': isSmallSize(), 'global-search-item__italic' : !secondaryLabel}\"\n                class=\"label\" *ngIf=\"!labelTemplate.children.length\"\n                [pTooltip]=\"secondaryLabel\" tooltipPosition=\"top\" showDelay=\"500\">{{ secondaryLabel ? secondaryLabel : secondaryEmptyLabel }}</span>\n\n            <div #descriptionTemplate>\n                <ng-content select=\"[descriptionTemplate]\"></ng-content>\n            </div>\n            <span [id]=\"id + '-description'\" class=\"description\"\n                [ngClass]=\"{'global-search-item__italic' : !secondaryLabel}\"\n                *ngIf=\" !descriptionTemplate.children.length && !isMediumSize() && !isSmallSize()\"\n                [pTooltip]=\"tertiaryLabel\" tooltipPosition=\"top\" showDelay=\"500\">{{ tertiaryLabel ? tertiaryLabel : tertiaryEmptyLabel }}</span>\n        </div>\n        <div class=\"global-search-item__container--width-40 global-search__dropdown--template\" *ngIf=\"!isSmallSize()\">\n            <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n        </div>\n    </div>\n</ng-template>\n",
+            styles: [".container{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;height:100%;border-bottom:1px solid #ccc;padding:15px 5px;margin:0 10px}::ng-deep .no-padding{padding:0!important;min-width:0!important}::ng-deep .s-button-with-text{min-width:0!important}.global-search-item__italic{font-style:italic}.global-search-item__container{margin-left:10px;width:100%}.global-search-item__container,.global-search-item__container span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.global-search-item__container .label{color:#333;display:block}.global-search-item__container .description{color:#999;display:block}.global-search-item__container--width-60{width:60%}.global-search-item__container--width-40{width:40%}.global-search-item__text-align--right{text-align:right;padding:2px 0 0 15px}.global-search__dropdown--template{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;text-align:right!important}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.global-search-item__container{-ms-flex:1;flex:1}}@media (max-width:767px){.global-search-item__container,.global-search-item__container span{white-space:normal}}.global-search-item__container:only-child{margin-left:0}"]
         })
-    ], IAInsightCardLoaderComponent);
-    return IAInsightCardLoaderComponent;
+    ], GlobalSearchDropdownItemComponent);
+    return GlobalSearchDropdownItemComponent;
 }());
 
-var IAInsightTemplateTypes;
-(function (IAInsightTemplateTypes) {
-    IAInsightTemplateTypes["Empty"] = "empty";
-    IAInsightTemplateTypes["Intro"] = "intro";
-    IAInsightTemplateTypes["NoPermission"] = "noPermission";
-})(IAInsightTemplateTypes || (IAInsightTemplateTypes = {}));
-
-var IAInsightComponent = /** @class */ (function () {
-    function IAInsightComponent() {
-        this.insights = [];
-        this.hasPermission = true;
+var GlobalSearchComponent = /** @class */ (function () {
+    function GlobalSearchComponent(cdr) {
+        this.cdr = cdr;
+        this.id = "s-global-search-" + GlobalSearchDropdownItemComponent.nextId++;
+        this.delay = 500;
+        this.isLoading = false;
+        this.showFooter = true;
+        this.onSearch = new EventEmitter();
+        this.onFocus = new EventEmitter();
+        this.onShowMore = new EventEmitter();
+        this.wasSearched = false;
+        this.isModalLoading = false;
+        this.expanded = true;
     }
-    IAInsightComponent.prototype.ngAfterContentInit = function () {
-        this._getTemplates();
-    };
-    IAInsightComponent.prototype.open = function () {
-        this.sidebar.open();
+    GlobalSearchComponent.prototype.onChange = function () {
+        var _this = this;
+        var search = this.search;
+        setTimeout(function () {
+            if (_this.search === search) {
+                _this.canShowGlobalSearchActive();
+                _this.onSearch.emit(_this.search);
+            }
+        }, this.delay);
     };
-    IAInsightComponent.prototype.close = function () {
-        this.sidebar.close();
+    GlobalSearchComponent.prototype.focusIn = function () {
+        this.onFocus.emit(true);
     };
-    IAInsightComponent.prototype.getIntroTemplate = function () {
-        return this._getCustomTemplate(IAInsightTemplateTypes.Intro);
+    GlobalSearchComponent.prototype.focusOut = function () {
+        this.onFocus.emit(false);
     };
-    IAInsightComponent.prototype.getNoPermissionTemplate = function () {
-        return this._getCustomTemplate(IAInsightTemplateTypes.NoPermission);
+    GlobalSearchComponent.prototype.showMore = function () {
+        this.onShowMore.emit();
     };
-    IAInsightComponent.prototype.getEmptyTemplate = function () {
-        return this._getCustomTemplate(IAInsightTemplateTypes.Empty);
+    GlobalSearchComponent.prototype.removeActiveClassByGlobalSearch = function () {
+        ExportUtils.removeClass(this.globalSearch, "global-search__input-active");
     };
-    IAInsightComponent.prototype._getCustomTemplate = function (type) {
-        var _a;
-        return (_a = this.templates.find(function (template) { return template.type === type; })) === null || _a === void 0 ? void 0 : _a.template;
+    GlobalSearchComponent.prototype.close = function () {
+        this.search = null;
+        this.wasSearched = false;
+        this.dropdownItens = null;
+        this.isModalLoading = false;
+        this.removeActiveClassByGlobalSearch();
     };
-    IAInsightComponent.prototype._getTemplates = function () {
-        this.introTemplate = this.getIntroTemplate();
-        this.emptyTemplate = this.getEmptyTemplate();
-        this.noPermissionTemplate = this.getNoPermissionTemplate();
+    GlobalSearchComponent.prototype.canShowGlobalSearchActive = function () {
+        this.wasSearched = !!this.search;
+        if (this.search) {
+            ExportUtils.addClass(this.globalSearch, "global-search__input-active");
+        }
+        else {
+            this.removeActiveClassByGlobalSearch();
+            this.close();
+        }
+        this.cdr.detectChanges();
     };
+    GlobalSearchComponent.nextId = 0;
+    GlobalSearchComponent.ctorParameters = function () { return [
+        { type: ChangeDetectorRef }
+    ]; };
+    __decorate([
+        ViewChild("globalSearch", { static: false })
+    ], GlobalSearchComponent.prototype, "globalSearch", void 0);
     __decorate([
         Input()
-    ], IAInsightComponent.prototype, "insights", void 0);
+    ], GlobalSearchComponent.prototype, "id", void 0);
     __decorate([
         Input()
-    ], IAInsightComponent.prototype, "hasPermission", void 0);
+    ], GlobalSearchComponent.prototype, "delay", void 0);
     __decorate([
         Input()
-    ], IAInsightComponent.prototype, "introText", void 0);
+    ], GlobalSearchComponent.prototype, "totalItensLabel", void 0);
     __decorate([
         Input()
-    ], IAInsightComponent.prototype, "emptyText", void 0);
+    ], GlobalSearchComponent.prototype, "showMoreLabel", void 0);
     __decorate([
         Input()
-    ], IAInsightComponent.prototype, "noPermissionText", void 0);
+    ], GlobalSearchComponent.prototype, "placeholder", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchComponent.prototype, "isLoading", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchComponent.prototype, "totalElements", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchComponent.prototype, "emptyTitle", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchComponent.prototype, "emptyDescription", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchComponent.prototype, "emptyIcon", void 0);
+    __decorate([
+        Input()
+    ], GlobalSearchComponent.prototype, "showFooter", void 0);
+    __decorate([
+        ContentChildren(GlobalSearchDropdownItemComponent)
+    ], GlobalSearchComponent.prototype, "dropdownItens", void 0);
+    __decorate([
+        Output()
+    ], GlobalSearchComponent.prototype, "onSearch", void 0);
+    __decorate([
+        Output()
+    ], GlobalSearchComponent.prototype, "onFocus", void 0);
+    __decorate([
+        Output()
+    ], GlobalSearchComponent.prototype, "onShowMore", void 0);
+    GlobalSearchComponent = __decorate([
+        Component({
+            selector: "s-global-search",
+            template: "<div class=\"ui-inputgroup\">\n    <input #globalSearch class=\"global-search__input\" [(ngModel)]=\"search\" (ngModelChange)=\"onChange()\" pInputText\n        [placeholder]=\"placeholder\" (focus)=\"focusIn()\" (blur)=\"focusOut()\">\n    <span class=\"ui-inputgroup-addon global-search__span\"><em class=\"fas fa-search\"></em></span>\n    <div class=\"global-search__modal\" *ngIf=\"wasSearched\">\n        <div *sLoadingState=\"isLoading && !isModalLoading\" class=\"global-search__loader\">\n            <div class=\"global-search__container\" *ngIf=\"dropdownItens && dropdownItens.length > 0 || isLoading\">\n                <div *ngIf=\"dropdownItens && dropdownItens.length > 0\">\n                    <div class=\"global-search__modal--total-itens-title\">\n                        <span class=\"ui-g-11 no-space\">{{totalItensLabel}}</span>\n                        <span class=\"ui-g-1 no-space global-search__modal--total-itens-title-icon\" (click)=\"close()\"><em\n                                class=\"fas fa-times\"></em></span>\n                    </div>\n                    <div class=\"no-space global-search__dropdown--itens\"\n                        [@expandableContent]=\"expanded\">\n                        <ng-container *ngFor=\"let item of dropdownItens\">\n                            <div class=\"s-object-card-field no-space global-search__dropdown--itens-container\">\n                                <ng-container *ngTemplateOutlet=\"item.content\"></ng-container>\n                            </div>\n                        </ng-container>\n                    </div>\n                    <div *ngIf=\"showFooter\" class=\"ui-g-12 global-search__modal--footer\">\n                        <s-button class=\"global-search__show-more\" (click)=\"showMore()\" priority=\"link\">\n                            {{showMoreLabel}}\n                        </s-button>\n                    </div>\n                </div>\n            </div>\n            <s-empty-state *ngIf=\"(!dropdownItens || dropdownItens.length==0) && !isLoading\" [title]=\"emptyTitle\"\n                [description]=\"emptyDescription\" ngClass=\"global-search__empty-state--icon\"\n                [iconClass]=\"(emptyIcon ? emptyIcon : 'fas fa-search')\">\n            </s-empty-state>\n        </div>\n    </div>\n    <div *ngIf=\"wasSearched\" class=\"global-search__background\" (click)=\"close()\"></div>\n</div>\n",
+            animations: [
+                trigger("expandableContent", [
+                    state("*", style$7({
+                        height: "0",
+                    })),
+                    state("false", style$7({
+                        height: "0",
+                    })),
+                    state("true", style$7({
+                        height: "*",
+                    })),
+                    transition("* => true", animate("200ms ease-out")),
+                    transition("false <=> true", animate("200ms ease-out")),
+                ]),
+            ],
+            styles: [".global-search__input{border-radius:20px 0 0 20px;width:136px;cursor:pointer;padding:0 0 0 15px;transition:.3s}.ui-inputtext{min-height:25px!important;height:25px!important}.global-search__span{transition:.3s;background:0 0!important;border-left:none;border-radius:0 20px 20px 0!important;padding:1px 15px 0 0!important;height:25px!important}.global-search__input:active,.global-search__input:focus{width:466px;cursor:default;transition:.3s;border-top:1px solid #428bca;border-left:1px solid #428bca;border-bottom:1px solid #428bca}.global-search__input:active,.global-search__input:focus+.global-search__span{transition:.3s;border-left:none;border-top:1px solid #428bca!important;border-right:1px solid #428bca!important;border-bottom:1px solid #428bca!important}.global-search__input-active{width:466px;cursor:default;transition:.3s}.global-search__modal{box-shadow:0 2px 8px 0 rgba(0,0,0,.4);border-radius:5px;width:500px;background:#fff;position:absolute;margin-top:60px;z-index:6;min-height:50px}::ng-deep .global-search__loader{border-radius:5px!important;width:100%}.global-search__container{min-height:50px;width:100%}.global-search__modal--total-itens-title{padding:15px;color:#333;border-bottom:1px solid #ccc;font-weight:600;height:50px}.global-search__modal--footer{height:50px;border-top:1px solid #ccc}.global-search__dropdown--itens{max-height:510px;overflow:auto}.global-search__dropdown--itens-container:hover{background:#dbe0e4}.global-search__modal--total-itens-title-icon{text-align:right;cursor:pointer}.global-search__background{background:rgba(0,0,0,.4);width:100%;height:calc(100vh - 70px);position:absolute;left:0;margin-top:50px;z-index:5;cursor:pointer}.no-space{padding:0;margin:0}.global-search__show-more{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}body .global-search__show-more--button{color:#428bca!important}.modal{position:absolute;left:1%;width:98%;height:calc(100vh - 90px)}.global-search__empty-state--icon{margin:42px 134px}::ng-deep .global-search__empty-state--icon .container .icon{font-size:40px}::ng-deep .s-button-priority-link{color:#428bca}@media all and (max-width:900px){.global-search__modal{top:20px;width:98%;left:1%}.global-search__input-active,.global-search__input:active,.global-search__input:focus{position:absolute;width:calc(100% - 70px);left:2%}body .global-search__dropdown--itens{max-height:100%;overflow:auto}}@media all and (max-width:767px){.global-search__modal{top:15px}.global-search__input-active,.global-search__input:active,.global-search__input:focus{width:calc(100% - 55px)}}@media all and (max-width:600px){.global-search__modal--itens{height:calc(100vh - 100px);background:#fff}.global-search__input-active,.global-search__input:active,.global-search__input:focus{position:absolute;width:calc(100% - 53px);left:2%}body .global-search__dropdown--itens{max-height:100%;overflow:auto}.global-search__dropdown--itens{max-height:100%;background:#fff}.global-search__modal--footer{background:#fff;height:50px}.global-search__modal{top:17px;border-radius:0;margin-top:55px;box-shadow:none;left:0;width:100%}}"]
+        })
+    ], GlobalSearchComponent);
+    return GlobalSearchComponent;
+}());
+
+var InfiniteScrollDirective = /** @class */ (function () {
+    function InfiniteScrollDirective(el) {
+        this.el = el;
+        this.onScroll = new EventEmitter();
+    }
+    InfiniteScrollDirective.prototype.scroll = function () {
+        if (this.el.nativeElement.scrollTop > (this.el.nativeElement.scrollHeight - this.el.nativeElement.offsetHeight - 2)) {
+            this.onScroll.emit();
+        }
+    };
+    InfiniteScrollDirective.ctorParameters = function () { return [
+        { type: ElementRef }
+    ]; };
     __decorate([
-        ViewChild(IAInsightSidebarComponent)
-    ], IAInsightComponent.prototype, "sidebar", void 0);
+        Output()
+    ], InfiniteScrollDirective.prototype, "onScroll", void 0);
     __decorate([
-        ContentChildren(TemplateDirective)
-    ], IAInsightComponent.prototype, "templates", void 0);
-    IAInsightComponent = __decorate([
-        Component({
-            selector: "s-ia-insight",
-            template: "<s-ia-insight-sidebar\n    #sidebar\n    [insights]=\"insights\"\n    [hasPermission]=\"hasPermission\"\n    [introText]=\"introText\"\n    [introTemplate]=\"introTemplate\"\n    [emptyText]=\"emptyText\"\n    [emptyTemplate]=\"emptyTemplate\"\n    [noPermissionText]=\"noPermissionText\"\n    [noPermissionTemplate]=\"noPermissionTemplate\">\n</s-ia-insight-sidebar>",
-            styles: [""]
+        HostListener("scroll")
+    ], InfiniteScrollDirective.prototype, "scroll", null);
+    InfiniteScrollDirective = __decorate([
+        Directive({
+            selector: "[sInfiniteScroll]"
         })
-    ], IAInsightComponent);
-    return IAInsightComponent;
+    ], InfiniteScrollDirective);
+    return InfiniteScrollDirective;
 }());
 
-var IAInsightModule = /** @class */ (function () {
-    function IAInsightModule() {
+var InfiniteScrollModule = /** @class */ (function () {
+    function InfiniteScrollModule() {
     }
-    IAInsightModule = __decorate([
+    InfiniteScrollModule = __decorate([
         NgModule({
-            imports: [
-                CommonModule,
-                TranslateModule,
-                BadgeModule,
-                ButtonModule,
-                TooltipModule,
-                TemplateModule,
-                SVGFactoryModule,
-            ],
             declarations: [
-                IAInsightComponent,
-                IAInsightCardComponent,
-                IAInsightSidebarComponent,
-                IAInsightCardLoaderComponent,
+                InfiniteScrollDirective
             ],
-            exports: [
-                IAInsightComponent,
-                TemplateModule,
+            imports: [
+                CommonModule
             ],
+            exports: [
+                InfiniteScrollDirective
+            ]
         })
-    ], IAInsightModule);
-    return IAInsightModule;
-}());
-
-var HeaderComponent = /** @class */ (function () {
-    function HeaderComponent() {
-    }
-    HeaderComponent = __decorate([
-        Component({
-            selector: "s-header",
-            template: "<ng-content></ng-content>"
-        })
-    ], HeaderComponent);
-    return HeaderComponent;
-}());
-
-var FooterComponent = /** @class */ (function () {
-    function FooterComponent() {
-    }
-    FooterComponent = __decorate([
-        Component({
-            selector: "s-footer",
-            template: "<ng-content></ng-content>"
-        })
-    ], FooterComponent);
-    return FooterComponent;
+    ], InfiniteScrollModule);
+    return InfiniteScrollModule;
 }());
 
-var StructureModule = /** @class */ (function () {
-    function StructureModule() {
+var GlobalSearchModule = /** @class */ (function () {
+    function GlobalSearchModule() {
     }
-    StructureModule = __decorate([
+    GlobalSearchModule = __decorate([
         NgModule({
-            imports: [CommonModule],
-            declarations: [HeaderComponent, FooterComponent],
-            exports: [HeaderComponent, FooterComponent],
+            declarations: [
+                GlobalSearchComponent,
+                GlobalSearchDropdownItemComponent
+            ],
+            imports: [
+                CommonModule,
+                InputTextModule,
+                FormsModule,
+                ReactiveFormsModule,
+                TooltipModule$1,
+                ThumbnailModule,
+                ButtonModule,
+                LoadingStateModule,
+                InfiniteScrollModule,
+                EmptyStateModule
+            ],
+            exports: [
+                GlobalSearchComponent,
+                GlobalSearchDropdownItemComponent,
+                TooltipModule$1,
+                ThumbnailModule,
+                ButtonModule,
+                LoadingStateModule,
+                EmptyStateModule
+            ],
+            entryComponents: [
+                GlobalSearchComponent,
+                GlobalSearchDropdownItemComponent
+            ]
         })
-    ], StructureModule);
-    return StructureModule;
+    ], GlobalSearchModule);
+    return GlobalSearchModule;
 }());
 
-var ImageCropperComponent = /** @class */ (function () {
-    function ImageCropperComponent() {
-        this.id = "s-image-cropper-" + ImageCropperComponent_1.nextId++;
-        this.visible = false;
-        this.header = "Recortar imagem";
-        this.cropLabel = "Recortar";
-        this.selectAnotherLabel = "Trocar";
-        this.removeLabel = "Remover";
-        this.cancelLabel = "Cancelar";
-        this.emptyStateTitle = "Selecione uma foto, em seguida você poderá ajustá-la";
-        this.emptyStateActionLabel = "Escolher imagem";
-        this.emptyStateIconClass = "fa fa-picture-o";
-        this.aspectRatio = NaN;
-        this.rounded = false;
-        this.allowSelectAnother = true;
-        this.allowRemove = true;
-        this.allowCancel = true;
-        this.visibleChange = new EventEmitter();
-        this.changeImage = new EventEmitter();
-        this.croppedImage = new EventEmitter();
-        this.croppedCanvas = new EventEmitter();
-        this.removedImage = new EventEmitter();
-        this.cancel = new EventEmitter();
+var IAInsightCardComponent = /** @class */ (function () {
+    function IAInsightCardComponent(clipboard, messageService, translateService) {
+        this.clipboard = clipboard;
+        this.messageService = messageService;
+        this.translateService = translateService;
+        this.open = false;
+        this.isLoading = false;
+        this.likeSelected = false;
+        this.dislikeSelected = false;
     }
-    ImageCropperComponent_1 = ImageCropperComponent;
-    ImageCropperComponent.prototype.ngOnInit = function () {
-        if (this.imageSource)
-            this.initCropper();
+    IAInsightCardComponent.prototype.toggle = function () {
+        this.open = !this.open;
+        this._requestInsight();
     };
-    ImageCropperComponent.prototype.ngOnChanges = function (changes) {
-        if (changes.imageSource && changes.imageSource.currentValue) {
-            this.initCropper();
+    IAInsightCardComponent.prototype.onLikeSelected = function () {
+        var _a, _b;
+        if (this.likeSelected) {
+            this.likeSelected = false;
         }
-    };
-    ImageCropperComponent.prototype.initCropper = function () {
-        if (this.cropper) {
-            this.cropper.destroy();
+        else {
+            this.likeSelected = true;
+            this.dislikeSelected = false;
+            (_b = (_a = this.insight).onLikeSelected) === null || _b === void 0 ? void 0 : _b.call(_a);
         }
-        this.image.nativeElement.src = this.imageSource;
-        this.cropper = new Cropper(this.image.nativeElement, {
-            aspectRatio: this.rounded ? 1 : this.aspectRatio,
-            guides: false,
-            dragMode: "move",
-            minCropBoxHeight: 2,
-            minCropBoxWidth: 2,
-            toggleDragModeOnDblclick: false,
-        });
-    };
-    ImageCropperComponent.prototype.getRoundedCanvas = function (sourceCanvas) {
-        var canvas = document.createElement("canvas");
-        var context = canvas.getContext("2d");
-        var width = sourceCanvas.width;
-        var height = sourceCanvas.height;
-        canvas.width = width;
-        canvas.height = height;
-        context.imageSmoothingEnabled = true;
-        context.drawImage(sourceCanvas, 0, 0, width, height);
-        context.globalCompositeOperation = "destination-in";
-        context.beginPath();
-        context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);
-        context.fill();
-        return canvas;
     };
-    ImageCropperComponent.prototype.onCropImage = function () {
-        if (!this.imageSource) {
-            this.croppedImage.emit();
-            this.croppedCanvas.emit();
+    IAInsightCardComponent.prototype.onDislikeSelected = function () {
+        var _a, _b;
+        if (this.dislikeSelected) {
+            this.dislikeSelected = false;
         }
         else {
-            var _croppedCanvas = this.rounded ? this.getRoundedCanvas(this.cropper.getCroppedCanvas()) : this.cropper.getCroppedCanvas();
-            this.croppedCanvas.emit(_croppedCanvas);
-            this.croppedImage.emit(_croppedCanvas.toDataURL());
+            this.dislikeSelected = true;
+            this.likeSelected = false;
+            (_b = (_a = this.insight).onDislikeSelected) === null || _b === void 0 ? void 0 : _b.call(_a);
         }
-        this.visibleChange.emit(false);
     };
-    ImageCropperComponent.prototype.onChangeImage = function () {
-        this.changeImage.emit();
+    IAInsightCardComponent.prototype.copyContent = function () {
+        var _a, _b;
+        (_b = (_a = this.insight).onCopy) === null || _b === void 0 ? void 0 : _b.call(_a, this.content);
+        if (this.clipboard.copy(this.content)) {
+            this.messageService.add({
+                severity: "info",
+                summary: this.translateService.instant("platform.angular_components.copied_to_clipboard"),
+            });
+        }
     };
-    ImageCropperComponent.prototype.onRemoveImage = function () {
-        this.imageSource = undefined;
-        this.removedImage.emit();
+    IAInsightCardComponent.prototype.reloadContent = function () {
+        this._requestInsight();
+    };
+    IAInsightCardComponent.prototype._requestInsight = function () {
+        var _this = this;
+        this.isLoading = true;
+        this.insight.request$
+            .pipe(first(), finalize(function () { return (_this.isLoading = false); }))
+            .subscribe(function (content) {
+            _this.content = marked.marked(content);
+        });
+    };
+    IAInsightCardComponent.ctorParameters = function () { return [
+        { type: Clipboard },
+        { type: MessageService },
+        { type: TranslateService }
+    ]; };
+    __decorate([
+        Input()
+    ], IAInsightCardComponent.prototype, "insight", void 0);
+    IAInsightCardComponent = __decorate([
+        Component({
+            selector: "s-ia-insight-card",
+            template: "<div class=\"ia-insight-card\" [ngClass]=\"{ 'ia-insight-card--close': !open }\">\n    <div class=\"header\" (click)=\"toggle()\">\n        <s-badge text=\"Insight\" iconClass=\"fal fa-lightbulb\"></s-badge>\n        <span class=\"insight-title\">{{ insight.title }}</span>\n        <span\n            class=\"toggle-icon fas\"\n            [ngClass]=\"{\n                'fa-angle-down': !open,\n                'fa-angle-up': open\n            }\"\n        >\n        </span>\n    </div>\n    <div class=\"content\">\n        <ng-container *ngIf=\"isLoading; then loadingBlock; else contentBlock\"></ng-container>\n        <ng-template #loadingBlock>\n            <s-ia-insight-card-loader></s-ia-insight-card-loader>\n        </ng-template>\n        <ng-template #contentBlock>\n            <ng-container *ngIf=\"content; then successBlock; else errorBlock\"></ng-container>\n\n            <ng-template #successBlock>\n                <span class=\"text\" [innerHTML]=\"content\"></span>\n            </ng-template>\n            <ng-template #errorBlock>\n                <span class=\"text text--error\">{{ \"platform.angular_components.error_loading_insight_alt\" | translate }}</span>\n            </ng-template>\n\n            <div class=\"options\">\n                <button [disabled]=\"!content\" (click)=\"copyContent()\" class=\"option fal fa-copy\"></button>\n                <button (click)=\"reloadContent()\" class=\"option fal fa-redo\"></button>\n                <button\n                    *ngIf=\"insight.onLikeSelected\"\n                    [disabled]=\"!content\"\n                    (click)=\"onLikeSelected()\"\n                    class=\"option\"\n                    [ngClass]=\"{\n                        'fal': !likeSelected,\n                        'fas': likeSelected,\n                        'fa-thumbs-up': true\n                    }\">\n                </button>\n                <button\n                    *ngIf=\"insight.onDislikeSelected\"\n                    [disabled]=\"!content\"\n                    (click)=\"onDislikeSelected()\"\n                    class=\"option\"\n                    [ngClass]=\"{\n                        'fal': !dislikeSelected,\n                        'fas': dislikeSelected,\n                        'fa-thumbs-down': true\n                    }\">\n                </button>\n            </div>\n        </ng-template>\n    </div>\n</div>\n",
+            styles: [".ia-insight-card{background-color:#fff;border:1px solid #9ecad4;border-radius:4px;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden}.ia-insight-card .header{-ms-flex-align:center;align-items:center;background-color:#f1f7f8;border-bottom:1px solid #9ecad4;display:-ms-flexbox;display:flex;gap:8px;min-height:60px;padding:8px 16px;-webkit-user-select:none;-ms-user-select:none;user-select:none}.ia-insight-card .header .insight-title{color:#428bca;-ms-flex-positive:1;flex-grow:1;font-family:\"Open Sans\",sans-serif;font-size:14px;line-height:150%}.ia-insight-card .header .toggle-icon{color:#888b99;font-size:20px}.ia-insight-card .content{-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;cursor:auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:16px;min-height:160px;padding:24px}.ia-insight-card .content .text{color:#212533;font-family:\"Open Sans\",sans-serif;font-size:14px;width:100%}.ia-insight-card .content .text--error{text-align:center}.ia-insight-card .content .options{display:-ms-flexbox;display:flex;gap:8px}.ia-insight-card .content .options .option{background-color:transparent;border:none;color:#428bca;cursor:pointer;font-size:12px}.ia-insight-card .content .options .option:disabled{color:#c1c1cc;cursor:auto}.ia-insight-card--close{border-color:#dedce5}.ia-insight-card--close .header{background-color:#fbfafc;border:#dedce5}.ia-insight-card--close .header .insight-title{color:#888b99}.ia-insight-card--close .content{display:none}"]
+        })
+    ], IAInsightCardComponent);
+    return IAInsightCardComponent;
+}());
+
+var IAInsightSidebarComponent = /** @class */ (function () {
+    function IAInsightSidebarComponent() {
+        this.insights = [];
+        this.opened = false;
+    }
+    IAInsightSidebarComponent.prototype.toggle = function () {
+        this.opened = !this.opened;
     };
-    ImageCropperComponent.prototype.onCancel = function () {
-        this.visibleChange.emit(false);
-        this.cancel.emit();
+    IAInsightSidebarComponent.prototype.open = function () {
+        this.opened = true;
     };
-    ImageCropperComponent.prototype.onModalVisibleChange = function (visible) {
-        if (!visible)
-            this.onCancel();
-        this.visibleChange.emit(visible);
+    IAInsightSidebarComponent.prototype.close = function () {
+        this.opened = false;
     };
-    var ImageCropperComponent_1;
-    ImageCropperComponent.nextId = 0;
-    __decorate([
-        Input()
-    ], ImageCropperComponent.prototype, "id", void 0);
-    __decorate([
-        Input()
-    ], ImageCropperComponent.prototype, "visible", void 0);
-    __decorate([
-        Input()
-    ], ImageCropperComponent.prototype, "header", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "cropLabel", void 0);
+    ], IAInsightSidebarComponent.prototype, "insights", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "selectAnotherLabel", void 0);
+    ], IAInsightSidebarComponent.prototype, "hasPermission", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "removeLabel", void 0);
+    ], IAInsightSidebarComponent.prototype, "introText", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "cancelLabel", void 0);
+    ], IAInsightSidebarComponent.prototype, "introTemplate", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "emptyStateTitle", void 0);
+    ], IAInsightSidebarComponent.prototype, "emptyText", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "emptyStateActionLabel", void 0);
+    ], IAInsightSidebarComponent.prototype, "emptyTemplate", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "emptyStateIconClass", void 0);
+    ], IAInsightSidebarComponent.prototype, "noPermissionText", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "aspectRatio", void 0);
+    ], IAInsightSidebarComponent.prototype, "noPermissionTemplate", void 0);
+    IAInsightSidebarComponent = __decorate([
+        Component({
+            selector: "s-ia-insight-sidebar",
+            template: "<div\n    class=\"sidebar\"\n    [class.opened]=\"opened\">\n    <div class=\"header\">\n        <button (click)=\"close()\" class=\"option\">\n            <span class=\"far fa-chevron-double-right\"></span>\n        </button>\n        <div class=\"title\">\n            <span><ng-container [ngTemplateOutlet]=\"iassistIcon\"></ng-container></span>\n            <span>Insight</span>\n        </div>\n    </div>\n    <div class=\"intro\">\n        <ng-container *ngIf=\"hasPermission; then permissionBlock; else noPermissionBlock\"></ng-container>\n\n        <ng-template #permissionBlock>\n            <ng-container *ngIf=\"insights?.length; then introBlock; else emptyBlock\"></ng-container>\n        \n            <ng-template #introBlock>\n                <ng-container *ngIf=\"introTemplate; then introCustomBlock; else introTextBlock\"></ng-container>\n\n                <ng-template #introCustomBlock>\n                    <ng-container *ngTemplateOutlet=\"introTemplate\"></ng-container>\n                </ng-template>\n\n                <ng-template #introTextBlock>\n                    <span class=\"text\">{{ introText || \"platform.angular_components.insight_intro\" | translate }}</span>\n                </ng-template>\n            </ng-template>\n            \n            <ng-template #emptyBlock>\n                <ng-container *ngIf=\"emptyTemplate; then emptyCustomBlock; else emptyTextBlock\"></ng-container>\n\n                <ng-template #emptyCustomBlock>\n                    <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n                </ng-template>\n\n                <ng-template #emptyTextBlock>\n                    <span class=\"text\">{{ emptyText || \"platform.angular_components.insight_empty\" | translate }}</span>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n        \n        <ng-template #noPermissionBlock>\n            <ng-container *ngIf=\"noPermissionTemplate; then noPermissionCustomBlock; else noPermissionTextBlock\"></ng-container>\n\n            <ng-template #noPermissionCustomBlock>\n                <ng-container *ngTemplateOutlet=\"noPermissionTemplate\"></ng-container>\n            </ng-template>\n\n            <ng-template #noPermissionTextBlock>\n                <span>{{ noPermissionText || \"platform.angular_components.insight_no_permission\" | translate }}</span>\n            </ng-template>\n        </ng-template>\n    </div>\n    <div class=\"insights\">\n        <ng-container *ngIf=\"insights?.length\">\n            <s-ia-insight-card\n                *ngFor=\"let insight of insights\"\n                [insight]=\"insight\">\n            </s-ia-insight-card>\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #iassistIcon>\n    <div style=\"width: 28px; height: 28px;\">\n        <span *sSVGFactory=\"'iassist'\"></span>\n    </div>\n</ng-template>\n",
+            styles: [".sidebar{background-color:#fff;border-left:1px solid #dedce5;height:100%;overflow-x:hidden;position:fixed;right:-25%;transition:.5s;top:0;width:25%;z-index:1002}.sidebar .header{border-bottom:1px solid #dedce5;display:-ms-flexbox;display:flex;gap:16px;padding:12px 20px}.sidebar .header .option{background-color:transparent;border:none;color:#428bca;cursor:pointer;font-size:16px;padding:12px}.sidebar .header .title{-ms-flex-align:center;align-items:center;color:#212533;display:-ms-flexbox;display:flex;font-family:\"Open Sans\",sans-serif;font-size:16px;gap:16px;line-height:1;-webkit-user-select:none;-ms-user-select:none;user-select:none}.sidebar .intro{margin:8px 40px}.sidebar .intro .text{color:#212533;display:-ms-flexbox;display:flex;font-family:\"Open Sans\",sans-serif;font-size:14px;-ms-flex-pack:center;justify-content:center;line-height:1.5;text-align:center;-webkit-user-select:none;-ms-user-select:none;user-select:none}.sidebar.opened{right:0}.sidebar.opened .insights{padding:12px}.insights{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:12px}@media (max-width:1366px){.sidebar{right:-50%;width:50%}}@media (max-width:768px){.sidebar{right:-75%;width:75%}}@media (max-width:600px){.sidebar{right:-100%;width:100%}}"]
+        })
+    ], IAInsightSidebarComponent);
+    return IAInsightSidebarComponent;
+}());
+
+var IAInsightCardLoaderComponent = /** @class */ (function () {
+    function IAInsightCardLoaderComponent() {
+    }
+    IAInsightCardLoaderComponent = __decorate([
+        Component({
+            selector: "s-ia-insight-card-loader",
+            template: "<div class=\"ia-insight-card-loader\">\n    <div class=\"loader\">\n        <div class=\"loader-icon\">\n                <div *sSVGFactory=\"'iassist'\"></div>\n        </div>\n    </div>\n    \n    <span class=\"loader-label\">{{ \"platform.angular_components.loading_insight\" | translate }}</span>\n</div>\n",
+            styles: [".ia-insight-card-loader{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:24px}.ia-insight-card-loader .loader{-ms-flex-align:center;align-items:center;animation:2s linear infinite spin;border:2px solid #f1f7f8;border-top:2px solid #0fa389;border-radius:50%;display:-ms-flexbox;display:flex;height:48px;-ms-flex-pack:center;justify-content:center;width:48px}.ia-insight-card-loader .loader .loader-icon{animation:2s linear infinite reverse spin;height:32px;transform:translate(-50%,-50%)}.ia-insight-card-loader .loader-label{color:#888b99;font-family:\"Open Sans\",sans-serif;font-size:16px}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}"]
+        })
+    ], IAInsightCardLoaderComponent);
+    return IAInsightCardLoaderComponent;
+}());
+
+var IAInsightTemplateTypes;
+(function (IAInsightTemplateTypes) {
+    IAInsightTemplateTypes["Empty"] = "empty";
+    IAInsightTemplateTypes["Intro"] = "intro";
+    IAInsightTemplateTypes["NoPermission"] = "noPermission";
+})(IAInsightTemplateTypes || (IAInsightTemplateTypes = {}));
+
+var IAInsightComponent = /** @class */ (function () {
+    function IAInsightComponent() {
+        this.insights = [];
+        this.hasPermission = true;
+    }
+    IAInsightComponent.prototype.ngAfterContentInit = function () {
+        this._getTemplates();
+    };
+    IAInsightComponent.prototype.open = function () {
+        this.sidebar.open();
+    };
+    IAInsightComponent.prototype.close = function () {
+        this.sidebar.close();
+    };
+    IAInsightComponent.prototype.getIntroTemplate = function () {
+        return this._getCustomTemplate(IAInsightTemplateTypes.Intro);
+    };
+    IAInsightComponent.prototype.getNoPermissionTemplate = function () {
+        return this._getCustomTemplate(IAInsightTemplateTypes.NoPermission);
+    };
+    IAInsightComponent.prototype.getEmptyTemplate = function () {
+        return this._getCustomTemplate(IAInsightTemplateTypes.Empty);
+    };
+    IAInsightComponent.prototype._getCustomTemplate = function (type) {
+        var _a;
+        return (_a = this.templates.find(function (template) { return template.type === type; })) === null || _a === void 0 ? void 0 : _a.template;
+    };
+    IAInsightComponent.prototype._getTemplates = function () {
+        this.introTemplate = this.getIntroTemplate();
+        this.emptyTemplate = this.getEmptyTemplate();
+        this.noPermissionTemplate = this.getNoPermissionTemplate();
+    };
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "rounded", void 0);
+    ], IAInsightComponent.prototype, "insights", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "allowSelectAnother", void 0);
+    ], IAInsightComponent.prototype, "hasPermission", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "allowRemove", void 0);
+    ], IAInsightComponent.prototype, "introText", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "allowCancel", void 0);
+    ], IAInsightComponent.prototype, "emptyText", void 0);
     __decorate([
         Input()
-    ], ImageCropperComponent.prototype, "imageSource", void 0);
-    __decorate([
-        Output()
-    ], ImageCropperComponent.prototype, "visibleChange", void 0);
-    __decorate([
-        Output()
-    ], ImageCropperComponent.prototype, "changeImage", void 0);
-    __decorate([
-        Output()
-    ], ImageCropperComponent.prototype, "croppedImage", void 0);
-    __decorate([
-        Output()
-    ], ImageCropperComponent.prototype, "croppedCanvas", void 0);
-    __decorate([
-        Output()
-    ], ImageCropperComponent.prototype, "removedImage", void 0);
-    __decorate([
-        Output()
-    ], ImageCropperComponent.prototype, "cancel", void 0);
-    __decorate([
-        ViewChild("image", { static: true })
-    ], ImageCropperComponent.prototype, "image", void 0);
+    ], IAInsightComponent.prototype, "noPermissionText", void 0);
     __decorate([
-        ContentChild(HeaderComponent, { static: true })
-    ], ImageCropperComponent.prototype, "headerSection", void 0);
+        ViewChild(IAInsightSidebarComponent)
+    ], IAInsightComponent.prototype, "sidebar", void 0);
     __decorate([
-        ContentChild(FooterComponent, { static: true })
-    ], ImageCropperComponent.prototype, "footerSection", void 0);
-    ImageCropperComponent = ImageCropperComponent_1 = __decorate([
+        ContentChildren(TemplateDirective)
+    ], IAInsightComponent.prototype, "templates", void 0);
+    IAInsightComponent = __decorate([
         Component({
-            selector: "s-image-cropper",
-            template: "<div [id]=\"id\">\n    <p-dialog\n        styleClass=\"s-image-cropper {{rounded ? 's-image-cropper--rounded' : ''}}\"\n        [header]=\"headerSection ? '' : header\"\n        [visible]=\"visible\"\n        (visibleChange)=\"onModalVisibleChange($event)\"\n        [modal]=\"true\"\n        [blockScroll]=\"true\"\n        [draggable]=\"false\"\n        [resizable]=\"false\"\n        [closeOnEscape]=\"allowCancel\"\n        [closable]=\"allowCancel\"\n        appendTo=\"body\">\n\n        <p-header *ngIf=\"headerSection\">\n            <ng-content select=\"s-header\"></ng-content>\n        </p-header>\n\n        <s-empty-state\n            [id]=\"id + '-empty-state'\"\n            *ngIf=\"!imageSource\"\n            [title]=\"emptyStateTitle\"\n            [iconClass]=\"emptyStateIconClass\"\n            [primaryActionLabel]=\"emptyStateActionLabel\"\n            (primaryAction)=\"onChangeImage()\">\n        </s-empty-state>\n\n        <div [attr.data-hidden]=\"!imageSource\" class=\"image-container\">\n            <img\n                [id]=\"id + '-cropper'\"\n                #image\n                [src]=\"imageSource || ''\"\n                alt=\"cropped image\"/>\n        </div>\n\n        <p-footer>\n            <div class=\"ui-fluid\" *ngIf=\"!footerSection\">\n                <div class=\"ui-g button-container\">\n\n                    <div *ngIf=\"allowCancel\" class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-cancel-button'\"\n                            type=\"button\"\n                            priority=\"link\"\n                            [label]=\"cancelLabel\"\n                            (onClick)=\"onCancel()\">\n                        </s-button>\n                    </div>\n\n                    <div *ngIf=\"imageSource && allowRemove\" class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-remove-button'\"\n                            type=\"button\"\n                            priority=\"secondary\"\n                            [label]=\"removeLabel\"\n                            (onClick)=\"onRemoveImage()\">\n                        </s-button>\n                    </div>\n\n                    <div *ngIf=\"imageSource && allowSelectAnother\" class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-select-another-button'\"\n                            type=\"button\"\n                            priority=\"secondary\"\n                            [label]=\"selectAnotherLabel\"\n                            (onClick)=\"onChangeImage()\">\n                        </s-button>\n                    </div>\n\n                    <div class=\"ui-sm-12 ui-md-3 ui-lg-2 ui-xl-2\">\n                        <s-button\n                            [id]=\"id + '-crop-button'\"\n                            type=\"button\"\n                            [label]=\"cropLabel\"\n                            (onClick)=\"onCropImage()\">\n                        </s-button>\n                    </div>\n                </div>\n            </div>\n\n            <ng-content select=\"s-footer\" *ngIf=\"footerSection\"></ng-content>\n        </p-footer>\n    </p-dialog>\n</div>",
-            encapsulation: ViewEncapsulation.None,
-            styles: ["/*!\n * Cropper.js v1.6.2\n * https://fengyuanchen.github.io/cropperjs\n *\n * Copyright 2015-present Chen Fengyuan\n * Released under the MIT license\n *\n * Date: 2024-04-21T07:43:02.731Z\n */.cropper-container{-webkit-touch-callout:none;direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{bottom:0;left:0;position:absolute;right:0;top:0}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:rgba(51,153,255,.75) solid 1px;overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:\" \";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media (min-width:768px){.cropper-point.point-se{height:15px;width:15px}}@media (min-width:992px){.cropper-point.point-se{height:10px;width:10px}}@media (min-width:1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:\" \";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}", ".s-image-cropper{border-radius:0!important;height:80%!important;max-width:100%!important;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:column;flex-direction:column}.s-image-cropper .ui-dialog-content{overflow:hidden;height:auto!important;-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.s-image-cropper .ui-dialog-footer,.s-image-cropper .ui-dialog-header{-ms-flex-negative:0;flex-shrink:0;direction:ltr}.s-image-cropper .image-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:100%}.s-image-cropper img{max-width:100%;max-height:100%}.s-image-cropper .button-container{-ms-flex-flow:wrap-reverse;flex-flow:wrap-reverse;-ms-flex-pack:end;justify-content:flex-end}.s-image-cropper .cropper-view-box{outline:#fff dashed 2px}.s-image-cropper .cropper-line{opacity:0}.s-image-cropper .cropper-point{background-color:#fff;opacity:1;height:15px;width:15px;border-radius:50%}.s-image-cropper .cropper-point.point-e{right:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-n{top:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-w{left:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-s{bottom:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-ne{right:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-nw{left:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-sw{left:-8.5px;bottom:-8.5px}.s-image-cropper .cropper-point.point-se{right:-8.5px;bottom:-8.5px}.s-image-cropper--rounded .cropper-face,.s-image-cropper--rounded .cropper-view-box{border-radius:50%}.s-image-cropper--rounded .cropper-view-box{outline:rgba(255,255,255,.3) dashed 1px}.s-image-cropper--rounded .cropper-view-box:after{border:2px dashed #fff;border-radius:50%;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}@media (max-width:767px){.s-image-cropper{border:none!important;top:0!important;left:0!important;width:100%!important;height:100%!important}}@media (min-width:768px){.s-image-cropper{width:80%!important}}@media (min-width:1200px){.s-image-cropper{width:60%!important}}"]
+            selector: "s-ia-insight",
+            template: "<s-ia-insight-sidebar\n    #sidebar\n    [insights]=\"insights\"\n    [hasPermission]=\"hasPermission\"\n    [introText]=\"introText\"\n    [introTemplate]=\"introTemplate\"\n    [emptyText]=\"emptyText\"\n    [emptyTemplate]=\"emptyTemplate\"\n    [noPermissionText]=\"noPermissionText\"\n    [noPermissionTemplate]=\"noPermissionTemplate\">\n</s-ia-insight-sidebar>",
+            styles: [""]
         })
-    ], ImageCropperComponent);
-    return ImageCropperComponent;
+    ], IAInsightComponent);
+    return IAInsightComponent;
 }());
 
-var ImageCropperModule = /** @class */ (function () {
-    function ImageCropperModule() {
+var IAInsightModule = /** @class */ (function () {
+    function IAInsightModule() {
     }
-    ImageCropperModule = __decorate([
+    IAInsightModule = __decorate([
         NgModule({
-            imports: [CommonModule, DialogModule, ButtonModule, EmptyStateModule, StructureModule],
-            declarations: [ImageCropperComponent],
-            exports: [ImageCropperComponent, StructureModule],
-            entryComponents: [ImageCropperComponent],
-        })
-    ], ImageCropperModule);
-    return ImageCropperModule;
-}());
-
-var ImageCropperService = /** @class */ (function () {
-    function ImageCropperService(componentFactoryResolver, appRef, injector) {
-        this.componentFactoryResolver = componentFactoryResolver;
-        this.appRef = appRef;
-        this.injector = injector;
-    }
-    ImageCropperService.prototype.show = function (config) {
-        var _this = this;
-        if (this.activeCropper)
-            this.destroy(this.activeCropper);
-        var activeCropper = {
-            componentRef: this.componentFactoryResolver.resolveComponentFactory(ImageCropperComponent).create(this.injector),
-            ngUnsubscribe: new Subject(),
-        };
-        this.activeCropper = activeCropper;
-        this.appRef.attachView(activeCropper.componentRef.hostView);
-        var domElem = activeCropper.componentRef.hostView.rootNodes[0];
-        document.body.appendChild(domElem);
-        this.configureInstance(activeCropper, config);
-        activeCropper.componentRef.instance.visible = true;
-        activeCropper.componentRef.instance.visibleChange
-            .pipe(takeUntil(this.activeCropper.ngUnsubscribe), delay(1000))
-            .subscribe(function (visible) {
-            if (!visible)
-                _this.destroy(activeCropper);
-        });
-    };
-    ImageCropperService.prototype.configureInstance = function (activeCropper, config) {
-        var instance = activeCropper.componentRef.instance;
-        if (config) {
-            Object.keys(config).forEach(function (key) {
-                var value = config[key];
-                if (typeof value !== "function")
-                    instance[key] = value;
-                else if (typeof value === "function") {
-                    instance[key].pipe(takeUntil(activeCropper.ngUnsubscribe)).subscribe(function () {
-                        var param = [];
-                        for (var _i = 0; _i < arguments.length; _i++) {
-                            param[_i] = arguments[_i];
-                        }
-                        return config[key].apply(config, __spread(param));
-                    });
-                }
-            });
-        }
-        instance.visibleChange.pipe(takeUntil(activeCropper.ngUnsubscribe)).subscribe(function (visible) { return (instance.visible = visible); });
-    };
-    ImageCropperService.prototype.destroy = function (activeCropper) {
-        activeCropper.ngUnsubscribe.next();
-        activeCropper.ngUnsubscribe.complete();
-        this.appRef.detachView(activeCropper.componentRef.hostView);
-        activeCropper.componentRef.destroy();
-    };
-    ImageCropperService.ctorParameters = function () { return [
-        { type: ComponentFactoryResolver },
-        { type: ApplicationRef },
-        { type: Injector }
-    ]; };
-    ImageCropperService = __decorate([
-        Injectable()
-    ], ImageCropperService);
-    return ImageCropperService;
+            imports: [
+                CommonModule,
+                TranslateModule,
+                BadgeModule,
+                ButtonModule,
+                TooltipModule,
+                TemplateModule,
+                SVGFactoryModule,
+            ],
+            declarations: [
+                IAInsightComponent,
+                IAInsightCardComponent,
+                IAInsightSidebarComponent,
+                IAInsightCardLoaderComponent,
+            ],
+            exports: [
+                IAInsightComponent,
+                TemplateModule,
+            ],
+        })
+    ], IAInsightModule);
+    return IAInsightModule;
 }());
 
 var KanbanEventService = /** @class */ (function () {
@@ -14736,260 +15069,6 @@ var ProductHeaderModule = /** @class */ (function () {
     return ProductHeaderModule;
 }());
 
-var FileValidation;
-(function (FileValidation) {
-    FileValidation["MaxFileSize"] = "maxFileSize";
-    FileValidation["MaxFileLimit"] = "maxFileLimit";
-    FileValidation["TypeInvalid"] = "typeInvalid";
-    FileValidation["UnsupportedExtension"] = "unsupportedExtension";
-})(FileValidation || (FileValidation = {}));
-
-var ProfilePicturePickerComponent = /** @class */ (function () {
-    function ProfilePicturePickerComponent(imageCropperService, confirmationService, translateService) {
-        this.imageCropperService = imageCropperService;
-        this.confirmationService = confirmationService;
-        this.translateService = translateService;
-        this.simpleTitle = this.translateService.instant("platform.angular_components.drag_your_photo_or"); // Arraste sua foto ou
-        this.actionTitle = this.translateService.instant("platform.angular_components.select_a_file"); // Selecione um arquivo
-        this.aspectRatio = 1;
-        this.removeButtonLabel = this.translateService.instant("platform.angular_components.remover");
-        this.changeButtonLabel = this.translateService.instant("platform.angular_components.change_photo"); // Alterar foto
-        this.confirmationTexts = {
-            removalHeader: this.translateService.instant("platform.angular_components.remove_image"),
-            removalMessage: this.translateService.instant("platform.angular_components.confirmation_remove_image"),
-            removalAcceptLabel: this.translateService.instant("platform.angular_components.remove"),
-            removalRejectLabel: this.translateService.instant("platform.angular_components.cancel"),
-        };
-        this.supportedExtensions = [];
-        this.changedImage = new EventEmitter();
-        this.removedImage = new EventEmitter();
-        this.invalidFile = new EventEmitter();
-    }
-    ProfilePicturePickerComponent.prototype.ngOnInit = function () {
-        this._normalizeSuportedExtensions();
-    };
-    ProfilePicturePickerComponent.prototype.onDragOver = function (event) {
-        event.preventDefault();
-        event.stopPropagation();
-    };
-    ProfilePicturePickerComponent.prototype.onDragLeave = function (event) {
-        event.preventDefault();
-        event.stopPropagation();
-    };
-    ProfilePicturePickerComponent.prototype.onDrop = function (event) {
-        event.preventDefault();
-        event.stopPropagation();
-        var files = [];
-        var dataTransferFiles = event.dataTransfer.files;
-        for (var i = 0; i < dataTransferFiles.length; i++) {
-            files.push(dataTransferFiles.item(i));
-        }
-        this._showImageCropper(files);
-    };
-    // Verificando o redimensionamento para ajustar o design para ficar responsivo.
-    ProfilePicturePickerComponent.prototype.onResize = function () {
-        if (this.uploadPicture && this.info && this.thumbnail) {
-            var uploadPictureWidth = this._getWidthElement(this.uploadPicture);
-            var infoWidth = this._getWidthElement(this.info);
-            var thumbnailWidth = this._getWidthElement(this.thumbnail);
-            if (thumbnailWidth + infoWidth > uploadPictureWidth) {
-                this.uploadPicture.nativeElement.classList.add("upload-picture--small");
-            }
-            else {
-                this.uploadPicture.nativeElement.classList.remove("upload-picture--small");
-            }
-        }
-    };
-    ProfilePicturePickerComponent.prototype.selectPhoto = function () {
-        var fileInputElement = this.fileInput.nativeElement;
-        fileInputElement.value = "";
-        fileInputElement.click();
-    };
-    ProfilePicturePickerComponent.prototype.removePhoto = function () {
-        var _this = this;
-        this.confirmationService.confirm({
-            message: this.confirmationTexts.removalMessage,
-            acceptLabel: this.confirmationTexts.removalAcceptLabel,
-            rejectLabel: this.confirmationTexts.removalRejectLabel,
-            header: this.confirmationTexts.removalHeader,
-            accept: function () {
-                var fileInputElement = _this.fileInput.nativeElement;
-                fileInputElement.value = "";
-                _this.image = "";
-                _this.removedImage.emit();
-            },
-        });
-    };
-    ProfilePicturePickerComponent.prototype.photoSelected = function (event) {
-        this._showImageCropper(event.srcElement.files);
-    };
-    ProfilePicturePickerComponent.prototype._showImageCropper = function (files) {
-        var _this = this;
-        if (!this._validateData(files)) {
-            return;
-        }
-        var file = files[0];
-        var fileReader = new FileReader();
-        fileReader.readAsDataURL(file);
-        fileReader.onloadend = function (fileEvent) {
-            _this.imageCropperService.show(__assign({ imageSource: fileEvent.target.result, croppedImage: function (image) {
-                    _this.image = image;
-                    _this.changedImage.emit(image);
-                }, changeImage: function () { return _this.selectPhoto(); }, allowSelectAnother: false, aspectRatio: _this.aspectRatio }, _this.cropperLabelsConfig));
-        };
-    };
-    ProfilePicturePickerComponent.prototype._normalizeSuportedExtensions = function () {
-        this.supportedExtensions = this.supportedExtensions
-            .map(function (extension) { return extension.replace(".", "").toLocaleLowerCase(); });
-    };
-    ProfilePicturePickerComponent.prototype._validateData = function (files) {
-        if (!files.length) {
-            return false;
-        }
-        if (files.length > 1) {
-            this.invalidFile.emit({ file: null, validation: FileValidation.MaxFileLimit });
-            return false;
-        }
-        var file = files[0];
-        if (!file.type.includes("image")) {
-            this.invalidFile.emit({ file: file, validation: FileValidation.TypeInvalid });
-            return false;
-        }
-        if (!this._validateFileExtension(file)) {
-            this.invalidFile.emit({ file: file, validation: FileValidation.UnsupportedExtension });
-            return false;
-        }
-        if (!this._validateFileSize(file)) {
-            this.invalidFile.emit({ file: file, validation: FileValidation.MaxFileSize });
-            return false;
-        }
-        return true;
-    };
-    ProfilePicturePickerComponent.prototype._validateFileExtension = function (file) {
-        var _a;
-        if ((_a = this.supportedExtensions) === null || _a === void 0 ? void 0 : _a.length) {
-            var extension = file.name.split(".").pop().toLowerCase();
-            return this.supportedExtensions.includes(extension);
-        }
-        return true;
-    };
-    ProfilePicturePickerComponent.prototype._validateFileSize = function (file) {
-        if (this.maxFileSize) {
-            return file.size > this.maxFileSize;
-        }
-        return true;
-    };
-    ProfilePicturePickerComponent.prototype._getWidthElement = function (element) {
-        var _a = element.nativeElement.getBoundingClientRect(), left = _a.left, right = _a.right;
-        return right - left;
-    };
-    ProfilePicturePickerComponent.ctorParameters = function () { return [
-        { type: ImageCropperService },
-        { type: ConfirmationService },
-        { type: TranslateService }
-    ]; };
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "simpleTitle", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "actionTitle", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "subtitle", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "aspectRatio", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "cropperLabelsConfig", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "removeButtonLabel", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "changeButtonLabel", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "confirmationTexts", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "maxFileSize", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "accept", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "supportedExtensions", void 0);
-    __decorate([
-        Input()
-    ], ProfilePicturePickerComponent.prototype, "image", void 0);
-    __decorate([
-        ViewChild("uploadPicture")
-    ], ProfilePicturePickerComponent.prototype, "uploadPicture", void 0);
-    __decorate([
-        ViewChild("info")
-    ], ProfilePicturePickerComponent.prototype, "info", void 0);
-    __decorate([
-        ViewChild("thumbnail", { read: ElementRef })
-    ], ProfilePicturePickerComponent.prototype, "thumbnail", void 0);
-    __decorate([
-        ViewChild("fileInput", { read: ElementRef })
-    ], ProfilePicturePickerComponent.prototype, "fileInput", void 0);
-    __decorate([
-        Output()
-    ], ProfilePicturePickerComponent.prototype, "changedImage", void 0);
-    __decorate([
-        Output()
-    ], ProfilePicturePickerComponent.prototype, "removedImage", void 0);
-    __decorate([
-        Output()
-    ], ProfilePicturePickerComponent.prototype, "invalidFile", void 0);
-    __decorate([
-        HostListener("dragover", ["$event"])
-    ], ProfilePicturePickerComponent.prototype, "onDragOver", null);
-    __decorate([
-        HostListener("dragleave", ["$event"])
-    ], ProfilePicturePickerComponent.prototype, "onDragLeave", null);
-    __decorate([
-        HostListener("drop", ["$event"])
-    ], ProfilePicturePickerComponent.prototype, "onDrop", null);
-    __decorate([
-        HostListener("window:resize")
-    ], ProfilePicturePickerComponent.prototype, "onResize", null);
-    ProfilePicturePickerComponent = __decorate([
-        Component({
-            selector: "s-profile-picture-picker",
-            template: "<p-confirmDialog></p-confirmDialog>\n\n<input #fileInput [accept]=\"accept\" class=\"file-input\" type=\"file\" (change)=\"photoSelected($event)\">\n<div #uploadPicture class=\"upload-picture\">\n   <s-thumbnail\n      #thumbnail\n      iconClass=\"far fa-user\"\n      [imageSource]=\"image\"\n      [hasAction]=\"!image\"\n      (click)=\"selectPhoto()\">\n   </s-thumbnail>\n   <div #info class=\"info\">\n      <ng-container *ngIf=\"image; then withImage; else noImage\"></ng-container>\n      <p class=\"subtitle\">{{ subtitle }}</p>\n   </div>\n</div>\n\n<ng-template #withImage>\n   <div class=\"buttons\">\n      <s-button\n         [label]=\"changeButtonLabel\"\n         priority=\"primary\"\n         (onClick)=\"selectPhoto()\">\n      </s-button>\n      <s-button\n         [label]=\"removeButtonLabel\"\n         priority=\"secondary\"\n         (onClick)=\"removePhoto()\">\n      </s-button>\n   </div>\n</ng-template>\n\n<ng-template #noImage>\n   <p class=\"title\">\n      {{ simpleTitle }}\n      <span\n         class=\"action-title\"\n         (click)=\"selectPhoto()\">\n         {{ actionTitle }}\n      </span>\n   </p>\n</ng-template>",
-            styles: [".file-input{display:none}.upload-picture{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.upload-picture .info{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:12px 20px;-ms-flex-align:start;align-items:flex-start}.upload-picture .info .title{font-family:\"Open Sans\",sans-serif;font-weight:700;font-size:.875rem;line-height:150%;color:#333}.upload-picture .info .title .action-title{cursor:pointer;color:#428bca}.upload-picture .info .buttons{display:-ms-flexbox;display:flex;gap:8px}.upload-picture .info .buttons s-button{margin:0}.upload-picture .info .subtitle{padding:6px 0;font-family:\"Open Sans\",sans-serif;font-weight:400;font-size:.75rem;line-height:150%;color:#697882;text-align:center}.upload-picture--small .info{-ms-flex-align:center;align-items:center}.upload-picture--small .info .subtitle,.upload-picture--small .info .title{text-align:center}.upload-picture--small .info .buttons{-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap}"]
-        })
-    ], ProfilePicturePickerComponent);
-    return ProfilePicturePickerComponent;
-}());
-
-var ProfilePicturePickerModule = /** @class */ (function () {
-    function ProfilePicturePickerModule() {
-    }
-    ProfilePicturePickerModule = __decorate([
-        NgModule({
-            imports: [
-                CommonModule,
-                ButtonModule,
-                ThumbnailModule,
-                ImageCropperModule,
-                ConfirmDialogModule,
-            ],
-            declarations: [ProfilePicturePickerComponent],
-            exports: [ProfilePicturePickerComponent],
-            providers: [
-                ImageCropperService,
-                ConfirmationService,
-            ],
-        })
-    ], ProfilePicturePickerModule);
-    return ProfilePicturePickerModule;
-}());
-
 var ProgressBarColors;
 (function (ProgressBarColors) {
     ProgressBarColors["Blue"] = "blue";
@@ -17862,5 +17941,5 @@ var fallback = {
  * Generated bundle index. Do not edit.
  */
 
-export { AccordionComponent, AccordionModule, AccordionPanelComponent, AlertComponent, AlertModule, AngularComponentsModule, AutocompleteField, BadgeColors, BadgeComponent, BadgeModule, BaseFieldComponent, BignumberField, BignumberInputDirective, BignumberInputModule, BooleanField, BooleanOptionsLabel, BreadcrumbComponent, BreadcrumbModule, Breakpoints, ButtonComponent, ButtonModule, ButtonPriority, ButtonSize, CalendarField, CalendarLocaleOptions, CalendarMaskDirective, CalendarMaskModule, CardComponent, CardModule, CardTemplateTypes, ChipsField, CodeEditorModule, CollapseLinkComponent, CollapseLinkModule, ControlErrorsComponent, ControlErrorsModule, CountryPhonePickerComponent, CountryPhonePickerModule, CurrencyField, CustomFieldsComponent, CustomFieldsModule, CustomFieldsService, DEFAULT_CALENDAR_LOCALE_OPTIONS, DEFAULT_LOCALE_OPTIONS, DEFAULT_NUMBER_LOCALE_OPTIONS, DebounceUtils, DoubleClickDirective, DynamicConfig, DynamicFormComponent, DynamicFormModule, DynamicType, EditableOverlayDirective, EditableOverlayModule, EmptyStateComponent, EmptyStateModule, EnumBadgeColors, EnumColumnFieldType, EnumSeverity, ExportUtils, Field, FieldType, Fieldset, FileUploadComponent, FileUploadModule, FileValidation, FormField, GanttComponent, GanttModule, GlobalSearchComponent, GlobalSearchDropdownItemComponent, GlobalSearchModule, GlobalSearchSizeEnum, HostProjectConfigsInjectionToken, IAInsightComponent, IAInsightModule, IAInsightTemplateTypes, ImageCropperComponent, ImageCropperModule, ImageCropperService, InfoSignDirective, InfoSignModule, KanbanComponent, KanbanModule, KanbanTemplateTypes, Languages, LoadingStateComponent, LoadingStateDirective, LoadingStateModule, LocaleModule, LocaleOptions, LocaleService, LocalizedCurrencyPipe, LocalizedCurrencyPipeOptions, LocalizedDateImpurePipe, LocalizedDatePipe, LocalizedNumberInputDirective, LocalizedNumberInputModule, LocalizedNumberPipe, LocalizedTimeImpurePipe, LocalizedTimePipe, LongPressDirective, LookupComponent, LookupField, MaskFormatterModule, MaskFormatterPipe, MouseEventsModule, NavigationDirective, NumberAlignmentOption, NumberField, NumberInputDirective, NumberInputModule, NumberLocaleOptions, ObjectCardComponent, ObjectCardFieldComponent, ObjectCardMainComponent, ObjectCardModule, Option, Ordination, PanelComponent, PanelModule, PasswordField, PasswordStrengthComponent, PasswordStrengthDirective, PasswordStrengthModule, PasswordStrengthPositions, PasswordStrengths, ProductHeaderComponent, ProductHeaderModule, ProfilePicturePickerComponent, ProfilePicturePickerModule, ProgressBarColors, ProgressBarComponent, ProgressBarModule, RadioButtonField, RatingScaleComponent, RatingScaleModule, RationButtonOption, RowTogllerDirective, SVGFactoryDirective, SVGFactoryModule, Section, SelectButtonComponent, SelectButtonModule, SelectField, SelectOption, SidebarComponent, SidebarModule, SlidePanelComponent, SlidePanelModule, SplitButtonComponent, SplitButtonModule, SplitButtonType, StatsCardComponent, StatsCardModule, StepState, StepsComponent, StepsModule, Structure, SwitchComponent, SwitchModule, TableFrozenPositionDirective, TableHeaderCheckboxComponent, TableHeaderCheckboxModule, TableModule, TaxCalculationLanguageConfigs, TextAreaField, TextField, Themes, ThumbnailComponent, ThumbnailModule, ThumbnailSize, TieredMenuDirective, TieredMenuModule, TileComponent, TileModule, TimelineComponent, TimelineItem, TimelineItemSeverity, TimelineItemSize, TimelineModule, TokenListComponent, TokenListModule, TooltipModule, TooltipPosition, ValidateErrors, ViewMode, WorkspaceSwitchComponent, WorkspaceSwitchModule, countries, fallback, TooltipComponent as ɵa, TooltipDirective as ɵb, TextFieldComponent as ɵba, NumberFieldModule as ɵbb, LocalizedNumberInputModule as ɵbc, NumberInputModule as ɵbd, NumberFieldComponent as ɵbe, CurrencyFieldModule as ɵbf, CurrencyFieldComponent as ɵbg, NumberFieldModule$1 as ɵbh, BignumberInputModule as ɵbi, BignumberFieldComponent as ɵbj, AutocompleteFieldComponent as ɵbk, BooleanFieldComponent as ɵbl, BooleanSwitchFieldComponent as ɵbm, CalendarFieldComponent as ɵbn, ChipsFieldComponent as ɵbo, CountryPhonePickerFieldComponent as ɵbp, DynamicFieldComponent as ɵbq, DynamicFormDirective as ɵbr, FieldsetComponent as ɵbs, FileUploadComponent$1 as ɵbt, LookupFieldComponent as ɵbu, RadioButtonComponent as ɵbv, RowComponent as ɵbw, SectionComponent as ɵbx, SelectFieldComponent as ɵby, SliderFieldComponent as ɵbz, TemplateDirective as ɵc, TextAreaFieldComponent as ɵca, TextAreaIAFieldComponent as ɵcb, IAssistService as ɵcc, DecimalField as ɵce, SideTableComponent as ɵcf, ThumbnailService as ɵcg, InfiniteScrollModule as ɵch, InfiniteScrollDirective as ɵci, IAInsightSidebarComponent as ɵcj, IAInsightCardComponent as ɵck, IAInsightCardLoaderComponent as ɵcl, StructureModule as ɵcm, HeaderComponent as ɵcn, FooterComponent as ɵco, KanbanEventService as ɵcp, KanbanItemComponent as ɵcq, KanbanColumnComponent as ɵcr, KanbanItemDraggingComponent as ɵcs, NumberLocaleOptions as ɵct, BorderButtonModule as ɵcu, BorderButtonComponent as ɵcv, ProgressBarDeterminateComponent as ɵcw, ProgressBarIndeterminateComponent as ɵcx, SelectButtonItemComponent as ɵcy, SlidePanelService as ɵcz, TemplateModule as ɵd, TieredMenuEventService as ɵda, TieredMenuService as ɵdb, TieredMenuGlobalService as ɵdc, TieredMenuComponent as ɵdd, TieredMenuNestedComponent as ɵde, TieredMenuItemComponent as ɵdf, TieredMenuDividerComponent as ɵdg, TimelineItemModule as ɵdh, TimelineIconItemComponent as ɵdi, HorizontalTimelineModule as ɵdj, HorizontalTimelineComponent as ɵdk, VerticalTimelineModule as ɵdl, VerticalTimelineComponent as ɵdm, RangeLineComponent as ɵdn, CollapseOptionComponent as ɵdo, CollapsedItemsComponent as ɵdp, VerticalItemsComponent as ɵdq, CustomTranslationsModule as ɵe, CodeEditorComponent as ɵf, CoreFacade as ɵg, CodeMirror6Core as ɵh, CountryPhonePickerService as ɵi, LocalizedCurrencyImpurePipe as ɵj, LocalizedBignumberPipe as ɵk, LocalizedBignumberImpurePipe as ɵl, NumericPipe as ɵm, NumericService as ɵn, EmptyStateGoBackComponent as ɵo, IAssistIconComponent as ɵp, SeniorIconComponent as ɵq, DotsIndicatorComponent as ɵr, LoadingIndicatorComponent as ɵs, FileUploadService as ɵt, InfoSignComponent as ɵu, TableColumnsComponent as ɵv, TablePagingComponent as ɵw, PasswordFieldModule as ɵx, PasswordFieldComponent as ɵy, TextFieldModule as ɵz };
+export { AccordionComponent, AccordionModule, AccordionPanelComponent, AlertComponent, AlertModule, AngularComponentsModule, AutocompleteField, BadgeColors, BadgeComponent, BadgeModule, BaseFieldComponent, BignumberField, BignumberInputDirective, BignumberInputModule, BooleanField, BooleanOptionsLabel, BreadcrumbComponent, BreadcrumbModule, Breakpoints, ButtonComponent, ButtonModule, ButtonPriority, ButtonSize, CalendarField, CalendarLocaleOptions, CalendarMaskDirective, CalendarMaskModule, CardComponent, CardModule, CardTemplateTypes, ChipsField, CodeEditorModule, CollapseLinkComponent, CollapseLinkModule, ControlErrorsComponent, ControlErrorsModule, CountryPhonePickerComponent, CountryPhonePickerModule, CurrencyField, CustomFieldsComponent, CustomFieldsModule, CustomFieldsService, DEFAULT_CALENDAR_LOCALE_OPTIONS, DEFAULT_LOCALE_OPTIONS, DEFAULT_NUMBER_LOCALE_OPTIONS, DebounceUtils, DoubleClickDirective, DynamicConfig, DynamicFormComponent, DynamicFormModule, DynamicType, EditableOverlayDirective, EditableOverlayModule, EmptyStateComponent, EmptyStateModule, EnumBadgeColors, EnumColumnFieldType, EnumSeverity, ExportUtils, Field, FieldType, Fieldset, FileUploadComponent, FileUploadModule, FileValidation, FormField, GanttComponent, GanttModule, GlobalSearchComponent, GlobalSearchDropdownItemComponent, GlobalSearchModule, GlobalSearchSizeEnum, HostProjectConfigsInjectionToken, IAInsightComponent, IAInsightModule, IAInsightTemplateTypes, ImageCropperComponent, ImageCropperModule, ImageCropperService, InfoSignDirective, InfoSignModule, KanbanComponent, KanbanModule, KanbanTemplateTypes, Languages, LoadingStateComponent, LoadingStateDirective, LoadingStateModule, LocaleModule, LocaleOptions, LocaleService, LocalizedCurrencyPipe, LocalizedCurrencyPipeOptions, LocalizedDateImpurePipe, LocalizedDatePipe, LocalizedNumberInputDirective, LocalizedNumberInputModule, LocalizedNumberPipe, LocalizedTimeImpurePipe, LocalizedTimePipe, LongPressDirective, LookupComponent, LookupField, MaskFormatterModule, MaskFormatterPipe, MouseEventsModule, NavigationDirective, NumberAlignmentOption, NumberField, NumberInputDirective, NumberInputModule, NumberLocaleOptions, ObjectCardComponent, ObjectCardFieldComponent, ObjectCardMainComponent, ObjectCardModule, Option, Ordination, PanelComponent, PanelModule, PasswordField, PasswordStrengthComponent, PasswordStrengthDirective, PasswordStrengthModule, PasswordStrengthPositions, PasswordStrengths, ProductHeaderComponent, ProductHeaderModule, ProfilePicturePickerComponent, ProfilePicturePickerModule, ProgressBarColors, ProgressBarComponent, ProgressBarModule, RadioButtonField, RatingScaleComponent, RatingScaleModule, RationButtonOption, RowTogllerDirective, SVGFactoryDirective, SVGFactoryModule, Section, SelectButtonComponent, SelectButtonModule, SelectField, SelectOption, SidebarComponent, SidebarModule, SlidePanelComponent, SlidePanelModule, SplitButtonComponent, SplitButtonModule, SplitButtonType, StatsCardComponent, StatsCardModule, StepState, StepsComponent, StepsModule, Structure, SwitchComponent, SwitchModule, TableFrozenPositionDirective, TableHeaderCheckboxComponent, TableHeaderCheckboxModule, TableModule, TaxCalculationLanguageConfigs, TextAreaField, TextField, Themes, ThumbnailComponent, ThumbnailModule, ThumbnailSize, TieredMenuDirective, TieredMenuModule, TileComponent, TileModule, TimelineComponent, TimelineItem, TimelineItemSeverity, TimelineItemSize, TimelineModule, TokenListComponent, TokenListModule, TooltipModule, TooltipPosition, ValidateErrors, ViewMode, WorkspaceSwitchComponent, WorkspaceSwitchModule, countries, fallback, TooltipComponent as ɵa, TooltipDirective as ɵb, TextFieldComponent as ɵba, NumberFieldModule as ɵbb, LocalizedNumberInputModule as ɵbc, NumberInputModule as ɵbd, NumberFieldComponent as ɵbe, CurrencyFieldModule as ɵbf, CurrencyFieldComponent as ɵbg, NumberFieldModule$1 as ɵbh, BignumberInputModule as ɵbi, BignumberFieldComponent as ɵbj, ProfilePictureModule as ɵbk, ThumbnailService as ɵbl, StructureModule as ɵbm, HeaderComponent as ɵbn, FooterComponent as ɵbo, ProfilePictureFieldComponent as ɵbp, AutocompleteFieldComponent as ɵbq, BooleanFieldComponent as ɵbr, BooleanSwitchFieldComponent as ɵbs, CalendarFieldComponent as ɵbt, ChipsFieldComponent as ɵbu, CountryPhonePickerFieldComponent as ɵbv, DynamicFieldComponent as ɵbw, DynamicFormDirective as ɵbx, FieldsetComponent as ɵby, FileUploadComponent$1 as ɵbz, TemplateDirective as ɵc, LookupFieldComponent as ɵca, RadioButtonComponent as ɵcb, RowComponent as ɵcc, SectionComponent as ɵcd, SelectFieldComponent as ɵce, SliderFieldComponent as ɵcf, TextAreaFieldComponent as ɵcg, TextAreaIAFieldComponent as ɵch, IAssistService as ɵci, DecimalField as ɵck, SideTableComponent as ɵcl, InfiniteScrollModule as ɵcm, InfiniteScrollDirective as ɵcn, IAInsightSidebarComponent as ɵco, IAInsightCardComponent as ɵcp, IAInsightCardLoaderComponent as ɵcq, KanbanEventService as ɵcr, KanbanItemComponent as ɵcs, KanbanColumnComponent as ɵct, KanbanItemDraggingComponent as ɵcu, NumberLocaleOptions as ɵcv, BorderButtonModule as ɵcw, BorderButtonComponent as ɵcx, ProgressBarDeterminateComponent as ɵcy, ProgressBarIndeterminateComponent as ɵcz, TemplateModule as ɵd, SelectButtonItemComponent as ɵda, SlidePanelService as ɵdb, TieredMenuEventService as ɵdc, TieredMenuService as ɵdd, TieredMenuGlobalService as ɵde, TieredMenuComponent as ɵdf, TieredMenuNestedComponent as ɵdg, TieredMenuItemComponent as ɵdh, TieredMenuDividerComponent as ɵdi, TimelineItemModule as ɵdj, TimelineIconItemComponent as ɵdk, HorizontalTimelineModule as ɵdl, HorizontalTimelineComponent as ɵdm, VerticalTimelineModule as ɵdn, VerticalTimelineComponent as ɵdo, RangeLineComponent as ɵdp, CollapseOptionComponent as ɵdq, CollapsedItemsComponent as ɵdr, VerticalItemsComponent as ɵds, CustomTranslationsModule as ɵe, CodeEditorComponent as ɵf, CoreFacade as ɵg, CodeMirror6Core as ɵh, CountryPhonePickerService as ɵi, LocalizedCurrencyImpurePipe as ɵj, LocalizedBignumberPipe as ɵk, LocalizedBignumberImpurePipe as ɵl, NumericPipe as ɵm, NumericService as ɵn, EmptyStateGoBackComponent as ɵo, IAssistIconComponent as ɵp, SeniorIconComponent as ɵq, DotsIndicatorComponent as ɵr, LoadingIndicatorComponent as ɵs, FileUploadService as ɵt, InfoSignComponent as ɵu, TableColumnsComponent as ɵv, TablePagingComponent as ɵw, PasswordFieldModule as ɵx, PasswordFieldComponent as ɵy, TextFieldModule as ɵz };
 //# sourceMappingURL=seniorsistemas-angular-components.js.map