ngx-techlify-core 11.3.0-beta.2 → 11.3.0-beta.6

package/bundles/ngx-techlify-core.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/material/dialog'), require('@angular/material/table'), require('@angular/material/sort'), require('@ngneat/until-destroy'), require('@angular/common'), require('@angular/forms'), require('@angular/common/http'), require('rxjs'), require('rxjs/operators'), require('@angular/material/snack-bar'), require('@angular/cdk/a11y'), require('@angular/cdk/coercion'), require('@angular/material/form-field'), require('@angular/material/select'), require('@angular/material/icon'), require('@angular/router'), require('@angular/material/core'), require('@angular/material/autocomplete'), require('@angular/material/badge'), require('@angular/material/button'), require('@angular/material/button-toggle'), require('@angular/material/card'), require('@angular/material/checkbox'), require('@angular/material/chips'), require('@angular/material/datepicker'), require('@angular/material/divider'), require('@angular/material/expansion'), require('@angular/material/grid-list'), require('@angular/material/input'), require('@angular/material/list'), require('@angular/material/menu'), require('@angular/material/paginator'), require('@angular/material/progress-bar'), require('@angular/material/progress-spinner'), require('@angular/material/radio'), require('@angular/material/sidenav'), require('@angular/material/slide-toggle'), require('@angular/material/slider'), require('@angular/material/stepper'), require('@angular/material/tabs'), require('@angular/material/toolbar'), require('@angular/material/tooltip'), require('@angular/material/tree'), require('@angular/flex-layout'), require('ngx-infinite-scroll'), require('ngx-doc-viewer'), require('ngx-editor'), require('xlsx'), require('@angular/platform-browser'), require('jsondiffpatch')) :
-    typeof define === 'function' && define.amd ? define('ngx-techlify-core', ['exports', '@angular/core', '@angular/material/dialog', '@angular/material/table', '@angular/material/sort', '@ngneat/until-destroy', '@angular/common', '@angular/forms', '@angular/common/http', 'rxjs', 'rxjs/operators', '@angular/material/snack-bar', '@angular/cdk/a11y', '@angular/cdk/coercion', '@angular/material/form-field', '@angular/material/select', '@angular/material/icon', '@angular/router', '@angular/material/core', '@angular/material/autocomplete', '@angular/material/badge', '@angular/material/button', '@angular/material/button-toggle', '@angular/material/card', '@angular/material/checkbox', '@angular/material/chips', '@angular/material/datepicker', '@angular/material/divider', '@angular/material/expansion', '@angular/material/grid-list', '@angular/material/input', '@angular/material/list', '@angular/material/menu', '@angular/material/paginator', '@angular/material/progress-bar', '@angular/material/progress-spinner', '@angular/material/radio', '@angular/material/sidenav', '@angular/material/slide-toggle', '@angular/material/slider', '@angular/material/stepper', '@angular/material/tabs', '@angular/material/toolbar', '@angular/material/tooltip', '@angular/material/tree', '@angular/flex-layout', 'ngx-infinite-scroll', 'ngx-doc-viewer', 'ngx-editor', 'xlsx', '@angular/platform-browser', 'jsondiffpatch'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['ngx-techlify-core'] = {}, global.ng.core, global.ng.material.dialog, global.ng.material.table, global.ng.material.sort, global['@ngneat/until-destroy'], global.ng.common, global.ng.forms, global.ng.common.http, global.rxjs, global.rxjs.operators, global.ng.material.snackBar, global.ng.cdk.a11y, global.ng.cdk.coercion, global.ng.material.formField, global.ng.material.select, global.ng.material.icon, global.ng.router, global.ng.material.core, global.ng.material.autocomplete, global.ng.material.badge, global.ng.material.button, global.ng.material.buttonToggle, global.ng.material.card, global.ng.material.checkbox, global.ng.material.chips, global.ng.material.datepicker, global.ng.material.divider, global.ng.material.expansion, global.ng.material.gridList, global.ng.material.input, global.ng.material.list, global.ng.material.menu, global.ng.material.paginator, global.ng.material.progressBar, global.ng.material.progressSpinner, global.ng.material.radio, global.ng.material.sidenav, global.ng.material.slideToggle, global.ng.material.slider, global.ng.material.stepper, global.ng.material.tabs, global.ng.material.toolbar, global.ng.material.tooltip, global.ng.material.tree, global.ng.flexLayout, global['ngx-infinite-scroll'], global['ngx-doc-viewer'], global['ngx-editor'], global.xlsx, global.ng.platformBrowser, global.jsondiffpatch));
-}(this, (function (exports, i0, dialog, table, sort, untilDestroy, common, forms, i1$1, rxjs, operators, i1, a11y, coercion, formField, select, icon, i1$2, core, autocomplete, badge, button, buttonToggle, card, checkbox, chips, datepicker, divider, expansion, gridList, input, list, menu, paginator, progressBar, progressSpinner, radio, sidenav, slideToggle, slider, stepper, tabs, toolbar, tooltip, tree, flexLayout, ngxInfiniteScroll, ngxDocViewer, ngxEditor, XLSX, platformBrowser, jsondiffpatch) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/material/dialog'), require('@angular/material/table'), require('@angular/material/sort'), require('@ngneat/until-destroy'), require('@angular/common'), require('@angular/forms'), require('@angular/common/http'), require('rxjs'), require('rxjs/operators'), require('@angular/material/snack-bar'), require('@angular/cdk/a11y'), require('@angular/cdk/coercion'), require('@angular/material/form-field'), require('@angular/material/select'), require('@angular/material/icon'), require('@angular/router'), require('@angular/material/tooltip'), require('@angular/material/core'), require('@angular/material/button'), require('@angular/material/checkbox'), require('@angular/material/input'), require('@angular/material/menu'), require('@angular/material/progress-spinner'), require('@angular/material/card'), require('@angular/material/divider'), require('@angular/material/chips'), require('@angular/material/datepicker'), require('@angular/material/list'), require('@angular/flex-layout'), require('ngx-infinite-scroll'), require('ngx-doc-viewer'), require('ngx-editor'), require('xlsx'), require('@angular/platform-browser'), require('jsondiffpatch'), require('@angular/cdk/keycodes'), require('@angular/material/autocomplete'), require('@angular/material/button-toggle')) :
+    typeof define === 'function' && define.amd ? define('ngx-techlify-core', ['exports', '@angular/core', '@angular/material/dialog', '@angular/material/table', '@angular/material/sort', '@ngneat/until-destroy', '@angular/common', '@angular/forms', '@angular/common/http', 'rxjs', 'rxjs/operators', '@angular/material/snack-bar', '@angular/cdk/a11y', '@angular/cdk/coercion', '@angular/material/form-field', '@angular/material/select', '@angular/material/icon', '@angular/router', '@angular/material/tooltip', '@angular/material/core', '@angular/material/button', '@angular/material/checkbox', '@angular/material/input', '@angular/material/menu', '@angular/material/progress-spinner', '@angular/material/card', '@angular/material/divider', '@angular/material/chips', '@angular/material/datepicker', '@angular/material/list', '@angular/flex-layout', 'ngx-infinite-scroll', 'ngx-doc-viewer', 'ngx-editor', 'xlsx', '@angular/platform-browser', 'jsondiffpatch', '@angular/cdk/keycodes', '@angular/material/autocomplete', '@angular/material/button-toggle'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['ngx-techlify-core'] = {}, global.ng.core, global.ng.material.dialog, global.ng.material.table, global.ng.material.sort, global['@ngneat/until-destroy'], global.ng.common, global.ng.forms, global.ng.common.http, global.rxjs, global.rxjs.operators, global.ng.material.snackBar, global.ng.cdk.a11y, global.ng.cdk.coercion, global.ng.material.formField, global.ng.material.select, global.ng.material.icon, global.ng.router, global.ng.material.tooltip, global.ng.material.core, global.ng.material.button, global.ng.material.checkbox, global.ng.material.input, global.ng.material.menu, global.ng.material.progressSpinner, global.ng.material.card, global.ng.material.divider, global.ng.material.chips, global.ng.material.datepicker, global.ng.material.list, global.ng.flexLayout, global['ngx-infinite-scroll'], global['ngx-doc-viewer'], global['ngx-editor'], global.xlsx, global.ng.platformBrowser, global.jsondiffpatch, global.ng.cdk.keycodes, global.ng.material.autocomplete, global.ng.material.buttonToggle));
+}(this, (function (exports, i0, dialog, table, sort, untilDestroy, common, forms, i1$1, rxjs, operators, i1, a11y, coercion, formField, select, icon, i1$2, tooltip, core, button, checkbox, input, menu, progressSpinner, card, divider, chips, datepicker, list, flexLayout, ngxInfiniteScroll, ngxDocViewer, ngxEditor, XLSX, platformBrowser, jsondiffpatch, keycodes, autocomplete, buttonToggle) { 'use strict';
 
     var ActionPopup = /** @class */ (function () {
         function ActionPopup() {
@@ -2738,8 +2738,9 @@
     Timeline.LAST_YEAR = 11;
     Timeline.ALL = 12;
 
-    var TimelineFilterComponent = /** @class */ (function () {
+    exports.ɵx = /** @class */ (function () {
         function TimelineFilterComponent() {
+            this.timelineValue = new forms.FormControl('');
             this.timelines = [
                 { value: 1, viewValue: 'Custom' },
                 { value: 2, viewValue: 'Today' },
@@ -2757,17 +2758,22 @@
             this.labelText = 'Select Timeline';
             this.dateFrom = 'date_from';
             this.dateTo = 'date_to';
+            this.appearance = "legacy";
+            this.showClearbutton = false;
             this.showCustomDateFields = false;
         }
         Object.defineProperty(TimelineFilterComponent.prototype, "defaultValue", {
             set: function (value) {
-                this.timelineValue = value;
+                this.timelineValue.setValue(value);
                 this.changeTimeline(value);
             },
             enumerable: false,
             configurable: true
         });
         TimelineFilterComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this.timelineValue.valueChanges.
+                pipe(operators.debounceTime(100), operators.distinctUntilChanged(), untilDestroy.untilDestroyed(this)).subscribe(function (value) { return _this.changeTimeline(value); });
         };
         TimelineFilterComponent.prototype.resetFieldValue = function (field) {
             this.form.get(field).setValue('');
@@ -2788,22 +2794,28 @@
         };
         return TimelineFilterComponent;
     }());
-    TimelineFilterComponent.decorators = [
+    exports.ɵx.decorators = [
         { type: i0.Component, args: [{
                     selector: 'app-timeline-filter',
-                    template: "<ng-container [formGroup]=\"form\">\n    <mat-form-field>\n        <mat-label>{{labelText}}</mat-label>\n        <mat-select (selectionChange)=\"changeTimeline($event.value)\" [value]=\"timelineValue\">\n            <mat-option *ngFor=\"let timeline of timelines\" [value]=\"timeline.value\">\n                {{timeline.viewValue}}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <ng-container *ngIf=\"showCustomDateFields\">\n        <mat-form-field>\n            <input matInput formControlName=\"{{dateFrom}}\" [matDatepicker]=\"fromPicker\" (click)=\"fromPicker.open()\"\n                placeholder=\"From Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"fromPicker\"></mat-datepicker-toggle>\n            <mat-datepicker #fromPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue(dateFrom)\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue(dateFrom)\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n        <mat-form-field>\n            <input matInput formControlName=\"{{dateTo}}\" [matDatepicker]=\"toPicker\" (click)=\"toPicker.open()\"\n                placeholder=\"To Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"\"></mat-datepicker-toggle>\n            <mat-datepicker #toPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue(dateTo)\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue(dateTo)\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n    </ng-container>\n</ng-container>",
+                    template: "<ng-container [formGroup]=\"form\">\n    <mat-form-field [appearance]=\"appearance\">\n        <mat-label>{{labelText}}</mat-label>\n        <mat-select [formControl]=\"timelineValue\">\n            <mat-option *ngFor=\"let timeline of timelines\" [value]=\"timeline.value\">\n                {{timeline.viewValue}}\n            </mat-option>\n        </mat-select>\n        <button mat-button *ngIf=\"showClearbutton && timelineValue.value\" matSuffix mat-icon-button\n            (click)=\"timelineValue.setValue('')\">\n            <mat-icon>close</mat-icon>\n        </button>\n    </mat-form-field>\n\n    <ng-container *ngIf=\"showCustomDateFields\">\n        <mat-form-field [appearance]=\"appearance\">\n            <mat-label>From Date</mat-label>\n            <input matInput formControlName=\"{{dateFrom}}\" [matDatepicker]=\"fromPicker\" (click)=\"fromPicker.open()\"\n                placeholder=\"From Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"fromPicker\"></mat-datepicker-toggle>\n            <mat-datepicker #fromPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue(dateFrom)\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue(dateFrom)\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n        <mat-form-field [appearance]=\"appearance\">\n            <mat-label>To Date</mat-label>\n            <input matInput formControlName=\"{{dateTo}}\" [matDatepicker]=\"toPicker\" (click)=\"toPicker.open()\"\n                placeholder=\"To Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"\"></mat-datepicker-toggle>\n            <mat-datepicker #toPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue(dateTo)\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue(dateTo)\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n    </ng-container>\n</ng-container>",
                     styles: [""]
                 },] }
     ];
-    TimelineFilterComponent.ctorParameters = function () { return []; };
-    TimelineFilterComponent.propDecorators = {
+    exports.ɵx.ctorParameters = function () { return []; };
+    exports.ɵx.propDecorators = {
+        timelineValue: [{ type: i0.Input }],
         timelines: [{ type: i0.Input }],
         labelText: [{ type: i0.Input }],
         dateFrom: [{ type: i0.Input }],
         dateTo: [{ type: i0.Input }],
+        appearance: [{ type: i0.Input }],
+        showClearbutton: [{ type: i0.Input }],
         form: [{ type: i0.Input }],
         defaultValue: [{ type: i0.Input }]
     };
+    exports.ɵx = __decorate([
+        untilDestroy.UntilDestroy()
+    ], exports.ɵx);
 
     var LoaderComponent = /** @class */ (function () {
         function LoaderComponent() {
@@ -3134,13 +3146,6 @@
         { type: HttpService }
     ]; };
 
-    /*
-     * This module imports and re-exports all Angular Material modules for convenience,
-     * so only 1 module import is needed in your feature modules.
-     * See https://material.angular.io/guide/getting-started#step-3-import-the-component-modules.
-     *
-     * To optimize your production builds, you should only import the components used in your app.
-     */
     var MaterialModule = /** @class */ (function () {
         function MaterialModule() {
         }
@@ -3149,45 +3154,29 @@
     MaterialModule.decorators = [
         { type: i0.NgModule, args: [{
                     exports: [
-                        autocomplete.MatAutocompleteModule,
-                        badge.MatBadgeModule,
                         button.MatButtonModule,
-                        buttonToggle.MatButtonToggleModule,
-                        card.MatCardModule,
                         checkbox.MatCheckboxModule,
-                        chips.MatChipsModule,
                         core.MatCommonModule,
-                        datepicker.MatDatepickerModule,
                         dialog.MatDialogModule,
-                        divider.MatDividerModule,
-                        expansion.MatExpansionModule,
                         formField.MatFormFieldModule,
-                        gridList.MatGridListModule,
                         icon.MatIconModule,
                         input.MatInputModule,
                         core.MatLineModule,
-                        list.MatListModule,
                         menu.MatMenuModule,
                         core.MatNativeDateModule,
                         core.MatOptionModule,
-                        paginator.MatPaginatorModule,
-                        progressBar.MatProgressBarModule,
                         progressSpinner.MatProgressSpinnerModule,
                         core.MatPseudoCheckboxModule,
-                        radio.MatRadioModule,
                         core.MatRippleModule,
                         select.MatSelectModule,
-                        sidenav.MatSidenavModule,
-                        slideToggle.MatSlideToggleModule,
-                        slider.MatSliderModule,
-                        i1.MatSnackBarModule,
                         sort.MatSortModule,
-                        stepper.MatStepperModule,
                         table.MatTableModule,
-                        tabs.MatTabsModule,
-                        toolbar.MatToolbarModule,
-                        tooltip.MatTooltipModule,
-                        tree.MatTreeModule
+                        card.MatCardModule,
+                        divider.MatDividerModule,
+                        chips.MatChipsModule,
+                        datepicker.MatDatepickerModule,
+                        list.MatListModule,
+                        tooltip.MatTooltipModule
                     ]
                 },] }
     ];
@@ -3429,7 +3418,7 @@
     }());
     TimelineFilterModule.decorators = [
         { type: i0.NgModule, args: [{
-                    declarations: [TimelineFilterComponent],
+                    declarations: [exports.ɵx],
                     imports: [
                         common.CommonModule,
                         TimelineFilterRoutingModule,
@@ -3437,7 +3426,7 @@
                         MaterialModule,
                         forms.ReactiveFormsModule
                     ],
-                    exports: [TimelineFilterComponent]
+                    exports: [exports.ɵx]
                 },] }
     ];
 
@@ -3795,11 +3784,19 @@
         untilDestroy.UntilDestroy()
     ], exports.ɵbb);
 
+    var esulr = {
+        title: 'Email Subscription Users',
+        permissions: {
+            only: ['app_admin'],
+            redirectTo: '/'
+        }
+    };
     var routes$4 = [
         {
             path: '',
             component: exports.ɵbb,
-            canActivate: [AuthenticationGuard]
+            canActivate: [AuthenticationGuard],
+            data: esulr
         },
     ];
     var EmailSubscriptionUserListRoutingModule = /** @class */ (function () {
@@ -4225,11 +4222,19 @@
         untilDestroy.UntilDestroy()
     ], exports.ɵbi);
 
+    var estlr = {
+        title: 'Email Subscription Type',
+        permissions: {
+            only: ['client_admin'],
+            redirectTo: '/'
+        }
+    };
     var routes$8 = [
         {
             path: '',
             component: exports.ɵbi,
             canActivate: [AuthenticationGuard],
+            data: estlr
         },
     ];
     var EmailSubscriptionTypeListRoutingModule = /** @class */ (function () {
@@ -4334,11 +4339,17 @@
         untilDestroy.UntilDestroy()
     ], exports.ɵbj);
 
+    var esfur = {
+        permissions: {
+            only: ['client_admin']
+        }
+    };
     var routes$9 = [
         {
             path: '',
             component: exports.ɵbj,
             canActivate: [AuthenticationGuard],
+            data: esfur
         },
     ];
     var EmailSubscriptionForUserRoutingModule = /** @class */ (function () {
@@ -6453,6 +6464,571 @@
                 },] }
     ];
 
+    var TechlifyTaggerTagFormConfigModel = /** @class */ (function () {
+        function TechlifyTaggerTagFormConfigModel() {
+            this.selectable = true;
+            this.removable = true;
+            this.separatorKeysCodes = [keycodes.ENTER, keycodes.COMMA];
+            this.placeholder = 'New Tag..';
+            this.apiUrl = 'api/techlify-tagger-tags';
+            this.createApiUrl = 'api/techlify-tagger-tags';
+            this.isCreateable = true;
+            this.isCacheTags = false;
+            this.isSingle = false;
+        }
+        return TechlifyTaggerTagFormConfigModel;
+    }());
+
+    var TechlifyTaggerTagFormFieldComponent_1;
+    exports.TechlifyTaggerTagFormFieldComponent = TechlifyTaggerTagFormFieldComponent_1 = /** @class */ (function () {
+        function TechlifyTaggerTagFormFieldComponent(_focusMonitor, _elementRef, httpService, _formField, ngControl) {
+            var _this = this;
+            this._focusMonitor = _focusMonitor;
+            this._elementRef = _elementRef;
+            this.httpService = httpService;
+            this._formField = _formField;
+            this.ngControl = ngControl;
+            this.stateChanges = new rxjs.Subject();
+            this.focused = false;
+            this.controlType = 'techlify-tagger-form-field';
+            this.id = "techlify-tagger-form-field-" + TechlifyTaggerTagFormFieldComponent_1.nextId++;
+            this.onChange = function (_) { };
+            this.onTouched = function () { };
+            this.tagInputCtrl = new forms.FormControl();
+            /**Pass the configuration for Techlify Tagger */
+            this.config = new TechlifyTaggerTagFormConfigModel();
+            /**Pass the default list of tags */
+            this._allTags = [];
+            /**Pass the Categories to filter for a model */
+            this.categories = [];
+            this._required = false;
+            this._disabled = false;
+            this._value = [];
+            this.tagInputCtrl.valueChanges
+                .subscribe(function (filterValue) {
+                _this.filterString = filterValue;
+            });
+            //Set Focus Monitor
+            _focusMonitor.monitor(_elementRef, true).subscribe(function (origin) {
+                if (_this.focused && !origin) {
+                    _this.onTouched();
+                }
+                _this.focused = !!origin;
+                _this.stateChanges.next();
+            });
+            if (this.ngControl != null) {
+                this.ngControl.valueAccessor = this;
+            }
+        }
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "allTags", {
+            get: function () {
+                return this._allTags;
+            },
+            set: function (value) {
+                this._allTags = value;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "tags", {
+            get: function () {
+                var _this = this;
+                return this.allTags.filter(function (x) { return _this.value.some(function (y) { return y == x.id; }); });
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "empty", {
+            //Default Getter and Setters for a Form Field Implementation
+            get: function () {
+                return this.value.length == 0;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "shouldLabelFloat", {
+            get: function () {
+                return this.focused || !this.empty || this.tagInputCtrl.value;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "required", {
+            get: function () {
+                return this._required;
+            },
+            set: function (value) {
+                this._required = coercion.coerceBooleanProperty(value);
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "disabled", {
+            get: function () {
+                return this._disabled;
+            },
+            set: function (value) {
+                this._disabled = coercion.coerceBooleanProperty(value);
+                this._disabled ? this.tagInputCtrl.disable() : this.tagInputCtrl.enable();
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "value", {
+            get: function () {
+                return this._value;
+            },
+            set: function (tagIds) {
+                this._value = tagIds || [];
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "errorState", {
+            get: function () {
+                return this.tagInputCtrl.dirty && this.required && (this.value.length == 0);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "placeholder", {
+            get: function () {
+                return this._placeholder;
+            },
+            set: function (value) {
+                this._placeholder = value;
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TechlifyTaggerTagFormFieldComponent.prototype.ngOnInit = function () {
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.ngOnChanges = function (changes) {
+            var _this = this;
+            //API to load all tags for the model type
+            if (this.allTags.length == 0) {
+                this.httpService
+                    .cache(!this.config.isCacheTags)
+                    .get(this.config.apiUrl, {
+                    params: {
+                        categories: this.categories.join(','),
+                        perPage: '1000'
+                    }
+                }).pipe(operators.debounceTime(500), untilDestroy.untilDestroyed(this)).subscribe(function (result) {
+                    _this.allTags = result.data;
+                });
+            }
+            //API to load only the selected tags for the model
+            if (this.modelId && this.value.length == 0) {
+                //Model Id is passed and no tags are present, so we query db for the avilable tags for the model ID.
+                this.httpService
+                    .cache(!this.config.isCacheTags)
+                    .get(this.config.apiUrl, {
+                    params: {
+                        categories: this.categories.join(','),
+                        model_type: this.modelType,
+                        model_id: this.modelId,
+                        perPage: '1000'
+                    }
+                }).pipe(operators.debounceTime(500), untilDestroy.untilDestroyed(this)).subscribe(function (result) {
+                    _this.value = ((result === null || result === void 0 ? void 0 : result.data) || []).map(function (x) { return x.id; });
+                    _this._handleInput();
+                });
+            }
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.init = function () {
+            var _this = this;
+            if (this.modelId && this.allTags.length == 0) {
+                //Model Id is passed and no tags are passed, so we query db for the avilable tags for the model ID.
+                this.httpService
+                    .cache(!this.config.isCacheTags)
+                    .get(this.config.apiUrl, {
+                    params: {
+                        categories: this.categories.join(','),
+                        model_type: this.modelType,
+                        model_id: this.modelId
+                    }
+                }).pipe(untilDestroy.untilDestroyed(this)).subscribe(function (result) {
+                    _this.allTags = result.data;
+                });
+            }
+        };
+        Object.defineProperty(TechlifyTaggerTagFormFieldComponent.prototype, "filteredTags", {
+            get: function () {
+                return this._filter();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TechlifyTaggerTagFormFieldComponent.prototype.setDescribedByIds = function (ids) {
+            // Just a empty implementation for Mat Form Field Interface
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.onContainerClick = function () {
+            // Just a empty implementation for Mat Form Field Interface
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.add = function (event) {
+            return __awaiter(this, void 0, void 0, function () {
+                var value, tags, tag, result, error_1;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            value = (event.value || '').trim();
+                            if (!(!this.config.isSingle || (this.value.length === 0))) return [3 /*break*/, 7];
+                            if (!(value && this.config.isCreateable)) return [3 /*break*/, 7];
+                            tags = this.allTags;
+                            tag = tags.find(function (item) { return item.title.toLowerCase() == value.toLowerCase(); });
+                            if (!!tag) return [3 /*break*/, 5];
+                            _a.label = 1;
+                        case 1:
+                            _a.trys.push([1, 3, , 4]);
+                            return [4 /*yield*/, this.httpService.post(this.config.createApiUrl, {
+                                    title: value,
+                                    description: value,
+                                    category_title: (this.categories.length > 0) ? (this.defaultCreateCategory ? this.defaultCreateCategory : this.categories[0]) : ''
+                                }).toPromise()];
+                        case 2:
+                            result = _a.sent();
+                            tag = result.item;
+                            return [3 /*break*/, 4];
+                        case 3:
+                            error_1 = _a.sent();
+                            return [2 /*return*/];
+                        case 4:
+                            this.allTags.push(tag);
+                            return [3 /*break*/, 6];
+                        case 5:
+                            //Optionally clean the existing value, to avoid duplicate
+                            this.remove(tag);
+                            _a.label = 6;
+                        case 6:
+                            this.value.push(tag.id);
+                            this._handleInput();
+                            _a.label = 7;
+                        case 7:
+                            // Clear the input value
+                            event.input.value = '';
+                            this.tagInputCtrl.setValue(null);
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.remove = function (tag) {
+            this.value = this.value.filter(function (x) { return x !== tag.id; });
+            this._handleInput();
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.selected = function (event) {
+            // Validate for single mode
+            if (!this.config.isSingle || (this.value.length === 0)) {
+                //Clean the existing value, to avoid duplicate
+                this.remove({ id: event.option.value });
+                this.value.push(event.option.value);
+                this._handleInput();
+            }
+            this.tagInput.nativeElement.value = '';
+            this.tagInputCtrl.setValue(null);
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype._filter = function () {
+            var _this = this;
+            var filterValue = this.filterString ? this.filterString.toString().toLowerCase() : null;
+            var availableTags = this.allTags.filter(function (tag) { return !_this.value.some(function (item) { return item == tag.id; }); });
+            return filterValue ? availableTags.filter(function (tag) { return tag.title.toLowerCase().includes(filterValue); }) : availableTags;
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.writeValue = function (tagIds) {
+            this.value = tagIds || [];
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.registerOnChange = function (fn) {
+            this.onChange = fn;
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.registerOnTouched = function (fn) {
+            this.onTouched = fn;
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.setDisabledState = function (isDisabled) {
+            this.disabled = isDisabled;
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype._handleInput = function () {
+            this.onChange(this.value);
+        };
+        TechlifyTaggerTagFormFieldComponent.prototype.ngOnDestroy = function () {
+            this.stateChanges.complete();
+            this._focusMonitor.stopMonitoring(this._elementRef);
+        };
+        return TechlifyTaggerTagFormFieldComponent;
+    }());
+    exports.TechlifyTaggerTagFormFieldComponent.nextId = 0;
+    exports.TechlifyTaggerTagFormFieldComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'app-techlify-tagger-tag-form-field',
+                    template: "<mat-chip-list #chipList aria-label=\"Tag Selection\">\n    <mat-chip *ngFor=\"let tag of tags\" [selectable]=\"config.selectable\" [removable]=\"config.removable\"\n        (removed)=\"remove(tag)\">\n        {{tag.title}}\n        <button matChipRemove *ngIf=\"config.removable\" class=\"border-0\">\n            <mat-icon class=\"mat-relative-icon\">cancel</mat-icon>\n        </button>\n    </mat-chip>\n    <input placeholder=\"{{config.isCreateable? config.placeholder:''}}\" #tagInput [formControl]=\"tagInputCtrl\"\n        [matAutocomplete]=\"auto\" [matChipInputFor]=\"chipList\"\n        [matChipInputSeparatorKeyCodes]=\"config.separatorKeysCodes\" (matChipInputTokenEnd)=\"add($event)\"\n        #trigger=\"matAutocompleteTrigger\" (click)=\"trigger.openPanel()\">\n</mat-chip-list>\n<mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n    <mat-option *ngFor=\"let tag of filteredTags\" [value]=\"tag.id\">\n        {{tag.title}}\n    </mat-option>\n</mat-autocomplete>",
+                    providers: [{ provide: formField.MatFormFieldControl, useExisting: TechlifyTaggerTagFormFieldComponent_1 }],
+                    styles: [".mat-relative-icon{font-size:20px;position:relative;right:7px;top:-3px}"]
+                },] }
+    ];
+    exports.TechlifyTaggerTagFormFieldComponent.ctorParameters = function () { return [
+        { type: a11y.FocusMonitor },
+        { type: i0.ElementRef },
+        { type: HttpService },
+        { type: formField.MatFormField, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [formField.MAT_FORM_FIELD,] }] },
+        { type: forms.NgControl, decorators: [{ type: i0.Optional }, { type: i0.Self }] }
+    ]; };
+    exports.TechlifyTaggerTagFormFieldComponent.propDecorators = {
+        tagInput: [{ type: i0.ViewChild, args: ['tagInput',] }],
+        config: [{ type: i0.Input }],
+        modelType: [{ type: i0.Input }],
+        modelId: [{ type: i0.Input }],
+        allTags: [{ type: i0.Input }],
+        categories: [{ type: i0.Input }],
+        defaultCreateCategory: [{ type: i0.Input }],
+        required: [{ type: i0.Input }],
+        disabled: [{ type: i0.Input }],
+        value: [{ type: i0.Input }],
+        placeholder: [{ type: i0.Input }]
+    };
+    exports.TechlifyTaggerTagFormFieldComponent = TechlifyTaggerTagFormFieldComponent_1 = __decorate([
+        untilDestroy.UntilDestroy()
+    ], exports.TechlifyTaggerTagFormFieldComponent);
+
+    var TechlifyTaggerTagFormFieldModule = /** @class */ (function () {
+        function TechlifyTaggerTagFormFieldModule() {
+        }
+        return TechlifyTaggerTagFormFieldModule;
+    }());
+    TechlifyTaggerTagFormFieldModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        exports.TechlifyTaggerTagFormFieldComponent
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        MaterialModule,
+                        flexLayout.FlexLayoutModule,
+                        autocomplete.MatAutocompleteModule,
+                        forms.ReactiveFormsModule
+                    ],
+                    exports: [exports.TechlifyTaggerTagFormFieldComponent]
+                },] }
+    ];
+
+    var TechlifyTaggerTagSelectorComponent_1;
+    exports.TechlifyTaggerTagSelectorComponent = TechlifyTaggerTagSelectorComponent_1 = /** @class */ (function () {
+        function TechlifyTaggerTagSelectorComponent(_focusMonitor, _elementRef, httpService, _formField, ngControl) {
+            var _this = this;
+            this._focusMonitor = _focusMonitor;
+            this._elementRef = _elementRef;
+            this.httpService = httpService;
+            this._formField = _formField;
+            this.ngControl = ngControl;
+            /**Pass the Categories to filter for a model */
+            this.categories = [];
+            this.multiple = false;
+            this.enableSearch = true;
+            this.tagSelectorCtrl = new forms.FormControl();
+            this.showAllTags = false;
+            this.useSelectButtonStyle = false;
+            this.tags = [];
+            this.stateChanges = new rxjs.Subject();
+            this.focused = false;
+            this.controlType = 'techlify-tagger-selector';
+            this.id = "techlify-tagger-selector-" + TechlifyTaggerTagSelectorComponent_1.nextId++;
+            this.onChange = function (_) { };
+            this.onTouched = function () { };
+            this._required = false;
+            this._disabled = false;
+            //Set Focus Monitor
+            _focusMonitor.monitor(_elementRef, true).subscribe(function (origin) {
+                if (_this.focused && !origin) {
+                    _this.onTouched();
+                }
+                _this.focused = !!origin;
+                _this.stateChanges.next();
+            });
+            if (this.ngControl != null) {
+                this.ngControl.valueAccessor = this;
+            }
+        }
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "apiUrl", {
+            get: function () {
+                var _a;
+                if (this.showAllTags) {
+                    return 'api/techlify-tagger-tags';
+                }
+                else if (((_a = this.categories) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+                    return 'api/techlify-tagger-tags?categories=' + this.categories.join(',');
+                }
+                else {
+                    return '';
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "empty", {
+            //Default Getter and Setters for a Form Field Implementation
+            get: function () {
+                return this.value.length == 0;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "shouldLabelFloat", {
+            get: function () {
+                return this.focused || !this.empty;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "required", {
+            get: function () {
+                return this._required;
+            },
+            set: function (value) {
+                this._required = coercion.coerceBooleanProperty(value);
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "disabled", {
+            get: function () {
+                return this._disabled;
+            },
+            set: function (value) {
+                this._disabled = coercion.coerceBooleanProperty(value);
+                this._disabled ? this.tagSelectorCtrl.disable() : this.tagSelectorCtrl.enable();
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "value", {
+            get: function () {
+                return this._value;
+            },
+            set: function (val) {
+                this._value = val;
+                this.tagSelectorCtrl.setValue(val);
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "errorState", {
+            get: function () {
+                return this.tagSelectorCtrl.dirty && this.required && (this.value.length == 0);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TechlifyTaggerTagSelectorComponent.prototype, "placeholder", {
+            get: function () {
+                return this._placeholder;
+            },
+            set: function (value) {
+                this._placeholder = value;
+                this.stateChanges.next();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TechlifyTaggerTagSelectorComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            if (this.useSelectButtonStyle) {
+                this.httpService.get(this.apiUrl)
+                    .pipe(untilDestroy.untilDestroyed(this))
+                    .subscribe(function (res) {
+                    _this.tags = res.data;
+                });
+            }
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.selectionChange = function (value) {
+            this.value = value;
+            this._handleInput();
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.setDescribedByIds = function (ids) {
+            // Just a empty implementation for Mat Form Field Interface
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.onContainerClick = function () {
+            // Just a empty implementation for Mat Form Field Interface
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.writeValue = function (val) {
+            this.value = val;
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.registerOnChange = function (fn) {
+            this.onChange = fn;
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.registerOnTouched = function (fn) {
+            this.onTouched = fn;
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.setDisabledState = function (isDisabled) {
+            this.disabled = isDisabled;
+        };
+        TechlifyTaggerTagSelectorComponent.prototype._handleInput = function () {
+            this.onChange(this.value);
+        };
+        TechlifyTaggerTagSelectorComponent.prototype.ngOnDestroy = function () {
+            this.stateChanges.complete();
+            this._focusMonitor.stopMonitoring(this._elementRef);
+        };
+        return TechlifyTaggerTagSelectorComponent;
+    }());
+    exports.TechlifyTaggerTagSelectorComponent.nextId = 0;
+    exports.TechlifyTaggerTagSelectorComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'app-techlify-tagger-tag-selector',
+                    template: "<app-searchable-selector *ngIf=\"apiUrl && !useSelectButtonStyle\" [formControl]=\"tagSelectorCtrl\" [apiUrl]=\"apiUrl\"\n    [enableSearch]=\"enableSearch\" [multiple]=\"multiple\" (selectionChange)=\"selectionChange($event)\">\n</app-searchable-selector>\n\n<mat-button-toggle-group *ngIf=\"apiUrl && useSelectButtonStyle\" [formControl]=\"tagSelectorCtrl\" [multiple]=\"multiple\"\n    (change)=\"selectionChange($event.value)\">\n    <mat-button-toggle *ngFor=\"let tag of tags\" [value]=\"tag.id\">{{tag.title}}</mat-button-toggle>\n</mat-button-toggle-group>",
+                    providers: [{ provide: formField.MatFormFieldControl, useExisting: TechlifyTaggerTagSelectorComponent_1 }],
+                    styles: [""]
+                },] }
+    ];
+    exports.TechlifyTaggerTagSelectorComponent.ctorParameters = function () { return [
+        { type: a11y.FocusMonitor },
+        { type: i0.ElementRef },
+        { type: HttpService },
+        { type: formField.MatFormField, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [formField.MAT_FORM_FIELD,] }] },
+        { type: forms.NgControl, decorators: [{ type: i0.Optional }, { type: i0.Self }] }
+    ]; };
+    exports.TechlifyTaggerTagSelectorComponent.propDecorators = {
+        categories: [{ type: i0.Input }],
+        multiple: [{ type: i0.Input }],
+        enableSearch: [{ type: i0.Input }],
+        showAllTags: [{ type: i0.Input }],
+        useSelectButtonStyle: [{ type: i0.Input }],
+        required: [{ type: i0.Input }],
+        disabled: [{ type: i0.Input }],
+        value: [{ type: i0.Input }],
+        placeholder: [{ type: i0.Input }]
+    };
+    exports.TechlifyTaggerTagSelectorComponent = TechlifyTaggerTagSelectorComponent_1 = __decorate([
+        untilDestroy.UntilDestroy()
+    ], exports.TechlifyTaggerTagSelectorComponent);
+
+    var TechlifyTaggerTagSelectorModule = /** @class */ (function () {
+        function TechlifyTaggerTagSelectorModule() {
+        }
+        return TechlifyTaggerTagSelectorModule;
+    }());
+    TechlifyTaggerTagSelectorModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        exports.TechlifyTaggerTagSelectorComponent
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        MaterialModule,
+                        flexLayout.FlexLayoutModule,
+                        autocomplete.MatAutocompleteModule,
+                        forms.ReactiveFormsModule,
+                        SearchableSelectorModule,
+                        buttonToggle.MatButtonToggleModule
+                    ],
+                    exports: [exports.TechlifyTaggerTagSelectorComponent]
+                },] }
+    ];
+
     var routes$n = [];
     var ImageForModelRoutingModule = /** @class */ (function () {
         function ImageForModelRoutingModule() {
@@ -6564,15 +7140,15 @@
     }());
     ImageForModelModule.decorators = [
         { type: i0.NgModule, args: [{
+                    declarations: [exports.ImageForModelComponent],
                     imports: [
                         common.CommonModule,
-                        ImageForModelRoutingModule,
                         MaterialModule,
                         flexLayout.FlexLayoutModule,
                         forms.ReactiveFormsModule,
+                        ImageForModelRoutingModule
                     ],
-                    declarations: [exports.ImageForModelComponent],
-                    exports: [exports.ImageForModelComponent],
+                    exports: [exports.ImageForModelComponent]
                 },] }
     ];
 
@@ -6688,10 +7264,13 @@
     exports.StorageService = StorageService;
     exports.SuccessSnackComponent = SuccessSnackComponent;
     exports.TechlifyConfig = TechlifyConfig;
+    exports.TechlifyTaggerTagFormConfigModel = TechlifyTaggerTagFormConfigModel;
+    exports.TechlifyTaggerTagFormFieldModule = TechlifyTaggerTagFormFieldModule;
+    exports.TechlifyTaggerTagSelectorModule = TechlifyTaggerTagSelectorModule;
     exports.TechlifyUpdateHistoryModule = TechlifyUpdateHistoryModule;
     exports.TechlifyUpdateModule = TechlifyUpdateModule;
     exports.Timeline = Timeline;
-    exports.TimelineFilterComponent = TimelineFilterComponent;
+    exports.TimelineFilterComponent = exports.ɵx;
     exports.TimelineFilterModule = TimelineFilterModule;
     exports.TokenInterceptor = TokenInterceptor;
     exports.UpdateNotifierComponent = UpdateNotifierComponent;
@@ -6699,6 +7278,9 @@
     exports.UtilityModule = UtilityModule;
     exports.ViewerConfig = ViewerConfig;
     exports.calculateTimeline = calculateTimeline;
+    exports.esfur = esfur;
+    exports.estlr = estlr;
+    exports.esulr = esulr;
     exports.ɵa = SnackModule;
     exports.ɵb = SuccessSnackComponent;
     exports.ɵbc = AuthenticationGuard;
@@ -6735,7 +7317,6 @@
     exports.ɵu = MatSelectInfiniteScrollDirective;
     exports.ɵv = NumItemsSelector;
     exports.ɵw = NumberSelector;
-    exports.ɵx = TimelineFilterComponent;
     exports.ɵy = TimelineFilterRoutingModule;
     exports.ɵz = LoaderComponent;