UNPKG

75.2 kBJavaScriptView Raw
1!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("rxjs"),require("rxjs/operators"),require("@angular/material/select"),require("ngx-mat-select-search"),require("@angular/common/http"),require("ngx-image-cropper")):"function"==typeof define&&define.amd?define("nitrozen",["exports","@angular/core","@angular/common","@angular/material","@angular/animations","@angular/forms","rxjs","rxjs/operators","@angular/material/select","ngx-mat-select-search","@angular/common/http","ngx-image-cropper"],n):n((t=t||self).nitrozen={},t.ng.core,t.ng.common,t.ng.material,t.ng.animations,t.ng.forms,t.rxjs,t.rxjs.operators,t.ng.material.select,t.ngxMatSelectSearch,t.ng.common.http,t.ngxImageCropper)}(this,(function(t,n,e,o,i,s,a,r,l,d,p,c){"use strict";
2/*! *****************************************************************************
3 Copyright (c) Microsoft Corporation. All rights reserved.
4 Licensed under the Apache License, Version 2.0 (the "License"); you may not use
5 this file except in compliance with the License. You may obtain a copy of the
6 License at http://www.apache.org/licenses/LICENSE-2.0
7
8 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
9 KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
10 WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
11 MERCHANTABLITY OR NON-INFRINGEMENT.
12
13 See the Apache Version 2.0 License for specific language governing permissions
14 and limitations under the License.
15 ***************************************************************************** */var u=function(){return(u=Object.assign||function(t){for(var n,e=1,o=arguments.length;e<o;e++)for(var i in n=arguments[e])Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i]);return t}).apply(this,arguments)};function g(t,n,e,o){var i,s=arguments.length,a=s<3?n:null===o?o=Object.getOwnPropertyDescriptor(n,e):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,n,e,o);else for(var r=t.length-1;r>=0;r--)(i=t[r])&&(a=(s<3?i(a):s>3?i(n,e,a):i(n,e))||a);return s>3&&a&&Object.defineProperty(n,e,a),a}function f(t,n){return function(e,o){n(e,o,t)}}var m,b=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)},g([n.Input()],t.prototype,"showProgress",void 0),g([n.Input()],t.prototype,"isContained",void 0),g([n.Input()],t.prototype,"theme",void 0),g([n.Input()],t.prototype,"focused",void 0),g([n.Input()],t.prototype,"large",void 0),g([n.Input()],t.prototype,"isStroked",void 0),g([n.Input()],t.prototype,"shouldBeDisabled",void 0),g([n.Input()],t.prototype,"showIcon",void 0),g([n.Output()],t.prototype,"clicked",void 0),t=g([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;transition:opacity .25s ease-out;position:absolute;top:50%;left: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:flex;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:flex;flex-direction:row-reverse;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:flex;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:flex;flex-direction:row-reverse;justify-content:center}"]})],t)}(),h=function(){function t(){}return t=g([n.NgModule({declarations:[b],imports:[e.CommonModule,o.MatButtonModule,o.MatProgressSpinnerModule],exports:[b,o.MatButtonModule,o.MatProgressSpinnerModule]})],t)}(),x=function(){function t(){this.clicked=new n.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.clickedButton=function(t){this.clicked.emit(t)},g([n.Input()],t.prototype,"shouldBeDisabled",void 0),g([n.Input()],t.prototype,"theme",void 0),g([n.Input()],t.prototype,"focused",void 0),g([n.Input()],t.prototype,"prefixIcon",void 0),g([n.Input()],t.prototype,"postfixIcon",void 0),g([n.Input()],t.prototype,"type",void 0),g([n.Output()],t.prototype,"clicked",void 0),t=g([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}"]})],t)}(),v=function(){function t(){}return t=g([n.NgModule({declarations:[x],imports:[e.CommonModule,o.MatButtonModule,o.MatProgressSpinnerModule],exports:[x,o.MatButtonModule,o.MatProgressSpinnerModule]})],t)}(),y=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)},g([n.Input()],t.prototype,"checked",void 0),g([n.Input()],t.prototype,"disabled",void 0),g([n.Input()],t.prototype,"indeterminate",void 0),g([n.Output()],t.prototype,"change",void 0),t=g([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:[""]})],t)}(),w=function(){function t(){}return t=g([n.NgModule({declarations:[y],imports:[e.CommonModule,o.MatCheckboxModule],exports:[y,o.MatCheckboxModule]})],t)}(),k=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)},g([n.Input()],t.prototype,"selected",void 0),g([n.Input()],t.prototype,"disabled",void 0),g([n.Output()],t.prototype,"change",void 0),t=g([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}"]})],t)}(),I=function(){function t(){}return t=g([n.NgModule({declarations:[k],imports:[e.CommonModule,o.MatRadioModule],exports:[k,o.MatRadioModule]})],t)}();!function(t){t.text="text",t.number="number",t.password="password",t.textarea="textarea"}(m||(m={}));var C={provide:s.NG_VALUE_ACCESSOR,useExisting:n.forwardRef((function(){return P})),multi:!0},M={provide:s.NG_VALIDATORS,useExisting:n.forwardRef((function(){return P})),multi:!0},P=function(){function t(t){this.cd=t,this.label="",this.type=m.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===m.textarea?this.textareaControl:this.inputControl},enumerable:!0,configurable:!0}),t.prototype.validate=function(t){return"number"!==this.type?null:u({},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}]},g([n.Input()],t.prototype,"id",void 0),g([n.Input()],t.prototype,"name",void 0),g([n.Input()],t.prototype,"label",void 0),g([n.Input()],t.prototype,"type",void 0),g([n.Input()],t.prototype,"hint",void 0),g([n.Input()],t.prototype,"error",void 0),g([n.Input()],t.prototype,"blocked",void 0),g([n.Input()],t.prototype,"success",void 0),g([n.Input()],t.prototype,"placeholder",void 0),g([n.Input()],t.prototype,"disabled",void 0),g([n.Input()],t.prototype,"tabindex",void 0),g([n.Input()],t.prototype,"search",void 0),g([n.Input()],t.prototype,"showSuccess",void 0),g([n.Input()],t.prototype,"righttext",void 0),g([n.Input()],t.prototype,"toolmsg",void 0),g([n.Input()],t.prototype,"pattern",void 0),g([n.Input()],t.prototype,"noneditable",void 0),g([n.Input()],t.prototype,"min",void 0),g([n.Input()],t.prototype,"max",void 0),g([n.Input()],t.prototype,"minlength",void 0),g([n.Input()],t.prototype,"maxlength",void 0),g([n.Input()],t.prototype,"required",void 0),g([n.Input()],t.prototype,"requiredIndicator",void 0),g([n.Input()],t.prototype,"tooltip",void 0),g([n.Input()],t.prototype,"passwordToggleEnabled",void 0),g([n.Input()],t.prototype,"passwordTextVisible",void 0),g([n.Input()],t.prototype,"autoSelect",void 0),g([n.Input()],t.prototype,"autofocus",void 0),g([n.Input()],t.prototype,"autocomplete",void 0),g([n.Input()],t.prototype,"autocorrect",void 0),g([n.Input()],t.prototype,"spellcheck",void 0),g([n.Output()],t.prototype,"change",void 0),g([n.Output()],t.prototype,"blur",void 0),g([n.Output()],t.prototype,"focus",void 0),g([n.Output()],t.prototype,"keyup",void 0),g([n.Output()],t.prototype,"click",void 0),g([n.HostBinding("class")],t.prototype,"getHostCssClasses",void 0),g([n.HostBinding("class.ng-dirty")],t.prototype,"focusedOrDirty",null),g([n.HostBinding("class.ng-touched")],t.prototype,"isTouched",null),g([n.ViewChild("inputControl")],t.prototype,"inputControl",void 0),g([n.ViewChild("inputModel")],t.prototype,"inputModel",void 0),g([n.ViewChild("textareaControl")],t.prototype,"textareaControl",void 0),g([n.ViewChild("passwordControl")],t.prototype,"passwordControl",void 0),t=g([n.Component({selector:"nitrozen-input",providers:[C,M],encapsulation:n.ViewEncapsulation.None,animations:[i.trigger("labelState",[i.state("inside",i.style({"font-size":"1em",top:"0"})),i.state("outside",i.style({"font-size":".7rem",top:"-15px"})),i.transition("inside => outside",i.animate("150ms ease-out")),i.transition("outside => inside",i.animate("150ms ease-out"))]),i.trigger("underlineState",[i.state("collapsed",i.style({width:"0%"})),i.state("expanded",i.style({width:"100%"})),i.transition("collapsed => expanded",i.animate("150ms ease-out")),i.transition("expanded => collapsed",i.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 [pattern]="pattern"\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 [pattern]="pattern"\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 [pattern]="pattern"\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 class="required-indicator" [innerHTML]="requiredIndicatorView"></span>\n <span class="nitro-tool" [matTooltipPosition]="\'above\'" matTooltipClass=\'input-tooltip\' matTooltip="{{toolmsg}}" [hidden]="!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:36px;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:flex;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:flex;position:relative;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;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: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 #fa3f4d}.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:#fa3f4d}.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:#fa3f4d;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:#fa3f4d;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}"]})],t)}(),z=function(){function t(){}return t=g([n.Component({selector:"nitrozen-input-suffix",template:"\n <ng-content></ng-content>\n "})],t)}(),S=function(){function t(){}return t=g([n.Component({selector:"nitrozen-input-prefix",template:"\n <ng-content></ng-content>\n "})],t)}(),O=function(){function t(){}return t=g([n.NgModule({declarations:[P,z,S],imports:[e.CommonModule,o.MatInputModule,o.MatProgressSpinnerModule,s.FormsModule,s.ReactiveFormsModule,o.MatSlideToggleModule,o.MatTooltipModule],exports:[P,z,S,o.MatInputModule,s.FormsModule,s.ReactiveFormsModule,o.MatProgressSpinnerModule,o.MatSlideToggleModule,o.MatTooltipModule]})],t)}(),_=function(){function t(){}return t.prototype.ngOnInit=function(){},t=g([n.Component({selector:"app-select",template:"<p>\n select works!\n</p>\n",styles:[""]})],t)}(),E=function(){function t(){}return t=g([n.NgModule({declarations:[_],imports:[e.CommonModule]})],t)}(),T=function(){function t(){this.destroy$=new a.Subject,this.selectCtrl=new s.FormControl,this.selectFilterCtrl=new s.FormControl,this.customClass="",this.isColumnHeader=!0,this.placeholder="Select",this.label=this.placeholder,this.displayName="name",this.id="id",this.isMultiple=!1,this.isSearch=!0,this.change=new n.EventEmitter,this.optionListObject={}}return t.prototype.ngOnInit=function(){var t=this;this.filteredoptions=this.options,this.selectCtrl.setValue(this.value),this.options.forEach((function(n){t.optionListObject[n[t.id]]=n})),this.selectFilterCtrl.valueChanges.pipe(r.takeUntil(this.destroy$)).subscribe((function(){t.filterOptions()})),this.selectCtrl.valueChanges.pipe(r.takeUntil(this.destroy$)).subscribe((function(n){t.isMultiple||t.change.emit({value:t.selectCtrl.value,objectValue:t.optionListObject[t.selectCtrl.value]})}))},t.prototype.ngOnChanges=function(t){var n=this;t.value&&this.selectCtrl.setValue(t.value.currentValue,{emitEvent:!1}),t.options&&(this.options=t.options.currentValue,this.filteredoptions=this.options,this.options.forEach((function(t){n.optionListObject[t[n.id]]=t})))},t.prototype.submitOptions=function(){var t=this.getArrayValueObjects(this.selectCtrl.value);this.change.emit({value:this.selectCtrl.value,objectValue:t}),this.select.close()},t.prototype.clearOptions=function(){this.selectCtrl.setValue([]),this.change.emit({value:[],objectValue:[]}),this.select.close()},t.prototype.getArrayValueObjects=function(t){var n=this,e=[];return t.forEach((function(t){e.push(n.optionListObject[t])})),e},t.prototype.filterOptions=function(){var t=this;if(this.options){var n=this.selectFilterCtrl.value;n?(n=n.toLowerCase(),this.filteredoptions=this.options.filter((function(e){return e[t.displayName].toLowerCase().indexOf(n)>-1}))):this.filteredoptions=this.options.slice()}},t.prototype.selectAllChanged=function(t){},g([n.ViewChild("select")],t.prototype,"select",void 0),g([n.Input()],t.prototype,"customClass",void 0),g([n.Input()],t.prototype,"isColumnHeader",void 0),g([n.Input()],t.prototype,"placeholder",void 0),g([n.Input()],t.prototype,"label",void 0),g([n.Input()],t.prototype,"value",void 0),g([n.Input()],t.prototype,"options",void 0),g([n.Input()],t.prototype,"displayName",void 0),g([n.Input()],t.prototype,"id",void 0),g([n.Input()],t.prototype,"isMultiple",void 0),g([n.Input()],t.prototype,"isSearch",void 0),g([n.Output()],t.prototype,"change",void 0),t=g([n.Component({selector:"app-select",template:'<div class="nitro-div">\n <mat-form-field [floatLabel]="\'always\'">\n <mat-label>{{label}}</mat-label>\n\n <mat-select #select [ngClass]="select.panelOpen ? \'arrow-top\' : \'arrow-bottom\'"[placeholder]="placeholder" [formControl]="selectCtrl" [multiple]="isMultiple" triggerValue="Select" [disableOptionCentering]="true" #select\n [panelClass]="isMultiple ? \'nitro-searchable-multiple-select-panel\' : \'nitro-searchable-select-panel\'" name="form_value">\n \x3c!-- <mat-select-trigger *ngIf="isColumnHeader">\n <span class="place-holder">\n {{placeholder}}\n </span>\n </mat-select-trigger> --\x3e\n <div class="options-container">\n\n <mat-option *ngIf="isSearch">\n <ngx-mat-select-search [formControl]="selectFilterCtrl" [placeholderLabel]="\'Search\'"\n [noEntriesFoundLabel]="\'No match found\'"></ngx-mat-select-search>\n </mat-option>\n <nitrozen-select-check-all *ngIf="isMultiple" [text]="\'\'" [model]="selectCtrl" [values]="options" (change)="selectAllChanged($event)">\n </nitrozen-select-check-all>\n <mat-option *ngFor="let option of filteredoptions" [value]="option[id]">\n {{option[displayName]}}\n </mat-option>\n </div>\n <div class="select-action-container" *ngIf="isMultiple">\n <nitrozen-button-text (clicked)="clearOptions()">Clear</nitrozen-button-text>\n <nitrozen-button-text (clicked)="submitOptions()">Submit</nitrozen-button-text>\n\n </div>\n\n \x3c!-- <app-button [type]="\'small-success\'" [label]="\'Submit\'" (click)="submitOptions()">\n <span>Submit</span>\n </app-button>\n <app-button [type]="\'small-default\'" [label]="\'Clear\'" (click)="clearOptions()">\n <span>Clear</span>\n </app-button> \n </div> --\x3e\n </mat-select>\n <mat-placeholder class="place-holder">{{placeholder}}</mat-placeholder>\n </mat-form-field>\n <div>{{model}}</div>\n</div>',encapsulation:n.ViewEncapsulation.None,styles:[".nitro-div ::ng-deep .mat-form-field-underline{display:none}.nitro-div ::ng-deep .mat-select-value-text{height:40px!important;padding-left:25px;line-height:40px!important;font-family:Poppins}.nitro-div ::ng-deep .mat-select{height:40px;background:#fff;border:1px solid #a9a9a9;border-radius:2px;font-family:Poppins}.nitro-div ::ng-deep .mat-form-field-label{line-height:40px!important;padding-left:5px;font-family:Poppins}.nitro-div ::ng-deep .mat-select-trigger{height:40px}.nitro-div .mat-select-disabled{border:none}.nitro-div .mat-select-disabled ::ng-deep .mat-select-trigger{background-color:#e4e5e6;border:1px solid #e4e5e6}.nitro-div .mat-select-disabled ::ng-deep .mat-select-arrow{margin:0 12px!important;color:#bbb!important}.nitro-div .mat-select-disabled ::ng-deep .mat-select-value-text{color:#bbb}.nitro-div ::ng-deep .mat-option{height:40px!important;border-bottom:1px solid;font-family:Poppins}.nitro-div ::ng-deep .mat-option-text{font-family:Poppins}.nitro-div ::ng-deep .mat-select-arrow{margin:0 12px!important;color:#5c6bdd!important}.nitro-div .mat-form-field-can-float.mat-form-field-should-float ::ng-deep .mat-form-field-label{line-height:21px!important;font-size:16px;font-weight:500px}.select-action-container{display:flex;flex-direction:row;justify-content:flex-end;height:60px;border-top:1px solid #e4e5e6;align-items:center}.options-container{max-height:196px;overflow:auto}.arrow-top ::ng-deep .mat-select-arrow{border-bottom:5px solid;border-top:none!important}.arrow-bottom :ng-deep .mat-select-arrow{border-top:5px solid;border-bottom:none!important}"]})],t)}(),D=function(){function t(){this.values=[],this.text="Select All",this.change=new n.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.isChecked=function(){return this.model.value&&this.values.length&&this.model.value.length===this.values.length},t.prototype.isIndeterminate=function(){return this.model.value&&this.values.length&&this.model.value.length&&this.model.value.length<this.values.length},t.prototype.toggleSelection=function(t){t.checked?this.model.setValue(this.values):this.model.setValue([])},g([n.Input()],t.prototype,"model",void 0),g([n.Input()],t.prototype,"values",void 0),g([n.Input()],t.prototype,"text",void 0),g([n.Output()],t.prototype,"change",void 0),t=g([n.Component({selector:"nitrozen-select-check-all",template:'<mat-checkbox class="mat-option" [disableRipple]="true" [indeterminate]="isIndeterminate()" [checked]="isChecked()"\n (click)="$event.stopPropagation()" (change)="toggleSelection($event)">\n {{text}}\n</mat-checkbox>',styles:[""]})],t)}(),F=function(){function t(){}return t=g([n.NgModule({declarations:[T,D],imports:[e.CommonModule,l.MatSelectModule,s.FormsModule,s.ReactiveFormsModule,d.NgxMatSelectSearchModule,o.MatCheckboxModule,v],exports:[T,l.MatSelectModule,D,o.MatCheckboxModule]})],t)}(),j=function(){function t(t,n){this.snackBarRef=t,this.data=n}return t.ctorParameters=function(){return[{type:o.MatSnackBarRef},{type:void 0,decorators:[{type:n.Inject,args:[o.MAT_SNACK_BAR_DATA]}]}]},t=g([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 '}),f(1,n.Inject(o.MAT_SNACK_BAR_DATA))],t)}(),B=function(){function t(){}return t.prototype.ngOnInit=function(){},t=g([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:flex;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}"]})],t)}(),A={},V=function(){function t(){}return t=g([n.NgModule({declarations:[B,j],imports:[e.CommonModule,o.MatIconModule],exports:[B,j,o.MatIconModule],providers:[{provide:o.MAT_SNACK_BAR_DATA,useValue:A}],entryComponents:[j]})],t)}(),$=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)},g([n.Input()],t.prototype,"tab",void 0),g([n.Output()],t.prototype,"change",void 0),t=g([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: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%}}']})],t)}(),q=function(){function t(){}return t=g([n.NgModule({declarations:[$],imports:[e.CommonModule],exports:[$],schemas:[n.CUSTOM_ELEMENTS_SCHEMA]})],t)}(),N=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)},g([n.Input()],t.prototype,"tab",void 0),g([n.Output()],t.prototype,"change",void 0),t=g([n.Component({selector:"nitrozen-tabs",template:'<div>\n<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>\n</div>',styles:['.tab-ordion{display:flex;font-family:Poppins;position:relative;justify-content:space-evenly;padding-top:20px;width:87%}.tab-ordion input[name=sections]{left:-9999px;position:absolute;top:-9999px}.tab-ordion section{display:flex;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;align-items:center;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;align-items:center;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:flex}@media (max-width:768px){h1{width:96%}.tab-ordion{width:18%}}@media (min-width:1366px){.tab-ordion,h1{width:70%}}@media (min-width:1824px){h1{width:100%}.tab-ordion{width:55%}}']})],t)}(),R=function(){function t(){}return t=g([n.NgModule({declarations:[N],imports:[e.CommonModule],exports:[N],schemas:[n.CUSTOM_ELEMENTS_SCHEMA]})],t)}(),L=function(){function t(t,n){this.dialogRef=t,this.data=n,this.croppedImage=""}return t.prototype.onNoClick=function(){this.dialogRef.close(this.croppedImage)},t.prototype.myMethod=function(){this.dialogRef.close()},t.prototype.imageCropped=function(t){this.croppedImage=t.base64},t.prototype.ngOnInit=function(){},t.ctorParameters=function(){return[{type:o.MatDialogRef},{type:void 0,decorators:[{type:n.Inject,args:[o.MAT_DIALOG_DATA]}]}]},t=g([n.Component({selector:"nitrozen-crop-modal",template:'<div class="alert-modal">\n\t<div class="dialog-tt" mat-dialog-title>Crop Image</div>\n\t<div mat-dialog-content>\n\t\t\x3c!-- <input type="file" (change)="fileChangeEvent($event)" />\n\t\t<img src="{{data.name}}"> --\x3e\n\t\t<div>\n\t\t\t<image-cropper\n\t\t\t[imageBase64]="data.name"\n\t\t\tformat="png,jpeg"\n\t\t\t(imageCropped)="imageCropped($event)"\n\t\t\t[aspectRatio]="data.config"\n\t\t\t></image-cropper>\n\t\t</div>\n\t</div>\n\t<div class="dialog-act" mat-dialog-actions>\n\t\t<div>\n\t\t\t<nitrozen-button [isContained]="true" [theme]="\'primary\'" [showIcon]="false" (clicked)="onNoClick()">Submit</nitrozen-button>\n\t\t</div>\n\t\t<div class="cancel-btns">\n\t\t\t<nitrozen-button [showProgress]="false" [isStroked]="true" [theme]="\'primary\'" [showIcon]="false" [shouldBeDisabled]="false" (clicked)="myMethod()"\n\t\t\t>Cancel</nitrozen-button>\n\t\t</div>\n\t</div>\n</div>',styles:[".dialog-tt{color:#41434c;font-family:Poppins;font-size:16px;font-weight:700;line-height:25px;visibility:hidden}.dialog-act{display:flex;justify-content:flex-end;padding-top:40px}.cancel-btns{padding-left:12px}"]}),f(1,n.Inject(o.MAT_DIALOG_DATA))],t)}(),U=function(){function t(t,e){this._http=t,this.dialog=e,this.text="Drag and drop your file here.",this.param="file",this.target="https://file.io",this.required=!1,this.download=!1,this.enableCrop=!1,this.complete=new n.EventEmitter,this.dimen=new n.EventEmitter,this.files=[],this.canChange=!1,this.logo_active=!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=[],this.logo_active=!0;var n=document.getElementById("fileUpload");n.onchange=function(e){console.log(e);for(var o=0;o<n.files.length;o++){var i=n.files[o];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,this.logo_active=!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=[],this.logo_active=!0;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.downloadImage=function(t){window.open(t,"_blank")},t.prototype.getImageDimension=function(t){var n=new Image;n.onload=function(){this.dimens={width:n.width,height:n.height,crop:!!t.crop&&t.crop},this.dimen.emit(this.dimens)}.bind(this),n.src=this.url},t.prototype.uploadFile=function(t){var n=this;this.canChange=!0,this.uploadedFileName=t.data.name;var e=new FileReader;e.readAsDataURL(t.data),e.onload=function(t){n.url=t.target.result,n.getImageDimension({crop:!1})},this.file_type=t.data.type,this.logo_active=!1,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.openCropTool=function(t){var n=this;t.stopPropagation(),this.dialog.open(L,{width:"480px",data:{name:this.url,config:this.config},autoFocus:!1}).afterClosed().subscribe((function(t){t&&(n.url=t,n.complete.emit(n.url),n.getImageDimension({crop:!0}))}))},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:p.HttpClient},{type:o.MatDialog}]},g([n.Input()],t.prototype,"text",void 0),g([n.Input()],t.prototype,"param",void 0),g([n.Input()],t.prototype,"view",void 0),g([n.Input()],t.prototype,"size",void 0),g([n.Input()],t.prototype,"dimension",void 0),g([n.Input()],t.prototype,"error",void 0),g([n.Input()],t.prototype,"msg",void 0),g([n.Input()],t.prototype,"target",void 0),g([n.Input()],t.prototype,"accept",void 0),g([n.Input()],t.prototype,"required",void 0),g([n.Input()],t.prototype,"download",void 0),g([n.Input()],t.prototype,"enableCrop",void 0),g([n.Input()],t.prototype,"downloadUrl",void 0),g([n.Input()],t.prototype,"replaceable",void 0),g([n.Input()],t.prototype,"newSrc",void 0),g([n.Input()],t.prototype,"config",void 0),g([n.Input()],t.prototype,"type",void 0),g([n.Output()],t.prototype,"complete",void 0),g([n.Output()],t.prototype,"dimen",void 0),t=g([n.Component({selector:"nitrozen-file-upload",template:'<div *ngIf="type === \'no-preview\'">\n <div class="file-cnt" (click)="onClick()" appDragDrop (onFileDropped)="uploadDragFile($event)">\n <div class="file-side-cont" [ngClass]="{\'file-active\': logo_active}" >\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 && file_type !== \'application/pdf\'">\n <img src="./../../assets/icons/fileupload_general.svg" style="height: 48px;object-fit: cover;">\n </div>\n <div class="img-ic-new" *ngIf="replaceable && file_type === \'application/pdf\'">\n <img src="./../../assets/icons/fileupload_placeholder_pdf.svg" style="height: 48px;object-fit: cover;">\n </div>\n <div class="img-txt">\n <div class="txt-cnt-left" *ngIf="!canChange">{{text}}</div>\n <div class="txt-cnt-left" *ngIf="canChange">{{uploadedFileName}}</div>\n <div class="txt-msg" title="{{msg}}">{{msg}}</div>\n <div *ngIf="size" class="txt-msg" title="{{size}}">{{size}}</div>\n <div *ngIf="dimension" class="txt-msg" title="{{dimension}}">{{dimension}}</div>\n </div>\n \n <div class="file-btn">\n <div *ngIf="enableCrop && replaceable">\n <div class="url-down" (click)="openCropTool($event)">\n <img src="./../../assets/icons/crop_icon.svg">\n </div>\n </div>\n <div *ngIf="downloadUrl">\n <div class="url-down" (click)="downloadImage(downloadUrl)">\n <img src="./../../assets/icons/fileupoload-download.svg">\n </div>\n </div>\n <div class="flat-btn-underline" *ngIf="!canChange">\n <nitrozen-button-rounded [showProgress]="false" [isStroked]="true" [theme]="\'primary\'" [showIcon]="false" [shouldBeDisabled]="false"\n >Upload</nitrozen-button-rounded>\n </div>\n <div class="flat-btn-underline" *ngIf="canChange">\n <a class="btn-text file-change">Change</a>\n </div>\n </div>\n </div>\n </div>\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" [required]="required" name="fileUpload" multiple="multiple"\n accept="{{accept}}" style="display:none;"/>\n\n <div *ngIf="error"><span [innerHTML]="error"></span></div>\n</div>\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" [ngClass]="{\'file-active\': logo_active}" >\n <div class="image-cnt" [ngClass]="{\'file-image-height\': canChange}">\n <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 <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 *ngIf="size" class="txt-msg-cn" title="{{size}}">{{size}}</div>\n <div *ngIf="dimension" class="txt-msg-cn" title="{{dimension}}">{{dimension}}</div>\n </div>\n \x3c!-- <div class="txt-cnt" *ngIf="canChange">{{uploadedFileName}}</div> --\x3e\n \x3c!-- <div class="txt-msg" title="{{msg}}">{{msg}}</div> --\x3e\n </div>\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="icn-down-pos" *ngIf="canChange && downloadUrl">\n <div class="url-down" (click)="downloadImage(downloadUrl)">\n <img src="./../../assets/icons/fileupoload-download.svg">\n </div>\n </div>\n <div class="icn-down-crop" *ngIf="canChange && enableCrop">\n <div class="url-down" (click)="openCropTool($event)">\n <img class="crop-icn" src="./../../assets/icons/crop_icon.svg">\n </div>\n </div>\n </div>\n <div class="file-btn-image" *ngIf="canChange">\n <div class="img-new-cnt">\n <div class="txt-cnt-image" *ngIf="canChange">{{uploadedFileName}}</div>\n <div class="txt-msg-image" title="{{msg}}">{{msg}}</div>\n <div *ngIf="size" class="txt-msg-image" title="{{size}}">{{size}}</div>\n <div *ngIf="dimension" class="txt-msg-image" title="{{dimension}}">{{dimension}}</div>\n </div>\n <div class="change-btn" *ngIf="canChange">\n <div class="flat-btn-underline">\n <a class="btn-text file-change">Change</a>\n </div>\n </div>\n </div>\n </div>\n <input type="file" id="fileUpload" [required]="required" name="fileUpload" multiple="multiple"\n accept="{{accept}}" style="display:none;"/>\n\n <div *ngIf="error"><span [innerHTML]="error"></span></div>\n</div>\n<div *ngIf="type === \'preview\' && view === \'protrait\'">\n <div class="file-cnt-image file-flx" [ngClass]="{\'file-height\': canChange}">\n <div class="main-file-drop" (click)="onClick()" appDragDrop (onFileDropped)="uploadDragFile($event)">\n <div class="inner-cnt-prot" [ngClass]="{\'file-active\': logo_active}" >\n <div class="image-cnt-new">\n <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 \x3c!-- <div class="txt-cnt break-txt">Drag and drop a file here or click to upload</div> --\x3e\n <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">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 *ngIf="size" class="txt-msg-cn" title="{{size}}">{{size}}</div>\n <div *ngIf="dimension" class="txt-msg-cn" title="{{dimension}}">{{dimension}}</div>\n </div>\n </div>\n <div>\n <div *ngIf="canChange && !replaceable">\n <img class="url-img-port" src="{{url}}">\n </div>\n <div *ngIf="replaceable">\n <img class="url-img-port" src="{{newSrc}}">\n </div>\n \x3c!-- <div class="icn-down-pos" *ngIf="downloadUrl">\n <div class="url-down" (click)="downloadImage(downloadUrl)">\n <img src="./../../assets/icons/fileupoload-download.svg">\n </div>\n </div> --\x3e\n </div>\n </div>\n <div class="icn-down-pos" *ngIf="canChange && downloadUrl">\n <div class="url-down" (click)="downloadImage(downloadUrl)">\n <img src="./../../assets/icons/fileupoload-download.svg">\n </div>\n </div>\n <div class="icn-down-crop-pro" *ngIf="canChange && enableCrop">\n <div class="url-down" (click)="openCropTool($event)">\n <img src="./../../assets/icons/crop_icon.svg">\n </div>\n </div>\n </div>\n </div>\n <div class="file-btn-image" *ngIf="canChange">\n <div class="img-new-cnt">\n <div class="txt-cnt-image" *ngIf="canChange">{{uploadedFileName}}</div>\n <div class="txt-msg-image" title="{{msg}}">{{msg}}</div>\n <div *ngIf="size" class="txt-msg-image" title="{{size}}">{{size}}</div>\n <div *ngIf="dimension" class="txt-msg-image" title="{{dimension}}">{{dimension}}</div>\n </div>\n <div class="change-btn" *ngIf="canChange">\n <div class="flat-btn-underline">\n <a class="btn-text file-change" (click)="onClick()">Change</a>\n </div>\n </div>\n </div>\n </div>\n <input type="file" id="fileUpload" [required]="required" name="fileUpload" multiple="multiple"\n accept="{{accept}}" style="display:none;"/>\n <div *ngIf="error"><span [innerHTML]="error"></span></div>\n</div>',animations:[i.trigger("fadeInOut",[i.state("in",i.style({opacity:100})),i.transition("* => void",[i.animate(300,i.style({opacity:0}))])])],styles:[".file-cnt{display:flex;width:65%;border-radius:3px;padding:12px;border:1px solid #e4e5e6;cursor:pointer;background-color:#f8f8f8}.file-side-cont{display:flex;width:100%;border:1px dashed #d7d7d7;border-radius:3px;background-color:#fff;padding:12px}.crop-icn{width:40px}.file-active{border:1px dashed #00f!important}.url-down{display:flex;height:100%;padding-right:25%}.icn-down-pos{position:absolute;right:10px;bottom:20px;top:175px;z-index:1}.icn-down-crop{position:absolute;right:60px;bottom:20px;top:175px;z-index:1}.icn-down-crop-pro{position:absolute;z-index:1;bottom:20px;right:40px}.file-cnt-image{width:486px;border:1px solid #e4e5e6;border-radius:3px;background-color:#f8f8f8;position:relative;cursor:pointer}.file-height{height:480px}.file-flx{display:flex;justify-content:center}.main-file-drop{width:265px;border-radius:3px;border:1px solid #e4e5e6;background-color:#d8d8d8;position:relative;cursor:pointer;height:330px;margin:10px 0}.img-txt-image{padding-top:12px}.break-txt{word-break:break-all;width:201px;text-align:center!important}.image-cnt-new{vertical-align:middle;margin:0 -50% 0 0;position:absolute;top:51%;left:50%;transform:translate(-50%,-50%)}.img-ic{border-radius:3px;padding:10px;align-items:center;display:flex}.img-ic-new{align-items:center;display:flex}.url-img{height:335px;width:466px;-o-object-fit:cover;object-fit:cover}.url-img-port{height:330px;width:266px;-o-object-fit:cover;object-fit:cover}.change-btn{display:flex;align-items:center;padding-right:12px}.img-new-cnt{flex:1;padding:12px}.text-msg-image{color:#9b9b9b;font-family:Poppins;font-size:12px;text-align:left;padding-left:10px}.file-btn-image{position:absolute;bottom:-40px;left:50%;transform:translate(-50%,-50%);width:96%;background:#fff;display:flex;justify-content:space-around}.inner-cnt{height:332px;border:1px dashed #d7d7d7;border-radius:3px;background-color:#fff;margin:10px}.inner-cnt-prot{border:1px dashed #d7d7d7;border-radius:3px;background-color:#fff;height:328px}.file-change{color:#5c6bdd!important;font-size:12px!important}.image-cnt{vertical-align:middle;margin:0 -50% 0 0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.file-image-height{top:37.8%}.img-txt{padding-left:24px;padding-top:10px}.txt-cnt{color:#61636a;font-family:Poppins;font-size:16px;text-align:center;text-overflow:ellipsis;max-width:275px;overflow:auto}.txt-cnt-left{color:#41434c;font-family:Poppins;font-size:12px;text-align:left;text-overflow:ellipsis;max-width:275px;overflow:auto}.txt-cnt-image{color:#41434c;font-family:Poppins;font-size:12px;text-overflow:ellipsis;max-width:275px;overflow:auto;text-align:left}.txt-msg{color:#9b9b9b;font-family:Poppins;font-size:12px;text-align:left;width:275px}.pad-12{padding-top:12px}.txt-msg-cn{text-align:center;color:#9b9b9b;font-family:Poppins;font-size:12px;width:275px}.txt-msg-image{color:#9b9b9b;font-family:Poppins;font-size:12px;text-align:left;width:275px}"]})],t)}(),H=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.clicked.emit(t)},g([n.Input()],t.prototype,"showProgress",void 0),g([n.Input()],t.prototype,"isContained",void 0),g([n.Input()],t.prototype,"focused",void 0),g([n.Input()],t.prototype,"isStroked",void 0),g([n.Input()],t.prototype,"theme",void 0),g([n.Input()],t.prototype,"shouldBeDisabled",void 0),g([n.Input()],t.prototype,"showIcon",void 0),g([n.Output()],t.prototype,"clicked",void 0),t=g([n.Component({selector:"nitrozen-button-rounded",template:'<div class="primary-theme" [ngClass]="{\n \'primary-section\': theme === \'primary\' ,\n \'secondary-section\': theme === \'accent\'\n }">\n\t<button mat-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 }"\n [disabled]="shouldBeDisabled"\n (click)="clickedButton($event)"\n\n>\n\n<div class="btn-icon-show">\n <span 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 </span>\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 fx-wt" [ngClass]="{\n \'btn-spin-stroke\': isStroked,\n \'btn-spin-contained\':isContained,\n \'btn-notprogress\': !showProgress,\n \'btn-progress\' : showProgress\n }" *ngIf="!shouldBeDisabled">\n <img *ngIf="isContained" class="btn-spinner" style="width: 40px;" src="../../../assets/icons/loader-white-1.gif">\n <img *ngIf="isStroked && theme === \'primary\'" class="btn-spinner" style="width: 40px;" src="../../../assets/icons/loader-blue.gif">\n <img *ngIf="isStroked && theme === \'accent\'" class="btn-spinner" style="width: 40px;" 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\n\n\x3c!-- <span class="btn-txt" *ngIf="!showProgress && !showIcon">\n <ng-content></ng-content>\n </span> --\x3e\n\n \n</button>\n\n\n</div>\n',styles:[".btn-nitrozen{height:40px;border-radius:21px;padding:0 32px;outline:0;cursor:pointer}.hover-state{pointer-events:none}.btn-notprogress{opacity:0;transition:opacity .25s ease-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.btn-progress{opacity:1}.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:#5c6bdd;text-underline-position:under}.primary-section .mat-flat-button{background-color:#5c6bdd}.primary-section .mat-flat-button:hover:not([disabled]){background-color:#4f5ecc}.primary-section .mat-flat-button:focus{text-decoration:underline;color:#fff;text-underline-position:under}.primary-section .mat-stroked-button{border:1px solid #5c6bdd!important}.primary-section .mat-stroked-button:hover:not([disabled]){background-color:rgba(79,94,204,.12)}.primary-section .mat-stroked-button:focus{text-decoration:underline;color:#5c6bdd;text-underline-position:under}.primary-section .btn-spin-stroke .mat-spinner circle,.primary-section .btn-spin-stroke ::ng-deep .mat-progress-spinner circle{stroke:#5c6bdd}.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:#5c6bdd}.primary-section .btn-contained-color{color:#fff}.primary-section .btn-spinner{text-align:center}.primary-section .btn-spin{display:flex;justify-content:center}.primary-section .btn-fynd-icon{height:48px;width:190px;border-radius:3px;background-color:#5c6bdd}.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:flex;flex-direction:row-reverse;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 .mat-stroked-button:disabled .btn-stroke-color,.secondary-section .mat-stroked-button[disabled=disabled] .btn-stroke-color{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:flex;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:flex;flex-direction:row-reverse;justify-content:center}"]})],t)}(),K=function(){function t(){}return t=g([n.NgModule({declarations:[H],imports:[e.CommonModule,o.MatButtonModule,o.MatProgressSpinnerModule],exports:[H,o.MatButtonModule,o.MatProgressSpinnerModule]})],t)}(),G=function(){function t(){this.onFileDropped=new n.EventEmitter}return t.prototype.onDragOver=function(t){t.preventDefault(),t.stopPropagation()},t.prototype.onDragLeave=function(t){t.preventDefault(),t.stopPropagation()},t.prototype.ondrop=function(t){t.preventDefault(),t.stopPropagation();var n=t.dataTransfer.files;n.length>0&&this.onFileDropped.emit(n)},g([n.Output()],t.prototype,"onFileDropped",void 0),g([n.HostListener("dragover",["$event"])],t.prototype,"onDragOver",null),g([n.HostListener("dragleave",["$event"])],t.prototype,"onDragLeave",null),g([n.HostListener("drop",["$event"])],t.prototype,"ondrop",null),t=g([n.Directive({selector:"[appDragDrop]"})],t)}(),W=function(){function t(){}return t=g([n.NgModule({declarations:[U,G,L],imports:[e.CommonModule,o.MatButtonModule,v,h,K,o.MatProgressSpinnerModule,o.MatProgressBarModule,c.ImageCropperModule,o.MatIconModule],exports:[U,o.MatButtonModule,o.MatProgressSpinnerModule,o.MatProgressBarModule,o.MatIconModule],entryComponents:[L]})],t)}();t.ButtonModule=h,t.ButtonTextModule=v,t.CheckboxModule=w,t.FileUploadModule=W,t.InputModule=O,t.RadioButtonModule=I,t.SearchableSelectModule=F,t.SelectModule=E,t.SnackBarModule=V,t.TabsModule=R,t.VerticalTabsModule=q,t.ɵ0=A,t.ɵa=b,t.ɵb=x,t.ɵc=y,t.ɵd=k,t.ɵe=P,t.ɵf=z,t.ɵg=S,t.ɵh=_,t.ɵi=T,t.ɵj=D,t.ɵk=B,t.ɵl=j,t.ɵm=$,t.ɵn=N,t.ɵo=U,t.ɵp=G,t.ɵq=L,t.ɵr=K,t.ɵs=H,Object.defineProperty(t,"__esModule",{value:!0})}));
16//# sourceMappingURL=nitrozen.umd.min.js.map
\No newline at end of file