@datarailsshared/datarailsshared 1.4.81 → 1.4.84

package/fesm2015/datarailsshared-datarailsshared.js

@@ -1,16 +1,19 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, Component, ViewEncapsulation, Input, Output, ChangeDetectionStrategy, ChangeDetectorRef, forwardRef, ElementRef, Inject, PLATFORM_ID, ContentChildren, Renderer2, HostBinding, ContentChild, Pipe, TemplateRef, HostListener, Directive, ComponentFactoryResolver, ViewContainerRef, ViewChild, Injector, Injectable, Host, NgModule, Optional } from '@angular/core';
-import { FormControl, NG_VALUE_ACCESSOR, NgModel, FormsModule, ReactiveFormsModule, NgControl } from '@angular/forms';
+import { FormControl, NG_VALUE_ACCESSOR, FormGroup, NgModel, FormsModule, ReactiveFormsModule, NgControl } from '@angular/forms';
 import { DateAdapter, MAT_DATE_LOCALE, MAT_DATE_FORMATS, MatNativeDateModule } from '@angular/material/core';
 import { MomentDateAdapter, MAT_MOMENT_DATE_ADAPTER_OPTIONS, MatMomentDateModule } from '@angular/material-moment-adapter';
 import * as momentImported from 'moment';
 import { isPlatformBrowser, DOCUMENT, CommonModule } from '@angular/common';
 import { Subject, from, merge, fromEvent, noop as noop$1, BehaviorSubject } from 'rxjs';
-import { startWith, switchMap, takeUntil, filter, skip, first, debounceTime, distinctUntilChanged } from 'rxjs/operators';
+import { startWith, switchMap, takeUntil, filter, skip, first, catchError, debounceTime, distinctUntilChanged } from 'rxjs/operators';
 import { transition, style, animate, trigger, state } from '@angular/animations';
 import * as i1 from '@angular/cdk/overlay';
 import { Overlay, OverlayPositionBuilder, OverlayConfig } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
+import * as i1$1 from '@angular/material/dialog';
+import { MatDialogRef, MAT_DIALOG_DATA, MatDialog, MatDialogModule } from '@angular/material/dialog';
+import * as _ from 'lodash';
 import { MatDatepickerModule, MatCalendar } from '@angular/material/datepicker';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
@@ -243,7 +246,7 @@ const MONTH_FORMATS = {
         monthYearA11yLabel: "MMMM YYYY"
     },
 };
-const ɵ0$5 = MONTH_FORMATS;
+const ɵ0$6 = MONTH_FORMATS;
 class MonthTagComponent extends AnyTagComponent {
     constructor() {
         super();
@@ -302,7 +305,7 @@ MonthTagComponent.decorators = [
                         useClass: MomentDateAdapter,
                         deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
                     },
-                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$5 },
+                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$6 },
                 ]
             },] }
 ];
@@ -423,7 +426,7 @@ const WEEK_FORMATS = {
         monthYearA11yLabel: "MMMM YYYY"
     },
 };
-const ɵ0$4 = WEEK_FORMATS;
+const ɵ0$5 = WEEK_FORMATS;
 class WeekTagComponent extends AnyTagComponent {
     constructor() {
         super();
@@ -519,7 +522,7 @@ WeekTagComponent.decorators = [
                         useClass: MomentDateAdapter,
                         deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
                     },
-                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$4 },
+                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$5 },
                 ]
             },] }
 ];
@@ -541,7 +544,7 @@ const YEAR_FORMATS = {
         monthYearA11yLabel: "MMMM YYYY"
     },
 };
-const ɵ0$3 = YEAR_FORMATS;
+const ɵ0$4 = YEAR_FORMATS;
 class YearTagComponent extends AnyTagComponent {
     constructor() {
         super();
@@ -606,7 +609,7 @@ YearTagComponent.decorators = [
                         useClass: MomentDateAdapter,
                         deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
                     },
-                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$3 },
+                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$4 },
                 ]
             },] }
 ];
@@ -720,7 +723,7 @@ const DAY_FORMATS = {
         monthYearA11yLabel: "MMMM YYYY"
     },
 };
-const ɵ0$2 = DAY_FORMATS;
+const ɵ0$3 = DAY_FORMATS;
 class DayTagComponent extends AnyTagComponent {
     constructor() {
         super();
@@ -773,7 +776,7 @@ DayTagComponent.decorators = [
                         useClass: MomentDateAdapter,
                         deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
                     },
-                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$2 },
+                    { provide: MAT_DATE_FORMATS, useValue: ɵ0$3 },
                 ]
             },] }
 ];
@@ -2993,6 +2996,222 @@ DrErrorComponent.propDecorators = {
     label: [{ type: Input }]
 };
 
+class DialogWrapperComponent {
+    constructor(dialogRef, dialogService, cdr, componentFactoryResolver, dialogData) {
+        var _a, _b, _c, _d;
+        this.dialogRef = dialogRef;
+        this.dialogService = dialogService;
+        this.cdr = cdr;
+        this.componentFactoryResolver = componentFactoryResolver;
+        this.dialogData = dialogData;
+        this.class = ((_b = (_a = this.dialogData) === null || _a === void 0 ? void 0 : _a.theme) === null || _b === void 0 ? void 0 : _b.noThemeSizeClass) ? null : ((_d = (_c = this.dialogData) === null || _c === void 0 ? void 0 : _c.theme) === null || _d === void 0 ? void 0 : _d.themeSize) || 'medium-modal';
+        this.saving$ = new BehaviorSubject(false);
+        this.destroy$ = new Subject();
+    }
+    ngAfterViewInit() {
+        if (!this.dialogData.child) {
+            return new Error('Expected componentTypeChild');
+        }
+        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.dialogData.child);
+        this.childComponent = this.content.createComponent(componentFactory).instance;
+        this.childComponent.closeDialog = this.closeDialog.bind(this);
+        this.childComponent.onAcceptDialog = this.onAcceptDialog.bind(this);
+        // pass data to component child
+        if (this.dialogData.childData) {
+            _.assign(this.childComponent, this.dialogData.childData);
+        }
+        // call component child init func - looks like double init
+        // if (this.childComponent.ngOnInit) {
+        //   this.childComponent.ngOnInit();
+        // }
+        this.cdr.detectChanges();
+    }
+    closeDialog(data) {
+        this.dialogRef.close(data || false);
+    }
+    onDecline() {
+        this.dialogRef.close(undefined);
+    }
+    onAcceptDialog(data) {
+        if (!this.childComponent) {
+            this.dialogRef.close(data || true);
+            return;
+        }
+        const funcName = this.dialogData.acceptButton.functions;
+        if (this.childComponent[funcName])
+            this.childComponent[funcName]();
+        const loadFuncName = this.dialogData.acceptButton.loading;
+        if (this.childComponent[loadFuncName])
+            this.isLoading = this.childComponent[loadFuncName]();
+        if (this.dialogData.confirmFn) {
+            this.saving$.next(true);
+            this.dialogData.confirmFn().pipe(takeUntil(this.destroy$), catchError(error => this.dialogService.throwErr(error, this.saving$))).subscribe(() => {
+                this.saving$.next(false);
+                this.dialogRef.close(data || true);
+            });
+        }
+        if (this.childComponent && !this.childComponent[funcName]) {
+            this.dialogRef.close(data || true);
+            return;
+        }
+    }
+    ngOnDestroy() {
+        this.destroy$.next(null);
+        this.destroy$.complete();
+    }
+}
+DialogWrapperComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'dr-dialog-wrapper',
+                template: "<div class=\"dialog-wrapper\"\n     [class.dialog-wrapper--confirmation-no-title]=\"dialogData.theme?.isConfirmation && !dialogData.title\">\n    <i class=\"dr-icon-exit\" data-test=\"close_btn\" (click)=\"closeDialog()\" *ngIf=\"!dialogData?.hideCloseBtn\"></i>\n\n    <div header class=\"dialog-wrapper__header\" *ngIf=\"dialogData.title\">\n        <h1 class=\"dialog-wrapper__header__title\" data-test=\"dialogTitle\">{{dialogData.title}}</h1>\n        <h1 class=\"dialog-wrapper__header__subtitle\" data-test=\"dialogSubtitle\"\n            *ngIf=\"dialogData.subtitle\">{{dialogData.subtitle}}</h1>\n    </div>\n    <div class=\"dialog-wrapper__content\"\n         [class.dialog-wrapper__content--no-padding]=\"dialogData.theme?.contentNoPadding\">\n        <span *ngIf=\"dialogData.contentIcon?.class\" class=\"dialog-wrapper__content__icon\">\n            <i [ngClass]=\"dialogData.contentIcon.class\" [style.color]=\"dialogData.contentIcon?.color || 'inherit'\"></i>\n        </span>\n        <span [innerHTML]=\"dialogData.content\"></span>\n        <span #content class=\"dialog-wrapper__content__anchor\"> </span>\n    </div>\n    <div footer class=\"dialog-wrapper__footer\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n        <div class=\"dialog-wrapper__footer__buttons\">\n            <dr-button *ngIf=\"dialogData.customButton\"\n                       (click)=\"onDecline()\"\n                       [theme]=\"'secondary'\"\n                       [isLoading]=\"isLoading\"\n                       data-test=\"declineBtn\"\n                       [drTooltip]=\"dialogData.tooltips?.custom\">\n                {{dialogData.customButton.label}}\n            </dr-button>\n            <dr-button *ngIf=\"dialogData.cancelButton\"\n                       (click)=\"closeDialog()\"\n                       [theme]=\"'secondary'\"\n                       data-test=\"closeBtn\"\n                       [drTooltip]=\"dialogData.tooltips?.cancel\">\n                {{dialogData.cancelButton.label}}\n            </dr-button>\n            <dr-button *ngIf=\"dialogData.acceptButton\"\n                       (click)=\"onAcceptDialog()\"\n                       [theme]=\"dialogData.acceptButton?.theme || 'primary'\"\n                       [isLoading]=\"isLoading\"\n                       data-test=\"acceptBtn\"\n                       [drTooltip]=\"dialogData.tooltips?.accept\">\n                {{dialogData.acceptButton.label}}\n            </dr-button>\n        </div>\n    </div>\n</div>\n",
+                styles: [":host.small-modal{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.large-modal{min-width:750px;max-width:750px}:host.medium-large-modal{min-width:669px;max-width:669px}:host.xl-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:1100px}:host.xl-custom-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:100%}::ng-deep .dialog-wrapper{display:flex;justify-content:space-between;flex-direction:column;position:relative}::ng-deep .dialog-wrapper>.dr-icon-exit{z-index:1;position:absolute;right:32px;top:20px;color:#51566f;cursor:pointer}::ng-deep .dialog-wrapper__header{display:flex;flex-direction:column;padding:8px 52px 8px 32px;border-bottom:1px solid #e5e6ea}::ng-deep .dialog-wrapper__header__title{color:#151b3f;position:static;font-weight:600;font-size:18px;line-height:24px}::ng-deep .dialog-wrapper__header__subtitle{font-size:14px;line-height:20px;margin:0}::ng-deep .dialog-wrapper--confirmation-no-title{padding-top:16px;height:100%}::ng-deep .dialog-wrapper__content{overflow-y:inherit;font-size:14px;font-weight:400;line-height:22px;padding:24px 32px 32px}::ng-deep .dialog-wrapper__content__anchor{display:none}::ng-deep .dialog-wrapper__content--no-padding{padding:0}::ng-deep .dialog-wrapper__content__icon{margin-right:10px;top:5px;position:relative}::ng-deep .dialog-wrapper__footer{border-top:1px solid #e5e6ea}::ng-deep .dialog-wrapper__footer__buttons{display:flex;justify-content:flex-end;padding-top:10px;padding-right:32px;padding-bottom:11px}::ng-deep .dialog-wrapper__footer__buttons dr-button:nth-child(n+2){margin-left:12px}\n"]
+            },] }
+];
+DialogWrapperComponent.ctorParameters = () => [
+    { type: MatDialogRef },
+    { type: DialogService },
+    { type: ChangeDetectorRef },
+    { type: ComponentFactoryResolver },
+    { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
+];
+DialogWrapperComponent.propDecorators = {
+    content: [{ type: ViewChild, args: ['content', { read: ViewContainerRef },] }],
+    class: [{ type: HostBinding, args: ['class',] }]
+};
+
+class DialogModalWrapperComponent {
+    constructor(dialogRef, dialogService, dialogData) {
+        var _a, _b;
+        this.dialogRef = dialogRef;
+        this.dialogService = dialogService;
+        this.dialogData = dialogData;
+        this.class = (_b = (_a = this === null || this === void 0 ? void 0 : this.dialogData) === null || _a === void 0 ? void 0 : _a.theme) === null || _b === void 0 ? void 0 : _b.themeSize;
+        this.saving$ = new BehaviorSubject(false);
+        this.isLoading = false;
+        this.showServerErrorMessage = false;
+        this.destroy$ = new Subject();
+    }
+    ngOnInit() {
+        if (this.dialogData.fields) {
+            this.form = new FormGroup(this.dialogData.fields.reduce((accumulator, currentValue) => {
+                const currentFormControl = {};
+                currentFormControl[currentValue.name] = new FormControl(currentValue.default || null, currentValue.validators || []);
+                return Object.assign(accumulator, currentFormControl);
+            }, {}));
+        }
+    }
+    onAccept() {
+        if (!this.dialogData.confirmFn)
+            return this.dialogRef.close(this.form.value || true);
+        this.isLoading = true;
+        this.saving$.next(true);
+        this.dialogData.confirmFn(this.form.value)
+            .pipe(takeUntil(this.destroy$), catchError((err) => {
+            this.showServerErrorMessage = true;
+            this.isLoading = false;
+            return this.dialogService.throwErr(err, this.saving$);
+        }))
+            .subscribe(() => {
+            this.saving$.next(false);
+            this.dialogRef.close(this.form.value || true);
+        });
+    }
+    footerAction() {
+        this.dialogData.footerTemplateData.action(this.form.value);
+    }
+    closeDialog() {
+        this.dialogRef.close(false);
+    }
+    ngOnDestroy() {
+        this.destroy$.next(null);
+        this.destroy$.complete();
+    }
+}
+DialogModalWrapperComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'dr-dialog-modal-wrapper',
+                template: "<div header class=\"header-dialog\">\n    <h1 class=\"title-dialog\" data-test=\"modalTitle\">{{dialogData.title}}</h1>\n    <i mat-icon-button *ngIf=\"!dialogData.hideCloseBtn\" (click)=\"closeDialog()\" class=\"dr-icon-exit icon-close\"\n       data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\">\n    <ng-container>{{dialogData.content}}</ng-container>\n    <span #content class=\"content-anchor\"></span>\n</div>\n<form *ngIf=\"dialogData.fields\" [formGroup]=\"form\" class=\"dr-smart-from\">\n    <div class=\"dr-smart-form_wrapper\">\n        <div *ngFor=\"let field of dialogData.fields\" class=\"dr-smart-form_group\"\n             [ngStyle]=\"{'display': field.isLabelFullWidth ? 'block' : 'flex'}\">\n            <label *ngIf=\"field.label\" [ngClass]=\"field.isLabelFullWidth ? 'col-md-12 mb-2' : 'col-md-2'\"\n                   class=\"label p-0 d-flex align-items-center\">{{field.label}}</label>\n            <div class=\"input-group p-0\"\n                 [ngClass]=\"{'col-md-10': field.label && !field.isLabelFullWidth, 'col-md-12': !field.label || field.isLabelFullWidth}\">\n                <dr-select *ngIf=\"field.type === 'select'\"\n                           [searchable]=\"dialogData.searchable\"\n                           [clearable]=\"dialogData.clearable\"\n                           [formControlName]=\"field.name\"\n                           [bindLabel]=\"field.bindLabel || null\"\n                           [bindValue]=\"field.bindValue || null\"\n                           [selectedItem]=\"field.default\"\n                           [items]=\"field.items || (field.items$ | async)\"\n                           [required]=\"true\"\n                           [placeholder]=\"field.placeholder\">\n                    <ng-template *ngIf=\"dialogData?.footerTemplateData\" #optionFooterTemplate>\n                        <button (click)=\"footerAction()\" class=\"dr-select-footer__btn\">\n                            <i *ngIf=\"dialogData.footerTemplateData.icon\"\n                               class=\"{{dialogData.footerTemplateData.icon}}\"></i>\n                            {{dialogData.footerTemplateData.label}}</button>\n                    </ng-template>\n                </dr-select>\n                <dr-input *ngIf=\"field.type === 'input'\" data-test=\"modalInput\" class=\"form-control\"\n                          [formControlName]=\"field.name\" [placeholder]=\"field.placeholder\"></dr-input>\n                <label class=\"form-error-alert\" *ngIf=\"dialogData.errorMessage && !form.pristine && form.invalid\">\n                    {{dialogData.errorMessage}}\n                </label>\n                <label class=\"form-error-alert\"\n                       *ngIf=\"form.valid && showServerErrorMessage && dialogData.serverErrorMessage\">\n                    {{dialogData.serverErrorMessage}}\n                </label>\n            </div>\n        </div>\n    </div>\n</form>\n\n<div footer class=\"footer-dialog\">\n    <div class=\"buttons-wrapper\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n        <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\"\n                   [theme]=\"'secondary'\"> {{dialogData.cancelButton.label}}</dr-button>\n        <dr-button *ngIf=\"dialogData.acceptButton\" data-test=\"modalAddBtn\" (click)=\"onAccept()\" [theme]=\"'primary'\"\n                   [isLoading]=\"isLoading\" [disabled]=\"form.invalid\"> {{dialogData.acceptButton.label}}</dr-button>\n    </div>\n</div>\n",
+                styles: [":host{display:flex;justify-content:space-between;flex-direction:column}:host.small-modal{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal{min-height:188px;max-height:467px;min-width:632px;max-width:632px}.header-dialog{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:8px 39px 8px 32px;border-bottom:1px solid #e5e6ea}.title-dialog{color:#151b3f;position:static;font-weight:bold;font-size:18px;line-height:24px}.content-dialog{font-weight:400;font-size:14px;padding:16px 32px 5px}.icon-close{color:#51566f;cursor:pointer}.dr-smart-from{font-size:14px;font-weight:500;line-height:22px;padding:16px 32px 22px}.content-dialog{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor{display:none}.footer-dialog{border-top:1px solid #e5e6ea}.buttons-wrapper{display:flex;justify-content:flex-end;padding-top:10px;padding-right:32px;padding-bottom:11px}.buttons-wrapper dr-button:nth-of-type(2){margin-left:12px}.form-error-alert{position:absolute;margin-top:5px;font-size:12px;color:red}.dr-select-footer__btn{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}\n"]
+            },] }
+];
+DialogModalWrapperComponent.ctorParameters = () => [
+    { type: MatDialogRef },
+    { type: DialogService },
+    { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
+];
+DialogModalWrapperComponent.propDecorators = {
+    class: [{ type: HostBinding, args: ['class',] }]
+};
+
+const DEFAULT_PANE_CLASS_NAME = 'wrapper-dialog';
+const DEFAULT_CONFIRM_THEME = { themeSize: 'small-modal' };
+class DialogService {
+    constructor(dialog) {
+        this.dialog = dialog;
+    }
+    /**
+     * Function to open modal with custom form
+     */
+    openDialogWrapper(componentTypeChild, dialogData, componentTypeWrapper) {
+        if (!componentTypeWrapper)
+            componentTypeWrapper = DialogWrapperComponent;
+        dialogData.data.child = componentTypeChild;
+        if (dialogData.panelClass instanceof Array) {
+            dialogData.panelClass.push(DEFAULT_PANE_CLASS_NAME);
+        }
+        else {
+            dialogData.panelClass = [dialogData.panelClass || '', DEFAULT_PANE_CLASS_NAME];
+        }
+        this.wrapperComponent = this.openDialog(componentTypeWrapper, dialogData);
+        return this.wrapperComponent;
+    }
+    /**
+     * Function to open confirmation modal
+     */
+    openConfirmDialog(confirmDialogData) {
+        const dialogData = { panelClass: DEFAULT_PANE_CLASS_NAME, data: null };
+        Object.assign(dialogData, { data: confirmDialogData });
+        if (!dialogData.data.theme)
+            dialogData.data.theme = DEFAULT_CONFIRM_THEME;
+        dialogData.data.theme.isConfirmation = true;
+        return this.openDialog(DialogWrapperComponent, dialogData);
+    }
+    /**
+     * Function to open confirmation modal with inputs
+     */
+    openConfirmDialogModal(confirmDialogData) {
+        const dialogData = { panelClass: DEFAULT_PANE_CLASS_NAME, data: null };
+        Object.assign(dialogData, { data: confirmDialogData });
+        if (!dialogData.data.theme)
+            dialogData.data.theme = DEFAULT_CONFIRM_THEME;
+        return this.openDialog(DialogModalWrapperComponent, dialogData);
+    }
+    close(params) {
+        this.wrapperComponent.close(params);
+    }
+    changeDialogThemeSize(theme) {
+        this.wrapperComponent.componentInstance.class = theme;
+    }
+    openDialog(componentType, dialogData) {
+        return this.dialog.open(componentType, dialogData);
+    }
+    throwErr(err, load) {
+        if (load) {
+            load.next(false);
+        }
+        throw err;
+    }
+}
+DialogService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DialogService_Factory() { return new DialogService(i0.ɵɵinject(i1$1.MatDialog)); }, token: DialogService, providedIn: "root" });
+DialogService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root'
+            },] }
+];
+DialogService.ctorParameters = () => [
+    { type: MatDialog }
+];
+
 var TooltipPosition;
 (function (TooltipPosition) {
     TooltipPosition["TOP"] = "top";
@@ -3009,6 +3228,27 @@ var TooltipPosition;
     TooltipPosition["LEFT_BOTTOM"] = "left-bottom";
 })(TooltipPosition || (TooltipPosition = {}));
 
+var DIALOG_SIZE;
+(function (DIALOG_SIZE) {
+    DIALOG_SIZE["SMALL"] = "small-modal";
+    DIALOG_SIZE["MEDIUM"] = "medium-modal";
+    DIALOG_SIZE["MEDIUM_LARGE"] = "medium-large-modal";
+    DIALOG_SIZE["LARGE"] = "large-modal";
+    DIALOG_SIZE["X_LARGE"] = "xl-modal";
+    DIALOG_SIZE["X_CUSTOM_LARGE"] = "xl-custom-modal";
+})(DIALOG_SIZE || (DIALOG_SIZE = {}));
+var DIALOG_BUTTON_LABEL;
+(function (DIALOG_BUTTON_LABEL) {
+    DIALOG_BUTTON_LABEL["SAVE"] = "Save";
+    DIALOG_BUTTON_LABEL["CANCEL"] = "Cancel";
+    DIALOG_BUTTON_LABEL["CLOSE"] = "Close";
+})(DIALOG_BUTTON_LABEL || (DIALOG_BUTTON_LABEL = {}));
+var DIALOG_FIELD_TYPE;
+(function (DIALOG_FIELD_TYPE) {
+    DIALOG_FIELD_TYPE["INPUT"] = "input";
+    DIALOG_FIELD_TYPE["SELECT"] = "select";
+})(DIALOG_FIELD_TYPE || (DIALOG_FIELD_TYPE = {}));
+
 class DrModelDebounceChangeDirective {
     constructor(ngModel) {
         this.ngModel = ngModel;
@@ -3111,7 +3351,7 @@ const components$3 = [DateTagComponent,
     AnyTagComponent,
     YearTagComponent,
     ForecastTagComponent];
-const ɵ0$1 = { useUtc: true };
+const ɵ0$2 = { useUtc: true };
 class DateTagModule {
 }
 DateTagModule.decorators = [
@@ -3129,7 +3369,7 @@ DateTagModule.decorators = [
                 ],
                 exports: components$3,
                 providers: [
-                    { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: ɵ0$1 }
+                    { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: ɵ0$2 }
                 ],
                 declarations: components$3,
             },] }
@@ -3394,7 +3634,7 @@ DrDatePickerCustomHeaderComponent.ctorParameters = () => [
 
 const moment = require('moment');
 const noop = () => { };
-const ɵ0 = noop;
+const ɵ0$1 = noop;
 class DrDatePickerComponent {
     constructor(cdr, dateAdapter, datePickerService) {
         this.cdr = cdr;
@@ -4034,9 +4274,9 @@ StepperComponent.propDecorators = {
     stepper: [{ type: ViewChild, args: ['stepper', { read: ElementRef },] }]
 };
 
-class StepperModule {
+class DrStepperModule {
 }
-StepperModule.decorators = [
+DrStepperModule.decorators = [
     { type: NgModule, args: [{
                 declarations: [StepperComponent],
                 imports: [
@@ -4047,11 +4287,33 @@ StepperModule.decorators = [
             },] }
 ];
 
+const ɵ0 = {}, ɵ1 = {};
+class DrDialogModule {
+}
+DrDialogModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [DialogWrapperComponent, DialogModalWrapperComponent],
+                imports: [
+                    CommonModule,
+                    MatDialogModule,
+                    DrInputsModule,
+                    ReactiveFormsModule,
+                    DrTooltipModule
+                ],
+                exports: [DialogWrapperComponent, DialogModalWrapperComponent],
+                providers: [
+                    { provide: MatDialogRef, useValue: ɵ0 },
+                    { provide: MAT_DIALOG_DATA, useValue: ɵ1 },
+                    DialogService
+                ]
+            },] }
+];
+
 /* components */
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AnyTagComponent, CalendarView, CheckboxComponent, CustomDateFormat, DateFromats, DatePickerPeriodPosition, DateTagComponent, DateTagModule, DayTagComponent, DrAccordionComponent, DrAccordionItemBodyComponent, DrAccordionItemComponent, DrAccordionItemHeaderComponent, DrAccordionModule, DrAvatarComponent, DrAvatarModule, DrAvatarPipe, DrButtonComponent, DrDropdownComponent, DrDropdownDirective, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownPositionDirective, DrDropdownService, DrErrorComponent, DrErrorModule, DrInputComponent, DrInputsModule, DrLayoutBodyComponent, DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutModule, DrModelDebounceChangeDirective, DrPopoverAlignmentDimension, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrSelectComponent, DrSharedUtils, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, ForecastTagComponent, ListTagComponent, ListTagModule, MonthTagComponent, QuarterTagComponent, RadioButtonComponent, RadioGroupComponent, SpinnerSize, SpinnerType, StepperModule, TimeframeOption, TooltipComponent, TooltipPosition, WeekTagComponent, YearTagComponent, components$3 as ɵa, POPUP_ANIMATION as ɵb, DrDatePickerComponent as ɵc, DrDatePickerService as ɵd, DrDatePickerWithTimeframeComponent as ɵe, DrDatePickerFormatDirective as ɵf, DrDatePickerCustomHeaderComponent as ɵg, DrShowTimeframePipe as ɵh, TooltipInfoComponent as ɵi, TooltipInfoSimpleComponent as ɵj, TooltipNoBodyComponent as ɵk, TooltipProcessDefaultComponent as ɵl, StepperComponent as ɵm };
+export { AnyTagComponent, CalendarView, CheckboxComponent, CustomDateFormat, DIALOG_BUTTON_LABEL, DIALOG_FIELD_TYPE, DIALOG_SIZE, DateFromats, DatePickerPeriodPosition, DateTagComponent, DateTagModule, DayTagComponent, DialogService, DrAccordionComponent, DrAccordionItemBodyComponent, DrAccordionItemComponent, DrAccordionItemHeaderComponent, DrAccordionModule, DrAvatarComponent, DrAvatarModule, DrAvatarPipe, DrButtonComponent, DrDialogModule, DrDropdownComponent, DrDropdownDirective, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownPositionDirective, DrDropdownService, DrErrorComponent, DrErrorModule, DrInputComponent, DrInputsModule, DrLayoutBodyComponent, DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutModule, DrModelDebounceChangeDirective, DrPopoverAlignmentDimension, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrSelectComponent, DrSharedUtils, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrStepperModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, ForecastTagComponent, ListTagComponent, ListTagModule, MonthTagComponent, QuarterTagComponent, RadioButtonComponent, RadioGroupComponent, SpinnerSize, SpinnerType, TimeframeOption, TooltipComponent, TooltipPosition, WeekTagComponent, YearTagComponent, components$3 as ɵa, POPUP_ANIMATION as ɵb, DrDatePickerComponent as ɵc, DrDatePickerService as ɵd, DrDatePickerWithTimeframeComponent as ɵe, DrDatePickerFormatDirective as ɵf, DrDatePickerCustomHeaderComponent as ɵg, DrShowTimeframePipe as ɵh, TooltipInfoComponent as ɵi, TooltipInfoSimpleComponent as ɵj, TooltipNoBodyComponent as ɵk, TooltipProcessDefaultComponent as ɵl, StepperComponent as ɵm, DialogWrapperComponent as ɵn, DialogModalWrapperComponent as ɵo };
 //# sourceMappingURL=datarailsshared-datarailsshared.js.map