moh-common-lib
Version:
A library of Angular components, services, and styles for B.C. Government Ministry of Health (MoH).
1 lines • 185 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/common"),require("zxcvbn"),require("ngx-bootstrap/progressbar"),require("ngx-bootstrap/modal"),require("ngx-bootstrap/typeahead"),require("date-fns/getDaysInMonth"),require("date-fns/isAfter"),require("date-fns/isBefore"),require("date-fns/startOfToday"),require("date-fns/addYears"),require("date-fns/subYears"),require("ngx-mydatepicker"),require("pdfjs-dist/legacy/build/pdf"),require("pdfjs-dist/legacy/build/pdf.worker.entry"),require("angular2-text-mask"),require("@ng-select/ng-select"),require("angular2-uuid"),require("moment"),require("ngx-bootstrap/accordion"),require("rxjs/operators"),require("@angular/common/http"),require("@angular/forms"),require("rxjs"),require("date-fns"),require("@angular/router"),require("@angular/core")):"function"==typeof define&&define.amd?define("moh-common-lib",["exports","@angular/common","zxcvbn","ngx-bootstrap/progressbar","ngx-bootstrap/modal","ngx-bootstrap/typeahead","date-fns/getDaysInMonth","date-fns/isAfter","date-fns/isBefore","date-fns/startOfToday","date-fns/addYears","date-fns/subYears","ngx-mydatepicker","pdfjs-dist/legacy/build/pdf","pdfjs-dist/legacy/build/pdf.worker.entry","angular2-text-mask","@ng-select/ng-select","angular2-uuid","moment","ngx-bootstrap/accordion","rxjs/operators","@angular/common/http","@angular/forms","rxjs","date-fns","@angular/router","@angular/core"],t):t(e["moh-common-lib"]={},e.ng.common,e.zxcvbn_,e.progressbar,e.modal,e.typeahead,e.getDaysInMonth,e.isAfter,e.isBefore,e.startOfToday,e.addYears,e.subYears,e.ngxMydatepicker,e.PDFJS_,e.pdf_worker_entry,e.angular2TextMask,e.ngSelect,e.angular2Uuid,e.moment_,e.accordion,e.rxjs.operators,e.ng.common.http,e.ng.forms,e.rxjs,e.dateFns,e.ng.router,e.ng.core)}(this,function(e,t,r,n,o,i,a,s,l,d,c,u,p,h,m,g,f,y,b,v,C,I,w,E,x,S,A){"use strict";a=a&&a.hasOwnProperty("default")?a["default"]:a,s=s&&s.hasOwnProperty("default")?s["default"]:s,l=l&&l.hasOwnProperty("default")?l["default"]:l,d=d&&d.hasOwnProperty("default")?d["default"]:d,c=c&&c.hasOwnProperty("default")?c["default"]:c,u=u&&u.hasOwnProperty("default")?u["default"]:u;var D=function(){function e(){}return e.decorators=[{type:A.Component,args:[{selector:"common-core-breadcrumb",template:'<nav class="breadcrumb d-flex justify-content-between horizontal-scroll" aria-label="breadcrumb">\r\n <ng-content select="[left]"></ng-content>\r\n <ng-content class=\'d-flex\' select="[center]"></ng-content>\r\n <ng-content select="[right]"></ng-content>\r\n</nav>\r\n',styles:[".breadcrumb{display:flex;justify-content:space-between;background-color:transparent}@media (min-width:992px){.breadcrumb{flex-wrap:nowrap}}.horizontal-scroll{overflow-x:scroll;overflow-y:hidden}.horizontal-scroll::-webkit-scrollbar{background:0 0;height:5px}.horizontal-scroll::-webkit-scrollbar-thumb{background:#5475a7;border-radius:10px}"]}]}],e.ctorParameters=function(){return[]},e}();function _(e){void 0===e&&(e=0),"scrollBehavior"in document.documentElement.style?window.scrollTo({top:e,behavior:"smooth"}):window.scrollTo(0,e)}function M(e){void 0===e&&(e=-75);var t=document.querySelector("common-error-container .text-danger");t&&_(t.getBoundingClientRect().top+window.pageYOffset+e)}var O=function(){function e(){this.submitLabel="Continue",this.canContinue=!0,this.isLoading=!1,this.defaultColor=!0,this.btnClick=new A.EventEmitter,this.scrollToErrorsOnSubmit=!0}return e.prototype.ngOnInit=function(){},e.prototype.onClick=function(e){return!this.isLoading&&this.canContinue&&(this.btnClick.emit(e),this.scrollToErrorsOnSubmit&&setTimeout(M,50)),e.stopPropagation(),!1},e.decorators=[{type:A.Component,args:[{selector:"common-form-action-bar",template:'<div class="form-action-bar form-bar" [ngClass]="{disabled: !canContinue}">\r\n <button class="btn btn-lg {{defaultColor ? \'btn-primary\' : \'btn-secondary\' }} submit"\r\n (click)="onClick($event)"\r\n [ngClass]="{disabled: !canContinue || isLoading}">\r\n <ng-container *ngIf="!isLoading; else loadingSpinner"> {{submitLabel}} </ng-container>\r\n \r\n </button>\r\n</div>\r\n\r\n<ng-template #loadingSpinner>\r\n <i class="fa fa-spinner fa-pulse fa-fw"></i>\r\n</ng-template>',viewProviders:[{provide:w.ControlContainer,useExisting:A.forwardRef(function(){return w.NgForm})}],styles:[".form-action-bar{display:flex;justify-content:flex-end;padding:1em;background-color:#cdd9e4;transition:background-color .3s;position:-webkit-sticky;position:-moz-sticky;position:-ms-sticky;position:-o-sticky;position:sticky;bottom:0;z-index:10;left:5rem;right:5rem}.form-action-bar.disabled{background-color:#d5d9dd}@media (max-width:991.98px){.form-action-bar{left:2.5rem;right:2.5rem}}.submit{min-width:240px}@media (max-width:767.98px){.form-action-bar{width:calc(100% + 30px);margin-left:-15px}.submit{min-width:100%}}.btn{white-space:normal!important;word-wrap:break-word}.btn-secondary.disabled{color:#000}"]}]}],e.ctorParameters=function(){return[]},e.propDecorators={submitLabel:[{type:A.Input}],canContinue:[{type:A.Input}],isLoading:[{type:A.Input}],defaultColor:[{type:A.Input}],btnClick:[{type:A.Output}],scrollToErrorsOnSubmit:[{type:A.Input}]},e}(),N=function(){function e(){this.layout="default"}return e.prototype.ngOnInit=function(){},e.decorators=[{type:A.Component,args:[{selector:"common-page-framework",template:'<div class="row" [ngSwitch]="layout">\r\n\r\n <ng-container *ngSwitchCase="\'default\'">\r\n <div class="col-md-8">\r\n <div class="px-lg-4 px-md-3 py-3">\r\n <ng-container *ngTemplateOutlet="content"></ng-container>\r\n </div>\r\n </div>\r\n <div class="col-md-4 aside-col">\r\n <div class=\'pr-lg-5 pr-md-4 py-2\'>\r\n <ng-container *ngTemplateOutlet="aside"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngSwitchCase="\'double\'">\r\n <div class="col-md-6">\r\n <div class="px-lg-5 px-md-3 py-3">\r\n <ng-container *ngTemplateOutlet="content"></ng-container>\r\n </div>\r\n </div>\r\n <div class="col-md-6">\r\n <div class=\'px-lg-5 px-md-3 py-3\'>\r\n <ng-container *ngTemplateOutlet="aside"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase="\'single\'">\r\n <div class="col-md-8 offset-lg-2">\r\n <div class="px-lg-5 px-md-3 py-3">\r\n <ng-container *ngTemplateOutlet="content"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase="\'blank\'">\r\n <div class="col-sm-12">\r\n <div class="px-lg-5 px-md-3 py-3">\r\n <ng-container *ngTemplateOutlet="content"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n<ng-container *ngTemplateOutlet="submit"></ng-container>\r\n\r\n\r\n\x3c!-- We use ng-template here to get around a bug with having multiple ng-contents in one template. By default, if there are duplicate ng-contents in a template Angular will select the very first one - even if latter ones are \'removed\' by ngSwitch or ngIf.--\x3e\r\n<ng-template #content>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n<ng-template #aside>\r\n <ng-content select=\'aside\'></ng-content>\r\n</ng-template>\r\n\r\n<ng-template #submit>\r\n <ng-content select=\'common-form-action-bar\'></ng-content>\r\n <ng-content select=\'common-form-submit-bar\'></ng-content>\r\n</ng-template>\r\n',encapsulation:A.ViewEncapsulation.None,styles:['common-page-framework{background:#fcfcfc;display:block;padding-left:30px;padding-right:30px;min-height:calc(100vh - 280px)}common-page-framework common-form-action-bar>.form-bar,common-page-framework common-form-submit-bar>.form-bar{background-color:red!important}common-page-framework common-form-action-bar .btn,common-page-framework common-form-submit-bar .btn{font-size:0}common-page-framework common-form-action-bar .btn:after,common-page-framework common-form-submit-bar .btn:after{font-size:1rem;content:"FORM BAR MUST BE PLACED OUTSIDE OF COMMON-PAGE-FRAMEWORK"}.h5,h5{font-size:1rem;font-weight:700;margin-bottom:0}p+.h5,p+h5{margin-top:1.5rem}.aside-col aside{background:#f2f2f2;padding:1em;border-radius:5px}@media (min-width:768px){.aside-col aside{margin-top:1rem}}']}]}],e.propDecorators={layout:[{type:A.Input}]},e}(),L=function(e,t){return(L=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r])})(e,t)};function P(e,t){function r(){this.constructor=e}L(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}function T(t,a,s,l){return new(s||(s=Promise))(function(e,r){function n(e){try{i(l.next(e))}catch(t){r(t)}}function o(e){try{i(l["throw"](e))}catch(t){r(t)}}function i(t){t.done?e(t.value):new s(function(e){e(t.value)}).then(n,o)}i((l=l.apply(t,a||[])).next())})}function k(n,o){var i,a,s,e,l={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]};return e={next:t(0),"throw":t(1),"return":t(2)},"function"==typeof Symbol&&(e[Symbol.iterator]=function(){return this}),e;function t(t){return function(e){return function r(e){if(i)throw new TypeError("Generator is already executing.");for(;l;)try{if(i=1,a&&(s=2&e[0]?a["return"]:e[0]?a["throw"]||((s=a["return"])&&s.call(a),0):a.next)&&!(s=s.call(a,e[1])).done)return s;switch(a=0,s&&(e=[2&e[0],s.value]),e[0]){case 0:case 1:s=e;break;case 4:return l.label++,{value:e[1],done:!1};case 5:l.label++,a=e[1],e=[0];continue;case 7:e=l.ops.pop(),l.trys.pop();continue;default:if(!(s=0<(s=l.trys).length&&s[s.length-1])&&(6===e[0]||2===e[0])){l=0;continue}if(3===e[0]&&(!s||e[1]>s[0]&&e[1]<s[3])){l.label=e[1];break}if(6===e[0]&&l.label<s[1]){l.label=s[1],s=e;break}if(s&&l.label<s[2]){l.label=s[2],l.ops.push(e);break}s[2]&&l.ops.pop(),l.trys.pop();continue}e=o.call(n,l)}catch(t){e=[6,t],a=0}finally{i=s=0}if(5&e[0])throw e[1];return{value:e[0]?e[1]:void 0,done:!0}}([t,e])}}}function R(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,o,i=r.call(e),a=[];try{for(;(void 0===t||0<t--)&&!(n=i.next()).done;)a.push(n.value)}catch(s){o={error:s}}finally{try{n&&!n.done&&(r=i["return"])&&r.call(i)}finally{if(o)throw o.error}}return a}function B(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(R(arguments[t]));return e}var V=function Lt(){this.objectId=y.UUID.UUID()},q=r,j=function(t){function e(){var e=t.call(this)||this;return e.label="Password",e.isRequired=!0,e.isDisabled=!1,e.minLen="8",e.maxLen="32",e.showPasswordStrength=!1,e.objectID="password_"+e.objectId,e.passwordChange=new A.EventEmitter,e.blurEvent=new A.EventEmitter,e.hideValue=!0,e.strengthPercentage=0,e.requiredMsgSeg=" is required.",e.minLenMsgSeg1=" must be at least ",e.minLenMsgSeg2=" characters in length.",e.criteriaMsg=" contains invalid characters.",e}return P(e,t),e.prototype.ngOnInit=function(){this.errMsg={required:this.label+this.requiredMsgSeg,minLength:this.label+this.minLenMsgSeg1+this.minLen+this.minLenMsgSeg2,criteria:this.label+this.criteriaMsg},this.errorMessages&&(this.errorMessages.required&&(this.errMsg.required=this.errorMessages.required),this.errorMessages.minLength&&(this.errMsg.minLength=this.errorMessages.minLength),this.errorMessages.criteria&&(this.errMsg.criteria=this.errorMessages.criteria))},e.prototype.ngOnChanges=function(e){e.password&&this.password&&(this.pswdStrength=this.getPasswordStrength(this.password),this.strengthPercentage=(this.pswdStrength+1)/5*100)},e.prototype.setPassword=function(e){this.passwordChange.emit(e)},e.prototype.onInputBlur=function(e){this.blurEvent.emit(event)},e.prototype.onPaste=function(e){return!1},e.prototype.getPasswordStrength=function(e){return q(e).score},e.decorators=[{type:A.Component,args:[{selector:"common-password",template:'<label class="control-label" for="{{objectID}}">{{label}}</label>\r\n<input #pswdRef="ngModel"\r\n type="{{hideValue? \'password\': \'text\'}}"\r\n class="form-control password-field"\r\n name="{{objectID}}"\r\n id="{{objectID}}"\r\n [ngModel]="password"\r\n (ngModelChange)="setPassword($event)"\r\n (blur)="onInputBlur($event)"\r\n [pattern]="pwdCriteria"\r\n [required]="isRequired"\r\n [minlength]="minLen"\r\n [maxlength]="maxLen"\r\n [disabled]="isDisabled"\r\n autocomplete="off"/>\r\n<span class="fa fa-fw {{hideValue? \'fa-eye\' : \'fa-eye-slash\'}} password-field-icon"\r\n (click)=\'hideValue = !hideValue\'></span>\r\n<div *ngIf=\'password && showPasswordStrength\'>\r\n\x3c!-- The progress bar --\x3e\r\n <div class="progress password-strength-bar" >\r\n <div class="progress-bar {{pswdStrength >= 4? \'bg-success\' : (pswdStrength >= 3? \'bg-warning\' : \'bg-danger\')}}"\r\n role="progressbar"\r\n [style.width]=\'strengthPercentage + "%"\'\r\n [attr.aria-valuenow]="strengthPercentage"\r\n aria-valuemin="0"\r\n aria-valuemax="100">\r\n </div>\r\n </div>\r\n <span class="password-progress-label {{pswdStrength >= 4? \'text-success\' : (pswdStrength >= 3? \'text-warning\' : \'text-danger\')}}"></span>\r\n</div>\r\n\x3c!-- Error messages for component --\x3e\r\n<div *ngIf="!pswdRef.disabled && (pswdRef.touched || pswdRef.dirty)"\r\n role="alert"\r\n class=\'error-container\'\r\n aria-live="assertive">\r\n <div class="text-danger" *ngIf="pswdRef?.errors?.required">\r\n {{errMsg.required}}\r\n </div>\r\n <div class="text-danger" *ngIf="pswdRef?.errors?.minlength">\r\n {{errMsg.minLength}}\r\n </div>\r\n <div class="text-danger" *ngIf="pswdRef?.errors?.pattern && !pswdRef?.errors?.minlength">\r\n {{errMsg.criteria}}\r\n </div>\r\n</div>\r\n\r\n',viewProviders:[{provide:w.ControlContainer,useExisting:A.forwardRef(function(){return w.NgForm})}],styles:[".password-field-icon{float:right;margin-left:-25px;margin-top:-25px;margin-right:.5rem;position:relative;z-index:2}.password-field{padding-right:2rem}.password-strength-bar{min-width:0;max-width:75%;height:.5rem;margin-top:1em}.password-progress-label{float:right;margin-left:-15px;margin-top:-15px;position:relative;z-index:2}.password-strength-bar+.text-success::after{content:'Good'}.password-strength-bar+.text-warning::after{content:'OK'}.password-strength-bar+.text-danger::after{content:'Bad'}input{width:100%}input[type=password]::-ms-clear,input[type=password]::-ms-reveal{display:none}"]}]}],e.ctorParameters=function(){return[]},e.propDecorators={label:[{type:A.Input}],isRequired:[{type:A.Input}],isDisabled:[{type:A.Input}],password:[{type:A.Input}],pwdCriteria:[{type:A.Input}],minLen:[{type:A.Input}],maxLen:[{type:A.Input}],errorMessages:[{type:A.Input}],showPasswordStrength:[{type:A.Input}],objectID:[{type:A.Input}],passwordChange:[{type:A.Output}],blurEvent:[{type:A.Output}],onPaste:[{type:A.HostListener,args:["document:paste",["$event"]]}]},e}(V),F=function(){function e(e,t){this.router=e,this.cd=t,this.progressSteps=[]}return e.prototype.ngOnInit=function(){var t=this;this.routerEvents$=this.router.events.pipe(C.filter(function(e){return e instanceof S.NavigationEnd}),C.map(function(e){return e.url})).subscribe(function(e){t.activeIndex=t.getActiveIndex(e),t.cd.detectChanges(),t.scrollStepIntoView()}),this.activeIndex=this.getActiveIndex(this.router.url)},e.prototype.ngOnDestroy=function(){this.cd.detach(),this.routerEvents$.unsubscribe()},e.prototype.calculateProgressPercentage=function(){var e=this.progressSteps.length,t=this.activeIndex+1;if(0===e||e<t)return 100;var r=1/(2*e);return Math.round(100*(t/e-r))},e.prototype.getActiveIndex=function(t){return this.progressSteps.findIndex(function(e){return t.endsWith(e.route)})},e.prototype.scrollStepIntoView=function(){var e=this.steps.toArray()[this.activeIndex],t=document.getElementsByClassName("horizontal-scroll");if(1===t.length)try{t[0].scrollLeft=Math.abs(e.nativeElement.offsetLeft-window.outerWidth/2)}catch(r){}},e.decorators=[{type:A.Component,args:[{selector:"common-wizard-progress-bar",template:'<progressbar\r\n [value]="calculateProgressPercentage()"\r\n [max]="100"\r\n [animate]="true">\r\n</progressbar>\r\n\r\n<div class="step-container" #stepContainer>\r\n\r\n <a #steps *ngFor="let step of progressSteps; let i = index;" [routerLink]="step.route">\r\n\r\n <div class="step" [ngClass]="{active: i === activeIndex}">\r\n <span class="step-text">{{step.title}}</span>\r\n </div>\r\n\r\n </a>\r\n\r\n</div>\r\n',changeDetection:A.ChangeDetectionStrategy.OnPush,styles:[':host{flex:1;padding:1em 2em;min-height:2em;min-width:650px}.step-container{display:flex;justify-content:space-around}progressbar{background-color:#adb5bd;height:.5rem}.step{position:relative;-webkit-transform:translateX(-.5em);transform:translateX(-.5em);margin-top:.25rem}.step:before{content:" ";position:absolute;width:1em;height:1em;border-radius:100%;background:#fff;border:3px solid #036;right:0;left:0;margin:0 auto;bottom:100%}.step:not(.active) .step-text{opacity:.8}.step:not(.active):before{background:#ced4da}.step .step-text{position:absolute;-webkit-transform:translateX(-33%);transform:translateX(-33%);white-space:nowrap;font-size:small;color:#164d80}']}]}],e.ctorParameters=function(){return[{type:S.Router},{type:A.ChangeDetectorRef}]},e.propDecorators={progressSteps:[{type:A.Input}],stepContainer:[{type:A.ViewChild,args:["stepContainer"]}],steps:[{type:A.ViewChildren,args:["steps"]}]},e}(),U="{label}",z=new RegExp(U,"g");var G=function(n){function e(e){var t=this.constructor,r=n.call(this,e)||this;return Object.setPrototypeOf(r,t.prototype),r}return P(e,n),e}(Error),$=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e._defaultErrMsg={},e.disabled=!1,e._onChange=function(e){},e._onTouched=function(e){},e}return P(e,t),e.prototype.ngOnInit=function(){this.setErrorMsg()},e.prototype.registerOnChange=function(e){this._onChange=e},e.prototype.registerOnTouched=function(e){this._onTouched=e},e.prototype.setDisabledState=function(e){this.disabled=e},e.prototype.setErrorMsg=function(){var t=this;this.validateLabel();var n=this.label?this.label.replace(/\s*\(.*?\)\s*/g,""):"Field";this.errorMessage&&Object.keys(this.errorMessage).map(function(e){return t._defaultErrMsg[e]=t.errorMessage[e]}),Object.keys(this._defaultErrMsg).map(function(e){return t._defaultErrMsg[e]=function r(e,t){return e.replace(z,t)}(t._defaultErrMsg[e],n)})},e.prototype.registerValidation=function(t,r){var n=this;return Promise.resolve().then(function(){if(t){var e=[r.bind(n)];return t.control.validator&&e.push(t.control.validator),t.control.setValidators(e),t.control.updateValueAndValidity(),t}})},e.prototype.validateLabel=function(){var e=typeof this.label;if("string"!==e&&this.label)throw new G("<AbstractFormControl> Invalid input provided to [label]. Label must be a string and you provided a "+e)},e.propDecorators={label:[{type:A.Input}],disabled:[{type:A.Input}],errorMessage:[{type:A.Input}]},e}(V),H=c(d(),150),Y=u(d(),150),K=function(n){function e(e,t){var r=n.call(this)||this;return r.controlDir=e,r.injectedValidators=t,r.dateChange=new A.EventEmitter,r.label="Date",r.restrictDate="any",r._month="null",r._dateRangeStart=null,r._dateRangeEnd=null,r.monthList=["January","February","March","April","May","June","July","August","September","October","November","December"],r.monthLabelforId="month_"+r.objectId,r.dayLabelforId="day_"+r.objectId,r.yearLabelforId="year_"+r.objectId,r._defaultErrMsg={required:U+" is required.",dayOutOfRange:"Invalid "+U+".",yearDistantPast:"Invalid "+U+".",yearDistantFuture:"Invalid "+U+".",noPastDatesAllowed:"Invalid "+U+".",noFutureDatesAllowed:"Invalid "+U+".",invalidValue:"Invalid "+U+".",invalidRange:"Invalid "+U+"."},r.today=d(),r.tomorrow=x.addDays(r.today,1),e&&(e.valueAccessor=r),r}return P(e,n),Object.defineProperty(e.prototype,"dateRangeStart",{set:function(e){this._dateRangeStart=e?x.startOfDay(e):null},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"dateRangeEnd",{set:function(e){this._dateRangeEnd=e?x.startOfDay(e):null},enumerable:!0,configurable:!0}),e.prototype.ngOnChanges=function(e){e.errorMessage&&this.setErrorMsg()},e.prototype.ngOnInit=function(){var t=this;if(this.setErrorMsg(),"any"!==this.restrictDate&&(this._dateRangeEnd||this._dateRangeStart)){throw new G('<common-date> - Invalid @Input() option configuration.\nYou cannot use "[restrictDate]" in combination with either "[dateRangeEnd]" or "[dateRangeStart]".\nYou must use either [restrictDate] or the [dateRange*] inputs.\n\n <common-date name=\'effectiveDate\'\n label="Effective Date"\n [restrictDate]="\'past\'" <<< problem, choose one\n [dateRangeEnd]=\'today\' <<< problem, choose one\n formControlName="effectiveDate"\n ></common-date>\n\n ')}"past"===this.restrictDate?(this._dateRangeEnd=this.today,this._dateRangeStart=null):"future"===this.restrictDate&&(this._dateRangeEnd=null,this._dateRangeStart=this.tomorrow),this.registerValidation(this.controlDir,this.validateSelf).then(function(e){t.injectedValidators&&t.injectedValidators.length&&(t.isRequired=1<=t.injectedValidators.filter(function(e){return e.required}).length)})},Object.defineProperty(e.prototype,"month",{get:function(){if(this.date)return this.date.getMonth()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"day",{get:function(){if(this.date)return this.date.getDate()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"year",{get:function(){if(this.date)return this.date.getFullYear()},enumerable:!0,configurable:!0}),e.prototype.processDate=function(){if(this.canCreateDate()){var e=this.getNumericValue(this._year),t=this.getNumericValue(this._month),r=this.getNumericValue(this._day);this.date=x.startOfDay(new Date(e,t,r)),this.date.setFullYear(e)}else(this.date||!this._year&&!this._day&&"null"===this._month)&&(this.date=null);this._onChange(this.date),this._onTouched(this.date),this.dateChange.emit(this.date)},e.prototype.canCreateDate=function(){var e="string"==typeof this._month&&"null"!==this._month||"number"==typeof this._month;return!!(this._year&&this._day&&e)},e.prototype._triggerOnChange=function(e){this._onChange(e),this.dateChange.emit(e)},e.prototype.getNumericValue=function(e){var t=parseInt(e,10);return isNaN(t)?null:t},e.prototype.setDisplayVariables=function(){this._day=this.date.getDate().toString(),this._month=this.date.getMonth().toString(),this._year=this.date.getFullYear().toString()},e.prototype.writeValue=function(e){e&&(this.date=e,this.setDisplayVariables())},e.prototype.onBlurDay=function(e){this._day=e,this.processDate()},e.prototype.onBlurYear=function(e){this._year=e,this.processDate()},e.prototype.onBlurMonth=function(e){this._month=e,this.processDate()},e.prototype.validateSelf=function(){var e=parseInt(this._year,10),t=parseInt(this._month,10),r=parseInt(this._day,10);if(isNaN(e)&&isNaN(t)&&isNaN(r))return null;if(isNaN(e)||isNaN(t)||isNaN(r)||!isNaN(e)&&e<=0)return{invalidValue:!0};if(a(new Date(e,t,1))<r||r<1)return{dayOutOfRange:!0};var n=this.validateRange();if(n)return n;var o=this.validateDistantDates();return o||null},e.prototype.validateRange=function(){var e=x.startOfDay(this.date);return this._dateRangeEnd&&s(e,this._dateRangeEnd)?"past"===this.restrictDate||0===x.compareAsc(this._dateRangeEnd,this.today)?{noFutureDatesAllowed:!0}:{invalidRange:!0}:this._dateRangeStart&&l(e,this._dateRangeStart)?"future"===this.restrictDate||0===x.compareAsc(this._dateRangeStart,this.tomorrow)?{noPastDatesAllowed:!0}:{invalidRange:!0}:null},e.prototype.validateDistantDates=function(){return!this._dateRangeEnd&&s(this.date,H)?{yearDistantFuture:!0}:!this._dateRangeStart&&l(this.date,Y)?{yearDistantPast:!0}:null},e.decorators=[{type:A.Component,args:[{selector:"common-date",template:'<fieldset>\r\n <legend class="date--legend">{{label}}</legend>\r\n <ng-container *ngTemplateOutlet="instructionText"></ng-container>\r\n <div class="date-row">\r\n <select class="form-control monthSelect"\r\n id="{{monthLabelforId}}"\r\n name="{{monthLabelforId}}"\r\n [value]="_month"\r\n (blur)="onBlurMonth($event.target.value)"\r\n [disabled]=\'disabled\'\r\n [required]="isRequired"\r\n aria-label="Month">\r\n \x3c!-- We show the blank option so the user can clear out their data.--\x3e\r\n <option value="null" label="Month" selected [disabled]=\'isRequired\'></option>\r\n <option *ngFor="let month of monthList; let i = index;" [value]="i">{{month}}</option>\r\n </select>\r\n\r\n <input type="number"\r\n class="form-control dayInput"\r\n id="{{dayLabelforId}}"\r\n name="{{dayLabelforId}}"\r\n placeholder="Day"\r\n [value]="_day"\r\n (blur)="onBlurDay($event.target.value)"\r\n commonDateFieldFormat\r\n [disabled]=\'disabled\'\r\n [required]="isRequired"\r\n maxlength="2"\r\n step="any"\r\n aria-label="Day"\r\n autocomplete="off"/>\r\n\r\n <input type="number"\r\n class="form-control yearInput"\r\n id="{{yearLabelforId}}"\r\n name="{{yearLabelforId}}"\r\n placeholder="Year"\r\n [value]="_year"\r\n (blur)="onBlurYear($event.target.value)"\r\n commonDateFieldFormat\r\n [disabled]=\'disabled\'\r\n [required]="isRequired"\r\n maxlength="4"\r\n step="any"\r\n aria-label="Year"\r\n autocomplete="off"/>\r\n\r\n </div>\r\n</fieldset>\r\n\r\n<common-error-container\r\n [displayError]="!disabled && (controlDir?.touched || controlDir?.dirty) && controlDir.errors">\r\n <div *ngIf="controlDir?.errors?.required; else ComponentErrors">\r\n {{_defaultErrMsg.required}}\r\n </div>\r\n</common-error-container>\r\n\r\n<ng-template #instructionText>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n\x3c!--Errors triggered by self-validation within component--\x3e\r\n<ng-template #ComponentErrors>\r\n <div *ngIf="controlDir?.errors?.dayOutOfRange">\r\n {{_defaultErrMsg.dayOutOfRange}}\r\n </div>\r\n <div *ngIf="controlDir?.errors?.yearDistantPast">\r\n {{_defaultErrMsg.yearDistantPast}}\r\n </div>\r\n <div *ngIf="controlDir?.errors?.yearDistantFuture">\r\n {{_defaultErrMsg.yearDistantFuture}}\r\n </div>\r\n <div *ngIf="controlDir?.errors?.noPastDatesAllowed">\r\n {{_defaultErrMsg.noPastDatesAllowed}}\r\n </div>\r\n <div *ngIf="controlDir?.errors?.noFutureDatesAllowed">\r\n {{_defaultErrMsg.noFutureDatesAllowed}}\r\n </div>\r\n <div *ngIf="controlDir?.errors?.invalidRange">\r\n {{_defaultErrMsg.invalidRange}}\r\n </div>\r\n\r\n \x3c!-- Case should not happen until something is not formatted correctly--\x3e\r\n <div *ngIf="controlDir?.errors?.invalidValue">\r\n {{_defaultErrMsg.invalidValue}}\r\n </div>\r\n</ng-template>\r\n',styles:[".date--legend{font-size:inherit;font-weight:700}.date-row{display:flex;flex-wrap:nowrap;justify-content:space-between}.monthSelect{max-width:50%;height:35px;margin-right:1em}.dayInput{max-width:25%;height:35px;margin-right:1em}.yearInput{max-width:25%;height:35px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}select option[selected]{color:gray!important}"]}]}],e.ctorParameters=function(){return[{type:w.NgControl,decorators:[{type:A.Optional},{type:A.Self}]},{type:Array,decorators:[{type:A.Optional},{type:A.Self},{type:A.Inject,args:[w.NG_VALIDATORS]}]}]},e.propDecorators={date:[{type:A.Input}],dateChange:[{type:A.Output}],label:[{type:A.Input}],restrictDate:[{type:A.Input}],dateRangeStart:[{type:A.Input}],dateRangeEnd:[{type:A.Input}]},e}($),W=function(t){function e(){var e=t.call(this)||this;return e.size=Z.DEFAULT,e.dateChange=new A.EventEmitter,e.required=!1,e.clearButton="visible",e.dateFormat="yyyy/mm/dd",e.DatepickerSizes=Z,e._onChange=function(e){},e._onTouched=function(){},e}return P(e,t),e.prototype.convertDateToSimpleDate=function(e){return null===e||e===undefined?null:{year:e.getFullYear(),month:e.getMonth()+1,day:e.getDate()}},e.prototype.convertSimpleDateToDate=function(e){return 0===e.year?null:new Date(e.year,e.month-1,e.day)},e.prototype.isDate=function(e){return!!e&&e.getDate!==undefined},e.prototype.ngOnInit=function(){if(this.errorMessages||(this.errorMessages={required:this.labelText+" is required.",dayOutOfRange:"Invalid "+this.labelText+".",yearDistantPast:"Invalid "+this.labelText+".",yearDistantFuture:"Invalid "+this.labelText+".",noFutureDatesAllowed:"Invalid "+this.labelText+".",invalidValue:"Invalid "+this.labelText+"."}),this.datepickerOptions={dateFormat:this.dateFormat,sunHighlight:!1,appendSelectorToBody:!0},this.size===Z.MINI&&(this.datepickerOptions.selectorHeight="185px",this.datepickerOptions.selectorWidth="201px"),this.isDate(this.disableSince)&&(this.datepickerOptions.disableSince=this.convertDateToSimpleDate(this.disableSince)),this.isDate(this.disableUntil)&&(this.datepickerOptions.disableUntil=this.convertDateToSimpleDate(this.disableSince)),this.onlyFutureDates){var e=new Date;this.datepickerOptions.disableUntil=this.convertDateToSimpleDate(e)}this.date&&(this.model={jsdate:this.date})},e.prototype.ngOnChanges=function(e){null===this.date&&(this.clearDate(),this._onChange(null),this._onTouched())},e.prototype.onDateChanged=function(e){(e.jsdate||null===e.jsdate)&&(this.dateChange.emit(e.jsdate),this._onChange(e.jsdate),this._onTouched())},e.prototype.clearDate=function(){this.ngxdp&&(this.date=null,this.ngxdp.clearDate())},e.prototype.registerOnChange=function(e){this._onChange=e},e.prototype.registerOnTouched=function(e){this._onTouched=e},e.prototype.writeValue=function(e){this.model={jsdate:e}},e.decorators=[{type:A.Component,args:[{selector:"common-datepicker",template:'<div>\r\n <label><span>{{labelText}}</span>\r\n <div class="input-group">\r\n\r\n <input class="form-control" placeholder="YYYY/MM/DD"\r\n ngx-mydatepicker name="datepicker-{{labelText}}-{{objectId}}"\r\n [(ngModel)]="model"\r\n [options]="datepickerOptions"\r\n #dp="ngx-mydatepicker"\r\n #dateEl=\'ngModel\'\r\n (dateChanged)="onDateChanged($event)"\r\n [required]=\'required\'\r\n [disabled]="disabled"\r\n autocomplete="off"/>\r\n\r\n <span class="input-group-append float-label-append">\r\n <button type="button" class="btn btn-default" (click)="dp.toggleCalendar()">\r\n <i class="fa fa-calendar"></i>\r\n </button>\r\n </span>\r\n </div>\r\n </label>\r\n</div>\r\n\r\n\x3c!-- InvalidDateFormat comes from ngxmydatepicker, so we have a little less control over it. --\x3e\r\n<div *ngIf="!disabled && dateEl.touched"\r\n role="alert"\r\n class=\'error-container\'\r\n aria-live="assertive">\r\n <div class="text-danger"\r\n *ngIf="(dateEl?.errors?.required) && errorMessages?.required && !dateEl?.errors?.invalidDateFormat">\r\n {{errorMessages.required}}\r\n </div>\r\n \x3c!-- ngx-mydatepicker has it\'s own errors and we can\'t easily add our own, so we have reduced error messages. --\x3e\r\n \x3c!-- <div class="text-danger"\r\n *ngIf="dateEl?.errors?.dayOutOfRange && errorMessages?.dayOutOfRange">\r\n {{errorMessages.dayOutOfRange}}\r\n </div>\r\n <div class="text-danger"\r\n *ngIf="dateEl?.errors?.yearDistantPast && errorMessages?.yearDistantPast">\r\n {{errorMessages.yearDistantPast}}\r\n </div>\r\n <div class="text-danger"\r\n *ngIf="dateEl?.errors?.yearDistantFuture && errorMessages?.yearDistantFuture">\r\n {{errorMessages.yearDistantFuture}}\r\n </div>\r\n <div class="text-danger"\r\n *ngIf="dateEl?.errors?.noPastDatesAllowed && errorMessages?.noPastDatesAllowed">\r\n {{errorMessages.noPastDatesAllowed}}\r\n </div>\r\n\r\n <div class="text-danger"\r\n *ngIf="dateEl?.errors?.noFutureDatesAllowed && errorMessages?.noFutureDatesAllowed">\r\n {{errorMessages.noFutureDatesAllowed}}\r\n </div> --\x3e\r\n <div class="text-danger"\r\n *ngIf="(dateEl?.errors?.invalidValue || dateEl?.errors?.invalidDateFormat) && errorMessages?.invalidValue">\r\n {{errorMessages.invalidValue}}\r\n </div>\r\n</div>\r\n',viewProviders:[{provide:w.ControlContainer,useExisting:A.forwardRef(function(){return w.NgForm})}],providers:[{provide:w.NG_VALUE_ACCESSOR,multi:!0,useExisting:A.forwardRef(function(){return e})}],styles:[".datepicker--mini{display:flex;flex-wrap:nowrap}.datepicker--mini:not(.hide-clear)>.btn{border-top-right-radius:0;border-bottom-right-radius:0}.datepicker--mini .input-group-append .btn{padding:0 .5rem}.input-group-append{z-index:0}.float-label-append{margin-bottom:calc(.5rem + 2px)}.has-float-label{flex-basis:calc(100% - 36px)}input::-ms-clear{display:none}"]}]}],e.ctorParameters=function(){return[]},e.propDecorators={size:[{type:A.Input}],date:[{type:A.Input}],dateChange:[{type:A.Output}],disabled:[{type:A.Input}],labelText:[{type:A.Input}],required:[{type:A.Input}],disableUntil:[{type:A.Input}],disableSince:[{type:A.Input}],onlyFutureDates:[{type:A.Input}],clearButton:[{type:A.Input}],dateFormat:[{type:A.Input}],errorMessages:[{type:A.Input}],ngxdp:[{type:A.ViewChild,args:["dp"]}]},e}(V),Z={MINI:"mini",DEFAULT:"default"},J={WrongType:0,TooSmall:1,TooBig:2,AlreadyExists:3,Unknown:4,CannotOpen:5,PDFnotSupported:6,CannotOpenPDF:7};J[J.WrongType]="WrongType",J[J.TooSmall]="TooSmall",J[J.TooBig]="TooBig",J[J.AlreadyExists]="AlreadyExists",J[J.Unknown]="Unknown",J[J.CannotOpen]="CannotOpen",J[J.PDFnotSupported]="PDFnotSupported",J[J.CannotOpenPDF]="CannotOpenPDF";var X=function Pt(e,t){this.errorCode=e,this.errorDescription=t},Q=function(){function t(e){this.attachmentOrder=0,this.uuid=y.UUID.UUID(),e&&(this.fileContent=e)}return t.prototype.toJSON=function(){return{attachmentOrder:this.attachmentOrder,attachmentUuid:this.uuid,attachmentDocumentType:this.documentType}},t.prototype.clone=function(){var e=new t;return e.uuid=this.uuid,e.fileContent=this.fileContent,e.documentType=this.documentType,e.contentType=this.contentType,e.size=this.size,e.sizeUnit=this.sizeUnit,e.sizeTxt=this.sizeTxt,e.naturalHeight=this.naturalHeight,e.naturalWidth=this.naturalWidth,e.name=this.name,e.id=this.id,e.error=this.error,e.attachmentOrder=this.attachmentOrder,e},t.prototype.calculateSize=function(){for(var e=["KiB","MiB","GiB","TiB","PiB","EiB","ZiB","YiB"],t=this.size,r=t+" bytes",n=0,o=t/1024;1<o;o/=1024,n++)r=o.toFixed(3)+" "+e[n]+" ("+t+" bytes)",this.sizeUnit=e[n];this.sizeTxt=r},t}(),ee=function(){function t(e,t){this.widthFactor=e,this.heightFactor=t}return t.prototype.scaleDown=function(e){return new t(this.widthFactor*e,this.heightFactor*e)},t}(),te=h;te.workerSrc=m.pdfJsWorker;var re=1048576,ne="image/jpeg",oe=function(n){function e(e,t){var r=n.call(this)||this;return r.zone=e,r.controlContainer=t,r.images=new Array(0),r.required=!1,r.instructionText="Please upload required ID documents.",r.errorMessages={required:"File is required."},r.imagesChange=new A.EventEmitter,r.errorDocument=new A.EventEmitter,r}return P(e,n),e.prototype.openFileDialog=function(){this.browseFileRef.nativeElement.click()},e.prototype.handleDragOver=function(e){e.preventDefault()},e.prototype.handleDrop=function(e){e.preventDefault();var t=e.dataTransfer.files;if(t&&0!==t.length)for(var r=0;r<t.length;r++)this.processFile(t[r])},e.prototype.handleChangeFile=function(e){var t=e.target.files;if(t&&0!==t.length){for(var r=0;r<t.length;r++)this.processFile(t[r]);e.target.value=""}},e.prototype.processFile=function(i){return T(this,void 0,void 0,function(){var t,r,n,o;return k(this,function(e){switch(e.label){case 0:switch(i.type){case"application/pdf":return[3,1]}return[3,6];case 1:return e.trys.push([1,4,,5]),[4,this.processPDFFile(i)];case 2:return t=e.sent(),[4,this.addFileImages(i.name,t)];case 3:return e.sent(),[3,5];case 4:return r=e.sent(),this.handleError(r),[3,5];case 5:return[3,11];case 6:return e.trys.push([6,9,,10]),[4,this.processImageFile(i)];case 7:return n=e.sent(),[4,this.addFileImages(i.name,[n])];case 8:return e.sent(),[3,10];case 9:return o=e.sent(),this.handleError(o),[3,10];case 10:return[3,11];case 11:return[2]}})})},e.prototype.processPDFFile=function(e){var t=this,r=new FileReader,d=[];return new Promise(function(s,l){r.onload=function(){var e={data:r.result};te.getDocument(e).promise.then(function(a){return T(t,void 0,void 0,function(){var t,r,n,o,i;return k(this,function(e){switch(e.label){case 0:if(50<a.numPages+this.images.length)return l(J.TooBig),[2];t=1,e.label=1;case 1:if(!(t<=a.numPages))return[3,9];e.label=2;case 2:return e.trys.push([2,7,,8]),[4,this.getPageImage(a,t)];case 3:return(r=e.sent()).size<=re?(d.push(r),[3,6]):[3,4];case 4:return[4,this.scaleImage(r)];case 5:n=e.sent(),d.push(n),e.label=6;case 6:return[3,8];case 7:return o=e.sent(),i="Error reading page "+t+" of the PDF.",console.log(i,o),l(J.CannotOpenPDF),[2];case 8:return t++,[3,1];case 9:return s(d),[2]}})})},function(){l(J.CannotOpenPDF)})},r.readAsArrayBuffer(e)})},e.prototype.getPageImage=function(e,t){var i=this,a=document.createElement("canvas"),s=a.getContext("2d");return new Promise(function(n,o){e.getPage(t).then(function(e){var t=e.getViewport({scale:2});t.width&&t.height?(a.width=t.width,a.height=t.height):(a.width=t.viewBox[2],a.height=t.viewBox[3]);var r={canvasContext:s,viewport:t};e.render(r).promise.then(function(){return T(i,void 0,void 0,function(){var t,r;return k(this,function(e){switch(e.label){case 0:return t=a.toDataURL("image/jpeg",.5),[4,this.createImage(t)];case 1:return r=e.sent(),n(r),[2]}})})},function(e){console.log("PDFJS render error:",e),o(J.CannotOpenPDF)})})["catch"](function(e){console.log("PDFJS getPage() error:",e),o(J.CannotOpenPDF)})})},e.prototype.processImageFile=function(e){var t=this,o=new FileReader;return 50<=this.images.length?Promise.reject(J.TooBig):new Promise(function(r,n){o.onload=function(){return T(t,void 0,void 0,function(){var t;return k(this,function(e){switch(e.label){case 0:return e.trys.push([0,4,,5]),[4,this.createImage(o.result)];case 1:return(t=e.sent()).size>re?[4,this.scaleImage(t)]:[3,3];case 2:t=e.sent(),e.label=3;case 3:return r(t),[3,5];case 4:return e.sent(),n(J.CannotOpen),[3,5];case 5:return[2]}})})},o.onerror=function(){n(J.CannotOpen)},o.readAsDataURL(e)})},e.prototype.scaleImage=function(d){return T(this,void 0,void 0,function(){var l=this;return k(this,function(e){return[2,new Promise(function(s,r){var n=document.createElement("img");n.onload=function(){var e=document.createElement("canvas"),t=e.getContext("2d"),i=Math.floor(.8*n.width),a=Math.floor(.8*n.height);e.width=i,e.height=a,t.drawImage(n,0,0,i,a),e.toBlob(function(o){var e=new FileReader;e.onload=function(n){return T(l,void 0,void 0,function(){var t,r;return k(this,function(e){switch(e.label){case 0:return(t=d.clone()).fileContent=n.target.result,t.size=o.size,t.naturalWidth=i,t.naturalHeight=a,t.calculateSize(),t.size>re?(r=s,[4,this.scaleImage(t)]):[3,2];case 1:return r.apply(void 0,[e.sent()]),[3,3];case 2:s(t),e.label=3;case 3:return[2]}})})},e.onerror=function(){r(J.CannotOpen)},e.readAsDataURL(o)},ne,.5)},n.onerror=function(){r(J.CannotOpen)},n.src=d.fileContent})]})})},e.prototype.createImage=function(e){var l=this,d=new Q(e);return new Promise(function(i,a){var s=document.createElement("img");s.onload=function(){var e=document.createElement("canvas"),t=e.getContext("2d"),r=l.getConstrainedSize(s.width,s.height);(r.width<200||r.height<200)&&a(J.TooSmall);var n=r.width,o=r.height;e.width=n,e.height=o,t.drawImage(s,0,0,n,o),e.toBlob(function(r){return T(l,void 0,void 0,function(){var t;return k(this,function(e){return t=new FileReader,r.size<2e4&&a(J.TooSmall),t.onload=function(e){d.fileContent=e.target.result,d.size=r.size,d.naturalWidth=n,d.naturalHeight=o,d.calculateSize(),i(d)},t.onerror=function(){a(J.CannotOpen)},t.readAsDataURL(r),[2]})})},ne,.5)},s.onerror=function(){a(J.CannotOpen)},s.src=d.fileContent})},e.prototype.addFileImages=function(i,a){return T(this,void 0,void 0,function(){var t,r,n,o=this;return k(this,function(e){for(t=0;t<a.length;t++)r=i+(1<a.length?".page-"+(t+1):""),(n=a[t]).name=r,n.id=r,n.contentType=ne;return[2,new Promise(function(e,t){var r=new Array;a.forEach(function(t){-1===o.images.findIndex(function(e){return e.fileContent===t.fileContent})&&r.push(t)}),0!==r.length?(o.images=B(o.images,r),o.imagesChange.emit(o.images),e()):t(J.AlreadyExists)})]})})},e.prototype.deleteImage=function(t){this.resetFileInput(),this.images=this.images.filter(function(e){return e.uuid!==t.uuid}),this.imagesChange.emit(this.images),this.required&&this.images.length<=0&&this.fileControl.setErrors({required:!0})},e.prototype.resetFileInput=function(){this.browseFileRef.nativeElement.value=""},Object.defineProperty(e.prototype,"fileControl",{get:function(){var e="fileUploadBrowse-"+this.id;return this.controlContainer.controls[e]},enumerable:!0,configurable:!0}),e.prototype.handleError=function(e,t){t||(t=new Q),t.error=e,this.errorDocument.emit(t)},e.prototype.getConstrainedSize=function(e,t){var r=e,n=t;return t<=e?3300<e&&(n=(r=3300)*t/e):3300<t&&(r=3300*e/t,n=3300),{width:Math.floor(r),height:Math.floor(n)}},e.prototype.forceRender=function(){this.zone.run(function(){})},e.prototype.handleKeyDownFileBrowse=function(e){"Enter"===e.key&&this.openFileDialog()},e.decorators=[{type:A.Component,args:[{selector:"common-file-uploader",template:'<div class="dropzone"\r\n (dragover)="handleDragOver($event)"\r\n (drop)="handleDrop($event)"\r\n [ngClass]=\'{"has-error": fileControl?.touched && fileControl?.errors?.required}\'>\r\n\r\n <div class="instruction-zone d-flex align-items-center flex-wrap flex-sm-nowrap flex-column flex-sm-row">\r\n <i class="fa fa-cloud-upload fa-4x d-inline-block upload-icon"\r\n aria-hidden="true" (click)=\'openFileDialog()\'></i>\r\n\r\n <input type="file"\r\n id="fileUploadBrowse-{{id}}"\r\n #browseFileRef\r\n ngModel\r\n accept="image/*,application/pdf"\r\n style="display:none;"\r\n tabindex="0"\r\n multiple\r\n name=\'fileUploadBrowse-{{id}}\'\r\n [required]=\'required && images && images.length === 0\'\r\n (change)="handleChangeFile($event)"\r\n autocomplete="off"/>\r\n <label for="fileUploadBrowse-{{id}}"\r\n class="file-upload-label d-inline-block ml-3"\r\n tabindex="0"\r\n (keydown)="handleKeyDownFileBrowse($event)">\r\n <span class=\'h2 color-body\'>Select a file</span>\r\n <span class=\'d-block description\'>{{ instructionText }}</span>\r\n </label>\r\n </div>\r\n\r\n <div *ngIf="fileControl?.touched"\r\n role="alert"\r\n class=\'error-container\'\r\n aria-live="assertive">\r\n <common-error-container [displayError]="fileControl?.errors?.required">\r\n {{errorMessages.required}}\r\n </common-error-container>\r\n </div>\r\n\r\n <div class="preview-zone">\r\n <div *ngFor="let mspImage of images"\r\n class="preview-item">\r\n <common-thumbnail [imageObject]="mspImage"\r\n (deleteImage)="deleteImage($event)">\r\n </common-thumbnail>\r\n </div>\r\n\r\n <div class="common-thumbnail">\r\n <div class="thumbnail-container">\r\n <div class="image-thumbnail demo-thumbnail"\r\n (click)=\'openFileDialog()\'>\r\n <i class="fa fa-plus fa-3x"></i>\r\n </div>\r\n <div class="action-strip text-primary">\r\n <a href="javascript:void(0)"\r\n title="Add"\r\n (click)="openFileDialog()">Add</a>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n</div>\r\n',encapsulation:A.ViewEncapsulation.None,viewProviders:[{provide:w.ControlContainer,useExisting:A.forwardRef(function(){return w.NgForm})}],styles:["common-file-uploader .color-body{color:#494949}common-file-uploader .description{font-weight:400}common-file-uploader .dropzone{border:2px dashed #d3d3d3;margin-bottom:10px;border-radius:8px;padding:2em 4em}common-file-uploader .dropzone.has-error{border-color:#a94442}common-file-uploader .dropzone .instruction-zone{margin:10px 5px 5px;text-align:left}common-file-uploader .dropzone .instruction-zone input{display:none}common-file-uploader .dropzone .instruction-zone .file-upload-label{color:#494949}common-file-uploader .dropzone .instruction-zone .file-upload-label:hover{text-decoration:none;cursor:pointer}common-file-uploader .dropzone .preview-zone{display:flex;flex-wrap:wrap;justify-content:left;align-items:left}common-file-uploader .dropzone .preview-zone .preview-item{position:relative;height:120px;text-align:left;margin-left:6rem;margin-bottom:1.5rem}common-file-uploader .dropzone .preview-zone .preview-item .icon-upload{opacity:.3;margin:0 auto 15px}common-file-uploader .dropzone .preview-zone .preview-item .icon-upload:hover{cursor:pointer;opacity:.6}common-file-uploader .dropzone .preview-zone .preview-item .text-upload:hover{cursor:pointer}common-file-uploader .dropzone .preview-zone .error-style{color:red;font-weight:700}common-file-uploader .dropzone .mobileShow{display:none}@media only screen and (min-device-width:320px) and (max-device-width:480px){common-file-uploader .dropzone .mobileShow{display:inline}}.common-thumbnail .thumbnail-container,common-thumbnail .thumbnail-container{transition:.3s;-webkit-transform:translateY(0);transform:translateY(0)}.common-thumbnail .thumbnail-container .image-thumbnail,.common-thumbnail .thumbnail-container .image-thumbnail-width-priority,common-thumbnail .thumbnail-container .image-thumbnail,common-thumbnail .thumbnail-container .image-thumbnail-width-priority{padding:2px 2px 0;border-radius:5px 5px 0 0}.common-thumbnail .thumbnail-container .image-thumbnail-width-priority:hover,.common-thumbnail .thumbnail-container .image-thumbnail:hover,common-thumbnail .thumbnail-container .image-thumbnail-width-priority:hover,common-thumbnail .thumbnail-container .image-thumbnail:hover{cursor:zoom-in}.common-thumbnail .thumbnail-container .demo-thumbnail,common-thumbnail .thumbnail-container .demo-thumbnail{height:100px!important;width:100px;background-color:#dee2e6;display:flex;justify-content:center;align-items:center}.common-thumbnail .thumbnail-container .demo-thumbnail:hover,common-thumbnail .thumbnail-container .demo-thumbnail:hover{cursor:pointer!important}.common-thumbnail .thumbnail-container .image-thumbnail,common-thumbnail .thumbnail-container .image-thumbnail{max-height:100px;height:auto;max-width:100%}.common-thumbnail .thumbnail-container .image-thumbnail-width-priority,common-thumbnail .thumbnail-container .image-thumbnail-width-priority{max-width:270px;width:auto;max-height:100%}.common-thumbnail .thumbnail-container:hover,common-thumbnail .thumbnail-container:hover{box-shadow:0 15px 10px -10px rgba(0,0,0,.1);-webkit-transform:translateY(-5px);transform:translateY(-5px)}.common-thumbnail .thumbnail-container:hover .action-strip,common-thumbnail .thumbnail-container:hover .action-strip{background:#ececec}.common-thumbnail .thumbnail-container .action-strip,common-thumbnail .thumbnail-container .action-strip{height:2em;border-radius:0 0 5px 5px;text-align:right;font-size:small;margin:0 2px;color:#a94442;padding:.3em;transition:.3s}.common-thumbnail .thumbnail-container .action-strip a,common-thumbnail .thumbnail-container .action-strip a{text-decoration:none}"]}]}],e.ctorParameters=function(){return[{type:A.NgZone},{type:w.ControlContainer}]},e.propDecorators={browseFileRef:[{type:A.ViewChild,args:["browseFileRef"]}],images:[{type:A.Input}],id:[{type:A.Input}],showError:[{type:A.Input}],required:[{type:A.Input}],instructionText:[{type:A.Input}],errorMessages:[{type:A.Input}],imagesChange:[{type:A.Output}],errorDocument:[{type:A.Output}]},e}(V),ie=function(){function e(e){this.reviewMode=!1,this.deleteImage=new A.EventEmitter,this.scaledWidth=300,this.viewContainerRef=e}return e.prototype.ngOnInit=function(){var e=(180*this.imageObject.naturalWidth/this.imageObject.naturalHeight).toFixed(0);this.scaledWidth=parseInt(e,10),250<this.scaledWidth?this.scaledWidth=250:this.scaledWidth<30&&(this.scaledWidth=100),isNaN(this.scaledWidth)&&(this.scaledWidth=300)},e.prototype["delete"]=function(e){this.deleteImage.emit(this.imageObject)},e.prototype.showFullSizeView=function(){this.fullSizeViewModal.config.backdrop=!1,this.fullSizeViewModal.show()},e.prototype.hideFullSizeView=function(){this.fullSizeViewModal.hide()},e.decorators=[{type:A.Component,args:[{selector:"common-thumbnail",template:'<div class="thumbnail-container">\r\n <img [src]="imageObject.fileContent" alt="" tabindex="0"\r\n [ngClass]="{\'image-thumbnail\': scaledWidth <= 300, \'image-thumbnail-width-priority\': scaledWidth > 300}"\r\n (click)="showFullSizeView()">\r\n <div class="action-strip" *ngIf="!reviewMode">\r\n <a href="javascript:void(0)" (click)="delete($event)" class=\'text-danger\' tabindex="0">Remove</a>\r\n </div>\r\n</div>\r\n\r\n<div bsModal #fullSizeViewModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">\r\n <div class="modal-dialog modal-lg">\r\n <div class="modal-content">\r\n <div class="modal-header">\r\n <h4 class="modal-title">{{imageObject.name}}</h4>\r\n <button type="button" class="close" (click)="hideFullSizeView()" aria-label="Close">\r\n <span aria-hidden="true">×</span>\r\n </button>\r\n </div>\r\n <div class="modal-body">\r\n <div class="row">\r\n <div class="col-md-12" >\r