nitrozen/bundles/nitrozen.umd.min.js

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.1.3.

!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/core"),require("@angular/common"),require("@angular/material"),require("@angular/animations"),require("@angular/forms"),require("@angular/common/http")):"function"==typeof define&&define.amd?define("nitrozen",["exports","@angular/core","@angular/common","@angular/material","@angular/animations","@angular/forms","@angular/common/http"],n):n((t=t||self).nitrozen={},t.ng.core,t.ng.common,t.ng.material,t.ng.animations,t.ng.forms,t.ng.common.http)}(this,(function(t,n,e,i,o,s,a){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation. All rights reserved.
    Licensed under the Apache License, Version 2.0 (the "License"); you may not use
    this file except in compliance with the License. You may obtain a copy of the
    License at http://www.apache.org/licenses/LICENSE-2.0

    THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
    KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
    WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
    MERCHANTABLITY OR NON-INFRINGEMENT.

    See the Apache Version 2.0 License for specific language governing permissions
    and limitations under the License.
    ***************************************************************************** */var r=function(){return(r=Object.assign||function(t){for(var n,e=1,i=arguments.length;e<i;e++)for(var o in n=arguments[e])Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o]);return t}).apply(this,arguments)};function p(t,n,e,i){var o,s=arguments.length,a=s<3?n:null===i?i=Object.getOwnPropertyDescriptor(n,e):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,n,e,i);else for(var r=t.length-1;r>=0;r--)(o=t[r])&&(a=(s<3?o(a):s>3?o(n,e,a):o(n,e))||a);return s>3&&a&&Object.defineProperty(n,e,a),a}function d(t,n){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,n)}var c,l=function(){function t(){this.clicked=new n.EventEmitter}return t.prototype.ngOnInit=function(){this.theme=this.theme?this.theme:"primary"},t.prototype.clickedButton=function(t){this.btnWidth=t.currentTarget.offsetWidth-80,this.clicked.emit(t)},p([n.Input(),d("design:type",Object)],t.prototype,"showProgress",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"isContained",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"theme",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"focused",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"large",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"isStroked",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"shouldBeDisabled",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"showIcon",void 0),p([n.Output(),d("design:type",n.EventEmitter)],t.prototype,"clicked",void 0),t=p([n.Component({selector:"nitrozen-button",template:'<div [ngClass]="{\n    \'primary-section\': theme === \'primary\' ,\n    \'secondary-section\': theme === \'accent\'\n  }">\n<button mat-raised-button  class="btn-nitrozen" \n[ngClass]="{\n    \'mat-stroked-button\': isStroked,\n    \'mat-flat-button\':isContained,\n    \'btn-focused\':focused,\n    \'hover-state\':showProgress,\n    \'large-btn\':large\n  }"\n  [disabled]="shouldBeDisabled"\n  (click)="clickedButton($event)"\n\n>\n\n<div class="btn-icon-show">\n  <div class="btn-txt" \n  [ngClass]="{\n    \'btn-show-icn\': showIcon,\n    \'btn-stroke-color\':isStroked,\n    \'btn-contained-color\':isContained,\n    \'btn-progress\': !showProgress,\n    \'btn-notprogress\' : showProgress\n  }">\n    <ng-content></ng-content>\n  </div>\n\n\n  <div class="btn-spin" [ngClass]="{\n    \'btn-spin-stroke\': isStroked,\n    \'btn-spin-contained\':isContained,\n    \'btn-progress\': !showProgress,\n    \'btn-notprogress\' : showProgress\n  }" *ngIf="showIcon">\n  <img src="./../../assets/icons/Bag_Icon.svg">\n</div>\n  <div class="btn-spin"  [ngStyle]="{\'width.px\': btnWidth}" [ngClass]="{\n    \'btn-spin-stroke\': isStroked,\n    \'btn-spin-contained\':isContained,\n    \'btn-notprogress\': !showProgress,\n    \'btn-progress\' : showProgress\n  }">\n  <img *ngIf="isContained" class="btn-spinner" style="width: 50px;" src="../../../assets/icons/loader-white-1.gif">\n  <img *ngIf="isStroked && theme === \'primary\'" class="btn-spinner" style="width: 50px;" src="../../../assets/icons/loader-green.gif">\n  <img *ngIf="isStroked && theme === \'accent\'" class="btn-spinner" style="width: 50px;" src="../../../assets/icons/loader-blue.gif">\n  \x3c!-- <mat-progress-spinner\n    class="btn-spinner"\n    [ngClass]="{\'c-button__spinner--active\': showProgress && !shouldBeDisabled}"\n    diameter="21"\n    mode="indeterminate"\n  ></mat-progress-spinner> --\x3e\n</div>\n</div>\n</button>\n</div>\n\n',styles:[".btn-nitrozen{height:48px;border-radius:3px;cursor:pointer;padding:0 40px;box-shadow:none}.hover-state{pointer-events:none}.large-btn{height:64px!important;padding:0 65px!important}.btn-notprogress{opacity:0;-webkit-transition:opacity .25s ease-out;transition:opacity .25s ease-out;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.fx-wt{width:66.38px}.primary-section .mat-flat-button.btn-focused{text-decoration:underline;color:#fff;text-underline-position:under}.primary-section .mat-stroked-button.btn-focused{text-decoration:underline;color:#36cc9b;text-underline-position:under}.primary-section .mat-flat-button{background-color:#36cc9b}.primary-section .mat-flat-button:hover:not([disabled]){background-color:#2eb589}.primary-section .mat-flat-button:focus{text-decoration:underline;color:#fff;text-underline-position:under}.primary-section .mat-stroked-button{border:1px solid #36cc9b}.primary-section .mat-stroked-button:hover:not([disabled]){background-color:rgba(54,204,155,.12)}.primary-section .mat-stroked-button:focus{text-decoration:underline;color:#45cc9b;text-underline-position:under}.primary-section .btn-spin-stroke .mat-spinner circle,.primary-section .btn-spin-stroke ::ng-deep .mat-progress-spinner circle{stroke:#fff}.primary-section .btn-spin-contained .mat-spinner circle,.primary-section .btn-spin-contained ::ng-deep .mat-progress-spinner circle{stroke:#fff}.primary-section .mat-flat-button:disabled,.primary-section .mat-flat-button[disabled=disabled]{background-color:rgba(54,204,155,.4)!important}.primary-section .btn-txt{font-family:Poppins;font-size:16px;font-weight:700;line-height:25px;text-align:center}.primary-section .btn-stroke-color{color:#36cc9b}.primary-section .btn-contained-color{color:#fff}.primary-section .btn-spinner{text-align:center}.primary-section .btn-spin{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center}.primary-section .btn-fynd-icon{height:48px;width:190px;border-radius:3px;background-color:#36cc9b}.primary-section .btn-fynd-icon:hover:not([disabled]){background-color:#2eb589}.primary-section .btn-fynd-icon:focus{text-decoration:underline;color:#fff;text-underline-position:under}.primary-section .btn-show-icn{padding-left:10px}.primary-section .btn-icon-show{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;flex-direction:row-reverse;-webkit-box-pack:center;justify-content:center}.secondary-section .mat-flat-button.btn-focused{text-decoration:underline;color:#fff;text-underline-position:under}.secondary-section .mat-stroked-button.btn-focused{text-decoration:underline;color:#5c6bdd;text-underline-position:under}.secondary-section .mat-flat-button{background-color:#5c6bdd}.secondary-section .mat-flat-button:hover:not([disabled]){background-color:#4f5ecc}.secondary-section .mat-flat-button:focus{text-decoration:underline;color:#fff;text-underline-position:under}.secondary-section .mat-stroked-button{border:1px solid #5c6bdd}.secondary-section .mat-stroked-button:hover:not([disabled]){background-color:rgba(79,94,204,.12)}.secondary-section .mat-stroked-button:focus{text-decoration:underline;color:#5c6bdd;text-underline-position:under}.secondary-section .btn-spin-stroke .mat-spinner circle,.secondary-section .btn-spin-stroke ::ng-deep .mat-progress-spinner circle{stroke:#5c6bdd}.secondary-section .btn-spin-contained .mat-spinner circle,.secondary-section .btn-spin-contained ::ng-deep .mat-progress-spinner circle{stroke:#fff}.secondary-section .mat-flat-button:disabled,.secondary-section .mat-flat-button[disabled=disabled]{background-color:rgba(92,107,221,.4)!important}.secondary-section .btn-txt{font-family:Poppins;font-size:16px;font-weight:700;line-height:25px;text-align:center}.secondary-section .btn-stroke-color{color:#5c6bdd}.secondary-section .btn-contained-color{color:#fff}.secondary-section .btn-spinner{text-align:center}.secondary-section .btn-spin{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center}.secondary-section .btn-fynd-icon{height:48px;width:190px;border-radius:3px;background-color:#5c6bdd}.secondary-section .btn-fynd-icon:hover:not([disabled]){background-color:#2eb589}.secondary-section .btn-fynd-icon:focus{text-decoration:underline;color:#fff;text-underline-position:under}.secondary-section .btn-show-icn{padding-left:10px}.secondary-section .btn-icon-show{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;flex-direction:row-reverse;-webkit-box-pack:center;justify-content:center}"]}),d("design:paramtypes",[])],t)}(),u=function(){function t(){}return t=p([n.NgModule({declarations:[l],imports:[e.CommonModule,i.MatButtonModule,i.MatProgressSpinnerModule],exports:[l,i.MatButtonModule,i.MatProgressSpinnerModule]})],t)}(),g=function(){function t(){this.clicked=new n.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.clickedButton=function(t){this.clicked.emit(t)},p([n.Input(),d("design:type",Object)],t.prototype,"shouldBeDisabled",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"theme",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"focused",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"prefixIcon",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"postfixIcon",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"type",void 0),p([n.Output(),d("design:type",n.EventEmitter)],t.prototype,"clicked",void 0),t=p([n.Component({selector:"nitrozen-button-text",template:"<div [ngClass]=\"{\n    'primary-section': theme === 'primary' ,\n    'secondary-section': theme === 'accent',\n    'warn-section':theme === 'warn'\n  }\">\n  <div>\n<button [ngClass]=\"{'btn-focused':focused,'btn-warn-thm':theme === 'warn','btn-prim-thm':theme === 'primary'}\" mat-button  (click)=\"clickedButton($event)\"  [disabled]=\"shouldBeDisabled\">\n\t<div>\n\t\t<span class=\"btn-spin\" *ngIf=\"prefixIcon\">\n  <img src=\"./../../assets/icons/arrow-icon.svg\">\n</span>\n\t<span class=\"btn-txt\" [ngClass]=\"{\n    'primary-section': theme === 'primary' ,\n    'secondary-section': theme === 'accent',\n    'warn-section':theme === 'warn'\n  }\">\n    <ng-content></ng-content>\n  </span>\n    <span class=\"btn-spin-post\" *ngIf=\"postfixIcon\">\n  <img src=\"./../../assets/icons/arrow-icon.svg\">\n</span>\n   \n</div>\n</button>\n</div>\n</div>\n",styles:[".btn-txt{color:#4f5ecc;font-family:Poppins;font-size:16px;font-weight:700;text-align:center}button:disabled,button[disabled=disabled]{color:rgba(92,107,221,.5)!important;opacity:.5}.btn-text,.primary-section{color:#36cc9b!important}.btn-prim-thm:focus{text-decoration:underline;color:#36cc9b!important;text-underline-position:under}.warn-section .btn-txt{color:#fb406b!important;font-weight:700}.btn-warn-thm:focus{text-decoration:underline;color:#fb406b!important;text-underline-position:under}.mat-button{height:48px}.mat-button:hover{background-color:transparent!important}.btn-focused,.mat-button:focus{text-decoration:underline;color:#4f5ecc;text-underline-position:under}.btn-spin{padding-right:8px}.btn-spin-post{padding-left:8px}.hover-state{pointer-events:none}img{width:14px;height:12px}"]}),d("design:paramtypes",[])],t)}(),b=function(){function t(){}return t=p([n.NgModule({declarations:[g],imports:[e.CommonModule,i.MatButtonModule,i.MatProgressSpinnerModule],exports:[g,i.MatButtonModule,i.MatProgressSpinnerModule]})],t)}(),f=function(){function t(){this.disabled=!1,this.indeterminate=!1,this.change=new n.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.onCheckboxStateChanged=function(t){console.log(t),this.change.emit(t)},p([n.Input(),d("design:type",Boolean)],t.prototype,"checked",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"disabled",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"indeterminate",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"change",void 0),t=p([n.Component({selector:"nitrozen-checkbox",template:'<mat-checkbox \nclass="nitro-checkbox" \n[checked]="checked" \n[indeterminate]="indeterminate"\n[disabled]="disabled"\n(change)="onCheckboxStateChanged($event)">\n\n\n<ng-content></ng-content>\n\n</mat-checkbox>',styles:[""]}),d("design:paramtypes",[])],t)}(),x=function(){function t(){}return t=p([n.NgModule({declarations:[f],imports:[e.CommonModule,i.MatCheckboxModule],exports:[f,i.MatCheckboxModule]})],t)}(),m=function(){function t(){this.disabled=!1,this.change=new n.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.onRadioButtonStateChanged=function(t){console.log(t),this.change.emit(t)},p([n.Input(),d("design:type",Boolean)],t.prototype,"selected",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"disabled",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"change",void 0),t=p([n.Component({selector:"nitrozen-radio-button",template:' <mat-radio-button color="primary"\n[disabled]="disabled"\n(change)="onRadioButtonStateChanged($event)">\n\n\n<ng-content></ng-content>\n</mat-radio-button>  \n',styles:["::ng-deep .mat-radio-label-content{padding-left:12px!important;font-family:Poppins!important}"]}),d("design:paramtypes",[])],t)}(),h=function(){function t(){}return t=p([n.NgModule({declarations:[m],imports:[e.CommonModule,i.MatRadioModule],exports:[m,i.MatRadioModule]})],t)}();!function(t){t.text="text",t.number="number",t.password="password",t.textarea="textarea"}(c||(c={}));var y={provide:s.NG_VALUE_ACCESSOR,useExisting:n.forwardRef((function(){return w})),multi:!0},v={provide:s.NG_VALIDATORS,useExisting:n.forwardRef((function(){return w})),multi:!0},w=function(){function t(t){this.cd=t,this.label="",this.type=c.text,this.blocked=!1,this.placeholder="",this.disabled=!1,this.search=!1,this.showSuccess=!1,this.noneditable=!1,this.required=!1,this.requiredIndicator="*",this.tooltip=!1,this.passwordToggleEnabled=!1,this.passwordTextVisible=!1,this.autoSelect=!1,this.autofocus=!1,this.autocomplete=!1,this.autocorrect=!1,this.spellcheck=!1,this.change=new n.EventEmitter,this.blur=new n.EventEmitter,this.focus=new n.EventEmitter,this.keyup=new n.EventEmitter,this.click=new n.EventEmitter,this.getHostCssClasses="ngx-input",this.focused=!1,this.onTouchedCallback=function(){},this.onChangeCallback=function(){}}return Object.defineProperty(t.prototype,"value",{get:function(){return this._value},set:function(t){t!==this._value&&(this._value=t,this.onChangeCallback(this._value))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"focusedOrDirty",{get:function(){return!!this.focused||("string"==typeof this.value?this.value&&this.value.length:void 0!==this.value&&null!==this.value)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isTouched",{get:function(){return!!this.inputModel&&this.inputModel.touched},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"labelState",{get:function(){return this.placeholder?"outside":this.focusedOrDirty?"outside":"inside"},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"underlineState",{get:function(){return this.focused?"expanded":"collapsed"},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"requiredIndicatorView",{get:function(){return this.requiredIndicator&&this.required?this.requiredIndicator:""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"element",{get:function(){return this.type===c.textarea?this.textareaControl:this.inputControl},enumerable:!0,configurable:!0}),t.prototype.validate=function(t){return"number"!==this.type?null:r({},s.Validators.max(this.max)(t),s.Validators.min(this.min)(t))},t.prototype.ngOnInit=function(){this.value||(this.value="")},t.prototype.ngAfterViewInit=function(){var t=this;this.autofocus&&setTimeout((function(){t.element.nativeElement.focus()})),setTimeout((function(){return t.cd.markForCheck()}))},t.prototype.ngOnChanges=function(t){("max"in t||"min"in t)&&this.onChangeCallback(this._value)},t.prototype.onChange=function(t){t.stopPropagation(),this.change.emit(this.value)},t.prototype.onKeyUp=function(t){t.stopPropagation(),this.keyup.emit(t)},t.prototype.onFocus=function(t){var n=this;t.stopPropagation(),this.autoSelect&&setTimeout((function(){n.element.nativeElement.select()})),this.focused=!0,this.focus.emit(t),this.onTouchedCallback()},t.prototype.onBlur=function(t){t.stopPropagation(),this.focused=!1,this.blur.emit(t)},t.prototype.writeValue=function(t){t!==this._value&&(this._value=t)},t.prototype.registerOnChange=function(t){this.onChangeCallback=t},t.prototype.registerOnTouched=function(t){this.onTouchedCallback=t},t.prototype.togglePassword=function(){var t=this;this.passwordTextVisible=!this.passwordTextVisible,setTimeout((function(){t.passwordTextVisible?t.passwordControl.nativeElement.focus():t.element.nativeElement.focus()}))},t.prototype.setDisabledState=function(t){this.disabled=t},t.ctorParameters=function(){return[{type:n.ChangeDetectorRef}]},p([n.Input(),d("design:type",String)],t.prototype,"id",void 0),p([n.Input(),d("design:type",String)],t.prototype,"name",void 0),p([n.Input(),d("design:type",String)],t.prototype,"label",void 0),p([n.Input(),d("design:type",String)],t.prototype,"type",void 0),p([n.Input(),d("design:type",String)],t.prototype,"hint",void 0),p([n.Input(),d("design:type",String)],t.prototype,"error",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"blocked",void 0),p([n.Input(),d("design:type",String)],t.prototype,"success",void 0),p([n.Input(),d("design:type",String)],t.prototype,"placeholder",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"disabled",void 0),p([n.Input(),d("design:type",Number)],t.prototype,"tabindex",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"search",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"showSuccess",void 0),p([n.Input(),d("design:type",String)],t.prototype,"righttext",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"noneditable",void 0),p([n.Input(),d("design:type",Number)],t.prototype,"min",void 0),p([n.Input(),d("design:type",Number)],t.prototype,"max",void 0),p([n.Input(),d("design:type",Number)],t.prototype,"minlength",void 0),p([n.Input(),d("design:type",Number)],t.prototype,"maxlength",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"required",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"requiredIndicator",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"tooltip",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"passwordToggleEnabled",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"passwordTextVisible",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"autoSelect",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"autofocus",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"autocomplete",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"autocorrect",void 0),p([n.Input(),d("design:type",Boolean)],t.prototype,"spellcheck",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"change",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"blur",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"focus",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"keyup",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"click",void 0),p([n.HostBinding("class"),d("design:type",Object)],t.prototype,"getHostCssClasses",void 0),p([n.HostBinding("class.ng-dirty"),d("design:type",Object),d("design:paramtypes",[])],t.prototype,"focusedOrDirty",null),p([n.HostBinding("class.ng-touched"),d("design:type",Boolean),d("design:paramtypes",[])],t.prototype,"isTouched",null),p([n.ViewChild("inputControl"),d("design:type",n.ElementRef)],t.prototype,"inputControl",void 0),p([n.ViewChild("inputModel"),d("design:type",s.NgModel)],t.prototype,"inputModel",void 0),p([n.ViewChild("textareaControl"),d("design:type",n.ElementRef)],t.prototype,"textareaControl",void 0),p([n.ViewChild("passwordControl"),d("design:type",n.ElementRef)],t.prototype,"passwordControl",void 0),t=p([n.Component({selector:"nitrozen-input",providers:[y,v],encapsulation:n.ViewEncapsulation.None,animations:[o.trigger("labelState",[o.state("inside",o.style({"font-size":"1em",top:"0"})),o.state("outside",o.style({"font-size":".7rem",top:"-15px"})),o.transition("inside => outside",o.animate("150ms ease-out")),o.transition("outside => inside",o.animate("150ms ease-out"))]),o.trigger("underlineState",[o.state("collapsed",o.style({width:"0%"})),o.state("expanded",o.style({width:"100%"})),o.transition("collapsed => expanded",o.animate("150ms ease-out")),o.transition("expanded => collapsed",o.animate("150ms ease-out"))])],template:'<div class="nitro-input-wrap" [ngClass]="{\'input-noneditable\':noneditable}">\n      <div class="ngx-input-flex-wrap">\n         \n        <div class="nitro-input-flex-wrap-inner">\n          <div class="nitro-input-box-wrap">\n            <div class="prefix-icon">\n            <ng-content select="nitrozen-input-prefix"></ng-content>\n          </div>\n            <textarea [ngClass]="{\'search-txt\': search }"\n              *ngIf="type === \'textarea\'"\n              class="ngx-input-textarea"\n              rows="1"\n              autosize\n              [(ngModel)]="value"\n              [id]="id"\n              [name]="name"\n              [placeholder]="placeholder"\n              [disabled]="disabled"\n              [attr.tabindex]="tabindex"\n              [attr.autocomplete]="autocomplete"\n              [attr.autocorrect]="autocorrect"\n              [attr.spellcheck]="spellcheck"\n              [minlength]="minlength"\n              [maxlength]="maxlength"\n              [required]="required"\n              (change)="onChange($event)"\n              (keyup)="onKeyUp($event)"\n              (focus)="onFocus($event)"\n              (blur)="onBlur($event)"\n              (click)="click.emit($event)"\n              #inputModel="ngModel"\n              #textareaControl\n            >\n            </textarea>\n            <input [ngClass]="{\'search-txt\': search,\'blocked\':blocked }"\n              *ngIf="type !== \'textarea\'"\n              class="ngx-input-box"\n              [(ngModel)]="value"\n              [hidden]="passwordTextVisible"\n              [id]="id"\n              [name]="name"\n              [placeholder]="placeholder"\n              [disabled]="disabled"\n              [type]="type"\n              [min]="\'\' + min"\n              [max]="\'\' + max"\n              [minlength]="minlength"\n              [maxlength]="maxlength"\n              [attr.tabindex]="tabindex"\n              [attr.autocomplete]="autocomplete"\n              [attr.autocorrect]="autocorrect"\n              [attr.spellcheck]="spellcheck"\n              (change)="onChange($event)"\n              (keyup)="onKeyUp($event)"\n              (focus)="onFocus($event)"\n              (blur)="onBlur($event)"\n              (click)="click.emit($event)"\n              [required]="required"\n              #inputModel="ngModel"\n              #inputControl\n            />\n            <input [ngClass]="{\'search-txt\': search }"\n              *ngIf="passwordToggleEnabled"\n              [hidden]="!passwordTextVisible"\n              type="text"\n              class="ngx-input-box"\n              type="text"\n              [id]="id + \'-password\'"\n              [placeholder]="placeholder"\n              [name]="name"\n              [disabled]="disabled"\n              [minlength]="minlength"\n              [maxlength]="maxlength"\n              [attr.autocomplete]="autocomplete"\n              [attr.autocorrect]="autocorrect"\n              [attr.spellcheck]="spellcheck"\n              [attr.tabindex]="tabindex"\n              [(ngModel)]="value"\n              (change)="onChange($event)"\n              (keyup)="onKeyUp($event)"\n              (focus)="onFocus($event)"\n              (blur)="onBlur($event)"\n              (click)="click.emit($event)"\n              [required]="required"\n              #inputTextModel="ngModel"\n              #passwordControl\n            />\n            <span\n              *ngIf="type === \'password\' && passwordToggleEnabled"\n              class="icon-eye"\n              title="Toggle Text Visibility"\n              (click)="togglePassword()"\n            >\n            </span>\n            <div class="nitro-input-label">\n            <span [innerHTML]="label"></span> <span [innerHTML]="requiredIndicatorView"></span>\n             <span class="nitro-tool" *ngIf="tooltip"> <img src="../../../assets/icons/tooltip.svg"></span>\n          </div>\n            <div class="suffix-icon">\n             <ng-content select="nitrozen-input-suffix"></ng-content>\n           </div>\n          </div>\n         \n        </div>\n       \n      </div>\n      \x3c!-- <div class="ngx-input-underline">\n        <div class="underline-fill"></div>\n      </div> --\x3e\n      <div class="ngx-input-hint" *ngIf="hint">\n        \x3c!-- <ng-content select="ngx-input-hint"></ng-content> --\x3e\n        <span  [innerHTML]="hint"></span>\n      </div>\n      <div class="nitro-cmp">\n        <div>\n      <div class="nitro-input-error" [ngClass]="{\'is-focused\':focused}" *ngIf="error">\n        \x3c!-- <ng-content select="ngx-input-hint"></ng-content> --\x3e\n        <span  [innerHTML]="error"></span>\n      </div>\n       <div class="nitro-input-success" *ngIf="success">\n        \x3c!-- <ng-content select="ngx-input-hint"></ng-content> --\x3e\n        <div class="nito-ss-img" *ngIf="showSuccess">\n        <img src="../../../assets/icons/check-circle.svg">\n        </div>\n        <div class="ss-txt" *ngIf="showSuccess">\n        <span  [innerHTML]="success"></span>\n      </div>\n    </div>\n  </div>\n  <div class="ngx-input-hint" *ngIf="righttext">\n    <span  [innerHTML]="righttext"></span>\n  </div>\n      </div>\n    </div>\n\n\n\n',styles:[".nitro-input-label{color:#9b9b9b;font-family:Poppins;font-size:12px;font-weight:500;line-height:21px;padding-bottom:4px}.nitro-tool{width:24px;height:24px;text-align:center;padding-left:4px}.input-noneditable{opacity:.4;pointer-events:none}input{height:40px;border:1px solid #d7d7d7;border-radius:4px;background-color:#fff;outline:0;color:#41434c;font-family:Poppins;font-size:14px;line-height:21px;padding-left:12px;width:100%}input:focus{box-shadow:none;border:1px solid #5c6bdd!important;border-radius:3px;background-color:#fff}input:focus+.nitro-input-label{color:#5c6bdd!important;font-weight:600!important}.is-focused{display:none!important}.nitro-cmp{display:-webkit-box;display:flex;-webkit-box-pack:justify;justify-content:space-between}textarea{box-sizing:border-box;height:96px;border:1px solid #d7d7d7;border-radius:4px;background-color:#fff;outline:0;color:#41434c;font-family:Poppins;font-size:14px;line-height:21px;padding-left:12px;padding-top:6px;width:100%}textarea:focus{box-shadow:none;border:1px solid #5c6bdd;border-radius:3px;background-color:#fff}textarea:focus+.nitro-input-label{color:#5c6bdd}.ss-txt{padding-left:5px}.suffix-icon{position:absolute;right:0;top:35px;width:24px;height:24px;text-align:center;cursor:pointer}.nito-ss-img{line-height:28px}.blocked{background-color:#f3f3f3;pointer-events:none}.prefix-icon{position:absolute;left:5px;top:35px;width:24px;height:24px;text-align:center}.search-txt{padding-left:35px;width:97.5%!important}.nitro-input-box-wrap{display:-webkit-box;display:flex;position:relative;-webkit-box-orient:vertical;-webkit-box-direction:reverse;flex-direction:column-reverse}::-webkit-input-placeholder{color:#a4a4a4;font-family:Poppins;font-size:12px;line-height:21px}::-moz-placeholder{color:#a4a4a4;font-family:Poppins;font-size:12px;line-height:21px}::placeholder{color:#a4a4a4;font-family:Poppins;font-size:12px;line-height:21px}:-ms-input-placeholder{color:#a4a4a4;font-family:Poppins;font-size:12px;line-height:21px}::-ms-input-placeholder{color:#a4a4a4;font-family:Poppins;font-size:12px;line-height:21px}.nitro-input-flex-wrap-inner{padding-top:4px}.ngx-input{width:100%}.ngx-input ngx-input-prefix{margin-right:8px}.ngx-input ngx-input-suffix{margin-left:8px}.ngx-input .nitro-input-wrap .ngx-input-box-wrap{position:relative;width:100%}.ngx-input .nitro-input-wrap .ngx-input-box-wrap:focus{outline:0}.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-box,.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-textarea{height:40px;border:1px solid #d7d7d7;border-radius:4px;background-color:#fff;outline:0;color:#41434c;font-family:Poppins;font-size:14px;line-height:21px;padding-left:12px;width:100%}.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-box:focus,.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-textarea:focus{box-shadow:none;border:1px solid #5c6bdd!important;border-radius:3px;background-color:#fff}.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-box[disabled],.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-textarea[disabled]{color:grey;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-box{margin:3px 0}.ngx-input .nitro-input-wrap .ngx-input-box-wrap .ngx-input-textarea{resize:none}.ngx-input .nitro-input-wrap .ngx-input-box-wrap .icon-eye{line-height:25px;top:0;bottom:0;position:absolute;right:10px;cursor:pointer;font-size:.8rem;color:#00f;-webkit-transition:color .1s;transition:color .1s}.ngx-input .nitro-input-wrap .ngx-input-box-wrap .icon-eye:hover{color:red}.ngx-input .nitro-input-wrap .ngx-input-label{pointer-events:none;position:absolute;font-size:16px}.ngx-input .nitro-input-wrap .ngx-input-underline{width:100%;height:1px;background-color:#ff0}.ngx-input .nitro-input-wrap .ngx-input-underline .underline-fill{background-color:#00f;width:100%;height:2px;margin:0 auto}.ngx-input .nitro-input-wrap .nitro-input-error{display:none}.ngx-input .nitro-input-wrap .ngx-input-hint{color:#9b9b9b;font-family:Poppins;font-size:12px;font-weight:500;line-height:21px;padding-top:4px}.ngx-input .nitro-input-wrap .nitro-input-success{color:#36cc9b;font-family:Poppins;font-size:12px;line-height:21px;display:-webkit-box;display:flex;padding-top:4px}.ngx-input.invalid.ng-touched .ngx-input-box,.ngx-input.invalid.ng-touched .ngx-input-textarea,.ngx-input.ng-invalid.ng-dirty .ngx-input-box,.ngx-input.ng-invalid.ng-dirty .ngx-input-textarea,.ngx-input.ng-invalid.ng-touched .ngx-input-box,.ngx-input.ng-invalid.ng-touched .ngx-input-textarea{border:1px solid #fb406b}.ngx-input.invalid.ng-touched .nitro-input-label,.ngx-input.ng-invalid.ng-dirty .nitro-input-label,.ngx-input.ng-invalid.ng-touched .nitro-input-label{font-weight:600;color:#fb406b}.ngx-input.invalid.ng-touched .ngx-input-hint,.ngx-input.ng-invalid.ng-dirty .ngx-input-hint,.ngx-input.ng-invalid.ng-touched .ngx-input-hint{color:#fb406b;display:none}.ngx-input.invalid.ng-touched .nitro-input-error,.ngx-input.ng-invalid.ng-dirty .nitro-input-error,.ngx-input.ng-invalid.ng-touched .nitro-input-error{display:block;color:#fb406b;font-family:Poppins;font-size:12px;line-height:18px;padding-top:4px}.ngx-input.invalid.ng-touched .nitro-input-success,.ngx-input.ng-invalid.ng-dirty .nitro-input-success,.ngx-input.ng-invalid.ng-touched .nitro-input-success{display:none}"]}),d("design:paramtypes",[n.ChangeDetectorRef])],t)}(),k=function(){function t(){}return t=p([n.Component({selector:"nitrozen-input-suffix",template:"\n    <ng-content></ng-content>\n  "})],t)}(),I=function(){function t(){}return t=p([n.Component({selector:"nitrozen-input-prefix",template:"\n    <ng-content></ng-content>\n  "})],t)}(),C=function(){function t(){}return t=p([n.NgModule({declarations:[w,k,I],imports:[e.CommonModule,i.MatInputModule,i.MatProgressSpinnerModule,s.FormsModule,s.ReactiveFormsModule,i.MatSlideToggleModule],exports:[w,k,I,i.MatInputModule,s.FormsModule,s.ReactiveFormsModule,i.MatProgressSpinnerModule,i.MatSlideToggleModule]})],t)}(),M=function(){function t(){}return t.prototype.ngOnInit=function(){},t=p([n.Component({selector:"app-select",template:"<p>\n  select works!\n</p>\n",styles:[""]}),d("design:paramtypes",[])],t)}(),O=function(){function t(){}return t=p([n.NgModule({declarations:[M],imports:[e.CommonModule]})],t)}(),P=function(){function t(t,n){this.snackBarRef=t,this.data=n}var e,o;return t.ctorParameters=function(){return[{type:i.MatSnackBarRef},{type:void 0,decorators:[{type:n.Inject,args:[i.MAT_SNACK_BAR_DATA]}]}]},t=p([n.Component({selector:"custom-snackbar",template:'\n   <div class="flex" style="display: flex;\n    justify-content: space-between;align-items: center;">\n  <div class="data" style="white-space: pre-line;">{{data.data}}</div>\n  <div class="dismiss" style="cursor:pointer;align-items: center;\n    display: flex;" *ngIf="data.hasIcon">\n        <mat-icon (click)="snackBarRef.dismiss()">close</mat-icon>\n  </div>\n  <div class="dismiss" style="cursor:pointer;line-height: 40px;" *ngIf="!data.hasIcon">\n       <div *ngIf="data.text">{{data.text}}</div>\n  </div>\n</div>\n\n  '}),(e=1,o=n.Inject(i.MAT_SNACK_BAR_DATA),function(t,n){o(t,n,e)}),d("design:paramtypes",[i.MatSnackBarRef,Object])],t)}(),j=function(){function t(){}return t.prototype.ngOnInit=function(){},t=p([n.Component({selector:"nitrozen-snack-bar",template:"\n    <ng-content></ng-content>\n  ",styles:["::ng-deep .text-snackbar{border-radius:3px;background-color:#5c6bdd!important;color:#fff;font-family:Poppins;font-size:14px;font-weight:400;line-height:21px}.btn-space{display:-webkit-box;display:flex;-webkit-box-pack:space-evenly;justify-content:space-evenly;padding-top:30px}::ng-deep .success-snackbar{border-radius:3px;background-color:#00c851;color:#fff;font-family:Poppins;font-size:14px;font-weight:400;line-height:21px}::ng-deep .error-snackbar{border-radius:3px;background-color:#fa3f4d;color:#fff;font-family:Poppins;font-size:14px;font-weight:400;line-height:21px}"]}),d("design:paramtypes",[])],t)}(),S={},z=function(){function t(){}return t=p([n.NgModule({declarations:[j,P],imports:[e.CommonModule,i.MatIconModule],exports:[j,P,i.MatIconModule],providers:[{provide:i.MAT_SNACK_BAR_DATA,useValue:S}],entryComponents:[P]})],t)}(),B=function(){function t(){this.change=new n.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.handleChange=function(t){console.log(t),this.change.emit(t)},p([n.Input(),d("design:type",Object)],t.prototype,"tab",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"change",void 0),t=p([n.Component({selector:"nitrozen-vertical-tabs",template:'<div class="tabordion">\n  <section *ngFor="let tb of tab; let i = index">\n    <input type="radio" name="sections" id="option{{i}}" [checked]="tb.checked" (change)="handleChange(tb)">\n    <label for="option{{i}}">\n    \t<div class="tab-sls">\n    \t\t<div class="tab-select">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_selected_icon.svg">\n    \t</div>\n    \t<div class="tab-unselect">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_unselected.svg">\n    \t</div>\n\n    \t<div class="text-tabs">{{tb.name}}</div>\n    \t</div>\n    \t</label>\n    \x3c!-- <article>\n      <p>{{tb.name}}</p>\n    </article> --\x3e\n  </section>\n\x3c!--   <section id="section2">\n    <input type="radio" name="sections" id="option2">\n    <label for="option2">\n    \t<div class="tab-sls">\n    \t\t<div class="tab-select">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_selected_icon.svg">\n    \t</div>\n    \t<div class="tab-unselect">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_unselected.svg">\n    \t</div>\n\n    \t<div class="text-tabs">Catalog Portfolio</div>\n    \t</div>\n    </label>\n    <article>\n      <p>Catalog Portfolio</p>\n    </article>\n  </section>\n  <section id="section3">\n    <input type="radio" name="sections" id="option3">\n     <label for="option3">\n    \t<div class="tab-sls">\n    \t\t<div class="tab-select">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_selected_icon.svg">\n    \t</div>\n    \t<div class="tab-unselect">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_unselected.svg">\n    \t</div>\n\n    \t<div class="text-tabs">Business Profile</div>\n    \t</div>\n    </label>\n    <article>\n      <p>Business Profile</p>\n    </article>\n  </section>\n  <section id="section4">\n    <input type="radio" name="sections" id="option4">\n    <label for="option4">\n    \t<div class="tab-sls">\n    \t\t<div class="tab-select">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_selected_icon.svg">\n    \t</div>\n    \t<div class="tab-unselect">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_unselected.svg">\n    \t</div>\n\n    \t<div class="text-tabs">KYC & Bank Details</div>\n    \t</div>\n    </label>\n    <article>\n      <p>KYC & Bank Details</p>\n    </article>\n  </section>\n  <section id="section5">\n    <input type="radio" name="sections" id="option5">\n    <label for="option5">\n    \t<div class="tab-sls">\n    \t\t<div class="tab-select">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_selected_icon.svg">\n    \t</div>\n    \t<div class="tab-unselect">\n    \t\t<img class="img-tabs" src="../../../assets/icons/tab_unselected.svg">\n    \t</div>\n\n    \t<div class="text-tabs">Agreement</div>\n    \t</div>\n    </label>\n    <article>\n      <p>Agreement</p>\n    </article>\n  </section> --\x3e\n</div>',styles:['.tabordion{display:block;font-family:Poppins;margin:auto;position:relative}.tabordion input[name=sections]{left:-9999px;position:absolute;top:-9999px}.tabordion section{display:block}.tabordion section label{cursor:pointer;display:block;padding:15px 20px;position:relative;max-width:280px;border-radius:3px;width:200px;z-index:100;border:1px solid #e4e5e6;margin-bottom:10px;color:#41434c;font-family:Poppins;font-size:16px;font-weight:500;line-height:25px}.tabordion section label .tab-select{display:none}.tabordion section label .tab-unselect{display:block}.tabordion section article{display:none;left:230px;min-width:300px;padding:0 0 0 21px;position:absolute;top:0}.tabordion section article:after{bottom:0;content:"";display:block;left:-229px;position:absolute;top:0;width:220px;z-index:1}.tabordion input[name=sections]:checked+label{color:#5c6bdd;font-family:Poppins;font-size:16px;border:1px solid #fff}.tabordion input[name=sections]:checked+label .tab-select{display:block}.tabordion input[name=sections]:checked+label .tab-unselect{display:none}.tabordion input[name=sections]:checked~article{display:block}.tab-select{height:24px;width:24px}.img-tabs{padding-top:2px}.text-tabs{padding-left:12px}.tab-unselect{height:24px;width:24px}@media (max-width:533px){.tabordion,h1{width:100%}.tabordion section label{font-size:1em;width:160px}.tabordion section article{left:200px;min-width:270px}.tabordion section article:after{bottom:0;content:"";display:block;left:-199px;position:absolute;top:0;width:200px}}.tab-sls{display:-webkit-box;display:flex}@media (max-width:768px){.tabordion,h1{width:96%}}@media (min-width:1366px){.tabordion,h1{width:70%}}@media (min-width:1824px){.tabordion,h1{width:100%}}']}),d("design:paramtypes",[])],t)}(),E=function(){function t(){}return t=p([n.NgModule({declarations:[B],imports:[e.CommonModule],exports:[B],schemas:[n.CUSTOM_ELEMENTS_SCHEMA]})],t)}(),F=function(){function t(){this.change=new n.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.handleChange=function(t){console.log(t),this.change.emit(t)},p([n.Input(),d("design:type",Object)],t.prototype,"tab",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"change",void 0),t=p([n.Component({selector:"nitrozen-tabs",template:'<div class="tab-ordion">\n  <section *ngFor="let tb of tab; let i = index">\n    <input type="radio" name="sections" id="option{{i}}" [checked]="tb.checked" (change)="handleChange(tb)">\n    <label for="option{{i}}">\n    \t<div class="text-tabs">{{tb.name}}</div>\n    \t</label>\n  </section>\n</div>',styles:['.tab-ordion{display:-webkit-box;display:flex;font-family:Poppins;margin:auto;position:relative;-webkit-box-pack:space-evenly;justify-content:space-evenly;padding-top:20px;width:87%}.tab-ordion input[name=sections]{left:-9999px;position:absolute;top:-9999px}.tab-ordion section{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.tab-ordion section label{cursor:pointer;display:block;position:relative;border-radius:3px;z-index:100;margin-bottom:10px;padding:0 12px;color:#41434c;font-family:Poppins}.tab-ordion section label:hover{border-radius:20px;background-color:#f3f3f3;height:40px;-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex}.tab-ordion section label .tab-select{display:none}.tab-ordion section label .tab-unselect{display:block}.tab-ordion section article{display:none;left:230px;min-width:300px;padding:0 0 0 21px;position:absolute;top:0}.tab-ordion section article:after{bottom:0;content:"";display:block;left:-229px;position:absolute;top:0;width:220px;z-index:1}.tab-ordion input[name=sections]:checked+label{color:#5c6bdd;font-family:Poppins;font-size:16px;border:1px solid #fff;background-color:#5c6bdd;border-radius:20px;height:40px;-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex}.tab-ordion input[name=sections]:checked+label .tab-select{display:block}.tab-ordion input[name=sections]:checked+label .tab-unselect{display:none}.tab-ordion input[name=sections]:checked+label .text-tabs{color:#fff}.tab-ordion input[name=sections]:checked~article{display:block}.tab-select{height:24px;width:24px}.img-tabs{padding-top:2px}.text-tabs{color:#4d4d4e;font-family:Poppins;font-size:14px;line-height:21px;width:100%}.tab-unselect{height:24px;width:24px}@media (max-width:533px){.tab-ordion,h1{width:100%}.tab-ordion section label{font-size:1em;width:160px}.tab-ordion section article{left:200px;min-width:270px}.tab-ordion section article:after{bottom:0;content:"";display:block;left:-199px;position:absolute;top:0;width:200px}}.tab-sls{display:-webkit-box;display:flex}@media (max-width:768px){h1{width:96%}.tab-ordion{width:18%}}@media (min-width:1366px){h1{width:70%}.tab-ordion{width:18%}}@media (min-width:1824px){h1{width:100%}.tab-ordion{width:55%}}']}),d("design:paramtypes",[])],t)}(),D=function(){function t(){}return t=p([n.NgModule({declarations:[F],imports:[e.CommonModule],exports:[F],schemas:[n.CUSTOM_ELEMENTS_SCHEMA]})],t)}(),_=function(){function t(t){this._http=t,this.text="Drag and drop a file here",this.param="file",this.msg="Accepted file types are png, jpg",this.target="https://file.io",this.complete=new n.EventEmitter,this.files=[],this.canChange=!1,this.typesMap={csv:{accept:"text/csv",contentType:["application/vnd.ms-excel","text/csv","text/plain"],readMethod:"text",errorMsg:"Invalid File Format. only CSV files are allowed"},image:{accept:"image/*",readMethod:"dataurl",errorMsg:"Invalid File Format. only IMAGE files are allowed"},image_jpg:{accept:"image/jpeg",readMethod:"dataurl",errorMsg:"Invalid File Format. only JPEG files are allowed"},video:{accept:"video/*",readMethod:"dataurl",errorMsg:"Invalid File Format. only VIDEO files are allowed"},pdf:{accept:"application/pdf",contentType:["application/pdf"],errorMsg:"Invalid File Format. only CSV files are allowed"},json:{accept:"application/json",contentType:"application/json",readMethod:"text",errorMsg:"Invalid File Format. only JSON files are allowed"}}}return t.prototype.ngOnInit=function(){},t.prototype.onClick=function(){var t=this;this.files=[];var n=document.getElementById("fileUpload");n.onchange=function(){for(var e=0;e<n.files.length;e++){var i=n.files[e];t.files.push({data:i,state:"in",inProgress:!1,progress:0,canRetry:!1,canCancel:!0})}t.uploadFiles()},n.click()},t.prototype.cancelFile=function(t){this.canChange=!1,t.sub.unsubscribe(),this.removeFileFromArray(t)},t.prototype.retryFile=function(t){this.uploadFile(t),t.canRetry=!1},t.prototype.uploadDragFile=function(t){this.files=[];for(var n=0;n<t.length;n++){var e=t[n];this.files.push({data:e,state:"in",inProgress:!1,progress:0,canRetry:!1,canCancel:!0}),this.uploadFiles()}},t.prototype.uploadFile=function(t){var n=this;if(this.canChange=!0,this.uploadedFileName=t.data.name,"image/*"===this.accept){var e=new FileReader;e.readAsDataURL(t.data),e.onload=function(t){n.url=t.target.result}}this.complete.emit(t.data)},t.prototype.uploadFiles=function(){var t=this;document.getElementById("fileUpload").value="",this.files.forEach((function(n){t.uploadFile(n)}))},t.prototype.removeFileFromArray=function(t){var n=this.files.indexOf(t);n>-1&&this.files.splice(n,1)},t.prototype.myMethod=function(t){},t.ctorParameters=function(){return[{type:a.HttpClient}]},p([n.Input(),d("design:type",Object)],t.prototype,"text",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"param",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"view",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"msg",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"target",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"accept",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"replaceable",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"newSrc",void 0),p([n.Input(),d("design:type",Object)],t.prototype,"type",void 0),p([n.Output(),d("design:type",Object)],t.prototype,"complete",void 0),t=p([n.Component({selector:"nitrozen-file-upload",template:'<div *ngIf="type === \'no-preview\'">\n<div class="file-cnt"  (click)="onClick()" appDragDrop (onFileDropped)="uploadDragFile($event)">\n\t<div class="file-side-cont">\n    \n  <div class="img-ic" *ngIf="!replaceable">\n      <img src="./../../assets/icons/fileupload_upload.svg">\n  </div>\n    <div class="img-ic-new" *ngIf="replaceable">\n      <img src="{{newSrc}}" style="width: 45px;height: 48px;">\n  </div>\n  <div class="img-txt">\n  \t<div class="txt-cnt-left" *ngIf="!canChange">{{text}}</div>\n  \t<div class="txt-cnt-left" *ngIf="canChange">{{uploadedFileName}}</div>\n  \t<div class="txt-msg" title="{{msg}}">{{msg}}</div>\n  </div>\n  <div class="file-btn" *ngIf="!canChange"><div class="flat-btn-underline">\n        <a class="btn-text file-change">Click To Upload</a>\n      </div></div>\n  <div class="file-btn" *ngIf="canChange"><div class="flat-btn-underline">\n        <a class="btn-text file-change">Change</a>\n      </div></div>\n</div>\n</div>\n\n\x3c!-- <ul>\n      <li *ngFor="let file of files" [@fadeInOut]="file.state">\n            <mat-progress-bar [value]="file.progress"></mat-progress-bar>\n            <span id="file-label">\n            {{file.data.name}} \n            <a title="Retry" (click)="retryFile(file)" *ngIf="file.canRetry">\n            <mat-icon>refresh</mat-icon></a>\n            <a title="Cancel" (click)="cancelFile(file)" *ngIf="file.canCancel">\n            <mat-icon>cancel</mat-icon></a>\n            </span>\n      </li>\n</ul> --\x3e\n<input type="file" id="fileUpload" name="fileUpload" multiple="multiple" \n\n accept="{{accept}}" style="display:none;"/>\n</div>\n\n\n<div *ngIf="type === \'preview\' && view === \'landscape\'">\n <div class="file-cnt-image" [ngClass]="{\'file-height\': canChange}"  (click)="onClick()" appDragDrop (onFileDropped)="uploadDragFile($event)">\n    <div class="inner-cnt">\n \t<div class="image-cnt" [ngClass]="{\'file-image-height\': canChange}">\n\t<div class="img-ic-image" *ngIf="!canChange && !replaceable">\n      <img src="./../../assets/icons/fileupload_large_upload.svg">\n  </div>\n  <div class="img-txt-image" *ngIf="!canChange && !replaceable">\n  \t<div class="txt-cnt">Drag and drop a file here</div>\n    <div class="txt-cnt">or</div>\n    <div class="pad-12">\n     <nitrozen-button-rounded [showProgress]="false" [isStroked]="true" [theme]="\'primary\'" [showIcon]="false" [shouldBeDisabled]="false"\n        >Upload</nitrozen-button-rounded>\n      </div>\n      <div class="pad-12" *ngIf="!canChange">\n          <div class="txt-msg-cn" title="{{msg}}">{{msg}}</div>\n      </div>\n  \t\x3c!-- <div class="txt-cnt" *ngIf="canChange">{{uploadedFileName}}</div> --\x3e\n  \x3c!-- \t<div class="txt-msg" title="{{msg}}">{{msg}}</div> --\x3e\n  </div>\n  <div *ngIf="canChange && !replaceable">\n  <img class="url-img" src="{{url}}">\n</div>\n<div *ngIf="replaceable">\n   <img class="url-img" src="{{newSrc}}">\n</div>\n</div>\n</div>\n<div class="file-btn-image" *ngIf="canChange">\n\t<div class="img-new-cnt">\n<div class="txt-cnt-image" *ngIf="canChange">{{uploadedFileName}}</div>\n  \t<div class="txt-msg-image" title="{{msg}}">{{msg}}</div>\n  </div>\n  <div class="change-btn" *ngIf="canChange">\n  \t<div class="flat-btn-underline">\n        <a class="btn-text file-change">Change</a>\n      </div>\n  </div>\n</div>\n</div>\n\n<input type="file" id="fileUpload" name="fileUpload" multiple="multiple" \n\n accept="{{accept}}" style="display:none;"/>\n</div>\n\n\n\n<div *ngIf="type === \'preview\'