@ohioepa/oepa-ui-lib 1.2.0 → 1.2.2

package/fesm2022/ohioepa-oepa-ui-lib.mjs

@@ -1,11 +1,11 @@
 import * as i0 from '@angular/core';
-import { Injectable, Component, Input, EventEmitter, Output, Directive, HostListener, Pipe, ViewChild, forwardRef, NgModule } from '@angular/core';
+import { Injectable, Inject, Component, Input, EventEmitter, Output, Directive, HostListener, Pipe, ViewChild, forwardRef, NgModule } from '@angular/core';
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import { Observable, Subject, forkJoin, EMPTY, of } from 'rxjs';
-import { map, mergeMap, catchError, debounceTime, distinctUntilChanged, tap } from 'rxjs/operators';
+import { Observable, Subject, forkJoin, EMPTY, of, throwError } from 'rxjs';
+import { map, mergeMap, catchError, debounceTime, distinctUntilChanged, tap, timeout } from 'rxjs/operators';
 import * as i1 from '@angular/common/http';
-import { HttpHeaders } from '@angular/common/http';
+import { HttpHeaders, HttpParams, HttpUrlEncodingCodec } from '@angular/common/http';
 import * as i1$1 from '@ohioepa/oepa-common-lib';
 import { CommonLibModule } from '@ohioepa/oepa-common-lib';
 import * as i1$2 from '@angular/forms';
@@ -51,11 +51,14 @@ import * as i1$4 from '@angular/router';
  */
 class OepaAddressService {
     http;
+    ebizRootURL;
     states;
     countries;
     statesUrl = '/ebiz/api/v1/references/states';
-    constructor(http) {
+    constructor(http, ebizRootURL) {
         this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.statesUrl = ebizRootURL + this.statesUrl;
     }
     /**
      * Retrieve the list of applicable states. If no states have been provided
@@ -95,7 +98,7 @@ class OepaAddressService {
             return this.countries;
         }));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaAddressService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaAddressService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaAddressService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaAddressService, decorators: [{
@@ -103,7 +106,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
 
 class AddressComponent {
     addressService;
@@ -766,12 +772,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class TableExportService {
     http;
+    ebizRootURL;
     downloadHTMLUrl = '/ebiz/api/v1/fileutil/tableAsHTML';
     downloadExcelUrl = '/ebiz/api/v1/fileutil/tableAsExcel';
     downloadDummyHTMLUrl = '/ebiz/api/v1/fileutil/dummyTableHTML';
     downloadDummyExcelUrl = '/ebiz/api/v1/fileutil/dummyTableExcel';
-    constructor(http) {
+    constructor(http, ebizRootURL) {
         this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.downloadHTMLUrl = ebizRootURL + this.downloadHTMLUrl;
+        this.downloadExcelUrl = ebizRootURL + this.downloadExcelUrl;
+        this.downloadDummyHTMLUrl = ebizRootURL + this.downloadDummyHTMLUrl;
+        this.downloadDummyExcelUrl = ebizRootURL + this.downloadDummyExcelUrl;
     }
     /**
      * Return a string representing the contents of table as HTML.
@@ -807,7 +819,7 @@ class TableExportService {
         const headers = new HttpHeaders();
         return this.http.get(this.downloadDummyExcelUrl, { headers: headers, responseType: 'blob' });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableExportService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableExportService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableExportService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableExportService, decorators: [{
@@ -815,7 +827,232 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
+/**
+ * NOTE: Needed this because of problems importing mime or mime-types library
+ */
+const MIME_TYPES = {
+    '.aac': 'audio/aac',
+    '.abw': 'application/x-abiword',
+    '.arc': 'application/octet-stream',
+    '.avi': 'video/x-msvideo',
+    '.azw': 'application/vnd.amazon.ebook',
+    '.bin': 'application/octet-stream',
+    '.bmp': 'image/bmp',
+    '.bz': 'application/x-bzip',
+    '.bz2': 'application/x-bzip2',
+    '.csh': 'application/x-csh',
+    '.css': 'text/css',
+    '.csv': 'text/csv',
+    '.doc': 'application/msword',
+    '.docx': 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+    '.eot': 'application/vnd.ms-fontobject',
+    '.epub': 'application/epub+zip',
+    '.es': 'application/ecmascript',
+    '.gif': 'image/gif',
+    '.htm': 'text/html',
+    '.html': 'text/html',
+    '.ico': 'image/x-icon',
+    '.ics': 'text/calendar',
+    '.jar': 'application/java-archive',
+    '.jpeg': 'image/jpeg',
+    '.jpg': 'image/jpeg',
+    '.js': 'application/javascript',
+    '.json': 'application/json',
+    '.mid': 'audio/midi audio/x-midi',
+    '.midi': 'audio/midi audio/x-midi',
+    '.mpeg': 'video/mpeg',
+    '.mpkg': 'application/vnd.apple.installer+xml',
+    '.odp': 'application/vnd.oasis.opendocument.presentation',
+    '.ods': 'application/vnd.oasis.opendocument.spreadsheet',
+    '.odt': 'application/vnd.oasis.opendocument.text',
+    '.oga': 'audio/ogg',
+    '.ogv': 'video/ogg',
+    '.ogx': 'application/ogg',
+    '.otf': 'font/otf',
+    '.png': 'image/png',
+    '.pdf': 'application/pdf',
+    '.ppt': 'application/vnd.ms-powerpoint',
+    '.pptx': 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
+    '.rar': 'application/x-rar-compressed',
+    '.rtf': 'application/rtf',
+    '.sh': 'application/x-sh',
+    '.svg': 'image/svg+xml',
+    '.swf': 'application/x-shockwave-flash',
+    '.tar': 'application/x-tar',
+    '.tif': 'image/tiff',
+    '.tiff': 'image/tiff',
+    '.ts': 'application/typescript',
+    '.ttf': 'font/ttf',
+    '.txt': 'text/plain',
+    '.vsd': 'application/vnd.visio',
+    '.wav': 'audio/wav',
+    '.weba': 'audio/webm',
+    '.webm': 'video/webm',
+    '.webp': 'image/webp',
+    '.woff': 'font/woff',
+    '.woff2': 'font/woff2',
+    '.xhtml': 'application/xhtml+xml',
+    '.xls': 'application/vnd.ms-excel',
+    '.xlsm': 'application/vnd.ms-excel.sheet.macroEnabled.12',
+    '.xlsx': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+    '.xml': 'application/xml',
+    '.xul': 'application/vnd.mozilla.xul+xml',
+    '.zip': 'application/zip',
+    '.3gp': 'video/3gpp',
+    '.7z': 'application/x-7z-compressed'
+};
+/**
+ * Collection of methods for uploading/downloading and displaying files.
+ */
+class OepaFileUtilService {
+    http;
+    ebizRootURL;
+    uploadUrl = '/file/upload/url';
+    fileUtilUrl = '/ebiz/api/v1/fileutil';
+    downloadUrl = this.fileUtilUrl + '/downloadAttachment';
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.uploadUrl = ebizRootURL + this.uploadUrl;
+        this.fileUtilUrl = ebizRootURL + this.fileUtilUrl;
+        this.downloadUrl = ebizRootURL + this.downloadUrl;
+    }
+    /**
+     * Return a single OepaAttachment object from the contents of file.
+     * The file will have been saved on the server if this method succeeds.
+     * @param file
+     */
+    uploadFile(file) {
+        const attachment = {};
+        attachment.userFilename = file.name;
+        // return new Observable<OepaAttachment>((observer) => observer.next(attachment));
+        const headers = new HttpHeaders();
+        const formData = new FormData();
+        formData.append('file', file, file.name);
+        /** No need to include Content-Type in Angular 4 */
+        headers.append('Content-Type', 'multipart/form-data');
+        headers.append('Accept', 'application/json');
+        return this.http.post(this.uploadUrl, formData)
+            .pipe(map((response) => {
+            let uploadedAttachment = {};
+            const attachments = response['attachments'];
+            if (attachments.length === 1) {
+                uploadedAttachment = attachments[0];
+            }
+            return uploadedAttachment;
+        }));
+    }
+    /**
+     * Download an attachment from the server. The location and systemFileName
+     * attributes of the attachment must be set and represent a valid file
+     * on the file system.
+     * @param attachment
+     */
+    downloadAttachment(attachment) {
+        const headers = new HttpHeaders();
+        headers.append('Content-type', 'application/json;odata=verbose');
+        return this.http.post(this.downloadUrl, attachment, { headers: headers, responseType: 'blob' });
+    }
+    /**
+     * Open the file represented by data in the browser.
+     * @param data binary file data.
+     * @param mimeType the file's mime type.
+     * @param fileName optional name for the downloaded file.
+     */
+    downloadFile(data, mimeType, fileName) {
+        if (data && mimeType) {
+            const blob = new Blob([data], { type: mimeType });
+            const url = window.URL.createObjectURL(blob);
+            if (!fileName || fileName.length === 0) {
+                window.open(url);
+            }
+            else {
+                this.downLoadFileWithFileName(url, fileName);
+            }
+        }
+        else {
+            console.log('ERROR: downloadFile: missing data or mimeType');
+        }
+    }
+    /**
+     * Utility method for downloading a file with a specific name.
+     * @param url
+     * @param fileName
+     */
+    downLoadFileWithFileName(url, fileName) {
+        const a = document.createElement('a');
+        document.body.appendChild(a);
+        a.setAttribute('style', 'display: none');
+        a.setAttribute('href', url);
+        a.setAttribute('download', fileName);
+        a.click();
+    }
+    /**
+     * Helper method to see if current browser is internet explorer
+     */
+    browserIsIE() {
+        const ua = window.navigator.userAgent;
+        const msie = ua.indexOf('MSIE ');
+        if (msie > -1) {
+            return true;
+        }
+        const trident = ua.indexOf('Trident/');
+        if (trident > -1) {
+            return true;
+        }
+        const edge = ua.indexOf('Edge/');
+        if (edge > -1) {
+            return true;
+        }
+        return false;
+    }
+    /**
+     * Determine the mime time for fileName (based on its extension).
+     * @param fileName
+     */
+    mimeTypeForFile(fileName) {
+        let mimeType;
+        if (fileName && fileName.lastIndexOf('.') > -1) {
+            const ext = fileName.substring(fileName.lastIndexOf('.'));
+            mimeType = MIME_TYPES[ext.toLowerCase()];
+        }
+        if (!mimeType) {
+            console.log('ERROR: mimeTypeForFile: No mime type found for file: ' + fileName);
+        }
+        return mimeType;
+    }
+    mimeTypeForExtension(extension) {
+        let mimeType;
+        let ext;
+        if (extension) {
+            ext = extension.toLowerCase();
+            if (!ext.startsWith('.')) {
+                ext = '.' + ext;
+            }
+            mimeType = MIME_TYPES[ext];
+        }
+        if (!mimeType) {
+            console.log('ERROR: mimeTypeForExtension: No mime type found for extension: ' + extension);
+        }
+        return mimeType;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaFileUtilService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaFileUtilService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaFileUtilService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
 
 class OepaTableSortingDirective {
     tableService;
@@ -1784,13 +2021,13 @@ class TableComponent {
     onCustomBtnClick() {
         this.customBtnClicked.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableComponent, deps: [{ token: i1$3.DomSanitizer }, { token: TableService }, { token: TableExportService }, { token: i1$1.OepaFileUtilService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableComponent, deps: [{ token: i1$3.DomSanitizer }, { token: TableService }, { token: TableExportService }, { token: OepaFileUtilService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableComponent, selector: "oepa-table", inputs: { tableId: "tableId", config: "config", complexHeader: "complexHeader", header: "header", customBtnLabel: "customBtnLabel", customBtnVisible: "customBtnVisible", customBtnEnabled: "customBtnEnabled", data: "data", totalRow: "totalRow" }, outputs: { cellClicked: "cellClicked", actionClicked: "actionClicked", rowSelected: "rowSelected", customBtnClicked: "customBtnClicked" }, ngImport: i0, template: "<!-- Unhide select input - only visible if one or more columns are hidden -->\n\n<form *ngIf=\"hiddenColumns.length > 0\">\n  <div class=\"row mb-2\">\n    <label class=\"col-sm-2 col-form-label\">Show Hidden Columns:</label>\n    <div class=\"col-sm-4\">\n      <select class=\"form-select\" (change)=\"unhideColumn($any($event).target.value)\" [id]=\"tableId+'_UnhideColumnSelect'\">\n        <option value=\"\">Choose a column</option>\n        <option *ngFor=\"let col of hiddenColumns\" [value]=\"col.id\">{{col.title}}</option>\n      </select>\n    </div>\n  </div>\n</form>\n<!-- This is the table -->\n<div ngClass=\"{{config.divClassName || ''}}\" >\n<table *ngIf=\"!config.hideTable\" class=\"table dataTable\" ngClass=\"{{config.className || ''}}\" role=\"grid\" style=\"width: 100%;\">\n\n<!-- This is the table header -->\n<thead>\n  <!-- There may be multiple header rows -->\n  <tr *ngFor=\"let hdr of headerRows; let hr=index;\" role=\"row\">\n    <!-- Details indicator column (if data has details) -->\n    <th *ngIf=\"dataHasDetails && hr === 0\" [rowSpan]=\"headerRows.length\" class=\"detail-indicator-col\">\n      <span>\n        <i (click)=\"toggleAllDetails()\" [id]=\"tableId+'_ShowAllDetailsLink'\" class=\"bi\" [ngClass]=\"{'bi-chevron-down': showAllDetails, 'bi-chevron-right': !showAllDetails}\"\n          [tooltip]=\"(showAllDetails ? 'Hide' : 'Show') + ' details for all rows'\" placement=\"right\">\n        </i>\n      </span>\n    </th>\n    <ng-template ngFor let-column [ngForOf]=\"hdr.columns\" let-c=\"index\">\n      <!-- Header cell -->\n      <th *ngIf=\"!column.hidden\" ngClass=\"{{column.className || ''}}\" [colSpan]=\"column.colspan || 1\" [rowSpan]=\"column.rowspan || 1\">\n        <!-- Select all Rows Checkbox -->\n        <div class=\"text-center\">\n          <input *ngIf=\"column.selectColumn\" type=\"checkbox\" [checked]=\"allRowsSelected\" (change)=\"toggleAllRowsSelection()\">\n\n          <!-- Header cell text with sort capability (if specified) -->\n          <span [oepaTableSorting]=\"true\" [column]=\"column\" [tableId]=\"tableId\" (sortChanged)=\"onSortChanged($event)\" [id]=\"tableId+'_SortColumnLink_'+column.id\">\n            <span *ngIf=\"column.sort\"><i class=\"pull-left bi\" [ngClass]=\"{'bi-chevron-down': column.sort === 'desc', 'bi-chevron-up': column.sort === 'asc'}\"></i>\n            <sup *ngIf=\"column?.sortIndex || 0 > 1\">{{column.sortIndex}}</sup></span>\n            {{column.title}}\n          </span>\n          <!-- button to allow column to be hidden (if specified) -->\n          <button *ngIf=\"column.hidden === false\" type=\"button\" class=\"btn-close float-end\" aria-label=\"Hide\" (click)=\"hideColumn(column)\"\n            [id]=\"tableId+'_HideColumnLink'+'_'+column.id\">\n          </button>\n\n        </div>\n        <!-- column filter (if specified) -->\n        <div *ngIf=\"((rows && rows.length > 0) || !noFilters()) && column.filterable\" >\n          <input [oepaTableFiltering]=\"{ filterString: '', columnId: column.id }\" [tableId]=\"tableId\" class=\"form-control input-sm\" (tableChanged)=\"onFilterChanged($event)\"\n            [id]=\"tableId+'_FilterColumn_'+column.id\" />\n        </div>\n      </th>\n    </ng-template>\n  </tr>\n</thead>\n\n<!-- This is the table body -->\n<tbody>\n  <ng-template ngFor let-row [ngForOf]=\"rows\" let-r=\"index\">\n    <!-- Data Row -->\n    <tr>\n      <td *ngIf=\"dataHasDetails\">\n        <!-- Detail icon (if specified) -->\n        <span *ngIf=\"row.showDetail === true || row.showDetail === false\">\n          <i *ngIf=\"row.detailIconClassName\" [ngClass]=\"row.detailIconClassName\"></i>\n          <i (click)=\"toggleRowDetail(row)\" [id]=\"tableId+'_ShowDetailLink_'+r\" class=\"bi\" [ngClass]=\"{'bi-chevron-down': row.showDetail, 'bi-chevron-right': !row.showDetail}\"\n            [tooltip]=\"(row.showDetail ? 'Hide' : 'Show') + ' details for this row'\" placement=\"right\">\n          </i>\n        </span>\n      </td>\n      <!-- If row is a divider, it spans the whole table -->\n      <!-- <td *ngIf=\"row.isDivider\" [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\" [ngClass]=\"row.dividerClassName || 'oepa-table-gray'\">&nbsp;</td> -->\n      <!-- Data Rows -->\n      <ng-template *ngIf=\"!row.isDivider\" ngFor let-col [ngForOf]=\"dataColumns\" let-i=\"index\">\n        <td *ngIf=\"!col.hidden && (row|cellColspan:col) > 0\" ngClass=\"{{row|cellClassname:col || ''}}\" [colSpan]=\"row|cellColspan:col\">\n          <!-- Data Cell -->\n          <div *ngIf=\"!col.actionColumn && !col.selectColumn && !col.singleSelectColumn\">\n            <!-- Template for popover 1 -->\n            <ng-template #popoverTemplate>\n              <div *ngIf=\"row.popover\">\n                <cml-template [templateInfo]=\"row.popover.content\"></cml-template>\n              </div>\n            </ng-template>\n            <!-- Popover 1 icon (if specified) -->\n            <span *ngIf=\"row.popover && i === (row.popoverColumnIndex || 0) && row.popover\" tabindex=\"0\" [popoverTitle]=\"row.popover.title\" [popover]=\"popoverTemplate\"\n              [containerClass]=\"row.popover.containerClass\" placement=\"right\" [triggers]=\"row.popover.trigger || 'mouseenter:mouseleave'\">\n              <i [ngClass]=\"row.popover.className\" [id]=\"tableId+'_PopoverLink_'+r\"></i>\n            </span>\n\n            <!-- Template for popover 2 -->\n            <ng-template #popover2Template>\n              <div *ngIf=\"row.popover2\">\n                <cml-template [templateInfo]=\"row.popover2.content\"></cml-template>\n              </div>\n            </ng-template>\n            <!-- Popover 2 icon (if specified) -->\n            <span *ngIf=\"i === (row.popover2ColumnIndex || 0) && row.popover2\" tabindex=\"0\" [popoverTitle]=\"row.popover2.title\" [popover]=\"popover2Template\"\n              [containerClass]=\"row.popover2.containerClass\" placement=\"right\" [triggers]=\"row.popover2.trigger || 'mouseenter:mouseleave'\">\n              <i [ngClass]=\"row.popover2.className\" [id]=\"tableId+'_Popover2Link_'+r\"></i>\n            </span>\n\n            <!-- Template for popover 3 -->\n            <ng-template #popover3Template>\n              <div *ngIf=\"row.popover3\">\n                <cml-template [templateInfo]=\"row.popover3.content\"></cml-template>\n              </div>\n            </ng-template>\n            <!-- Popover 3 icon (if specified) -->\n            <span *ngIf=\"i === (row.popover3ColumnIndex || 0) && row.popover3\" tabindex=\"0\" [popoverTitle]=\"row.popover3.title\" [popover]=\"popover3Template\"\n              [containerClass]=\"row.popover3.containerClass\" placement=\"right\" [triggers]=\"row.popover3.trigger || 'mouseenter:mouseleave'\">\n              <i [ngClass]=\"row.popover3.className\" [id]=\"tableId+'_Popover3Link_'+r\"></i>\n            </span>\n\n            \n            <!-- <div *ngIf=\"row|cellInnerHTML:col\" [innerHTML]=\"row|cellInnerHTML:col\"></div>\n            <span *ngIf=\"!(row|cellInnerHTML:col)\">{{row|cellValue:col}}</span> -->\n\n            <!-- If col is hyperlink, display data as a hyperlink -->\n            <button *ngIf=\"col.hyperlink\" type=\"button\" class=\"btn btn-link\" (click)=\"cellClick(row, col.id)\" [id]=\"tableId+'_CellClick_'+r+'_'+i\">\n              <span *ngIf=\"!(row|cellInnerHTML:col)\">\n                <i [ngClass]=\"row|cellIconClassname:col\"></i>\n                <span *ngIf=\"row|cellImgSrc:col\"><img [src]=\"row|cellImgSrc:col\"/></span>\n                {{row|cellValue:col}}\n              </span>\n              <div *ngIf=\"row|cellInnerHTML:col\" [innerHTML]=\"row|cellInnerHTML:col\"></div>\n            </button>\n            <!-- If col is NOT hyperlink, just display data -->\n            <span *ngIf=\"!col.hyperlink\">\n              <span *ngIf=\"!(row|cellInnerHTML:col)\">\n                <i ngClass=\"{{row|cellIconClassname:col || ''}}\"></i>\n                <span *ngIf=\"row|cellImgSrc:col\"><img [src]=\"row|cellImgSrc:col\"/></span>\n                {{row|cellValue:col}}\n              </span>\n              <div *ngIf=\"row|cellInnerHTML:col\" [innerHTML]=\"row|cellInnerHTML:col\"></div>\n            </span>\n          </div>\n          <!-- Select Cell -->\n          <div *ngIf=\"col.selectColumn\" class=\"text-center\">\n            <input [id]=\"tableId+'_'+r\" type=\"checkbox\" [disabled]=\"!row.selectable\" [checked]=\"row.selected\" (change)=\"toggleRowSelection(row)\">\n          </div>\n          <!-- Single Select Cell -->\n          <div *ngIf=\"col.singleSelectColumn\" class=\"text-center\">\n            <input [id]=\"tableId+'_singleSelect_'+r\" type=\"radio\" [disabled]=\"!row.selectable\" [checked]=\"row.selected\" (change)=\"singleRowSelection(row)\">\n          </div>\n          <!-- Action Button Cell -->\n          <div *ngIf=\"col.actionColumn && row.actions\">\n            <oepa-action-btn [actions]=\"row.actions\" [data]=\"row.dataSource\"  (actionClicked)=\"onActionClick($event)\" [btnId]=\"tableId+'_'+r\"></oepa-action-btn>\n          </div>\n        </td>\n      </ng-template>\n    </tr>\n\n    <!-- Detail Row -->\n    <tr *ngIf=\"row.showDetail\" class=\"table-info\">\n      <td [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\">\n        <cml-template [templateInfo]=\"row.detail\"></cml-template>\n      </td>\n    </tr>\n  </ng-template>\n  <tr *ngIf=\"totalRow\">\n    <td *ngIf=\"dataHasDetails\">\n    </td>\n      <ng-template ngFor let-totalCol [ngForOf]=\"dataColumns\">\n          <td *ngIf=\"!totalCol.hidden\" ngClass=\"{{totalRow|cellClassname:totalCol || ''}}\">\n            <div>\n               <span><i ngClass=\"{{totalRow|cellIconClassname:totalCol || ''}}\"></i>{{totalRow|cellValue:totalCol}}</span>\n            </div>\n          </td>\n      </ng-template>\n  </tr>\n</tbody>\n</table>\n</div>\n<!-- Table footer -->\n<form *ngIf=\"!config.hideFooter || (data && pageInfo.itemsPerPage < data.length)\" class=\"form-horizontal\">\n<div class=\"form-group row text-right\">\n  <!-- Table-wide filter -->\n  <div class=\"col-sm-4\">\n    <div class=\"row\">\n      <div class=\"col-sm-6\">\n        <input *ngIf=\"!config.hideGlobalFilter\" placeholder=\"Filter all columns\" [oepaTableFiltering]=\"{ filterString: '' }\" [tableId]=\"tableId\" class=\"form-control input-sm\" (tableChanged)=\"onFilterChanged($event)\"\n          [id]=\"tableId+'_FilterAllColumnsInput'\" />\n      </div>\n      <div class=\"col-sm-6\">\n        <span *ngIf=\"config.showRowCountInFooter && _data && _data.length > 0\">\n          <span class=\"badge badge-secondary\" style=\"color: #999\">{{_data.length}}</span>&nbsp;total rows\n        </span>\n      </div>\n    </div>\n  </div>\n  <!-- Export Buttons -->\n  <div class=\"col-sm-4 d-flex justify-content-center\">\n    <div class=\"row\">\n      <div class=\"col-sm-12 text-center\">\n        <button type=\"button\" *ngIf=\"config.exportToExcel\" class=\"btn btn-primary mr-1\" (click)=\"exportToExcel()\" [id]=\"tableId+'_ExportToExcelBtn'\">Export to Excel</button>\n        <button type=\"button\" *ngIf=\"config.exportToHTML\" class=\"btn btn-primary mr-1\" (click)=\"exportToHTML()\" [id]=\"tableId+'_ExportToHTMLBtn'\">Export to HTML</button>\n        <button *ngIf=\"customBtnVisible\" type=\"button\" class=\"btn btn-primary mr-1\" (click)=\"onCustomBtnClick()\" [id]=\"tableId+'_CustomBtn'\" [disabled]=\"!customBtnEnabled\">{{customBtnLabel}}</button>\n      </div>\n      <div *ngIf=\"config.exportToExcel || config.exportToHTML\" class=\"col-sm-12 text-center\">\n        <span>Export only visible data:&nbsp;\n          <input type=\"checkbox\" [checked]=\"exportVisibleOnly\" (click)=\"toggleExportVisibleOnly()\" id=\"exportVisibleOnlyCheckbox\"/>\n        </span>\n      </div>\n    </div>\n  </div>\n  <!-- Pagination -->\n  <div *ngIf=\"!config.disablePagination\" class=\"col-sm-4 d-flex justify-content-end\">\n    <pagination *ngIf=\"paginationOn\" class=\"pagination-sm\" [totalItems]=\"pageInfo.length\" [itemsPerPage]=\"pageInfo.itemsPerPage\" [maxSize]=\"pageInfo.maxSize\"\n      [(ngModel)]=\"currentPage\" name=\"currentTablePage\"\n      [boundaryLinks]=\"true\" [rotate]=\"false\" (pageChanged)=\"onPageChanged($event)\" (numPages)=\"pageInfo.numPages = $event\">\n    </pagination>\n    &nbsp;\n    <button (click)=\"togglePagingation()\" type=\"button\" class=\"btn btn-default btn-sm mr-1\">{{ paginationOn ? 'Show All Rows' : 'Restore Pagination'}}</button>\n  </div>\n</div>\n</form>", styles: [".pagination{margin:0}th.oepa-table-header-center{text-align:center}.oepa-table-bold{font-weight:700}.oepa-table-italic{font-style:italic}.oepa-table-line-through{text-decoration:line-through}.oepa-table-gray{background-color:#ddd}td.oepa-undeline-cell{border-bottom:1pt solid black}.detail-indicator-col{width:30px}.action-btn-col{width:90px}.select-col{width:20px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i7$1.PaginationComponent, selector: "pagination", inputs: ["align", "maxSize", "boundaryLinks", "directionLinks", "firstText", "previousText", "nextText", "lastText", "rotate", "pageBtnClass", "disabled", "customPageTemplate", "customNextTemplate", "customPreviousTemplate", "customFirstTemplate", "customLastTemplate", "itemsPerPage", "totalItems"], outputs: ["numPages", "pageChanged"] }, { kind: "directive", type: i8.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: i9.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: i1$1.OepaTemplateComponent, selector: "cml-template", inputs: ["templateInfo"] }, { kind: "component", type: ActionBtnComponent, selector: "oepa-action-btn", inputs: ["label", "btnId", "data", "actions", "normalSize", "dropup"], outputs: ["actionClicked"] }, { kind: "directive", type: OepaTableSortingDirective, selector: "[oepaTableSorting]", inputs: ["tableId", "oepaTableSorting", "column"], outputs: ["sortChanged"] }, { kind: "directive", type: OepaTableFilteringDirective, selector: "[oepaTableFiltering]", inputs: ["oepaTableFiltering", "tableId"], outputs: ["tableChanged"] }, { kind: "pipe", type: OepaTableCellInnerHtmlPipe, name: "cellInnerHTML" }, { kind: "pipe", type: OepaTableCellColSpanPipe, name: "cellColspan" }, { kind: "pipe", type: OepaTableCellValuePipe, name: "cellValue" }, { kind: "pipe", type: OepaTableCellClassnamePipe, name: "cellClassname" }, { kind: "pipe", type: OepaTableCellIconClassnamePipe, name: "cellIconClassname" }, { kind: "pipe", type: OepaTableCellImgSrcPipe, name: "cellImgSrc" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-table', template: "<!-- Unhide select input - only visible if one or more columns are hidden -->\n\n<form *ngIf=\"hiddenColumns.length > 0\">\n  <div class=\"row mb-2\">\n    <label class=\"col-sm-2 col-form-label\">Show Hidden Columns:</label>\n    <div class=\"col-sm-4\">\n      <select class=\"form-select\" (change)=\"unhideColumn($any($event).target.value)\" [id]=\"tableId+'_UnhideColumnSelect'\">\n        <option value=\"\">Choose a column</option>\n        <option *ngFor=\"let col of hiddenColumns\" [value]=\"col.id\">{{col.title}}</option>\n      </select>\n    </div>\n  </div>\n</form>\n<!-- This is the table -->\n<div ngClass=\"{{config.divClassName || ''}}\" >\n<table *ngIf=\"!config.hideTable\" class=\"table dataTable\" ngClass=\"{{config.className || ''}}\" role=\"grid\" style=\"width: 100%;\">\n\n<!-- This is the table header -->\n<thead>\n  <!-- There may be multiple header rows -->\n  <tr *ngFor=\"let hdr of headerRows; let hr=index;\" role=\"row\">\n    <!-- Details indicator column (if data has details) -->\n    <th *ngIf=\"dataHasDetails && hr === 0\" [rowSpan]=\"headerRows.length\" class=\"detail-indicator-col\">\n      <span>\n        <i (click)=\"toggleAllDetails()\" [id]=\"tableId+'_ShowAllDetailsLink'\" class=\"bi\" [ngClass]=\"{'bi-chevron-down': showAllDetails, 'bi-chevron-right': !showAllDetails}\"\n          [tooltip]=\"(showAllDetails ? 'Hide' : 'Show') + ' details for all rows'\" placement=\"right\">\n        </i>\n      </span>\n    </th>\n    <ng-template ngFor let-column [ngForOf]=\"hdr.columns\" let-c=\"index\">\n      <!-- Header cell -->\n      <th *ngIf=\"!column.hidden\" ngClass=\"{{column.className || ''}}\" [colSpan]=\"column.colspan || 1\" [rowSpan]=\"column.rowspan || 1\">\n        <!-- Select all Rows Checkbox -->\n        <div class=\"text-center\">\n          <input *ngIf=\"column.selectColumn\" type=\"checkbox\" [checked]=\"allRowsSelected\" (change)=\"toggleAllRowsSelection()\">\n\n          <!-- Header cell text with sort capability (if specified) -->\n          <span [oepaTableSorting]=\"true\" [column]=\"column\" [tableId]=\"tableId\" (sortChanged)=\"onSortChanged($event)\" [id]=\"tableId+'_SortColumnLink_'+column.id\">\n            <span *ngIf=\"column.sort\"><i class=\"pull-left bi\" [ngClass]=\"{'bi-chevron-down': column.sort === 'desc', 'bi-chevron-up': column.sort === 'asc'}\"></i>\n            <sup *ngIf=\"column?.sortIndex || 0 > 1\">{{column.sortIndex}}</sup></span>\n            {{column.title}}\n          </span>\n          <!-- button to allow column to be hidden (if specified) -->\n          <button *ngIf=\"column.hidden === false\" type=\"button\" class=\"btn-close float-end\" aria-label=\"Hide\" (click)=\"hideColumn(column)\"\n            [id]=\"tableId+'_HideColumnLink'+'_'+column.id\">\n          </button>\n\n        </div>\n        <!-- column filter (if specified) -->\n        <div *ngIf=\"((rows && rows.length > 0) || !noFilters()) && column.filterable\" >\n          <input [oepaTableFiltering]=\"{ filterString: '', columnId: column.id }\" [tableId]=\"tableId\" class=\"form-control input-sm\" (tableChanged)=\"onFilterChanged($event)\"\n            [id]=\"tableId+'_FilterColumn_'+column.id\" />\n        </div>\n      </th>\n    </ng-template>\n  </tr>\n</thead>\n\n<!-- This is the table body -->\n<tbody>\n  <ng-template ngFor let-row [ngForOf]=\"rows\" let-r=\"index\">\n    <!-- Data Row -->\n    <tr>\n      <td *ngIf=\"dataHasDetails\">\n        <!-- Detail icon (if specified) -->\n        <span *ngIf=\"row.showDetail === true || row.showDetail === false\">\n          <i *ngIf=\"row.detailIconClassName\" [ngClass]=\"row.detailIconClassName\"></i>\n          <i (click)=\"toggleRowDetail(row)\" [id]=\"tableId+'_ShowDetailLink_'+r\" class=\"bi\" [ngClass]=\"{'bi-chevron-down': row.showDetail, 'bi-chevron-right': !row.showDetail}\"\n            [tooltip]=\"(row.showDetail ? 'Hide' : 'Show') + ' details for this row'\" placement=\"right\">\n          </i>\n        </span>\n      </td>\n      <!-- If row is a divider, it spans the whole table -->\n      <!-- <td *ngIf=\"row.isDivider\" [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\" [ngClass]=\"row.dividerClassName || 'oepa-table-gray'\">&nbsp;</td> -->\n      <!-- Data Rows -->\n      <ng-template *ngIf=\"!row.isDivider\" ngFor let-col [ngForOf]=\"dataColumns\" let-i=\"index\">\n        <td *ngIf=\"!col.hidden && (row|cellColspan:col) > 0\" ngClass=\"{{row|cellClassname:col || ''}}\" [colSpan]=\"row|cellColspan:col\">\n          <!-- Data Cell -->\n          <div *ngIf=\"!col.actionColumn && !col.selectColumn && !col.singleSelectColumn\">\n            <!-- Template for popover 1 -->\n            <ng-template #popoverTemplate>\n              <div *ngIf=\"row.popover\">\n                <cml-template [templateInfo]=\"row.popover.content\"></cml-template>\n              </div>\n            </ng-template>\n            <!-- Popover 1 icon (if specified) -->\n            <span *ngIf=\"row.popover && i === (row.popoverColumnIndex || 0) && row.popover\" tabindex=\"0\" [popoverTitle]=\"row.popover.title\" [popover]=\"popoverTemplate\"\n              [containerClass]=\"row.popover.containerClass\" placement=\"right\" [triggers]=\"row.popover.trigger || 'mouseenter:mouseleave'\">\n              <i [ngClass]=\"row.popover.className\" [id]=\"tableId+'_PopoverLink_'+r\"></i>\n            </span>\n\n            <!-- Template for popover 2 -->\n            <ng-template #popover2Template>\n              <div *ngIf=\"row.popover2\">\n                <cml-template [templateInfo]=\"row.popover2.content\"></cml-template>\n              </div>\n            </ng-template>\n            <!-- Popover 2 icon (if specified) -->\n            <span *ngIf=\"i === (row.popover2ColumnIndex || 0) && row.popover2\" tabindex=\"0\" [popoverTitle]=\"row.popover2.title\" [popover]=\"popover2Template\"\n              [containerClass]=\"row.popover2.containerClass\" placement=\"right\" [triggers]=\"row.popover2.trigger || 'mouseenter:mouseleave'\">\n              <i [ngClass]=\"row.popover2.className\" [id]=\"tableId+'_Popover2Link_'+r\"></i>\n            </span>\n\n            <!-- Template for popover 3 -->\n            <ng-template #popover3Template>\n              <div *ngIf=\"row.popover3\">\n                <cml-template [templateInfo]=\"row.popover3.content\"></cml-template>\n              </div>\n            </ng-template>\n            <!-- Popover 3 icon (if specified) -->\n            <span *ngIf=\"i === (row.popover3ColumnIndex || 0) && row.popover3\" tabindex=\"0\" [popoverTitle]=\"row.popover3.title\" [popover]=\"popover3Template\"\n              [containerClass]=\"row.popover3.containerClass\" placement=\"right\" [triggers]=\"row.popover3.trigger || 'mouseenter:mouseleave'\">\n              <i [ngClass]=\"row.popover3.className\" [id]=\"tableId+'_Popover3Link_'+r\"></i>\n            </span>\n\n            \n            <!-- <div *ngIf=\"row|cellInnerHTML:col\" [innerHTML]=\"row|cellInnerHTML:col\"></div>\n            <span *ngIf=\"!(row|cellInnerHTML:col)\">{{row|cellValue:col}}</span> -->\n\n            <!-- If col is hyperlink, display data as a hyperlink -->\n            <button *ngIf=\"col.hyperlink\" type=\"button\" class=\"btn btn-link\" (click)=\"cellClick(row, col.id)\" [id]=\"tableId+'_CellClick_'+r+'_'+i\">\n              <span *ngIf=\"!(row|cellInnerHTML:col)\">\n                <i [ngClass]=\"row|cellIconClassname:col\"></i>\n                <span *ngIf=\"row|cellImgSrc:col\"><img [src]=\"row|cellImgSrc:col\"/></span>\n                {{row|cellValue:col}}\n              </span>\n              <div *ngIf=\"row|cellInnerHTML:col\" [innerHTML]=\"row|cellInnerHTML:col\"></div>\n            </button>\n            <!-- If col is NOT hyperlink, just display data -->\n            <span *ngIf=\"!col.hyperlink\">\n              <span *ngIf=\"!(row|cellInnerHTML:col)\">\n                <i ngClass=\"{{row|cellIconClassname:col || ''}}\"></i>\n                <span *ngIf=\"row|cellImgSrc:col\"><img [src]=\"row|cellImgSrc:col\"/></span>\n                {{row|cellValue:col}}\n              </span>\n              <div *ngIf=\"row|cellInnerHTML:col\" [innerHTML]=\"row|cellInnerHTML:col\"></div>\n            </span>\n          </div>\n          <!-- Select Cell -->\n          <div *ngIf=\"col.selectColumn\" class=\"text-center\">\n            <input [id]=\"tableId+'_'+r\" type=\"checkbox\" [disabled]=\"!row.selectable\" [checked]=\"row.selected\" (change)=\"toggleRowSelection(row)\">\n          </div>\n          <!-- Single Select Cell -->\n          <div *ngIf=\"col.singleSelectColumn\" class=\"text-center\">\n            <input [id]=\"tableId+'_singleSelect_'+r\" type=\"radio\" [disabled]=\"!row.selectable\" [checked]=\"row.selected\" (change)=\"singleRowSelection(row)\">\n          </div>\n          <!-- Action Button Cell -->\n          <div *ngIf=\"col.actionColumn && row.actions\">\n            <oepa-action-btn [actions]=\"row.actions\" [data]=\"row.dataSource\"  (actionClicked)=\"onActionClick($event)\" [btnId]=\"tableId+'_'+r\"></oepa-action-btn>\n          </div>\n        </td>\n      </ng-template>\n    </tr>\n\n    <!-- Detail Row -->\n    <tr *ngIf=\"row.showDetail\" class=\"table-info\">\n      <td [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\">\n        <cml-template [templateInfo]=\"row.detail\"></cml-template>\n      </td>\n    </tr>\n  </ng-template>\n  <tr *ngIf=\"totalRow\">\n    <td *ngIf=\"dataHasDetails\">\n    </td>\n      <ng-template ngFor let-totalCol [ngForOf]=\"dataColumns\">\n          <td *ngIf=\"!totalCol.hidden\" ngClass=\"{{totalRow|cellClassname:totalCol || ''}}\">\n            <div>\n               <span><i ngClass=\"{{totalRow|cellIconClassname:totalCol || ''}}\"></i>{{totalRow|cellValue:totalCol}}</span>\n            </div>\n          </td>\n      </ng-template>\n  </tr>\n</tbody>\n</table>\n</div>\n<!-- Table footer -->\n<form *ngIf=\"!config.hideFooter || (data && pageInfo.itemsPerPage < data.length)\" class=\"form-horizontal\">\n<div class=\"form-group row text-right\">\n  <!-- Table-wide filter -->\n  <div class=\"col-sm-4\">\n    <div class=\"row\">\n      <div class=\"col-sm-6\">\n        <input *ngIf=\"!config.hideGlobalFilter\" placeholder=\"Filter all columns\" [oepaTableFiltering]=\"{ filterString: '' }\" [tableId]=\"tableId\" class=\"form-control input-sm\" (tableChanged)=\"onFilterChanged($event)\"\n          [id]=\"tableId+'_FilterAllColumnsInput'\" />\n      </div>\n      <div class=\"col-sm-6\">\n        <span *ngIf=\"config.showRowCountInFooter && _data && _data.length > 0\">\n          <span class=\"badge badge-secondary\" style=\"color: #999\">{{_data.length}}</span>&nbsp;total rows\n        </span>\n      </div>\n    </div>\n  </div>\n  <!-- Export Buttons -->\n  <div class=\"col-sm-4 d-flex justify-content-center\">\n    <div class=\"row\">\n      <div class=\"col-sm-12 text-center\">\n        <button type=\"button\" *ngIf=\"config.exportToExcel\" class=\"btn btn-primary mr-1\" (click)=\"exportToExcel()\" [id]=\"tableId+'_ExportToExcelBtn'\">Export to Excel</button>\n        <button type=\"button\" *ngIf=\"config.exportToHTML\" class=\"btn btn-primary mr-1\" (click)=\"exportToHTML()\" [id]=\"tableId+'_ExportToHTMLBtn'\">Export to HTML</button>\n        <button *ngIf=\"customBtnVisible\" type=\"button\" class=\"btn btn-primary mr-1\" (click)=\"onCustomBtnClick()\" [id]=\"tableId+'_CustomBtn'\" [disabled]=\"!customBtnEnabled\">{{customBtnLabel}}</button>\n      </div>\n      <div *ngIf=\"config.exportToExcel || config.exportToHTML\" class=\"col-sm-12 text-center\">\n        <span>Export only visible data:&nbsp;\n          <input type=\"checkbox\" [checked]=\"exportVisibleOnly\" (click)=\"toggleExportVisibleOnly()\" id=\"exportVisibleOnlyCheckbox\"/>\n        </span>\n      </div>\n    </div>\n  </div>\n  <!-- Pagination -->\n  <div *ngIf=\"!config.disablePagination\" class=\"col-sm-4 d-flex justify-content-end\">\n    <pagination *ngIf=\"paginationOn\" class=\"pagination-sm\" [totalItems]=\"pageInfo.length\" [itemsPerPage]=\"pageInfo.itemsPerPage\" [maxSize]=\"pageInfo.maxSize\"\n      [(ngModel)]=\"currentPage\" name=\"currentTablePage\"\n      [boundaryLinks]=\"true\" [rotate]=\"false\" (pageChanged)=\"onPageChanged($event)\" (numPages)=\"pageInfo.numPages = $event\">\n    </pagination>\n    &nbsp;\n    <button (click)=\"togglePagingation()\" type=\"button\" class=\"btn btn-default btn-sm mr-1\">{{ paginationOn ? 'Show All Rows' : 'Restore Pagination'}}</button>\n  </div>\n</div>\n</form>", styles: [".pagination{margin:0}th.oepa-table-header-center{text-align:center}.oepa-table-bold{font-weight:700}.oepa-table-italic{font-style:italic}.oepa-table-line-through{text-decoration:line-through}.oepa-table-gray{background-color:#ddd}td.oepa-undeline-cell{border-bottom:1pt solid black}.detail-indicator-col{width:30px}.action-btn-col{width:90px}.select-col{width:20px}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.DomSanitizer }, { type: TableService }, { type: TableExportService }, { type: i1$1.OepaFileUtilService }], propDecorators: { tableId: [{
+        }], ctorParameters: () => [{ type: i1$3.DomSanitizer }, { type: TableService }, { type: TableExportService }, { type: OepaFileUtilService }], propDecorators: { tableId: [{
                 type: Input
             }], config: [{
                 type: Input
@@ -1932,10 +2169,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Output
             }] } });
 
+class AccountSearchService {
+    http;
+    ebizRootURL;
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.ebizRootURL = ebizRootURL;
+    }
+    searchAccountsFromDB(searchURL, filter) {
+        const headers = new HttpHeaders();
+        headers.append('Content-Type', 'application/json');
+        const url = this.ebizRootURL + searchURL;
+        console.log('URL: ' + url);
+        return this.http.post(url, filter, { headers: headers, responseType: 'json' });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
 class AccountSearchModalComponent {
     fb;
     bsModalRef;
-    http;
+    accountSearchService;
     modalFormGroup;
     errorMessage;
     inProgressMsg;
@@ -1950,10 +2214,10 @@ class AccountSearchModalComponent {
     };
     searchURL = '/ebiz/api/v1/accounts/revenuesSearch';
     onAccountSelected = new EventEmitter();
-    constructor(fb, bsModalRef, http) {
+    constructor(fb, bsModalRef, accountSearchService) {
         this.fb = fb;
         this.bsModalRef = bsModalRef;
-        this.http = http;
+        this.accountSearchService = accountSearchService;
     }
     ngOnInit() {
         this.createForm();
@@ -1997,7 +2261,7 @@ class AccountSearchModalComponent {
         this.inProgressMsg = 'Searching...';
         this.tableData = [];
         this.buildTableHeader();
-        this.searchAccountsFromDB(filter).subscribe({
+        this.accountSearchService.searchAccountsFromDB(this.searchURL, filter).subscribe({
             next: accounts => {
                 this.inProgressMsg = undefined;
                 if (accounts && accounts.length > 0) {
@@ -2054,20 +2318,13 @@ class AccountSearchModalComponent {
         this.onAccountSelected.emit(this.selectedAccount);
         this.bsModalRef.hide();
     }
-    searchAccountsFromDB(filter) {
-        const headers = new HttpHeaders();
-        headers.append('Content-Type', 'application/json');
-        const url = this.searchURL;
-        console.log('URL: ' + url);
-        return this.http.post(url, filter, { headers: headers, responseType: 'json' });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchModalComponent, deps: [{ token: i1$2.FormBuilder }, { token: i2$1.BsModalRef }, { token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchModalComponent, deps: [{ token: i1$2.FormBuilder }, { token: i2$1.BsModalRef }, { token: AccountSearchService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AccountSearchModalComponent, selector: "oepa-account-search-modal", inputs: { searchURL: "searchURL" }, outputs: { onAccountSelected: "onAccountSelected" }, ngImport: i0, template: "<div class=\"modal-header\">\n    <h4 class=\"modal-title pull-left\">Advanced Ebiz Account Search</h4>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"bsModalRef.hide()\">\n    </button>\n</div>\n<div class=\"modal-body\">\n        <accordion>\n            <accordion-group panelClass=\"panel-info\" #searchGroup [isOpen]=\"openSearchCriteria\">\n                <div accordion-heading>\n                    <div class=\"row\">\n                        <div class=\"col-sm-6\">\n                            <i class=\"float-xs-right bi\" id=\"accountSearchCriteria\" name=\"accountSearchCriteria\" \n                            [ngClass]=\"{'bi-chevron-down': searchGroup?.isOpen, 'bi-chevron-right': !searchGroup?.isOpen}\"></i>\n                                <b>Ebiz Account Search Criteria</b>\n                        </div>\n                    </div>\n                </div>\n                <form [formGroup]=\"modalFormGroup\">\n                <div class=\"row\">\n                    <div class=\"col-md-12\">\n                        <div class=\"form-group\">\n                            <label>Ebiz User ID</label>\n                            <input type=\"search\" class=\"form-control\" id=\"userUIDInput\" formControlName=\"userID\">\n                        </div>\n                    </div>\n                    <div class=\"col-md-12\">\n                        <div class=\"form-group\">\n                            <label>First Name</label>\n                            <input type=\"search\" class=\"form-control\" id=\"firstNameInput\" formControlName=\"firstName\">\n                        </div>\n                    </div>\n                    <div class=\"col-md-12\">\n                        <div class=\"form-group\">\n                            <label>Last Name</label>\n                            <input type=\"search\" class=\"form-control\" id=\"lastNameInput\" formControlName=\"lastName\">\n                        </div>\n                    </div>\n                </div>\n                \n                <div class=\"row\">\n                    <div class=\"col-sm-12 text-center\">\n                        <span *ngIf=\"inProgressMsg\" class=\"spinner-border text-primary\" role=\"status\"></span>\n                        <button *ngIf=\"!inProgressMsg\" type=\"submit\" class=\"btn btn-primary mr-2\" id=\"submitSearchBtn\" (click)=\"submitSearch()\">Search</button>\n                        <button id=\"resetSearchBtn\" type=\"button\" class=\"btn btn-primary\" (click)=\"resetSearch()\">Reset</button>\n                    </div>\n                </div>\n            </form>\n            </accordion-group>\n        </accordion>\n    <div *ngIf=\"tableData && tableData.length > 0\" class=\"card\">\n        <div class=\"card-header\">\n            <b>Ebiz Account List&nbsp;</b><span class=\"badge bg-secondary\">{{tableData.length}}</span>\n        </div>\n        <div class=\"card-body\" *ngIf=\"tableHeader\">\n            <oepa-table tableId=\"accountSearchTable\" [config]=\"tableConfig\" [data]=\"tableData\" [header]=\"tableHeader\" (rowSelected)=\"onRowSelect($event)\">\n            </oepa-table>\n        </div>\n    </div>\n</div>\n<div class=\"modal-footer d-block\">\n    <div *ngIf=\"errorMessage\">\n        <div class=\"alert alert-danger\">\n            {{errorMessage}}\n        </div>\n    </div>\n    <div *ngIf=\"inProgressMsg\">\n        <div class=\"alert alert-info\">\n            {{inProgressMsg}}\n        </div>\n    </div>\n    <div class=\"row\">\n        <div class=\"col-sm-12 text-center\">\n            <button type=\"button\" class=\"btn btn-primary mr-2\"\n                id=\"SaveAccountBtn\"\n                [disabled]=\"!selectedAccount || inProgressMsg\"\n                (click)=\"save()\">Save</button>\n            <button id=\"CancelPaymentBtn\" type=\"button\" class=\"btn btn-primary\"\n                (click)=\"bsModalRef.hide()\">Cancel</button>\n        </div>\n    </div>\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i6.AccordionComponent, selector: "accordion", inputs: ["isAnimated", "closeOthers"] }, { kind: "component", type: i6.AccordionPanelComponent, selector: "accordion-group, accordion-panel", inputs: ["heading", "panelClass", "isDisabled", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: TableComponent, selector: "oepa-table", inputs: ["tableId", "config", "complexHeader", "header", "customBtnLabel", "customBtnVisible", "customBtnEnabled", "data", "totalRow"], outputs: ["cellClicked", "actionClicked", "rowSelected", "customBtnClicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-account-search-modal', template: "<div class=\"modal-header\">\n    <h4 class=\"modal-title pull-left\">Advanced Ebiz Account Search</h4>\n    <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"bsModalRef.hide()\">\n    </button>\n</div>\n<div class=\"modal-body\">\n        <accordion>\n            <accordion-group panelClass=\"panel-info\" #searchGroup [isOpen]=\"openSearchCriteria\">\n                <div accordion-heading>\n                    <div class=\"row\">\n                        <div class=\"col-sm-6\">\n                            <i class=\"float-xs-right bi\" id=\"accountSearchCriteria\" name=\"accountSearchCriteria\" \n                            [ngClass]=\"{'bi-chevron-down': searchGroup?.isOpen, 'bi-chevron-right': !searchGroup?.isOpen}\"></i>\n                                <b>Ebiz Account Search Criteria</b>\n                        </div>\n                    </div>\n                </div>\n                <form [formGroup]=\"modalFormGroup\">\n                <div class=\"row\">\n                    <div class=\"col-md-12\">\n                        <div class=\"form-group\">\n                            <label>Ebiz User ID</label>\n                            <input type=\"search\" class=\"form-control\" id=\"userUIDInput\" formControlName=\"userID\">\n                        </div>\n                    </div>\n                    <div class=\"col-md-12\">\n                        <div class=\"form-group\">\n                            <label>First Name</label>\n                            <input type=\"search\" class=\"form-control\" id=\"firstNameInput\" formControlName=\"firstName\">\n                        </div>\n                    </div>\n                    <div class=\"col-md-12\">\n                        <div class=\"form-group\">\n                            <label>Last Name</label>\n                            <input type=\"search\" class=\"form-control\" id=\"lastNameInput\" formControlName=\"lastName\">\n                        </div>\n                    </div>\n                </div>\n                \n                <div class=\"row\">\n                    <div class=\"col-sm-12 text-center\">\n                        <span *ngIf=\"inProgressMsg\" class=\"spinner-border text-primary\" role=\"status\"></span>\n                        <button *ngIf=\"!inProgressMsg\" type=\"submit\" class=\"btn btn-primary mr-2\" id=\"submitSearchBtn\" (click)=\"submitSearch()\">Search</button>\n                        <button id=\"resetSearchBtn\" type=\"button\" class=\"btn btn-primary\" (click)=\"resetSearch()\">Reset</button>\n                    </div>\n                </div>\n            </form>\n            </accordion-group>\n        </accordion>\n    <div *ngIf=\"tableData && tableData.length > 0\" class=\"card\">\n        <div class=\"card-header\">\n            <b>Ebiz Account List&nbsp;</b><span class=\"badge bg-secondary\">{{tableData.length}}</span>\n        </div>\n        <div class=\"card-body\" *ngIf=\"tableHeader\">\n            <oepa-table tableId=\"accountSearchTable\" [config]=\"tableConfig\" [data]=\"tableData\" [header]=\"tableHeader\" (rowSelected)=\"onRowSelect($event)\">\n            </oepa-table>\n        </div>\n    </div>\n</div>\n<div class=\"modal-footer d-block\">\n    <div *ngIf=\"errorMessage\">\n        <div class=\"alert alert-danger\">\n            {{errorMessage}}\n        </div>\n    </div>\n    <div *ngIf=\"inProgressMsg\">\n        <div class=\"alert alert-info\">\n            {{inProgressMsg}}\n        </div>\n    </div>\n    <div class=\"row\">\n        <div class=\"col-sm-12 text-center\">\n            <button type=\"button\" class=\"btn btn-primary mr-2\"\n                id=\"SaveAccountBtn\"\n                [disabled]=\"!selectedAccount || inProgressMsg\"\n                (click)=\"save()\">Save</button>\n            <button id=\"CancelPaymentBtn\" type=\"button\" class=\"btn btn-primary\"\n                (click)=\"bsModalRef.hide()\">Cancel</button>\n        </div>\n    </div>\n</div>" }]
-        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: i2$1.BsModalRef }, { type: i1.HttpClient }], propDecorators: { searchURL: [{
+        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: i2$1.BsModalRef }, { type: AccountSearchService }], propDecorators: { searchURL: [{
                 type: Input,
                 args: ['searchURL']
             }], onAccountSelected: [{
@@ -2077,7 +2334,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 class AccountSearchInputComponent {
     idService;
     modalService;
-    http;
+    accountSearchService;
     nameSearch = '';
     nameSource;
     componentId;
@@ -2091,10 +2348,10 @@ class AccountSearchInputComponent {
     errorMessageAddendum = '';
     rowLayout = false;
     accountSelected = new EventEmitter();
-    constructor(idService, modalService, http) {
+    constructor(idService, modalService, accountSearchService) {
         this.idService = idService;
         this.modalService = modalService;
-        this.http = http;
+        this.accountSearchService = accountSearchService;
         this.nameSource = new Observable((observer) => {
             observer.next(this.group.get(this.field)?.value);
         }).pipe(mergeMap((token) => this.searchAccounts(token)));
@@ -2106,7 +2363,7 @@ class AccountSearchInputComponent {
                 userID: this.userID
             };
             this.searching = true;
-            this.searchAccountsFromDB(filter).subscribe({
+            this.accountSearchService.searchAccountsFromDB(this.searchURL, filter).subscribe({
                 next: accountList => {
                     if (accountList && accountList.length == 1) {
                         this.loadAccountInForm(accountList[0]);
@@ -2154,18 +2411,11 @@ class AccountSearchInputComponent {
         const filter = {
             userID: token
         };
-        return this.searchAccountsFromDB(filter).pipe(map((accounts) => {
+        return this.accountSearchService.searchAccountsFromDB(this.searchURL, filter).pipe(map((accounts) => {
             this.searching = false;
             return accounts;
         }));
     }
-    searchAccountsFromDB(filter) {
-        const headers = new HttpHeaders();
-        headers.append('Content-Type', 'application/json');
-        const url = this.searchURL;
-        console.log('URL: ' + url);
-        return this.http.post(url, filter, { headers: headers, responseType: 'json' });
-    }
     advancedSearch() {
         console.log('URL: ' + this.searchURL);
         const initialState = {
@@ -2177,13 +2427,13 @@ class AccountSearchInputComponent {
             this.accountSelected.emit(account);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchInputComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: i2$1.BsModalService }, { token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchInputComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: i2$1.BsModalService }, { token: AccountSearchService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AccountSearchInputComponent, selector: "oepa-account-search-input", inputs: { group: "group", userID: "userID", field: "field", title: "title", searchURL: "searchURL", errorMessageAddendum: "errorMessageAddendum", rowLayout: "rowLayout" }, outputs: { accountSelected: "accountSelected" }, ngImport: i0, template: "<div [formGroup]=\"group\" class=\"form-group\" [ngClass]=\"{'row text-right': rowLayout}\">\n    <ng-template #accountTemplate let-model=\"item\" let-index=\"index\">\n        <h5>{{ (model.userID || '') +\n            (' - ' + model.firstName + ' ' + model.lastName + (model.company ? ' (' + model.company + ')' : '')) }}</h5>\n    </ng-template>\n    <label [ngClass]=\"{'col-sm-4 col-form-label': rowLayout}\">\n        {{title}}\n        <span *ngIf=\"searching\" class=\"spinner-border text-primary\" role=\"status\"></span>\n        <a id=\"AdvancedSearch\" href=\"javascript:void(0)\" (click)=\"advancedSearch()\">Advanced Search</a>\n    </label>\n    <div [ngClass]=\"{'col-sm-8': rowLayout}\">\n        <input class=\"form-control\" type=\"search\"\n            [ngClass]=\"{'is-invalid':group.controls[field].status === 'INVALID', 'col-sm-8': rowLayout}\"\n            [formControlName]=\"field\" [typeahead]=\"nameSource\" [typeaheadScrollable]=\"true\"\n            (typeaheadOnSelect)=\"onAccountSelect($event)\" [id]=\"componentId + '_AccountSearch'\"\n            [typeaheadItemTemplate]=\"accountTemplate\" [typeaheadMinLength]=\"3\" placeholder=\"Search Account\">\n        <small class=\"invalid-feedback\" *ngIf=\"group.controls[field]?.hasError('required')\">{{title}} is required\n            {{errorMessageAddendum}}</small>\n    </div>\n</div>\n<div *ngIf=\"errorMessage\" class=\"alert alert-danger\">\n    {{errorMessage}}\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i6$1.TypeaheadDirective, selector: "[typeahead]", inputs: ["typeahead", "typeaheadMinLength", "adaptivePosition", "isAnimated", "typeaheadWaitMs", "typeaheadOptionsLimit", "typeaheadOptionField", "typeaheadGroupField", "typeaheadOrderBy", "typeaheadAsync", "typeaheadLatinize", "typeaheadSingleWords", "typeaheadWordDelimiters", "typeaheadMultipleSearch", "typeaheadMultipleSearchDelimiters", "typeaheadPhraseDelimiters", "typeaheadItemTemplate", "optionsListTemplate", "typeaheadScrollable", "typeaheadOptionsInScrollableView", "typeaheadHideResultsOnBlur", "typeaheadSelectFirstItem", "typeaheadIsFirstItemActive", "container", "dropup"], outputs: ["typeaheadLoading", "typeaheadNoResults", "typeaheadOnSelect", "typeaheadOnPreview", "typeaheadOnBlur"], exportAs: ["bs-typeahead"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountSearchInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-account-search-input', template: "<div [formGroup]=\"group\" class=\"form-group\" [ngClass]=\"{'row text-right': rowLayout}\">\n    <ng-template #accountTemplate let-model=\"item\" let-index=\"index\">\n        <h5>{{ (model.userID || '') +\n            (' - ' + model.firstName + ' ' + model.lastName + (model.company ? ' (' + model.company + ')' : '')) }}</h5>\n    </ng-template>\n    <label [ngClass]=\"{'col-sm-4 col-form-label': rowLayout}\">\n        {{title}}\n        <span *ngIf=\"searching\" class=\"spinner-border text-primary\" role=\"status\"></span>\n        <a id=\"AdvancedSearch\" href=\"javascript:void(0)\" (click)=\"advancedSearch()\">Advanced Search</a>\n    </label>\n    <div [ngClass]=\"{'col-sm-8': rowLayout}\">\n        <input class=\"form-control\" type=\"search\"\n            [ngClass]=\"{'is-invalid':group.controls[field].status === 'INVALID', 'col-sm-8': rowLayout}\"\n            [formControlName]=\"field\" [typeahead]=\"nameSource\" [typeaheadScrollable]=\"true\"\n            (typeaheadOnSelect)=\"onAccountSelect($event)\" [id]=\"componentId + '_AccountSearch'\"\n            [typeaheadItemTemplate]=\"accountTemplate\" [typeaheadMinLength]=\"3\" placeholder=\"Search Account\">\n        <small class=\"invalid-feedback\" *ngIf=\"group.controls[field]?.hasError('required')\">{{title}} is required\n            {{errorMessageAddendum}}</small>\n    </div>\n</div>\n<div *ngIf=\"errorMessage\" class=\"alert alert-danger\">\n    {{errorMessage}}\n</div>" }]
-        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: i2$1.BsModalService }, { type: i1.HttpClient }], propDecorators: { group: [{
+        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: i2$1.BsModalService }, { type: AccountSearchService }], propDecorators: { group: [{
                 type: Input,
                 args: ['group']
             }], userID: [{
@@ -3114,13 +3364,13 @@ class PTableComponent {
     onCustomBtn2Click() {
         this.customBtn2Clicked.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PTableComponent, deps: [{ token: i1$3.DomSanitizer }, { token: TableService }, { token: TableExportService }, { token: i1$1.OepaFileUtilService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PTableComponent, deps: [{ token: i1$3.DomSanitizer }, { token: TableService }, { token: TableExportService }, { token: OepaFileUtilService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PTableComponent, selector: "oepa-p-table", inputs: { tableId: "tableId", allowEdit: "allowEdit", config: "config", complexHeader: "complexHeader", header: "header", customBtnLabel: "customBtnLabel", customBtnVisible: "customBtnVisible", customBtnEnabled: "customBtnEnabled", customBtnLabel2: "customBtnLabel2", customBtnVisible2: "customBtnVisible2", customBtnEnabled2: "customBtnEnabled2", small: "small", data: "data", totalRow: "totalRow" }, outputs: { cellClicked: "cellClicked", actionClicked: "actionClicked", rowSelected: "rowSelected", customBtnClicked: "customBtnClicked", customBtn2Clicked: "customBtn2Clicked" }, ngImport: i0, template: "<div *ngIf=\"!config.hideTable\">\n  <form *ngIf=\"hiddenColumns.length > 0\">\n    <div class=\"row mb-2\">\n      <label class=\"col-sm-2 col-form-label\">Show Hidden Columns:</label>\n      <div class=\"col-sm-4\">\n        <select class=\"form-select\" (change)=\"unhideColumn($any($event).target.value)\"\n          [id]=\"tableId+'_UnhideColumnSelect'\">\n          <option value=\"\">Choose a column</option>\n          <option *ngFor=\"let col of hiddenColumns\" [value]=\"col.id\">{{col.title}}</option>\n        </select>\n      </div>\n    </div>\n  </form>\n\n  <div ngClass=\"{{config.divClassName || ''}}\">\n    <p-table [columns]=\"visibleColumns\" [value]=\"rows\" \n      [scrollable]=\"config.verticalScroll\" [scrollHeight]=\"config.scrollHeight\"\n      [tableStyle]=\"{'min-width': '50rem'}\">\n      <ng-template pTemplate=\"header\" let-columns>\n        <tr *ngFor=\"let hdr of headerRows; let hr=index;\" role=\"row\">\n          <th *ngIf=\"dataHasDetails && hr === 0\" [rowSpan]=\"headerRows.length\" class=\"detail-indicator-col\">\n            <span>\n              <i (click)=\"toggleAllDetails()\" [id]=\"tableId+'_ShowAllDetailsLink'\" class=\"bi\"\n                [ngClass]=\"{'bi-chevron-down': showAllDetails, 'bi-chevron-right': !showAllDetails}\"\n                [tooltip]=\"(showAllDetails ? 'Hide' : 'Show') + ' details for all rows'\" placement=\"right\">\n              </i>\n            </span>\n          </th>\n          <ng-template ngFor let-col [ngForOf]=\"hdr.columns\" let-i=\"index\">\n            <th *ngIf=\"!col.hidden && col.frozenColumn\" pFrozenColumn ngClass=\"{{col.className || ''}}\"\n              [colSpan]=\"col.colspan || 1\" [rowSpan]=\"col.rowspan || 1\">\n              <oepa-table-header-cell [column]=\"col\" [tableId]=\"tableId\" [allRowsSelected]=\"allRowsSelected\"\n                [rowCount]=\"rows.length\" [noFiltersSubject]=\"noFiltersSubject\"\n                (onToggleAllRowsSelection)=\"toggleAllRowsSelection()\" (onSortChanged)=\"onSortChanged($event)\"\n                (onHideColumn)=\"hideColumn($event)\" (onFilterChanged)=\"onFilterChanged($event)\">\n              </oepa-table-header-cell>\n            </th>\n            <th *ngIf=\"!col.hidden && !col.frozenColumn\" ngClass=\"{{col.className || ''}}\"\n              [colSpan]=\"col.colspan || 1\" [rowSpan]=\"col.rowspan || 1\">\n              <oepa-table-header-cell [column]=\"col\" [tableId]=\"tableId\" [allRowsSelected]=\"allRowsSelected\"\n                [rowCount]=\"rows.length\" [noFiltersSubject]=\"noFiltersSubject\"\n                (onToggleAllRowsSelection)=\"toggleAllRowsSelection()\" (onSortChanged)=\"onSortChanged($event)\"\n                (onHideColumn)=\"hideColumn($event)\" (onFilterChanged)=\"onFilterChanged($event)\">\n              </oepa-table-header-cell>\n            </th>\n          </ng-template>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-row let-r=\"rowIndex\" let-columns=\"columns\">\n        <!-- Data Row -->\n        <tr>\n          <td *ngIf=\"dataHasDetails\">\n            <!-- Detail icon (if specified) -->\n            <span *ngIf=\"row.showDetail === true || row.showDetail === false\">\n              <i *ngIf=\"row.detailIconClassName\" [ngClass]=\"row.detailIconClassName\"></i>\n              <i (click)=\"toggleRowDetail(row)\" [id]=\"tableId+'_ShowDetailLink_'+r\" class=\"bi\"\n                [ngClass]=\"{'bi-chevron-down': row.showDetail, 'bi-chevron-right': !row.showDetail}\"\n                [tooltip]=\"(row.showDetail ? 'Hide' : 'Show') + ' details for this row'\" placement=\"right\">\n              </i>\n            </span>\n          </td>\n          <!-- If row is a divider, it spans the whole table -->\n          <td *ngIf=\"row.isDivider\" [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\"\n            [ngClass]=\"row.dividerClassName || 'oepa-table-gray'\">&nbsp;</td>\n          <!-- Data Rows -->\n          <ng-template *ngIf=\"!row.isDivider\" ngFor let-col [ngForOf]=\"dataColumns\" let-i=\"index\">\n            <td *ngIf=\"!col.hidden && (row|cellColspan:col) > 0 &&!col.frozenColumn\"\n              ngClass=\"{{row|cellClassname:col || ''}}\" [colSpan]=\"row|cellColspan:col\">\n              <oepa-table-data-cell [col]=\"col\" [i]=\"i\" [row]=\"row\" [r]=\"r\" [tableId]=\"tableId\"\n                (onActionClick)=\"onActionClick($event)\" (onCellClick)=\"cellClick($event)\"\n                (onToggleRowSelection)=\"toggleRowSelection($event)\"\n                (onSingleRowSelection)=\"singleRowSelection($event)\"></oepa-table-data-cell>\n            </td>\n            <td *ngIf=\"!col.hidden && (row|cellColspan:col) > 0 &&col.frozenColumn\" pFrozenColumn\n              ngClass=\"{{row|cellClassname:col || ''}}\" [colSpan]=\"row|cellColspan:col\">\n              <oepa-table-data-cell [col]=\"col\" [i]=\"i\" [row]=\"row\" [r]=\"r\" [tableId]=\"tableId\"\n                (onActionClick)=\"onActionClick($event)\" (onCellClick)=\"cellClick($event)\"\n                (onToggleRowSelection)=\"toggleRowSelection($event)\"\n                (onSingleRowSelection)=\"singleRowSelection($event)\"></oepa-table-data-cell>\n            </td>\n          </ng-template>\n        </tr>\n\n        <!-- Detail Row -->\n        <tr *ngIf=\"row.showDetail\" class=\"table-info\">\n          <td [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\">\n            <cml-template [templateInfo]=\"row.detail\"></cml-template>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n  </div>\n  <!-- Table footer -->\n  <form *ngIf=\"!config.hideFooter || (data && pageInfo.itemsPerPage < data.length)\" class=\"form-horizontal\">\n    <div class=\"form-group row\">\n      <!-- Table-wide filter -->\n      <div class=\"col-sm-5\">\n        <div class=\"row\">\n          <div class=\"col-sm-6\">\n            <input *ngIf=\"!config.hideGlobalFilter\" placeholder=\"Filter all columns\"\n              [oepaTableFiltering]=\"{ filterString: '' }\" [tableId]=\"tableId\" class=\"form-control input-sm\"\n              (tableChanged)=\"onFilterChanged($event)\" [id]=\"tableId+'_FilterAllColumnsInput'\" />\n          </div>\n          <div class=\"col-sm-6\">\n            <span *ngIf=\"config.showRowCountInFooter && _data && _data.length > 0\">\n              <span class=\"badge bg-secondary\">{{_data.length}}</span>&nbsp;total rows\n            </span>\n          </div>\n        </div>\n      </div>\n      <!-- Export Buttons -->\n      <div class=\"col-sm-2 d-flex justify-content-center\">\n        <div class=\"row\">\n          <div class=\"col-sm-12 text-center\" *ngIf=\"allowEdit\">\n            <div *ngIf=\"config.exportToExcel || config.exportToHTML\" class=\"btn-group\" dropdown>\n              <button id=\"exportBtn\" dropdownToggle type=\"button\" class=\"btn btn-primary dropdown-toggle\"\n                aria-controls=\"dropdown-basic\">\n                Export <span class=\"caret\"></span>\n                <ul id=\"export-dropdown\" *dropdownMenu class=\"dropdown-menu\">\n                  <li *ngIf=\"config.exportToExcel\" role=\"menuitem\"><a class=\"dropdown-item\"\n                      (click)=\"exportToExcel()\">Export to Excel</a></li>\n                  <li *ngIf=\"config.exportToHTML\" role=\"menuitem\"><a class=\"dropdown-item\"\n                      (click)=\"exportToHTML()\">Export\n                      to HTML</a></li>\n                </ul>\n              </button>\n            </div>\n            <button *ngIf=\"customBtnVisible\" type=\"button\"\n              ngClass=\"{{'btn btn-primary me-1' + (small ? ' btn-sm' : '')}}\" (click)=\"onCustomBtnClick()\"\n              [id]=\"tableId+'_CustomBtn'\" [disabled]=\"!customBtnEnabled\">{{customBtnLabel}}</button>\n            <button *ngIf=\"customBtnVisible2\" type=\"button\"\n              ngClass=\"{{'btn btn-primary me-1' + (small ? ' btn-sm' : '')}}\" (click)=\"onCustomBtn2Click()\"\n              [id]=\"tableId+'_CustomBtn'\" [disabled]=\"!customBtnEnabled2\">{{customBtnLabel2}}</button>\n          </div>\n        </div>\n      </div>\n      <!-- Pagination -->\n      <div *ngIf=\"!config.disablePagination\" class=\"col-sm-5\">\n        <div class=\"row\">\n          <div class=\"col-sm-9\">\n            <pagination *ngIf=\"paginationOn\" class=\"pagination-sm\" [totalItems]=\"pageInfo.length\"\n              [itemsPerPage]=\"pageInfo.itemsPerPage\" [maxSize]=\"pageInfo.maxSize\" [(ngModel)]=\"currentPage\"\n              name=\"currentTablePage\" [boundaryLinks]=\"true\" [rotate]=\"false\" (pageChanged)=\"onPageChanged($event)\"\n              (numPages)=\"pageInfo.numPages = $event\">\n            </pagination>\n          </div>\n          <div class=\"col-sm-3\">\n            <button (click)=\"togglePagingation()\" type=\"button\" class=\"btn btn-default btn-sm me-1\">{{ paginationOn ?\n              'Show All Rows' : 'Restore Pagination'}}</button>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"config.exportToExcel || config.exportToHTML\" class=\"col-sm-12 text-center\">\n        <span>Export only visible data:&nbsp;\n          <input type=\"checkbox\" [checked]=\"exportVisibleOnly\" (click)=\"toggleExportVisibleOnly()\"\n            id=\"exportVisibleOnlyCheckbox\" />\n        </span>\n      </div>\n    </div>\n  </form>\n</div>", styles: [".pagination{margin:0}th.oepa-table-header-center{text-align:center}.oepa-table-bold{font-weight:700}.oepa-table-italic{font-style:italic}.oepa-table-line-through{text-decoration:line-through}.oepa-table-gray{background-color:#ddd}td.oepa-undeline-cell{border-bottom:1pt solid black}.detail-indicator-col{width:30px}.action-btn-col{width:90px}.select-col{width:20px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i7$1.PaginationComponent, selector: "pagination", inputs: ["align", "maxSize", "boundaryLinks", "directionLinks", "firstText", "previousText", "nextText", "lastText", "rotate", "pageBtnClass", "disabled", "customPageTemplate", "customNextTemplate", "customPreviousTemplate", "customFirstTemplate", "customLastTemplate", "itemsPerPage", "totalItems"], outputs: ["numPages", "pageChanged"] }, { kind: "directive", type: i9.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "directive", type: i3.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i3.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i3.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i11.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i10.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "component", type: i1$1.OepaTemplateComponent, selector: "cml-template", inputs: ["templateInfo"] }, { kind: "component", type: TableDataCellComponent, selector: "oepa-table-data-cell", inputs: ["col", "row", "i", "r", "tableId"], outputs: ["onCellClick", "onToggleRowSelection", "onSingleRowSelection", "onActionClick"] }, { kind: "component", type: TableHeaderCellComponent, selector: "oepa-table-header-cell", inputs: ["column", "tableId", "allRowsSelected", "rowCount", "noFiltersSubject"], outputs: ["onToggleAllRowsSelection", "onSortChanged", "onHideColumn", "onFilterChanged"] }, { kind: "directive", type: OepaTableFilteringDirective, selector: "[oepaTableFiltering]", inputs: ["oepaTableFiltering", "tableId"], outputs: ["tableChanged"] }, { kind: "pipe", type: OepaTableCellColSpanPipe, name: "cellColspan" }, { kind: "pipe", type: OepaTableCellClassnamePipe, name: "cellClassname" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-p-table', template: "<div *ngIf=\"!config.hideTable\">\n  <form *ngIf=\"hiddenColumns.length > 0\">\n    <div class=\"row mb-2\">\n      <label class=\"col-sm-2 col-form-label\">Show Hidden Columns:</label>\n      <div class=\"col-sm-4\">\n        <select class=\"form-select\" (change)=\"unhideColumn($any($event).target.value)\"\n          [id]=\"tableId+'_UnhideColumnSelect'\">\n          <option value=\"\">Choose a column</option>\n          <option *ngFor=\"let col of hiddenColumns\" [value]=\"col.id\">{{col.title}}</option>\n        </select>\n      </div>\n    </div>\n  </form>\n\n  <div ngClass=\"{{config.divClassName || ''}}\">\n    <p-table [columns]=\"visibleColumns\" [value]=\"rows\" \n      [scrollable]=\"config.verticalScroll\" [scrollHeight]=\"config.scrollHeight\"\n      [tableStyle]=\"{'min-width': '50rem'}\">\n      <ng-template pTemplate=\"header\" let-columns>\n        <tr *ngFor=\"let hdr of headerRows; let hr=index;\" role=\"row\">\n          <th *ngIf=\"dataHasDetails && hr === 0\" [rowSpan]=\"headerRows.length\" class=\"detail-indicator-col\">\n            <span>\n              <i (click)=\"toggleAllDetails()\" [id]=\"tableId+'_ShowAllDetailsLink'\" class=\"bi\"\n                [ngClass]=\"{'bi-chevron-down': showAllDetails, 'bi-chevron-right': !showAllDetails}\"\n                [tooltip]=\"(showAllDetails ? 'Hide' : 'Show') + ' details for all rows'\" placement=\"right\">\n              </i>\n            </span>\n          </th>\n          <ng-template ngFor let-col [ngForOf]=\"hdr.columns\" let-i=\"index\">\n            <th *ngIf=\"!col.hidden && col.frozenColumn\" pFrozenColumn ngClass=\"{{col.className || ''}}\"\n              [colSpan]=\"col.colspan || 1\" [rowSpan]=\"col.rowspan || 1\">\n              <oepa-table-header-cell [column]=\"col\" [tableId]=\"tableId\" [allRowsSelected]=\"allRowsSelected\"\n                [rowCount]=\"rows.length\" [noFiltersSubject]=\"noFiltersSubject\"\n                (onToggleAllRowsSelection)=\"toggleAllRowsSelection()\" (onSortChanged)=\"onSortChanged($event)\"\n                (onHideColumn)=\"hideColumn($event)\" (onFilterChanged)=\"onFilterChanged($event)\">\n              </oepa-table-header-cell>\n            </th>\n            <th *ngIf=\"!col.hidden && !col.frozenColumn\" ngClass=\"{{col.className || ''}}\"\n              [colSpan]=\"col.colspan || 1\" [rowSpan]=\"col.rowspan || 1\">\n              <oepa-table-header-cell [column]=\"col\" [tableId]=\"tableId\" [allRowsSelected]=\"allRowsSelected\"\n                [rowCount]=\"rows.length\" [noFiltersSubject]=\"noFiltersSubject\"\n                (onToggleAllRowsSelection)=\"toggleAllRowsSelection()\" (onSortChanged)=\"onSortChanged($event)\"\n                (onHideColumn)=\"hideColumn($event)\" (onFilterChanged)=\"onFilterChanged($event)\">\n              </oepa-table-header-cell>\n            </th>\n          </ng-template>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-row let-r=\"rowIndex\" let-columns=\"columns\">\n        <!-- Data Row -->\n        <tr>\n          <td *ngIf=\"dataHasDetails\">\n            <!-- Detail icon (if specified) -->\n            <span *ngIf=\"row.showDetail === true || row.showDetail === false\">\n              <i *ngIf=\"row.detailIconClassName\" [ngClass]=\"row.detailIconClassName\"></i>\n              <i (click)=\"toggleRowDetail(row)\" [id]=\"tableId+'_ShowDetailLink_'+r\" class=\"bi\"\n                [ngClass]=\"{'bi-chevron-down': row.showDetail, 'bi-chevron-right': !row.showDetail}\"\n                [tooltip]=\"(row.showDetail ? 'Hide' : 'Show') + ' details for this row'\" placement=\"right\">\n              </i>\n            </span>\n          </td>\n          <!-- If row is a divider, it spans the whole table -->\n          <td *ngIf=\"row.isDivider\" [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\"\n            [ngClass]=\"row.dividerClassName || 'oepa-table-gray'\">&nbsp;</td>\n          <!-- Data Rows -->\n          <ng-template *ngIf=\"!row.isDivider\" ngFor let-col [ngForOf]=\"dataColumns\" let-i=\"index\">\n            <td *ngIf=\"!col.hidden && (row|cellColspan:col) > 0 &&!col.frozenColumn\"\n              ngClass=\"{{row|cellClassname:col || ''}}\" [colSpan]=\"row|cellColspan:col\">\n              <oepa-table-data-cell [col]=\"col\" [i]=\"i\" [row]=\"row\" [r]=\"r\" [tableId]=\"tableId\"\n                (onActionClick)=\"onActionClick($event)\" (onCellClick)=\"cellClick($event)\"\n                (onToggleRowSelection)=\"toggleRowSelection($event)\"\n                (onSingleRowSelection)=\"singleRowSelection($event)\"></oepa-table-data-cell>\n            </td>\n            <td *ngIf=\"!col.hidden && (row|cellColspan:col) > 0 &&col.frozenColumn\" pFrozenColumn\n              ngClass=\"{{row|cellClassname:col || ''}}\" [colSpan]=\"row|cellColspan:col\">\n              <oepa-table-data-cell [col]=\"col\" [i]=\"i\" [row]=\"row\" [r]=\"r\" [tableId]=\"tableId\"\n                (onActionClick)=\"onActionClick($event)\" (onCellClick)=\"cellClick($event)\"\n                (onToggleRowSelection)=\"toggleRowSelection($event)\"\n                (onSingleRowSelection)=\"singleRowSelection($event)\"></oepa-table-data-cell>\n            </td>\n          </ng-template>\n        </tr>\n\n        <!-- Detail Row -->\n        <tr *ngIf=\"row.showDetail\" class=\"table-info\">\n          <td [colSpan]=\"visibleColumnCount + (dataHasDetails ? 1 : 0)\">\n            <cml-template [templateInfo]=\"row.detail\"></cml-template>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n  </div>\n  <!-- Table footer -->\n  <form *ngIf=\"!config.hideFooter || (data && pageInfo.itemsPerPage < data.length)\" class=\"form-horizontal\">\n    <div class=\"form-group row\">\n      <!-- Table-wide filter -->\n      <div class=\"col-sm-5\">\n        <div class=\"row\">\n          <div class=\"col-sm-6\">\n            <input *ngIf=\"!config.hideGlobalFilter\" placeholder=\"Filter all columns\"\n              [oepaTableFiltering]=\"{ filterString: '' }\" [tableId]=\"tableId\" class=\"form-control input-sm\"\n              (tableChanged)=\"onFilterChanged($event)\" [id]=\"tableId+'_FilterAllColumnsInput'\" />\n          </div>\n          <div class=\"col-sm-6\">\n            <span *ngIf=\"config.showRowCountInFooter && _data && _data.length > 0\">\n              <span class=\"badge bg-secondary\">{{_data.length}}</span>&nbsp;total rows\n            </span>\n          </div>\n        </div>\n      </div>\n      <!-- Export Buttons -->\n      <div class=\"col-sm-2 d-flex justify-content-center\">\n        <div class=\"row\">\n          <div class=\"col-sm-12 text-center\" *ngIf=\"allowEdit\">\n            <div *ngIf=\"config.exportToExcel || config.exportToHTML\" class=\"btn-group\" dropdown>\n              <button id=\"exportBtn\" dropdownToggle type=\"button\" class=\"btn btn-primary dropdown-toggle\"\n                aria-controls=\"dropdown-basic\">\n                Export <span class=\"caret\"></span>\n                <ul id=\"export-dropdown\" *dropdownMenu class=\"dropdown-menu\">\n                  <li *ngIf=\"config.exportToExcel\" role=\"menuitem\"><a class=\"dropdown-item\"\n                      (click)=\"exportToExcel()\">Export to Excel</a></li>\n                  <li *ngIf=\"config.exportToHTML\" role=\"menuitem\"><a class=\"dropdown-item\"\n                      (click)=\"exportToHTML()\">Export\n                      to HTML</a></li>\n                </ul>\n              </button>\n            </div>\n            <button *ngIf=\"customBtnVisible\" type=\"button\"\n              ngClass=\"{{'btn btn-primary me-1' + (small ? ' btn-sm' : '')}}\" (click)=\"onCustomBtnClick()\"\n              [id]=\"tableId+'_CustomBtn'\" [disabled]=\"!customBtnEnabled\">{{customBtnLabel}}</button>\n            <button *ngIf=\"customBtnVisible2\" type=\"button\"\n              ngClass=\"{{'btn btn-primary me-1' + (small ? ' btn-sm' : '')}}\" (click)=\"onCustomBtn2Click()\"\n              [id]=\"tableId+'_CustomBtn'\" [disabled]=\"!customBtnEnabled2\">{{customBtnLabel2}}</button>\n          </div>\n        </div>\n      </div>\n      <!-- Pagination -->\n      <div *ngIf=\"!config.disablePagination\" class=\"col-sm-5\">\n        <div class=\"row\">\n          <div class=\"col-sm-9\">\n            <pagination *ngIf=\"paginationOn\" class=\"pagination-sm\" [totalItems]=\"pageInfo.length\"\n              [itemsPerPage]=\"pageInfo.itemsPerPage\" [maxSize]=\"pageInfo.maxSize\" [(ngModel)]=\"currentPage\"\n              name=\"currentTablePage\" [boundaryLinks]=\"true\" [rotate]=\"false\" (pageChanged)=\"onPageChanged($event)\"\n              (numPages)=\"pageInfo.numPages = $event\">\n            </pagination>\n          </div>\n          <div class=\"col-sm-3\">\n            <button (click)=\"togglePagingation()\" type=\"button\" class=\"btn btn-default btn-sm me-1\">{{ paginationOn ?\n              'Show All Rows' : 'Restore Pagination'}}</button>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"config.exportToExcel || config.exportToHTML\" class=\"col-sm-12 text-center\">\n        <span>Export only visible data:&nbsp;\n          <input type=\"checkbox\" [checked]=\"exportVisibleOnly\" (click)=\"toggleExportVisibleOnly()\"\n            id=\"exportVisibleOnlyCheckbox\" />\n        </span>\n      </div>\n    </div>\n  </form>\n</div>", styles: [".pagination{margin:0}th.oepa-table-header-center{text-align:center}.oepa-table-bold{font-weight:700}.oepa-table-italic{font-style:italic}.oepa-table-line-through{text-decoration:line-through}.oepa-table-gray{background-color:#ddd}td.oepa-undeline-cell{border-bottom:1pt solid black}.detail-indicator-col{width:30px}.action-btn-col{width:90px}.select-col{width:20px}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.DomSanitizer }, { type: TableService }, { type: TableExportService }, { type: i1$1.OepaFileUtilService }, { type: i0.ElementRef }], propDecorators: { tableId: [{
+        }], ctorParameters: () => [{ type: i1$3.DomSanitizer }, { type: TableService }, { type: TableExportService }, { type: OepaFileUtilService }, { type: i0.ElementRef }], propDecorators: { tableId: [{
                 type: Input
             }], allowEdit: [{
                 type: Input
@@ -3462,13 +3712,13 @@ class FileUploadComponent {
             this.downloadFile(this.blankForm);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: i1$1.OepaFileUtilService }, { token: i2$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: OepaFileUtilService }, { token: i2$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FileUploadComponent, selector: "oepa-file-upload", inputs: { group: "group", field: "field", label: "label", errorLabel: "errorLabel", blankForm: "blankForm", blankFormUrl: "blankFormUrl", showValidation: "showValidation", domain: "domain", attachment: "attachment", accept: "accept", removeAllowed: "removeAllowed", parserName: "parserName", parserReport: "parserReport" }, outputs: { fileUploaded: "fileUploaded", fileRemoved: "fileRemoved", download: "download" }, ngImport: i0, template: "<form [formGroup]=\"group\">\n  <div *ngIf=\"!attachment || !attachment.userFilename\" class=\"form-group\">\n    <div>\n      <label *ngIf=\"label\">{{label}}</label>\n      <span *ngIf=\"blankFormUrl\">&nbsp;<a href=\"{{blankFormUrl}}\" target=\"_blank\">Blank Form</a></span>\n      <span *ngIf=\"blankForm\">&nbsp;<a href=\"javascript:void(0)\" (click)=\"downloadBlankForm()\">Blank Form</a></span>\n      <div class=\"form-group\">\n      <div class=\"input-group\">\n        <span class=\"input-group-btn\">\n          <label class=\"btn btn-primary btn-file\">\n            Browse&hellip; \n            <input type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\" \n              [id]=\"componentId+'_BrowseBtn'\" [name]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n              [attr.accept]=\"accept ? accept : null\"\n              [disabled]=\"group.controls[field].status === 'DISABLED'\">\n          </label>\n        </span>\n        <input [ngClass]=\"{'is-invalid':showValidation && group.controls[field].status === 'INVALID'}\" \n          type=\"text\" class=\"form-control\" placeholder=\"No file chosen\" [id]=\"componentId+'_Input'\" [name]=\"componentId+'_Input'\" readonly>\n        <small class=\"invalid-feedback\" *ngIf=\"showValidation && group.controls[field].status === 'INVALID'\">{{errorLabel || label}} is required</small>\n      </div>\n      <!-- dummy input field for validation purposes -->\n      <input type=\"text\" [hidden]=\"true\" [formControlName]=\"field\"/>\n    </div>\n  </div>\n    <div *ngIf=\"uploadError\" class=\"alert alert-danger\" role=\"alert\">{{uploadError}}</div>\n    <div *ngIf=\"parserReport\">\n      <div *ngIf=\"parserReport.successful\" class=\"alert alert-info\" role=\"alert\">Spreadsheet was successfully parsed.</div>\n      <div *ngIf=\"!parserReport.successful\" class=\"alert alert-danger\" role=\"alert\">\n        There are errors in the uploaded spreadsheet:\n        <ul>\n          <li *ngFor=\"let error of parserReport.errors\">{{error.message}}</li>\n        </ul>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"attachment && attachment.userFilename\">\n    <div>\n      <label *ngIf=\"label\">{{label}}</label>\n      <div class=\"input-group\">\n        <a (click)=\"downloadFile(attachment)\" [id]=\"componentId+'_DownloadFileLink'\" [name]=\"componentId+'_DownloadFileLink'\" \n          class=\"form-control\">{{attachment.userFilename}}</a>\n        <span *ngIf=\"removeAllowed\" class=\"input-group-btn\">\n        <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveFileBtn'\" [name]=\"componentId+'_RemoveFileBtn'\"\n          (click)=\"removeFile()\" [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Attachment</button>\n        \n\t\t\t</span>\n      </div>\n    </div>\n  </div>\n</form>", styles: ["a:hover{cursor:pointer}a{color:#3399f3!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FileUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-file-upload', template: "<form [formGroup]=\"group\">\n  <div *ngIf=\"!attachment || !attachment.userFilename\" class=\"form-group\">\n    <div>\n      <label *ngIf=\"label\">{{label}}</label>\n      <span *ngIf=\"blankFormUrl\">&nbsp;<a href=\"{{blankFormUrl}}\" target=\"_blank\">Blank Form</a></span>\n      <span *ngIf=\"blankForm\">&nbsp;<a href=\"javascript:void(0)\" (click)=\"downloadBlankForm()\">Blank Form</a></span>\n      <div class=\"form-group\">\n      <div class=\"input-group\">\n        <span class=\"input-group-btn\">\n          <label class=\"btn btn-primary btn-file\">\n            Browse&hellip; \n            <input type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\" \n              [id]=\"componentId+'_BrowseBtn'\" [name]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n              [attr.accept]=\"accept ? accept : null\"\n              [disabled]=\"group.controls[field].status === 'DISABLED'\">\n          </label>\n        </span>\n        <input [ngClass]=\"{'is-invalid':showValidation && group.controls[field].status === 'INVALID'}\" \n          type=\"text\" class=\"form-control\" placeholder=\"No file chosen\" [id]=\"componentId+'_Input'\" [name]=\"componentId+'_Input'\" readonly>\n        <small class=\"invalid-feedback\" *ngIf=\"showValidation && group.controls[field].status === 'INVALID'\">{{errorLabel || label}} is required</small>\n      </div>\n      <!-- dummy input field for validation purposes -->\n      <input type=\"text\" [hidden]=\"true\" [formControlName]=\"field\"/>\n    </div>\n  </div>\n    <div *ngIf=\"uploadError\" class=\"alert alert-danger\" role=\"alert\">{{uploadError}}</div>\n    <div *ngIf=\"parserReport\">\n      <div *ngIf=\"parserReport.successful\" class=\"alert alert-info\" role=\"alert\">Spreadsheet was successfully parsed.</div>\n      <div *ngIf=\"!parserReport.successful\" class=\"alert alert-danger\" role=\"alert\">\n        There are errors in the uploaded spreadsheet:\n        <ul>\n          <li *ngFor=\"let error of parserReport.errors\">{{error.message}}</li>\n        </ul>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"attachment && attachment.userFilename\">\n    <div>\n      <label *ngIf=\"label\">{{label}}</label>\n      <div class=\"input-group\">\n        <a (click)=\"downloadFile(attachment)\" [id]=\"componentId+'_DownloadFileLink'\" [name]=\"componentId+'_DownloadFileLink'\" \n          class=\"form-control\">{{attachment.userFilename}}</a>\n        <span *ngIf=\"removeAllowed\" class=\"input-group-btn\">\n        <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveFileBtn'\" [name]=\"componentId+'_RemoveFileBtn'\"\n          (click)=\"removeFile()\" [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Attachment</button>\n        \n\t\t\t</span>\n      </div>\n    </div>\n  </div>\n</form>", styles: ["a:hover{cursor:pointer}a{color:#3399f3!important}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: i1$1.OepaFileUtilService }, { type: i2$1.BsModalService }], propDecorators: { group: [{
+        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: OepaFileUtilService }, { type: i2$1.BsModalService }], propDecorators: { group: [{
                 type: Input
             }], field: [{
                 type: Input
@@ -3595,13 +3845,13 @@ class MultiFileUploadComponent {
             this.downloadFile(this.blankForm);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MultiFileUploadComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: i1$1.OepaFileUtilService }, { token: i2$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MultiFileUploadComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: OepaFileUtilService }, { token: i2$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MultiFileUploadComponent, selector: "oepa-multi-file-upload", inputs: { group: "group", field: "field", label: "label", errorLabel: "errorLabel", blankForm: "blankForm", blankFormUrl: "blankFormUrl", showValidation: "showValidation", domain: "domain", attachments: "attachments", removeAllowed: "removeAllowed" }, outputs: { fileUploaded: "fileUploaded", fileRemoved: "fileRemoved", download: "download" }, viewQueries: [{ propertyName: "myFileInput", first: true, predicate: ["myFileInput"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"group\">\n  <div class=\"form-group\">\n    <div>\n      <label *ngIf=\"label\">{{label}}</label>\n      <span *ngIf=\"blankFormUrl\">&nbsp;<a href=\"{{blankFormUrl}}\" target=\"_blank\">Blank Form</a></span>\n      <span *ngIf=\"blankForm\">&nbsp;<a href=\"\" (click)=\"downloadBlankForm()\">Blank Form</a></span>\n      <div class=\"form-group\">\n      <div class=\"input-group\">\n        <span class=\"input-group-btn\">\n          <label class=\"btn btn-primary btn-file\">\n            Browse&hellip; \n            <input #myFileInput type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\" \n              [id]=\"componentId+'_BrowseBtn'\" [name]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n              [disabled]=\"group.controls[field].status === 'DISABLED'\">\n          </label>\n        </span>\n        <input  [ngClass]=\"{'is-invalid':showValidation && group.controls[field].status === 'INVALID'}\"\n          type=\"text\" class=\"form-control\" \n          [placeholder]=\"(!attachments || attachments.length === 0) ? 'No files uploaded' : (attachments.length + ' file(s) uploaded')\"\n          [id]=\"componentId+'_Input'\" [name]=\"componentId+'_Input'\" readonly>\n          <small class=\"invalid-feedback\" *ngIf=\"showValidation && group.controls[field].status === 'INVALID'\">{{errorLabel || label}} is required</small>\n      </div>\n      <!-- dummy input field for validation purposes -->\n      <input type=\"text\" [hidden]=\"true\" [formControlName]=\"field\"/>\n    </div>\n  </div>\n    <div *ngIf=\"uploadError\" class=\"alert alert-danger\" role=\"alert\">{{uploadError}}</div>\n    <div *ngIf=\"parserReport\">\n      <div *ngIf=\"!attachments[0] && parserReport.successful\" class=\"alert alert-info\" role=\"alert\">Spreadsheet was successfully parsed.</div>\n      <div [hidden]=\"parserReport.successful\" class=\"alert alert-danger\" role=\"alert\">\n        There are errors in the uploaded spreadsheet:\n        <ul>\n          <li *ngFor=\"let error of parserReport.errors\">{{error.message}}</li>\n        </ul>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"attachments && attachments[0]\">\n    <div *ngFor=\"let attachment of attachments; let i=index;\">\n      <div class=\"form-group\">\n        <div class=\"input-group\">\n          <a (click)=\"downloadFile(attachment)\" [id]=\"componentId+'_DownloadFileLink_'+i\" [name]=\"componentId+'_DownloadFileLink_'+i\"\n            class=\"form-control\">{{attachment.userFilename}}</a>\n          <span *ngIf=\"removeAllowed\" class=\"input-group-btn\">\n            <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveFileBtn_'+i\" [name]=\"componentId+'_RemoveFileBtn_'+i\"\n              (click)=\"removeFile(attachment)\" [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Attachment</button>\n          </span>\n        </div>\n      </div>\n    </div>\n  </div>\n</form>", styles: ["a:hover{cursor:pointer}a{color:#3399f3!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MultiFileUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-multi-file-upload', template: "<form [formGroup]=\"group\">\n  <div class=\"form-group\">\n    <div>\n      <label *ngIf=\"label\">{{label}}</label>\n      <span *ngIf=\"blankFormUrl\">&nbsp;<a href=\"{{blankFormUrl}}\" target=\"_blank\">Blank Form</a></span>\n      <span *ngIf=\"blankForm\">&nbsp;<a href=\"\" (click)=\"downloadBlankForm()\">Blank Form</a></span>\n      <div class=\"form-group\">\n      <div class=\"input-group\">\n        <span class=\"input-group-btn\">\n          <label class=\"btn btn-primary btn-file\">\n            Browse&hellip; \n            <input #myFileInput type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\" \n              [id]=\"componentId+'_BrowseBtn'\" [name]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n              [disabled]=\"group.controls[field].status === 'DISABLED'\">\n          </label>\n        </span>\n        <input  [ngClass]=\"{'is-invalid':showValidation && group.controls[field].status === 'INVALID'}\"\n          type=\"text\" class=\"form-control\" \n          [placeholder]=\"(!attachments || attachments.length === 0) ? 'No files uploaded' : (attachments.length + ' file(s) uploaded')\"\n          [id]=\"componentId+'_Input'\" [name]=\"componentId+'_Input'\" readonly>\n          <small class=\"invalid-feedback\" *ngIf=\"showValidation && group.controls[field].status === 'INVALID'\">{{errorLabel || label}} is required</small>\n      </div>\n      <!-- dummy input field for validation purposes -->\n      <input type=\"text\" [hidden]=\"true\" [formControlName]=\"field\"/>\n    </div>\n  </div>\n    <div *ngIf=\"uploadError\" class=\"alert alert-danger\" role=\"alert\">{{uploadError}}</div>\n    <div *ngIf=\"parserReport\">\n      <div *ngIf=\"!attachments[0] && parserReport.successful\" class=\"alert alert-info\" role=\"alert\">Spreadsheet was successfully parsed.</div>\n      <div [hidden]=\"parserReport.successful\" class=\"alert alert-danger\" role=\"alert\">\n        There are errors in the uploaded spreadsheet:\n        <ul>\n          <li *ngFor=\"let error of parserReport.errors\">{{error.message}}</li>\n        </ul>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"attachments && attachments[0]\">\n    <div *ngFor=\"let attachment of attachments; let i=index;\">\n      <div class=\"form-group\">\n        <div class=\"input-group\">\n          <a (click)=\"downloadFile(attachment)\" [id]=\"componentId+'_DownloadFileLink_'+i\" [name]=\"componentId+'_DownloadFileLink_'+i\"\n            class=\"form-control\">{{attachment.userFilename}}</a>\n          <span *ngIf=\"removeAllowed\" class=\"input-group-btn\">\n            <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveFileBtn_'+i\" [name]=\"componentId+'_RemoveFileBtn_'+i\"\n              (click)=\"removeFile(attachment)\" [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Attachment</button>\n          </span>\n        </div>\n      </div>\n    </div>\n  </div>\n</form>", styles: ["a:hover{cursor:pointer}a{color:#3399f3!important}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: i1$1.OepaFileUtilService }, { type: i2$1.BsModalService }], propDecorators: { group: [{
+        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: OepaFileUtilService }, { type: i2$1.BsModalService }], propDecorators: { group: [{
                 type: Input
             }], field: [{
                 type: Input
@@ -3830,9 +4080,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class EntityService {
     http;
+    ebizRootURL;
     entityURL = '/ebiz/api/v1/entities';
-    constructor(http) {
+    constructor(http, ebizRootURL) {
         this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.entityURL = ebizRootURL + this.entityURL;
     }
     searchPersons(filter) {
         const headers = new HttpHeaders();
@@ -3918,7 +4171,7 @@ class EntityService {
         const url = this.entityURL + '/programs';
         return this.http.get(url, { headers: headers, responseType: 'json' });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EntityService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EntityService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EntityService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EntityService, decorators: [{
@@ -3926,7 +4179,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
 
 class OrganizationCreateModalComponent {
     fb;
@@ -5907,9 +6163,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class EdocAttachmentService {
     http;
+    ebizRootURL;
     fileUtilUrl = '/ebiz/api/v1/fileutil';
-    constructor(http) {
+    constructor(http, ebizRootURL) {
         this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.fileUtilUrl = ebizRootURL + this.fileUtilUrl;
     }
     createEDocAttachment(eDocAttachment) {
         let url = this.fileUtilUrl + '/eDocumentAttachments';
@@ -5929,7 +6188,7 @@ class EdocAttachmentService {
         headers.append('Content-type', 'application/json;odata=verbose');
         return this.http.get(url, { headers: headers, responseType: 'blob' });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EdocAttachmentService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EdocAttachmentService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EdocAttachmentService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EdocAttachmentService, decorators: [{
@@ -5937,7 +6196,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
 
 class EdocAttachmentComponent {
     idService;
@@ -6115,13 +6377,13 @@ class EdocAttachmentComponent {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EdocAttachmentComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: i1$1.OepaFileUtilService }, { token: EdocAttachmentService }, { token: i2$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EdocAttachmentComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: OepaFileUtilService }, { token: EdocAttachmentService }, { token: i2$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: EdocAttachmentComponent, selector: "oepa-edoc-attachment", inputs: { attachment: "attachment", group: "group", field: "field", label: "label", errorLabel: "errorLabel", showValidation: "showValidation", accept: "accept", removeAllowed: "removeAllowed", okToDelete: "okToDelete" }, outputs: { fileUploaded: "fileUploaded", fileRemoved: "fileRemoved", download: "download" }, ngImport: i0, template: "<form [formGroup]=\"group\">\n    <div *ngIf=\"!attachment || !attachment.userFilename\" class=\"form-group\">\n        <div>\n            <label *ngIf=\"label\">{{label}}</label>\n            <div class=\"form-group\">\n                <div class=\"input-group\">\n                    <span *ngIf=\"!busy\" class=\"input-group-btn\">\n                        <label class=\"btn btn-primary btn-file\">\n                            Browse&hellip;\n                            <input type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\"\n                                [id]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n                                [attr.accept]=\"accept ? accept : null\"\n                                [disabled]=\"group.controls[field].status === 'DISABLED'\">\n                        </label>\n                    </span>\n                    <span *ngIf=\"busy\"> <span class=\"spinner-border text-primary\" role=\"status\"></span></span>\n                    <input [ngClass]=\"{'is-invalid':showValidation && group.controls[field].status === 'INVALID'}\"\n                        type=\"text\" class=\"form-control\" placeholder=\"No file chosen\" [id]=\"componentId+'_Input'\" readonly>\n                    <small class=\"invalid-feedback\"\n                        *ngIf=\"showValidation && group.controls[field].status === 'INVALID'\">{{errorLabel || label}} is\n                        required</small>\n                </div>\n                <!-- dummy input field for validation purposes -->\n                <input type=\"text\" [hidden]=\"true\" [formControlName]=\"field\" />\n            </div>\n        </div>\n    </div>\n    <div *ngIf=\"attachment && attachment.userFilename\">\n        <div>\n            <label *ngIf=\"label\">{{label}}</label>\n            <div class=\"input-group\">\n                <a (click)=\"downloadFile(attachment)\" [id]=\"componentId+'_DownloadFileLink'\" \n                    class=\"form-control\">{{attachment.userFilename}}</a>\n                <span *ngIf=\"removeAllowed && !busy\" class=\"input-group-btn\">\n                    <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveFileBtn'\"\n                        (click)=\"removeFile()\"\n                        [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Attachment</button>\n                </span>\n                <span *ngIf=\"busy\"> <span class=\"spinner-border text-primary\" role=\"status\"></span></span>\n            </div>\n        </div>\n    </div>\n    <div *ngIf=\"errorMsg\" class=\"alert alert-danger\" role=\"alert\">{{errorMsg}}</div>\n</form>", styles: ["a:hover{cursor:pointer}a{color:#3399f3!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EdocAttachmentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-edoc-attachment', template: "<form [formGroup]=\"group\">\n    <div *ngIf=\"!attachment || !attachment.userFilename\" class=\"form-group\">\n        <div>\n            <label *ngIf=\"label\">{{label}}</label>\n            <div class=\"form-group\">\n                <div class=\"input-group\">\n                    <span *ngIf=\"!busy\" class=\"input-group-btn\">\n                        <label class=\"btn btn-primary btn-file\">\n                            Browse&hellip;\n                            <input type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\"\n                                [id]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n                                [attr.accept]=\"accept ? accept : null\"\n                                [disabled]=\"group.controls[field].status === 'DISABLED'\">\n                        </label>\n                    </span>\n                    <span *ngIf=\"busy\"> <span class=\"spinner-border text-primary\" role=\"status\"></span></span>\n                    <input [ngClass]=\"{'is-invalid':showValidation && group.controls[field].status === 'INVALID'}\"\n                        type=\"text\" class=\"form-control\" placeholder=\"No file chosen\" [id]=\"componentId+'_Input'\" readonly>\n                    <small class=\"invalid-feedback\"\n                        *ngIf=\"showValidation && group.controls[field].status === 'INVALID'\">{{errorLabel || label}} is\n                        required</small>\n                </div>\n                <!-- dummy input field for validation purposes -->\n                <input type=\"text\" [hidden]=\"true\" [formControlName]=\"field\" />\n            </div>\n        </div>\n    </div>\n    <div *ngIf=\"attachment && attachment.userFilename\">\n        <div>\n            <label *ngIf=\"label\">{{label}}</label>\n            <div class=\"input-group\">\n                <a (click)=\"downloadFile(attachment)\" [id]=\"componentId+'_DownloadFileLink'\" \n                    class=\"form-control\">{{attachment.userFilename}}</a>\n                <span *ngIf=\"removeAllowed && !busy\" class=\"input-group-btn\">\n                    <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveFileBtn'\"\n                        (click)=\"removeFile()\"\n                        [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Attachment</button>\n                </span>\n                <span *ngIf=\"busy\"> <span class=\"spinner-border text-primary\" role=\"status\"></span></span>\n            </div>\n        </div>\n    </div>\n    <div *ngIf=\"errorMsg\" class=\"alert alert-danger\" role=\"alert\">{{errorMsg}}</div>\n</form>", styles: ["a:hover{cursor:pointer}a{color:#3399f3!important}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: i1$1.OepaFileUtilService }, { type: EdocAttachmentService }, { type: i2$1.BsModalService }], propDecorators: { attachment: [{
+        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: OepaFileUtilService }, { type: EdocAttachmentService }, { type: i2$1.BsModalService }], propDecorators: { attachment: [{
                 type: Input
             }], group: [{
                 type: Input
@@ -6646,13 +6908,13 @@ class LynxImageUploadComponent {
             this.onImageRemove.emit(this.image);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxImageUploadComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: i2$1.BsModalService }, { token: i1$1.OepaFileUtilService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxImageUploadComponent, deps: [{ token: i1$1.OepaComponentIdService }, { token: i2$1.BsModalService }, { token: OepaFileUtilService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: LynxImageUploadComponent, selector: "oepa-lynx-image-upload", inputs: { group: "group", field: "field", projectID: "projectID", label: "label", errorLabel: "errorLabel", image: "image", showValidation: "showValidation", required: "required", accept: "accept", imageBlobUrl: "imageBlobUrl" }, outputs: { onImageUpload: "onImageUpload", onImageRemove: "onImageRemove", onImageDownload: "onImageDownload" }, ngImport: i0, template: "<form [formGroup]=\"group\">\n    <div *ngIf=\"!imageBlobUrl\">\n            <label class=\"btn btn-primary btn-file\">\n                    Browse&hellip;\n                    <input type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\" \n                      [id]=\"componentId+'_BrowseBtn'\" [name]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n                      [attr.accept]=\"accept ? accept : null\"\n                      [disabled]=\"group.controls[field].status === 'DISABLED'\">\n                  </label>\n            <span>&nbsp;Click the button on the left to upload an image from your computer.</span>\n    </div>\n    <div *ngIf=\"imageBlobUrl\">\n        <div class=\"row\">\n            <div class=\"col-sm-12\">\n                <img [src]=\"imageBlobUrl\" [id]=\"componentId+'_Image'\" width=\"200\">\n            </div>\n            <br/>\n            <div class=\"col-sm-12\">\n                <label>{{image.userFilename}}</label>\n            </div>\n            <div class=\"col-sm-12\">\n                <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveImageBtn'\" [name]=\"componentId+'_RemoveImageBtn'\"\n                    (click)=\"removeImage()\" [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Image</button>\n            </div>\n        </div>\n    </div>\n    <div *ngIf=\"errorMessage\" class=\"alert alert-danger\">{{errorMessage}}</div>\n</form>", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxImageUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-lynx-image-upload', template: "<form [formGroup]=\"group\">\n    <div *ngIf=\"!imageBlobUrl\">\n            <label class=\"btn btn-primary btn-file\">\n                    Browse&hellip;\n                    <input type=\"file\" style=\"display: none;\" (change)=\"fileChange($event)\" \n                      [id]=\"componentId+'_BrowseBtn'\" [name]=\"componentId+'_BrowseBtn'\" class=\"form-control\"\n                      [attr.accept]=\"accept ? accept : null\"\n                      [disabled]=\"group.controls[field].status === 'DISABLED'\">\n                  </label>\n            <span>&nbsp;Click the button on the left to upload an image from your computer.</span>\n    </div>\n    <div *ngIf=\"imageBlobUrl\">\n        <div class=\"row\">\n            <div class=\"col-sm-12\">\n                <img [src]=\"imageBlobUrl\" [id]=\"componentId+'_Image'\" width=\"200\">\n            </div>\n            <br/>\n            <div class=\"col-sm-12\">\n                <label>{{image.userFilename}}</label>\n            </div>\n            <div class=\"col-sm-12\">\n                <button type=\"button\" class=\"btn btn-primary\" [id]=\"componentId+'_RemoveImageBtn'\" [name]=\"componentId+'_RemoveImageBtn'\"\n                    (click)=\"removeImage()\" [disabled]=\"group.controls[field].status === 'DISABLED'\">Remove Image</button>\n            </div>\n        </div>\n    </div>\n    <div *ngIf=\"errorMessage\" class=\"alert alert-danger\">{{errorMessage}}</div>\n</form>" }]
-        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: i2$1.BsModalService }, { type: i1$1.OepaFileUtilService }], propDecorators: { group: [{
+        }], ctorParameters: () => [{ type: i1$1.OepaComponentIdService }, { type: i2$1.BsModalService }, { type: OepaFileUtilService }], propDecorators: { group: [{
                 type: Input
             }], field: [{
                 type: Input
@@ -6848,19 +7110,42 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Output
             }] } });
 
+class ParamsHelpService {
+    http;
+    baseURL = '/ebiz/api/v1/gateway/helpURLs/';
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.baseURL = ebizRootURL + this.baseURL;
+    }
+    retrieveHelpURL(helpURLParamName) {
+        return this.http.get(this.baseURL + helpURLParamName, { responseType: 'text' });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParamsHelpService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParamsHelpService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParamsHelpService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
 class ParamsHelpButtonComponent {
     router;
-    http;
+    helpService;
     helpURL = '';
     title = 'Click here for instructions or call (614) 466-0061';
     anchorClass = '';
-    constructor(router, http) {
+    constructor(router, helpService) {
         this.router = router;
-        this.http = http;
+        this.helpService = helpService;
     }
     ngOnInit() {
         const helpURLParamName = this.router.url.replace(new RegExp('/', 'g'), '.');
-        this.http.get('/ebiz/api/v1/gateway/helpURLs/' + helpURLParamName, { responseType: 'text' }).subscribe({
+        this.helpService.retrieveHelpURL(helpURLParamName).subscribe({
             next: url => {
                 if (url && url.length > 0) {
                     this.helpURL = url;
@@ -6873,23 +7158,324 @@ class ParamsHelpButtonComponent {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParamsHelpButtonComponent, deps: [{ token: i1$4.Router }, { token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParamsHelpButtonComponent, deps: [{ token: i1$4.Router }, { token: ParamsHelpService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ParamsHelpButtonComponent, selector: "oepa-params-help-button", inputs: { title: "title", anchorClass: "anchorClass" }, ngImport: i0, template: "<a *ngIf=\"helpURL\" [href]=\"helpURL\" [class]=\"anchorClass\" target=\"_blank\" [title]=\"title\">\n  <i class=\"bi bi-question-circle\"></i>\n</a>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParamsHelpButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-params-help-button', template: "<a *ngIf=\"helpURL\" [href]=\"helpURL\" [class]=\"anchorClass\" target=\"_blank\" [title]=\"title\">\n  <i class=\"bi bi-question-circle\"></i>\n</a>\n" }]
-        }], ctorParameters: () => [{ type: i1$4.Router }, { type: i1.HttpClient }], propDecorators: { title: [{
+        }], ctorParameters: () => [{ type: i1$4.Router }, { type: ParamsHelpService }], propDecorators: { title: [{
                 type: Input
             }], anchorClass: [{
                 type: Input
             }] } });
 
+/**
+ * OepaUserAccountService - A collection of methods for accessing and manipulating user accounts.
+ */
+class OepaUserAccountService {
+    http;
+    ebizRootURL;
+    hostUrl = '/ebiz';
+    accountsUrl = '/api/v1/userAccounts';
+    ebizAccountsUrl = '/api/v1/accounts';
+    ebizSessionUrl = '/api/v1/session';
+    account;
+    personID = '';
+    sessionID = '';
+    webappsRootURL = '';
+    logoutPath = '';
+    idleTimerRunning = false;
+    idleTime = 0;
+    idleThreshold = (29 * 60); // 29 minute timeout threshold by default
+    idleSubject = new Subject();
+    timeoutID;
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.hostUrl = ebizRootURL + this.hostUrl;
+        this.logoutPath = '/jsp/logout.jsp';
+    }
+    /**
+     * Retrieve the User Account for the user userid.
+     * @param userid
+     */
+    retrieveAccountForUser(userid) {
+        return this.http.get(this.hostUrl + this.accountsUrl + '/' + userid);
+    }
+    /**
+     * Retrieve the user account for the currently logged in user.
+     * @returns Observable<OepaUserAccount>
+     */
+    retrieveAccountForCurrentUser() {
+        return this.http.get(this.hostUrl + this.accountsUrl + '/login').pipe(map((account) => {
+            if (!account) {
+                if (this.personID && this.sessionID) {
+                    this.retrieveAccountForInternalSession(this.personID, this.sessionID).subscribe({
+                        next: internalAccount => {
+                            if (internalAccount) {
+                                this.account = internalAccount;
+                            }
+                            else {
+                                this.logMessageOnServer('retrieveAccountForCurrentUser - no account, redirecting to logout');
+                                this.redirectToLogout();
+                            }
+                        }, error: err => {
+                            this.logMessageOnServer('Failed retrieving internal account: ' + err);
+                            this.redirectToLogout();
+                        }
+                    });
+                }
+                else {
+                    this.logMessageOnServer('retrieveAccountForCurrentUser - no account, redirecting to logout');
+                    this.redirectToLogout();
+                }
+            }
+            else {
+                this.account = account;
+                console.log('retrieveAccountForCurrentUser: ' + this.account?.loginName || '<unknown>');
+            }
+            return this.account;
+        }));
+    }
+    /**
+     * Redirect to logout screen if user is not found
+     */
+    redirectToLogout(msg) {
+        let logoutUrl = this.logoutPath;
+        if (this.webappsRootURL) {
+            logoutUrl = this.webappsRootURL + (this.logoutPath || '');
+        }
+        alert(msg || 'Connection lost. You will be redirected to the login page.');
+        console.log('redirecting to logoutUrl:' + logoutUrl);
+        window.location.href = logoutUrl;
+    }
+    /**
+     * Retrieve the user account for the currently logged in user.
+     * @param sessionID person ID for internal user
+     * @returns Observable<OepaUserAccount>
+     */
+    retrieveAccountForInternalSession(personID, sessionID) {
+        this.account = {};
+        const url = this.hostUrl + this.accountsUrl + '/internal/personID/' + personID + '/sessionID/' + sessionID;
+        console.log('retrieveAccountForInternalSession: ' + url);
+        return this.http.get(url).pipe(map((account) => {
+            this.account = account;
+            this.personID = personID;
+            this.sessionID = sessionID;
+            console.log('retrieveAccountForInternalSession: ' + this.account?.loginName || '<unknown>');
+            return account;
+        }));
+    }
+    /**
+     * Determine whether account has the role roleName.
+     * @param account
+     * @param roleName
+     */
+    accountHasRole(account, roleName) {
+        let hasRole = false;
+        const roleList = this.getRoleList(account);
+        if (roleList && roleList.length) {
+            hasRole = (roleList.indexOf(roleName) > -1);
+        }
+        return hasRole;
+    }
+    getRoleList(account) {
+        const roleList = [];
+        if (account.roleList && account.roleList.length > 0) {
+            account.roleList.forEach((role) => {
+                roleList.push(role.name || '');
+            });
+        }
+        return roleList;
+    }
+    /**
+     * Determine whether account has the privilege privilegeType.
+     * @param account
+     * @param privilegeType
+     */
+    accountHasPrivilege(account, privilegeType) {
+        let hasPrivilege = false;
+        const privilegeList = this.getPrivilegeList(account);
+        if (privilegeList && privilegeList.length) {
+            hasPrivilege = (privilegeList.indexOf(privilegeType) > -1);
+        }
+        return hasPrivilege;
+    }
+    getPrivilegeList(account) {
+        const privilegeList = [];
+        if (account.roleList && account.roleList.length > 0) {
+            account.roleList.forEach((role) => {
+                if (role.privilegeList && role.privilegeList.length > 0) {
+                    role.privilegeList.forEach((privilege) => {
+                        privilegeList.push(privilege.type || '');
+                    });
+                }
+            });
+        }
+        return privilegeList;
+    }
+    /**
+     * Retrieve the userAccount of the current user. The retrieveAccountForCurrentUser method
+     * must be invoked prior to invoking this method.
+     */
+    getCurrentUserAccount() {
+        console.log('getCurrentUserAccount: ' + this.account?.loginName || '<unknown>');
+        return this.account;
+    }
+    /**
+     * ===========================================================================================================================
+     * EBIZ METHODS:
+     * The methods below currently apply only to eBiz.
+     * ===========================================================================================================================
+     */
+    getWebappsRootURL() {
+        if (this.webappsRootURL) {
+            return of(this.webappsRootURL);
+        }
+        else {
+            const url = this.hostUrl + '/api/v1/gateway/gatewayConfig';
+            return this.http.get(url).pipe(map((gatewayConfig) => {
+                if (gatewayConfig) {
+                    this.webappsRootURL = gatewayConfig.webappsRootURL;
+                }
+                return this.webappsRootURL;
+            }));
+        }
+    }
+    /**
+     * Return array of ProgramPrivileges matching programPrivilegeRequest.
+     * @param programPrivilegeRequest
+     * @returns Observable<Array<ProgramPrivilege>>
+     */
+    searchPrivileges(programPrivilegeRequest, altUserID) {
+        const url = this.hostUrl + this.ebizAccountsUrl + '/programPrivileges/search' + (altUserID ? '?userid=' + altUserID : '');
+        return this.http.post(url, programPrivilegeRequest);
+    }
+    /**
+     * Create a new ProgramPrivilege based on contents of ProgramPrivilegeRequest.
+     * @param programPrivilegeRequest
+     * @returns Observable<ProgramPrivilege?
+     */
+    createProgramPrivilege(programPrivilegeRequest, altUserID) {
+        return this.http.post(this.hostUrl + this.ebizAccountsUrl + '/programPrivileges' + (altUserID ? '?userid=' + altUserID : ''), programPrivilegeRequest);
+    }
+    /**
+     * Delete the ProgramPrivilege identified by programPrivilegeID.
+     * @param programPrivilegeID
+     * @returns Observable<void>
+     */
+    deleteProgramPrivilege(programPrivilegeID, altUserID) {
+        return this.http.delete(this.hostUrl + this.ebizAccountsUrl + '/programPrivileges/' + programPrivilegeID + (altUserID ? '?userid=' + altUserID : ''), { responseType: 'text' });
+    }
+    /**
+     * Delegate a program privilege based on information in delegation.
+     * @param delegation
+     * @returns Observable<void>
+     */
+    delegateProgramPrivilege(delegation, altUserID) {
+        return this.http.post(this.hostUrl + this.ebizAccountsUrl + '/programPrivileges/delegation' + (altUserID ? '?userid=' + altUserID : ''), delegation, { responseType: 'text' });
+    }
+    /**
+      * ===========================================================================================================================
+      * Helper METHODS:
+      * ===========================================================================================================================
+      */
+    /**
+     * Set the user account to be used for "live reload mode"
+     * @param userAccount
+     */
+    setLiveReloadUser(userAccount) {
+        this.account = userAccount;
+        console.log('setLiveReloadUser: ' + this.account?.loginName || '<unknown>');
+        return this.http.post(this.hostUrl + this.ebizAccountsUrl + '/liveReload', userAccount);
+    }
+    /**
+     * Stores the given user in the eBiz session.
+     * @param accountUserID
+     */
+    storeUserInSession(accountUserID) {
+        let acct = {};
+        acct.accountID = accountUserID;
+        return this.http.post(this.hostUrl + this.ebizSessionUrl + '/storeUser/' + accountUserID, null);
+    }
+    /**
+     * See if the current user should be allowed to see "demo" capabilities
+     */
+    demoCapabilitiesAllowed() {
+        let demoAllowed = false;
+        if (this.account && this.account.roleList) {
+            this.account.roleList.forEach(role => {
+                if (role.name === 'AllowDemo') {
+                    demoAllowed = true;
+                }
+            });
+        }
+        return demoAllowed;
+    }
+    startIdleTimer(threshold) {
+        if (this.timeoutID) {
+            clearTimeout(this.timeoutID);
+        }
+        this.idleThreshold = threshold || this.idleThreshold;
+        if (!this.idleTimerRunning) {
+            console.log('The idle timeout started with threshold: ' + this.idleThreshold);
+            this.idleTimerRunning = true;
+            this.checkTimeout();
+        }
+    }
+    resetIdleTime() {
+        console.log('idle timer reset');
+        this.idleTime = 0;
+    }
+    checkTimeout() {
+        this.timeoutID = setTimeout(() => {
+            this.idleTime += 60;
+            console.log('idle time = ' + this.idleTime + ", threshold = " + this.idleThreshold);
+            if (this.idleTime >= this.idleThreshold) {
+                console.log('firing next idleSubject...');
+                this.idleTimerRunning = false;
+                this.idleSubject.next(this.idleTime);
+            }
+            else {
+                if (this.timeoutID) {
+                    clearTimeout(this.timeoutID);
+                }
+                this.checkTimeout();
+            }
+        }, 60000);
+    }
+    getIdleTimeout() {
+        return this.idleSubject.asObservable();
+    }
+    logMessageOnServer(message) {
+        const messageResponse = {
+            response: message
+        };
+        const url = this.hostUrl + this.accountsUrl + '/logs/message';
+        return this.http.post(url, messageResponse);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaUserAccountService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaUserAccountService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaUserAccountService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
 class OepaPinService {
     http;
+    ebizRootURL;
     pinsUrl = '/ebiz/api/v1/pins';
-    constructor(http) {
+    constructor(http, ebizRootURL) {
         this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.pinsUrl = ebizRootURL + this.pinsUrl;
     }
     /**
      * Retrieve an attestation by id.
@@ -6926,7 +7512,7 @@ class OepaPinService {
     retrievePin(userID) {
         return this.http.get(this.pinsUrl + '/' + userID);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaPinService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaPinService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaPinService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaPinService, decorators: [{
@@ -6934,7 +7520,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
 
 class PinModalComponent {
     userAccountService;
@@ -7098,13 +7687,13 @@ class PinModalComponent {
             console.error('Could not retrieve security question:' + JSON.stringify(err));
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PinModalComponent, deps: [{ token: i1$1.OepaUserAccountService }, { token: i1$2.FormBuilder }, { token: OepaPinService }, { token: i2$1.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PinModalComponent, deps: [{ token: OepaUserAccountService }, { token: i1$2.FormBuilder }, { token: OepaPinService }, { token: i2$1.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PinModalComponent, selector: "oepa-pin-modal", inputs: { attestationID: "attestationID", submitCallback: "submitCallback", submittingComponent: "submittingComponent" }, outputs: { close: "close" }, ngImport: i0, template: "<form [formGroup]=\"oepaSubmissionForm\">\n  <div class=\"modal-body\">\n\n    <div [hidden]=\"noPin\">\n      <div class=\"card-header\">\n          <div class=\"row\" *ngIf=\"pinAttestation.text\">\n              <div class=\"col-md-12\">\n                <div class=\"well\" [innerHTML]=\"pinAttestation.text\"></div>\n              </div>\n            </div>\n      </div>\n      <br>\n      <div class=\"card-header\" *ngIf=\"serviceAttestation\">\n          <div class=\"row\" *ngIf=\"serviceAttestation.text\">\n              <div class=\"col-md-12\">\n                <div class=\"well\" [innerHTML]=\"serviceAttestation.text\">\"</div>\n              </div>\n            </div>\n      </div>\n    </div>\n    <br>\n\n    <div class=\"row\" *ngIf=\"loadingAttestations\">\n      <div class=\"col-md-12\">\n        <div class=\"alert alert-info\">\n          <span class=\"spinner-border text-primary\" role=\"status\"></span> Loading PIN information...\n        </div>\n      </div>\n    </div>\n\n    <div [hidden]=\"loadingAttestations || noPin\">\n      <div class=\"row\">\n        <div class=\"col-md-12\">\n          <div class=\"form-group\">\n            <label style=\"padding: 5px;\"><b>Security Question:</b></label>\n            <label>{{securityQuestion.question}}</label>\n            <div>\n              <input  [ngClass]=\"{'is-invalid':showValidation && !oepaSubmissionForm.controls['securityAnswer'].valid}\"\n                formControlName=\"securityAnswer\" type=\"password\" class=\"form-control\" name=\"securityAnswer\" placeholder=\"Answer\" required>\n              <small class=\"invalid-feedback\" *ngIf=\"showValidation && !oepaSubmissionForm.controls['securityAnswer'].valid\">Answer to security question is required</small>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"row\">\n        <div class=\"col-md-12\">\n          <div class=\"form-group\">\n            <label><b>PIN: </b></label>\n            <div>\n              <input [ngClass]=\"{'is-invalid':showValidation && !oepaSubmissionForm.controls['securityPIN'].valid}\"\n                formControlName=\"securityPIN\" type=\"password\" class=\"form-control\" name=\"securityPIN\" placeholder=\"PIN\" required>\n              <small class=\"invalid-feedback\" *ngIf=\"showValidation && !oepaSubmissionForm.controls['securityPIN'].valid\">A valid PIN is required</small>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    \n    <div >\n      <div class=\"row\">\n        <div class=\"col-md-12\">\n          <!-- toggle hasPin message -->\n          <div *ngIf=\"noPin\">\n            <b>Attention:</b> Before you can submit, you first must activate your PIN. Cancel this submission, save the application/report and go back to the main eBusiness Home Page. \n            Select <b>MY Account- Request New PIN</b> to get started. <br>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"row\" *ngIf=\"errorMessage\">\n      <div class=\"col-md-12\">\n        <div class=\"alert alert-danger\" role=\"alert\">{{ errorMessage }}</div>\n      </div>\n    </div>\n\n  </div>\n\n\n  <div class=\"modal-footer\">\n    <span *ngIf=\"submitInProgress === true\" id=\"wait\"><span class=\"spinner-border text-primary\" role=\"status\"></span>Please wait...&nbsp;&nbsp;</span>\n    <button class=\"btn btn-primary mr-1\" (click)=\"submit()\" [disabled]=\"submitInProgress || !oepaSubmissionForm.valid\">Submit</button>\n    <button class=\"btn btn-primary mr-1\" (click)=\"cancel()\" [disabled]=\"submitInProgress\">Cancel</button>\n  </div>\n\n</form>", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PinModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-pin-modal', template: "<form [formGroup]=\"oepaSubmissionForm\">\n  <div class=\"modal-body\">\n\n    <div [hidden]=\"noPin\">\n      <div class=\"card-header\">\n          <div class=\"row\" *ngIf=\"pinAttestation.text\">\n              <div class=\"col-md-12\">\n                <div class=\"well\" [innerHTML]=\"pinAttestation.text\"></div>\n              </div>\n            </div>\n      </div>\n      <br>\n      <div class=\"card-header\" *ngIf=\"serviceAttestation\">\n          <div class=\"row\" *ngIf=\"serviceAttestation.text\">\n              <div class=\"col-md-12\">\n                <div class=\"well\" [innerHTML]=\"serviceAttestation.text\">\"</div>\n              </div>\n            </div>\n      </div>\n    </div>\n    <br>\n\n    <div class=\"row\" *ngIf=\"loadingAttestations\">\n      <div class=\"col-md-12\">\n        <div class=\"alert alert-info\">\n          <span class=\"spinner-border text-primary\" role=\"status\"></span> Loading PIN information...\n        </div>\n      </div>\n    </div>\n\n    <div [hidden]=\"loadingAttestations || noPin\">\n      <div class=\"row\">\n        <div class=\"col-md-12\">\n          <div class=\"form-group\">\n            <label style=\"padding: 5px;\"><b>Security Question:</b></label>\n            <label>{{securityQuestion.question}}</label>\n            <div>\n              <input  [ngClass]=\"{'is-invalid':showValidation && !oepaSubmissionForm.controls['securityAnswer'].valid}\"\n                formControlName=\"securityAnswer\" type=\"password\" class=\"form-control\" name=\"securityAnswer\" placeholder=\"Answer\" required>\n              <small class=\"invalid-feedback\" *ngIf=\"showValidation && !oepaSubmissionForm.controls['securityAnswer'].valid\">Answer to security question is required</small>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"row\">\n        <div class=\"col-md-12\">\n          <div class=\"form-group\">\n            <label><b>PIN: </b></label>\n            <div>\n              <input [ngClass]=\"{'is-invalid':showValidation && !oepaSubmissionForm.controls['securityPIN'].valid}\"\n                formControlName=\"securityPIN\" type=\"password\" class=\"form-control\" name=\"securityPIN\" placeholder=\"PIN\" required>\n              <small class=\"invalid-feedback\" *ngIf=\"showValidation && !oepaSubmissionForm.controls['securityPIN'].valid\">A valid PIN is required</small>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    \n    <div >\n      <div class=\"row\">\n        <div class=\"col-md-12\">\n          <!-- toggle hasPin message -->\n          <div *ngIf=\"noPin\">\n            <b>Attention:</b> Before you can submit, you first must activate your PIN. Cancel this submission, save the application/report and go back to the main eBusiness Home Page. \n            Select <b>MY Account- Request New PIN</b> to get started. <br>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"row\" *ngIf=\"errorMessage\">\n      <div class=\"col-md-12\">\n        <div class=\"alert alert-danger\" role=\"alert\">{{ errorMessage }}</div>\n      </div>\n    </div>\n\n  </div>\n\n\n  <div class=\"modal-footer\">\n    <span *ngIf=\"submitInProgress === true\" id=\"wait\"><span class=\"spinner-border text-primary\" role=\"status\"></span>Please wait...&nbsp;&nbsp;</span>\n    <button class=\"btn btn-primary mr-1\" (click)=\"submit()\" [disabled]=\"submitInProgress || !oepaSubmissionForm.valid\">Submit</button>\n    <button class=\"btn btn-primary mr-1\" (click)=\"cancel()\" [disabled]=\"submitInProgress\">Cancel</button>\n  </div>\n\n</form>" }]
-        }], ctorParameters: () => [{ type: i1$1.OepaUserAccountService }, { type: i1$2.FormBuilder }, { type: OepaPinService }, { type: i2$1.BsModalRef }], propDecorators: { attestationID: [{
+        }], ctorParameters: () => [{ type: OepaUserAccountService }, { type: i1$2.FormBuilder }, { type: OepaPinService }, { type: i2$1.BsModalRef }], propDecorators: { attestationID: [{
                 type: Input
             }], submitCallback: [{
                 type: Input
@@ -7233,13 +7822,13 @@ class ServerTimeoutModalComponent {
     close() {
         this.bsModalRef.hide();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ServerTimeoutModalComponent, deps: [{ token: i1$1.OepaUserAccountService }, { token: i2$1.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ServerTimeoutModalComponent, deps: [{ token: OepaUserAccountService }, { token: i2$1.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ServerTimeoutModalComponent, selector: "oepa-server-timeout-modal", inputs: { countdownSeconds: "countdownSeconds" }, outputs: { onKeepAlive: "onKeepAlive" }, ngImport: i0, template: "<div class=\"modal-header\">\n    <h4 class=\"modal-title pull-left\">\n        <span>Connection Timeout</span>\n        <span *ngIf=\"!connectionLost\">&nbsp;Pending</span>\n    </h4>\n    <button type=\"button\" class=\"close pull-right\" aria-label=\"Close\" (click)=\"close()\">\n        <span aria-hidden=\"true\">&times;</span>\n      </button>\n  </div>\n  <div class=\"modal-body\">\n    <div *ngIf=\"!connectionLost\">\n        Your connection is about to time out: {{mm}}:{{ss}}\n        <!-- : <countdown [config]=\"config\" (event)=\"handleEvent($event)\"></countdown> -->\n        <br/>\n        Click the button below to keep from being logged out.\n    </div>\n    <div *ngIf=\"connectionLost\">\n        Connection timeout.\n    </div>\n  </div>\n  <div class=\"modal-footer\">\n    <div class=\"row\">\n        <div *ngIf=\"errorMessage\" class=\"col-sm-12\">\n            <div  class=\"alert alert-danger\">\n                {{errorMessage}}\n            </div>\n        </div>\n    </div>\n    <div class=\"col-sm-12 text-right\">\n        <button *ngIf=\"!connectionLost\" type=\"button\" class=\"btn btn-primary mr-2\" (click)=\"keepAlive()\">Stay Logged In</button>\n        <button *ngIf=\"connectionLost\" type=\"button\" class=\"btn btn-primary mr-2\" (click)=\"close()\">Close</button>\n    </div>\n  </div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ServerTimeoutModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'oepa-server-timeout-modal', template: "<div class=\"modal-header\">\n    <h4 class=\"modal-title pull-left\">\n        <span>Connection Timeout</span>\n        <span *ngIf=\"!connectionLost\">&nbsp;Pending</span>\n    </h4>\n    <button type=\"button\" class=\"close pull-right\" aria-label=\"Close\" (click)=\"close()\">\n        <span aria-hidden=\"true\">&times;</span>\n      </button>\n  </div>\n  <div class=\"modal-body\">\n    <div *ngIf=\"!connectionLost\">\n        Your connection is about to time out: {{mm}}:{{ss}}\n        <!-- : <countdown [config]=\"config\" (event)=\"handleEvent($event)\"></countdown> -->\n        <br/>\n        Click the button below to keep from being logged out.\n    </div>\n    <div *ngIf=\"connectionLost\">\n        Connection timeout.\n    </div>\n  </div>\n  <div class=\"modal-footer\">\n    <div class=\"row\">\n        <div *ngIf=\"errorMessage\" class=\"col-sm-12\">\n            <div  class=\"alert alert-danger\">\n                {{errorMessage}}\n            </div>\n        </div>\n    </div>\n    <div class=\"col-sm-12 text-right\">\n        <button *ngIf=\"!connectionLost\" type=\"button\" class=\"btn btn-primary mr-2\" (click)=\"keepAlive()\">Stay Logged In</button>\n        <button *ngIf=\"connectionLost\" type=\"button\" class=\"btn btn-primary mr-2\" (click)=\"close()\">Close</button>\n    </div>\n  </div>\n" }]
-        }], ctorParameters: () => [{ type: i1$1.OepaUserAccountService }, { type: i2$1.BsModalRef }], propDecorators: { countdownSeconds: [{
+        }], ctorParameters: () => [{ type: OepaUserAccountService }, { type: i2$1.BsModalRef }], propDecorators: { countdownSeconds: [{
                 type: Input
             }], onKeepAlive: [{
                 type: Output
@@ -7247,9 +7836,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class ShoppingCartService {
     http;
+    ebizRootURL;
     paymentUrl = '/ebiz/api/v1/payment/';
-    constructor(http) {
+    constructor(http, ebizRootURL) {
         this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.paymentUrl = ebizRootURL + this.paymentUrl;
     }
     /**
      * Retrieve a shopping cart for the current user for the provided serviceName.
@@ -7319,7 +7911,7 @@ class ShoppingCartService {
         const url = this.paymentUrl + '/shoppingCart/' + cart.serviceName + '/checkout';
         return this.http.post(url, cart, { headers: headers, responseType: 'json' });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShoppingCartService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShoppingCartService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShoppingCartService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShoppingCartService, decorators: [{
@@ -7327,7 +7919,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
 
 class ShoppingCartViewComponent {
     router;
@@ -8192,7 +8787,230 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Input
             }] } });
 
+class LynxService {
+    http;
+    ebizRootURL;
+    lynxUrl = '/ebiz/api/v1/lynx/';
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.lynxUrl = ebizRootURL + this.lynxUrl;
+    }
+    retrieveProjects() {
+        const headers = new HttpHeaders();
+        headers.append('Content-type', 'application/json');
+        return this.http.get(this.lynxUrl + 'projects', { headers: headers });
+    }
+    retrieveProjectMetadata(projectID) {
+        const headers = new HttpHeaders();
+        headers.append('Content-type', 'application/json');
+        return this.http.get(this.lynxUrl + 'metadata/' + projectID, { headers: headers });
+    }
+    storeImage(attachment, projectID) {
+        const headers = new HttpHeaders();
+        headers.append('Content-type', 'application/json');
+        let url = this.lynxUrl + 'project/' + projectID + '/' + 'image';
+        return this.http.post(url, attachment, { headers: headers });
+    }
+    tagImage(imageMetadata, imageID, projectID) {
+        const headers = new HttpHeaders();
+        headers.append('Content-type', 'application/json');
+        let url = this.lynxUrl + 'project/' + projectID + '/' + 'image/' + imageID + '/metadata';
+        return this.http.post(url, imageMetadata, { headers: headers });
+    }
+    downloadImage(imageID) {
+        const headers = new HttpHeaders();
+        headers.append('Content-type', 'application/json;odata=verbose');
+        return this.http.get(this.lynxUrl + 'image' + '/' + imageID, { headers: headers, responseType: 'blob' });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
+class AccountService {
+    http;
+    ebizRootURL;
+    URL = '/ebiz/api/v1/accounts';
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.URL = ebizRootURL + this.URL;
+    }
+    retrieveRolesForService(serviceName) {
+        return this.http.get(this.URL + "/roles/" + serviceName);
+    }
+    retrieveUsersForService(serviceName) {
+        return this.http.get(this.URL + "/users/service/" + serviceName);
+    }
+    searchAccounts(criteria) {
+        return this.http.post(this.URL + "/search", criteria);
+    }
+    retrieveServicesByServiceType(serviceType) {
+        return this.http.get(`${this.URL}/services/serviceTypes/${serviceType}/list`);
+    }
+    retrieveServiceNamesByServiceType(serviceType) {
+        return this.http.get(`${this.URL}/services/serviceTypes/${serviceType}/names`);
+    }
+    retrieveAllServices() {
+        return this.http.get(`${this.URL}/services/serviceTypes/all`);
+    }
+    retrieveService(name) {
+        return this.http.get(`${this.URL}/services/serviceTypes/${name}`);
+    }
+    retrieveAttestationByType(type) {
+        return this.http.get(`${this.URL}/attestation/${type}`);
+    }
+    updateServiceStatus(service) {
+        return this.http.post(this.URL + "/updateServiceStatus", service);
+    }
+    searchAccountServiceAllows(criteria) {
+        return this.http.post(this.URL + "/searchAccountServiceAllows", criteria);
+    }
+    createAccountServiceAllow(accountServiceAllow) {
+        return this.http.post(this.URL + '/createAccountServiceAllow/', accountServiceAllow);
+    }
+    deleteAccountServiceAllow(accountServiceAllow) {
+        return this.http
+            .delete(this.URL + '/deleteAccountServiceAllow/service/' + accountServiceAllow.serviceName + '/account/' + accountServiceAllow.userID);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccountService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
+class ParameterService {
+    http;
+    ebizRootURL;
+    baseUrl = '/ebiz/api/v1/parameters';
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.baseUrl = ebizRootURL + this.baseUrl;
+    }
+    retrieveParameterByName(parameterName) {
+        let url = this.baseUrl + '/names/' + parameterName;
+        return this.http.get(url);
+    }
+    retrieveParameterByID(parameterID) {
+        let url = this.baseUrl + '/' + parameterID;
+        return this.http.get(url);
+    }
+    createParameter(parameter) {
+        let url = this.baseUrl;
+        return this.http.post(url, parameter);
+    }
+    deleteParameter(parameterID) {
+        let url = this.baseUrl + '/' + parameterID;
+        return this.http.delete(url);
+    }
+    deleteParameterByName(parameterName) {
+        let url = this.baseUrl + '/names/' + parameterName;
+        return this.http.delete(url);
+    }
+    retrieveParameterByPrefix(prefix) {
+        let url = this.baseUrl + '/namePrefix/' + prefix;
+        return this.http.get(url);
+    }
+    updateParameter(parameter) {
+        let url = this.baseUrl + '/' + parameter.id;
+        return this.http.put(url, parameter);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParameterService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParameterService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParameterService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
+class OepaReferenceService {
+    http;
+    ebizRootURL;
+    countiesUrl = '/ebiz/api/v1/references/counties/state';
+    districtsUrl = '/ebiz/api/v1/references/districts';
+    doLaaTypessUrl = '/ebiz/api/v1/asbestos/references/doLaaTypes';
+    constructor(http, ebizRootURL) {
+        this.http = http;
+        this.ebizRootURL = ebizRootURL;
+        this.countiesUrl = ebizRootURL + this.countiesUrl;
+        this.districtsUrl = ebizRootURL + this.districtsUrl;
+        this.doLaaTypessUrl = ebizRootURL + this.doLaaTypessUrl;
+    }
+    /**
+     * Retrieve counties
+     */
+    getCounties(state) {
+        return this.http.get(this.countiesUrl + '/' + state);
+    }
+    /**
+     * Retrieve districts
+    */
+    getDistricts() {
+        return this.http.get(this.districtsUrl);
+    }
+    /**
+     * Retrieve DO/LAAs
+    */
+    getDoLaaTypes() {
+        return this.http.get(this.doLaaTypessUrl);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaReferenceService, deps: [{ token: i1.HttpClient }, { token: 'ebizRootURL' }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaReferenceService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaReferenceService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['ebizRootURL']
+                }] }] });
+
 class CommonFormsModule {
+    static forRoot(ebizRootURL) {
+        return {
+            ngModule: CommonFormsModule,
+            providers: [
+                AccountSearchService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                AccountService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                EdocAttachmentService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                EntityService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                LynxService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                OepaAddressService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                OepaFileUtilService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                OepaPinService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                OepaReferenceService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                OepaUserAccountService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                ParameterService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                ParamsHelpService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                ShoppingCartService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+                TableExportService, { provide: 'ebizRootURL', useValue: ebizRootURL },
+            ]
+        };
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CommonFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: CommonFormsModule, declarations: [AccountSearchInputComponent, AccountSearchModalComponent,
             ActionBtnComponent, ActionBtnModalComponent, AddressComponent, ZipCodeComponent,
@@ -8368,49 +9186,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{ selector: 'oepa-blank', template: "\n" }]
         }], ctorParameters: () => [] });
 
-class LynxService {
-    http;
-    lynxUrl = '/ebiz/api/v1/lynx/';
-    constructor(http) {
-        this.http = http;
-    }
-    retrieveProjects() {
-        const headers = new HttpHeaders();
-        headers.append('Content-type', 'application/json');
-        return this.http.get(this.lynxUrl + 'projects', { headers: headers });
-    }
-    retrieveProjectMetadata(projectID) {
-        const headers = new HttpHeaders();
-        headers.append('Content-type', 'application/json');
-        return this.http.get(this.lynxUrl + 'metadata/' + projectID, { headers: headers });
-    }
-    storeImage(attachment, projectID) {
-        const headers = new HttpHeaders();
-        headers.append('Content-type', 'application/json');
-        let url = this.lynxUrl + 'project/' + projectID + '/' + 'image';
-        return this.http.post(url, attachment, { headers: headers });
-    }
-    tagImage(imageMetadata, imageID, projectID) {
-        const headers = new HttpHeaders();
-        headers.append('Content-type', 'application/json');
-        let url = this.lynxUrl + 'project/' + projectID + '/' + 'image/' + imageID + '/metadata';
-        return this.http.post(url, imageMetadata, { headers: headers });
-    }
-    downloadImage(imageID) {
-        const headers = new HttpHeaders();
-        headers.append('Content-type', 'application/json;odata=verbose');
-        return this.http.get(this.lynxUrl + 'image' + '/' + imageID, { headers: headers, responseType: 'blob' });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LynxService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
-
 const digitRegExp = /\d/;
 /**
  * This function is for use with th TextMask directive and creates a mask for integers
@@ -8450,50 +9225,6 @@ function convertToMask(strNumber) {
         .map((char) => digitRegExp);
 }
 
-class ParameterService {
-    http;
-    baseUrl = '/ebiz/api/v1/parameters';
-    constructor(http) {
-        this.http = http;
-    }
-    retrieveParameterByName(parameterName) {
-        let url = this.baseUrl + '/names/' + parameterName;
-        return this.http.get(url);
-    }
-    retrieveParameterByID(parameterID) {
-        let url = this.baseUrl + '/' + parameterID;
-        return this.http.get(url);
-    }
-    createParameter(parameter) {
-        let url = this.baseUrl;
-        return this.http.post(url, parameter);
-    }
-    deleteParameter(parameterID) {
-        let url = this.baseUrl + '/' + parameterID;
-        return this.http.delete(url);
-    }
-    deleteParameterByName(parameterName) {
-        let url = this.baseUrl + '/names/' + parameterName;
-        return this.http.delete(url);
-    }
-    retrieveParameterByPrefix(prefix) {
-        let url = this.baseUrl + '/namePrefix/' + prefix;
-        return this.http.get(url);
-    }
-    updateParameter(parameter) {
-        let url = this.baseUrl + '/' + parameter.id;
-        return this.http.put(url, parameter);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParameterService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParameterService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ParameterService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
-
 class ValidationService {
     constructor() { }
     processValidators(form, formValidators) {
@@ -8684,6 +9415,78 @@ const TV_APP_EU_GROUP_IMG = BASE64_PREFIX + 'R0lGODlhEAAQANUAAO/v7+zqzOfn59/f39f
 const USER_IMG = BASE64_PREFIX + 'R0lGODlhEwAQALMAAM6aMf///84AAAAEAK2qlO/r74SChAICbsbDxv/PYzFlnAAAAP///wAAAAAAAAAAACH5BAEAAAwALAAAAAATABAAAARbkMkZapXWTrm6X1i2fd0AMlkwfglypusytMkrTh1Cd6GGL7RCggCCrWjE3mXDWCAAOpsP9zR4lKqfE3DC4hSKwyLQRd2aYfCBTDkv1Ie4QrpEgxUCAbh4Tt1SEQA7';
 const V_ELLIPSIS_IMG = BASE64_PREFIX + 'R0lGODlhEAAbAKEDABERESIiIkRERP///yH+FUNyZWF0ZWQgd2l0aCBUaGUgR0lNUAAh+QQBCgADACwAAAAAEAAbAAACIJyPqcvtrwAQcEgKQ8C1+w9+V6VxThmm6uqh0Jht7EwXADs=';
 
+class CustomEncoder {
+    encodeKey(key) {
+        return encodeURIComponent(key);
+    }
+    encodeValue(value) {
+        return encodeURIComponent(value);
+    }
+    decodeKey(key) {
+        return decodeURIComponent(key);
+    }
+    decodeValue(value) {
+        return decodeURIComponent(value);
+    }
+}
+
+class OepaHttpInterceptor {
+    userAccountService;
+    defaultTimeout = 5 * 60 * 1000;
+    constructor(userAccountService) {
+        this.userAccountService = userAccountService;
+    }
+    /**
+     * Add a timestamp as a query parameter to all http requests
+     * @param req
+     * @param next
+     */
+    intercept(req, next) {
+        this.userAccountService.resetIdleTime();
+        const paramsReq = req.clone({ params: req.params.set('oepats', new Date().getTime().toString()) });
+        const params = new HttpParams({ encoder: new CustomEncoder(), fromString: paramsReq.params.toString() });
+        const httpUrlEncoding = new HttpUrlEncodingCodec();
+        const changedReq = req.clone({ params, url: httpUrlEncoding.encodeValue(req.url) });
+        const timeoutValue = req.headers.get('timeout') || this.defaultTimeout;
+        const timeoutValueNumeric = Number(timeoutValue);
+        return next.handle(changedReq).pipe(timeout(timeoutValueNumeric), catchError((error) => {
+            let msg = error.headers ? error.headers.get('OEPA_ERROR') : '';
+            console.log('msg from header = ' + msg);
+            console.log('ERROR: [' + req.url + ']: ' + JSON.stringify(error));
+            msg = msg || error.error.message || error.error.errorMessage || 'Server error.';
+            if (msg) {
+                if (msg.indexOf('User account is required') > -1
+                    || msg.toUpperCase().indexOf('USERID IS MISSING') > -1) {
+                    alert(msg);
+                    this.userAccountService.redirectToLogout();
+                }
+                msg = this.shortenErrorMessage(msg);
+            }
+            return throwError(() => msg);
+        }));
+    }
+    /**
+     * Shorten error message in the event of a JSON parse error
+     */
+    shortenErrorMessage(msg) {
+        const JSONParseMsg = 'JSON parse error:';
+        const JSONParseIdx = msg.indexOf(JSONParseMsg);
+        if (JSONParseIdx > -1) {
+            const semicolonIdx = msg.indexOf(';');
+            msg = msg.substring(JSONParseMsg.length, semicolonIdx);
+        }
+        return msg;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaHttpInterceptor, deps: [{ token: OepaUserAccountService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaHttpInterceptor, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OepaHttpInterceptor, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: OepaUserAccountService }] });
+
 /*
  * Public API Surface of oepa-ui-lib
  */
@@ -8692,5 +9495,5 @@ const V_ELLIPSIS_IMG = BASE64_PREFIX + 'R0lGODlhEAAbAKEDABERESIiIkRERP///yH+FUNy
  * Generated bundle index. Do not edit.
  */
 
-export { AccountSearchInputComponent, AccountSearchModalComponent, ActionBtnComponent, ActionBtnModalComponent, AddressComponent, ArrayFilterPipe, ArraySortPipe, BlankComponent, CATALOG_IMG, CAUTION_IMG, CE_IMG, CHARGE_CO_IMG, CHECK_IMG, CheckboxComponent, CheckboxInputComponent, CommentModalComponent, CommonFormsModule, ConfirmationModalComponent, ContactComponent, DEFINITIONS_IMG, DELETE_IMG, DIALOG_IMG, DOWNLOAD_IMG, DateInputComponent, DateInputModalComponent, DatepickerComponent, DaterangepickerComponent, DualListBoxComponent, ERROR_IMG, EU_CAUTION_IMG, EU_IMG, EXCLUDED_EU, EbizAddressComponent, EdocAttachmentComponent, EdocAttachmentService, EntityService, FACILITY_IMG, FOLDER_CLOSED_IMG, FOLDER_OPEN_IMG, FileUploadComponent, GLOBAL_HELP_IMG, GREEN_CHECK_IMG, GREEN_DOT_IMG, ICON_DOC_IMG, ICON_DWG_IMG, ICON_PDF_IMG, ICON_TXT_IMG, ICON_XLS_IMG, INACTIVE_USER_IMG, INSIGNIFICANT_EU_CAUTION_IMG, INSIGNIFICANT_EU_IMG, INSIGNIGICANT_EU_NO_APP_REQS_CAUTION_IMG, INSIGNIGICANT_EU_NO_APP_REQS_IMG, LOCK_ICON1_IMG, LOCK_ICON1_PARTIAL_IMG, LynxImageUploadComponent, LynxService, MessageComponent, MessageListComponent, MultiFileUploadComponent, NOT_INCLUDEABLE_EU_IMG, NotesModalComponent, NumericInputComponent, NumericInputDirective, OEPAErrorMessageComponent, OEPAWaitMessageComponent, OepaAddressService, OepaFormsService, OepaMessage, OepaMessageType, OepaPinService, OepaTableCellClassnamePipe, OepaTableCellColSpanPipe, OepaTableCellIconClassnamePipe, OepaTableCellImgSrcPipe, OepaTableCellInnerHtmlPipe, OepaTableCellValuePipe, OepaTableFilteringDirective, OepaTableSortingDirective, OrganizationCreateModalComponent, OrganizationSearchInputComponent, OrganizationSearchModalComponent, PDF_IMG, PERMIT_EU_GROUP_IMG, PERMIT_EU_IMG, PERMIT_IMG, PROCESS_IMG, PTableComponent, ParameterService, ParamsHelpButtonComponent, PersonCreateModalComponent, PersonSearchInputComponent, PersonSearchModalComponent, PhoneNumberComponent, PinModalComponent, PlaceCreateModalComponent, PlaceSearchInputComponent, PlaceSearchModalComponent, RED_DOT_IMG, REPORT_EU_GROUP_CAUTION_IMG, REPORT_EU_GROUP_IMG, REPORT_IMG, REPORT_PERIOD_CAUTION_IMG, REPORT_PERIOD_IMG, SCENARIO_IMG, SHUTDOWN_EU_IMG, SHUTDOWN_FACILITY_IMG, STACK_IMG, SelectInputComponent, ServerTimeoutModalComponent, ShoppingCartService, ShoppingCartSummaryComponent, ShoppingCartViewComponent, SortOptions, StartEndTimepickerComponent, TOWER_IMG, TRIVIAL_EU_CAUTION_IMG, TRIVIAL_EU_IMG, TV_APP_EU_GROUP_IMG, TableComponent, TableExportService, TableService, TemplateConfirmationModalComponent, TextAreaInputComponent, TextInputComponent, TimeoutModalComponent, TimepickerComponent, USER_IMG, V_ELLIPSIS_IMG, ValidationService, YesNoBooleanComponent, YesNoComponent, YesNoOtherInputComponent, ZipCodeComponent, oepaCreateIntegerMask };
+export { AccountSearchInputComponent, AccountSearchModalComponent, ActionBtnComponent, ActionBtnModalComponent, AddressComponent, ArrayFilterPipe, ArraySortPipe, BlankComponent, CATALOG_IMG, CAUTION_IMG, CE_IMG, CHARGE_CO_IMG, CHECK_IMG, CheckboxComponent, CheckboxInputComponent, CommentModalComponent, CommonFormsModule, ConfirmationModalComponent, ContactComponent, CustomEncoder, DEFINITIONS_IMG, DELETE_IMG, DIALOG_IMG, DOWNLOAD_IMG, DateInputComponent, DateInputModalComponent, DatepickerComponent, DaterangepickerComponent, DualListBoxComponent, ERROR_IMG, EU_CAUTION_IMG, EU_IMG, EXCLUDED_EU, EbizAddressComponent, EdocAttachmentComponent, EdocAttachmentService, EntityService, FACILITY_IMG, FOLDER_CLOSED_IMG, FOLDER_OPEN_IMG, FileUploadComponent, GLOBAL_HELP_IMG, GREEN_CHECK_IMG, GREEN_DOT_IMG, ICON_DOC_IMG, ICON_DWG_IMG, ICON_PDF_IMG, ICON_TXT_IMG, ICON_XLS_IMG, INACTIVE_USER_IMG, INSIGNIFICANT_EU_CAUTION_IMG, INSIGNIFICANT_EU_IMG, INSIGNIGICANT_EU_NO_APP_REQS_CAUTION_IMG, INSIGNIGICANT_EU_NO_APP_REQS_IMG, LOCK_ICON1_IMG, LOCK_ICON1_PARTIAL_IMG, LynxImageUploadComponent, LynxService, MessageComponent, MessageListComponent, MultiFileUploadComponent, NOT_INCLUDEABLE_EU_IMG, NotesModalComponent, NumericInputComponent, NumericInputDirective, OEPAErrorMessageComponent, OEPAWaitMessageComponent, OepaAddressService, OepaFormsService, OepaHttpInterceptor, OepaMessage, OepaMessageType, OepaPinService, OepaTableCellClassnamePipe, OepaTableCellColSpanPipe, OepaTableCellIconClassnamePipe, OepaTableCellImgSrcPipe, OepaTableCellInnerHtmlPipe, OepaTableCellValuePipe, OepaTableFilteringDirective, OepaTableSortingDirective, OrganizationCreateModalComponent, OrganizationSearchInputComponent, OrganizationSearchModalComponent, PDF_IMG, PERMIT_EU_GROUP_IMG, PERMIT_EU_IMG, PERMIT_IMG, PROCESS_IMG, PTableComponent, ParameterService, ParamsHelpButtonComponent, PersonCreateModalComponent, PersonSearchInputComponent, PersonSearchModalComponent, PhoneNumberComponent, PinModalComponent, PlaceCreateModalComponent, PlaceSearchInputComponent, PlaceSearchModalComponent, RED_DOT_IMG, REPORT_EU_GROUP_CAUTION_IMG, REPORT_EU_GROUP_IMG, REPORT_IMG, REPORT_PERIOD_CAUTION_IMG, REPORT_PERIOD_IMG, SCENARIO_IMG, SHUTDOWN_EU_IMG, SHUTDOWN_FACILITY_IMG, STACK_IMG, SelectInputComponent, ServerTimeoutModalComponent, ShoppingCartService, ShoppingCartSummaryComponent, ShoppingCartViewComponent, SortOptions, StartEndTimepickerComponent, TOWER_IMG, TRIVIAL_EU_CAUTION_IMG, TRIVIAL_EU_IMG, TV_APP_EU_GROUP_IMG, TableComponent, TableExportService, TableService, TemplateConfirmationModalComponent, TextAreaInputComponent, TextInputComponent, TimeoutModalComponent, TimepickerComponent, USER_IMG, V_ELLIPSIS_IMG, ValidationService, YesNoBooleanComponent, YesNoComponent, YesNoOtherInputComponent, ZipCodeComponent, oepaCreateIntegerMask };
 //# sourceMappingURL=ohioepa-oepa-ui-lib.mjs.map