iptdevs-design-system 2.2.4 → 2.2.7

package/esm2020/lib/components/atoms/datalist/datalist.component.mjs

@@ -1,88 +1,88 @@
-import { Component, Input, Output, EventEmitter } from '@angular/core';
-import { Validators } from '@angular/forms';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/forms";
-import * as i2 from "@angular/common";
-export class DatalistComponent {
-    constructor(fb) {
-        this.isChanged = new EventEmitter();
-        this.clicked = false;
-        this.formControl = fb.group({
-            dataListControl: ['', [Validators.required]],
-        });
-    }
-    ngOnInit() {
-        if (this.initalData != null) {
-            this.formControl.controls['dataListControl'].setValue(this.initalData);
-        }
-    }
-    optionChanged(event) {
-        let selectOption = this.datalistData.find(element => element.name == event.target.value);
-        if (typeof (selectOption) != 'undefined') {
-            this.isChanged.emit(selectOption.code);
-        }
-        else {
-            this.isChanged.emit('-1');
-            this.formControl.controls['dataListControl'].setValue(null);
-        }
-    }
-    click(value) {
-        this.clicked = value.isTrusted;
-    }
-    get labelClass() {
-        return this.clicked === false ? 'label' : 'labelUp';
-    }
-}
-DatalistComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: DatalistComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: DatalistComponent, selector: "ipt-datalist", inputs: { datalistId: "datalistId", datalistData: "datalistData", placeHolder: "placeHolder", validateText: "validateText", initalData: "initalData" }, outputs: { isChanged: "isChanged" }, ngImport: i0, template: `
-    <div class="input-container">
-      <label [ngClass]="labelClass">{{ placeHolder }}</label>
-      <input
-        type="text"
-        class="input"
-        (click)="click($event)"
-        [attr.list]="datalistId"
-        (change)="optionChanged($event)"
-      />
-
-      <datalist id="{{ datalistId }}">
-        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
-          {{item.name}} {{item.last_name}}
-        </option>
-      </datalist>
-    </div>
-  `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}.input-container{position:relative;margin-top:30px}.input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff}.input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: DatalistComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ipt-datalist', template: `
-    <div class="input-container">
-      <label [ngClass]="labelClass">{{ placeHolder }}</label>
-      <input
-        type="text"
-        class="input"
-        (click)="click($event)"
-        [attr.list]="datalistId"
-        (change)="optionChanged($event)"
-      />
-
-      <datalist id="{{ datalistId }}">
-        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
-          {{item.name}} {{item.last_name}}
-        </option>
-      </datalist>
-    </div>
-  `, styles: ["*{font-family:Poppins,sans-serif}.input-container{position:relative;margin-top:30px}.input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff}.input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.FormBuilder }]; }, propDecorators: { datalistId: [{
-                type: Input
-            }], datalistData: [{
-                type: Input
-            }], placeHolder: [{
-                type: Input
-            }], validateText: [{
-                type: Input
-            }], initalData: [{
-                type: Input
-            }], isChanged: [{
-                type: Output
-            }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YWxpc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvZGF0YWxpc3QvZGF0YWxpc3QuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQWEsTUFBTSxlQUFlLENBQUM7QUFDbEYsT0FBTyxFQUFnRSxVQUFVLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7OztBQXdCMUcsTUFBTSxPQUFPLGlCQUFpQjtJQWE1QixZQUFZLEVBQWU7UUFMakIsY0FBUyxHQUFHLElBQUksWUFBWSxFQUFVLENBQUM7UUFHakQsWUFBTyxHQUFZLEtBQUssQ0FBQztRQUd2QixJQUFJLENBQUMsV0FBVyxHQUFHLEVBQUUsQ0FBQyxLQUFLLENBQUM7WUFDMUIsZUFBZSxFQUFFLENBQUMsRUFBRSxFQUFFLENBQUMsVUFBVSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1NBQzdDLENBQUMsQ0FBQztJQUNKLENBQUM7SUFFRixRQUFRO1FBQ04sSUFBRyxJQUFJLENBQUMsVUFBVSxJQUFJLElBQUksRUFBRTtZQUMxQixJQUFJLENBQUMsV0FBVyxDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7U0FDeEU7SUFDSCxDQUFDO0lBRUQsYUFBYSxDQUFDLEtBQVU7UUFDdEIsSUFBSSxZQUFZLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLEVBQUUsQ0FBRSxPQUFPLENBQUMsSUFBSSxJQUFJLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFMUYsSUFBSSxPQUFNLENBQUMsWUFBWSxDQUFDLElBQUksV0FBVyxFQUFFO1lBQ3ZDLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUN4QzthQUFNO1lBQ0wsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDMUIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUM7U0FDN0Q7SUFDSCxDQUFDO0lBRUQsS0FBSyxDQUFDLEtBQWlCO1FBQ3JCLElBQUksQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFDLFNBQVMsQ0FBQztJQUNqQyxDQUFDO0lBRUQsSUFBVyxVQUFVO1FBQ25CLE9BQU8sSUFBSSxDQUFDLE9BQU8sS0FBSyxLQUFLLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDO0lBQ3RELENBQUM7OzhHQTFDVSxpQkFBaUI7a0dBQWpCLGlCQUFpQixpUEFwQmxCOzs7Ozs7Ozs7Ozs7Ozs7OztHQWlCVDsyRkFHVSxpQkFBaUI7a0JBdEI3QixTQUFTOytCQUNFLGNBQWMsWUFDZDs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FpQlQ7a0dBS1EsVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUVJLFNBQVM7c0JBQWxCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPdXRwdXQsIEV2ZW50RW1pdHRlciwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEFic3RyYWN0Q29udHJvbCwgRm9ybUJ1aWxkZXIsIEZvcm1Db250cm9sLCBGb3JtR3JvdXAsIE5nRm9ybSwgVmFsaWRhdG9ycyB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnaXB0LWRhdGFsaXN0JyxcclxuICB0ZW1wbGF0ZTogYFxyXG4gICAgPGRpdiBjbGFzcz1cImlucHV0LWNvbnRhaW5lclwiPlxyXG4gICAgICA8bGFiZWwgW25nQ2xhc3NdPVwibGFiZWxDbGFzc1wiPnt7IHBsYWNlSG9sZGVyIH19PC9sYWJlbD5cclxuICAgICAgPGlucHV0XHJcbiAgICAgICAgdHlwZT1cInRleHRcIlxyXG4gICAgICAgIGNsYXNzPVwiaW5wdXRcIlxyXG4gICAgICAgIChjbGljayk9XCJjbGljaygkZXZlbnQpXCJcclxuICAgICAgICBbYXR0ci5saXN0XT1cImRhdGFsaXN0SWRcIlxyXG4gICAgICAgIChjaGFuZ2UpPVwib3B0aW9uQ2hhbmdlZCgkZXZlbnQpXCJcclxuICAgICAgLz5cclxuXHJcbiAgICAgIDxkYXRhbGlzdCBpZD1cInt7IGRhdGFsaXN0SWQgfX1cIj5cclxuICAgICAgICA8b3B0aW9uICpuZ0Zvcj1cImxldCBpdGVtIG9mIGRhdGFsaXN0RGF0YTsgaW5kZXggYXMgaVwiIFt2YWx1ZV09XCJpdGVtLm5hbWVcIj5cclxuICAgICAgICAgIHt7aXRlbS5uYW1lfX0ge3tpdGVtLmxhc3RfbmFtZX19XHJcbiAgICAgICAgPC9vcHRpb24+XHJcbiAgICAgIDwvZGF0YWxpc3Q+XHJcbiAgICA8L2Rpdj5cclxuICBgLFxyXG4gIHN0eWxlVXJsczogWycuL2RhdGFsaXN0LmNzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgRGF0YWxpc3RDb21wb25lbnQge1xyXG5cclxuICBASW5wdXQoKSBkYXRhbGlzdElkITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGRhdGFsaXN0RGF0YSE6IGFueVtdO1xyXG4gIEBJbnB1dCgpIHBsYWNlSG9sZGVyITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIHZhbGlkYXRlVGV4dCE6IHN0cmluZztcclxuICBASW5wdXQoKSBpbml0YWxEYXRhITogc3RyaW5nO1xyXG5cclxuICBAT3V0cHV0KCkgaXNDaGFuZ2VkID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XHJcblxyXG4gIGZvcm1Db250cm9sITogRm9ybUdyb3VwO1xyXG4gIGNsaWNrZWQ6IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgY29uc3RydWN0b3IoZmI6IEZvcm1CdWlsZGVyKSB7XHJcbiAgICB0aGlzLmZvcm1Db250cm9sID0gZmIuZ3JvdXAoe1xyXG4gICAgICBkYXRhTGlzdENvbnRyb2w6IFsnJywgW1ZhbGlkYXRvcnMucmVxdWlyZWRdXSxcclxuICAgIH0pO1xyXG4gICB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgaWYodGhpcy5pbml0YWxEYXRhICE9IG51bGwpIHtcclxuICAgICAgdGhpcy5mb3JtQ29udHJvbC5jb250cm9sc1snZGF0YUxpc3RDb250cm9sJ10uc2V0VmFsdWUodGhpcy5pbml0YWxEYXRhKTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIG9wdGlvbkNoYW5nZWQoZXZlbnQ6IGFueSkge1xyXG4gICAgbGV0IHNlbGVjdE9wdGlvbiA9IHRoaXMuZGF0YWxpc3REYXRhLmZpbmQoZWxlbWVudCA9PiAgZWxlbWVudC5uYW1lID09IGV2ZW50LnRhcmdldC52YWx1ZSk7XHJcblxyXG4gICAgaWYgKHR5cGVvZihzZWxlY3RPcHRpb24pICE9ICd1bmRlZmluZWQnKSB7XHJcbiAgICAgIHRoaXMuaXNDaGFuZ2VkLmVtaXQoc2VsZWN0T3B0aW9uLmNvZGUpO1xyXG4gICAgfSBlbHNlIHtcclxuICAgICAgdGhpcy5pc0NoYW5nZWQuZW1pdCgnLTEnKTtcclxuICAgICAgdGhpcy5mb3JtQ29udHJvbC5jb250cm9sc1snZGF0YUxpc3RDb250cm9sJ10uc2V0VmFsdWUobnVsbCk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBjbGljayh2YWx1ZTogTW91c2VFdmVudCkge1xyXG4gICAgdGhpcy5jbGlja2VkID0gdmFsdWUuaXNUcnVzdGVkO1xyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBsYWJlbENsYXNzKCk6IHN0cmluZyB7XHJcbiAgICByZXR1cm4gdGhpcy5jbGlja2VkID09PSBmYWxzZSA/ICdsYWJlbCcgOiAnbGFiZWxVcCc7XHJcbiAgfVxyXG59XHJcbiJdfQ==
+import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { Validators } from '@angular/forms';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+import * as i2 from "@angular/common";
+export class DatalistComponent {
+    constructor(fb) {
+        this.isChanged = new EventEmitter();
+        this.clicked = false;
+        this.formControl = fb.group({
+            dataListControl: ['', [Validators.required]],
+        });
+    }
+    ngOnInit() {
+        if (this.initalData != null) {
+            this.formControl.controls['dataListControl'].setValue(this.initalData);
+        }
+    }
+    optionChanged(event) {
+        let selectOption = this.datalistData.find(element => element.name == event.target.value);
+        if (typeof (selectOption) != 'undefined') {
+            this.isChanged.emit(selectOption.code);
+        }
+        else {
+            this.isChanged.emit('-1');
+            this.formControl.controls['dataListControl'].setValue(null);
+        }
+    }
+    click(value) {
+        this.clicked = value.isTrusted;
+    }
+    get labelClass() {
+        return this.clicked === false ? 'label' : 'labelUp';
+    }
+}
+DatalistComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: DatalistComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: DatalistComponent, selector: "ipt-datalist", inputs: { datalistId: "datalistId", datalistData: "datalistData", placeHolder: "placeHolder", validateText: "validateText", initalData: "initalData" }, outputs: { isChanged: "isChanged" }, ngImport: i0, template: `
+    <div class="input-container">
+      <label [ngClass]="labelClass">{{ placeHolder }}</label>
+      <input
+        type="text"
+        class="input"
+        (click)="click($event)"
+        [attr.list]="datalistId"
+        (change)="optionChanged($event)"
+      />
+
+      <datalist id="{{ datalistId }}">
+        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
+          {{item.name}} {{item.last_name}}
+        </option>
+      </datalist>
+    </div>
+  `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}.input-container{position:relative;margin-top:30px}.input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;margin:10px 10px -30px;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff}.input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: DatalistComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ipt-datalist', template: `
+    <div class="input-container">
+      <label [ngClass]="labelClass">{{ placeHolder }}</label>
+      <input
+        type="text"
+        class="input"
+        (click)="click($event)"
+        [attr.list]="datalistId"
+        (change)="optionChanged($event)"
+      />
+
+      <datalist id="{{ datalistId }}">
+        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
+          {{item.name}} {{item.last_name}}
+        </option>
+      </datalist>
+    </div>
+  `, styles: ["*{font-family:Poppins,sans-serif}.input-container{position:relative;margin-top:30px}.input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;margin:10px 10px -30px;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff}.input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.FormBuilder }]; }, propDecorators: { datalistId: [{
+                type: Input
+            }], datalistData: [{
+                type: Input
+            }], placeHolder: [{
+                type: Input
+            }], validateText: [{
+                type: Input
+            }], initalData: [{
+                type: Input
+            }], isChanged: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YWxpc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvZGF0YWxpc3QvZGF0YWxpc3QuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQWEsTUFBTSxlQUFlLENBQUM7QUFDbEYsT0FBTyxFQUFnRSxVQUFVLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7OztBQXdCMUcsTUFBTSxPQUFPLGlCQUFpQjtJQWE1QixZQUFZLEVBQWU7UUFMakIsY0FBUyxHQUFHLElBQUksWUFBWSxFQUFVLENBQUM7UUFHakQsWUFBTyxHQUFZLEtBQUssQ0FBQztRQUd2QixJQUFJLENBQUMsV0FBVyxHQUFHLEVBQUUsQ0FBQyxLQUFLLENBQUM7WUFDMUIsZUFBZSxFQUFFLENBQUMsRUFBRSxFQUFFLENBQUMsVUFBVSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1NBQzdDLENBQUMsQ0FBQztJQUNKLENBQUM7SUFFRixRQUFRO1FBQ04sSUFBRyxJQUFJLENBQUMsVUFBVSxJQUFJLElBQUksRUFBRTtZQUMxQixJQUFJLENBQUMsV0FBVyxDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7U0FDeEU7SUFDSCxDQUFDO0lBRUQsYUFBYSxDQUFDLEtBQVU7UUFDdEIsSUFBSSxZQUFZLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLEVBQUUsQ0FBRSxPQUFPLENBQUMsSUFBSSxJQUFJLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFMUYsSUFBSSxPQUFNLENBQUMsWUFBWSxDQUFDLElBQUksV0FBVyxFQUFFO1lBQ3ZDLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUN4QzthQUFNO1lBQ0wsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDMUIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUM7U0FDN0Q7SUFDSCxDQUFDO0lBRUQsS0FBSyxDQUFDLEtBQWlCO1FBQ3JCLElBQUksQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFDLFNBQVMsQ0FBQztJQUNqQyxDQUFDO0lBRUQsSUFBVyxVQUFVO1FBQ25CLE9BQU8sSUFBSSxDQUFDLE9BQU8sS0FBSyxLQUFLLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDO0lBQ3RELENBQUM7OzhHQTFDVSxpQkFBaUI7a0dBQWpCLGlCQUFpQixpUEFwQmxCOzs7Ozs7Ozs7Ozs7Ozs7OztHQWlCVDsyRkFHVSxpQkFBaUI7a0JBdEI3QixTQUFTOytCQUNFLGNBQWMsWUFDZDs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FpQlQ7a0dBS1EsVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUVJLFNBQVM7c0JBQWxCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPdXRwdXQsIEV2ZW50RW1pdHRlciwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBBYnN0cmFjdENvbnRyb2wsIEZvcm1CdWlsZGVyLCBGb3JtQ29udHJvbCwgRm9ybUdyb3VwLCBOZ0Zvcm0sIFZhbGlkYXRvcnMgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2lwdC1kYXRhbGlzdCcsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdiBjbGFzcz1cImlucHV0LWNvbnRhaW5lclwiPlxuICAgICAgPGxhYmVsIFtuZ0NsYXNzXT1cImxhYmVsQ2xhc3NcIj57eyBwbGFjZUhvbGRlciB9fTwvbGFiZWw+XG4gICAgICA8aW5wdXRcbiAgICAgICAgdHlwZT1cInRleHRcIlxuICAgICAgICBjbGFzcz1cImlucHV0XCJcbiAgICAgICAgKGNsaWNrKT1cImNsaWNrKCRldmVudClcIlxuICAgICAgICBbYXR0ci5saXN0XT1cImRhdGFsaXN0SWRcIlxuICAgICAgICAoY2hhbmdlKT1cIm9wdGlvbkNoYW5nZWQoJGV2ZW50KVwiXG4gICAgICAvPlxuXG4gICAgICA8ZGF0YWxpc3QgaWQ9XCJ7eyBkYXRhbGlzdElkIH19XCI+XG4gICAgICAgIDxvcHRpb24gKm5nRm9yPVwibGV0IGl0ZW0gb2YgZGF0YWxpc3REYXRhOyBpbmRleCBhcyBpXCIgW3ZhbHVlXT1cIml0ZW0ubmFtZVwiPlxuICAgICAgICAgIHt7aXRlbS5uYW1lfX0ge3tpdGVtLmxhc3RfbmFtZX19XG4gICAgICAgIDwvb3B0aW9uPlxuICAgICAgPC9kYXRhbGlzdD5cbiAgICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVVcmxzOiBbJy4vZGF0YWxpc3QuY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIERhdGFsaXN0Q29tcG9uZW50IHtcblxuICBASW5wdXQoKSBkYXRhbGlzdElkITogc3RyaW5nO1xuICBASW5wdXQoKSBkYXRhbGlzdERhdGEhOiBhbnlbXTtcbiAgQElucHV0KCkgcGxhY2VIb2xkZXIhOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHZhbGlkYXRlVGV4dCE6IHN0cmluZztcbiAgQElucHV0KCkgaW5pdGFsRGF0YSE6IHN0cmluZztcblxuICBAT3V0cHV0KCkgaXNDaGFuZ2VkID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG5cbiAgZm9ybUNvbnRyb2whOiBGb3JtR3JvdXA7XG4gIGNsaWNrZWQ6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBjb25zdHJ1Y3RvcihmYjogRm9ybUJ1aWxkZXIpIHtcbiAgICB0aGlzLmZvcm1Db250cm9sID0gZmIuZ3JvdXAoe1xuICAgICAgZGF0YUxpc3RDb250cm9sOiBbJycsIFtWYWxpZGF0b3JzLnJlcXVpcmVkXV0sXG4gICAgfSk7XG4gICB9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgaWYodGhpcy5pbml0YWxEYXRhICE9IG51bGwpIHtcbiAgICAgIHRoaXMuZm9ybUNvbnRyb2wuY29udHJvbHNbJ2RhdGFMaXN0Q29udHJvbCddLnNldFZhbHVlKHRoaXMuaW5pdGFsRGF0YSk7XG4gICAgfVxuICB9XG5cbiAgb3B0aW9uQ2hhbmdlZChldmVudDogYW55KSB7XG4gICAgbGV0IHNlbGVjdE9wdGlvbiA9IHRoaXMuZGF0YWxpc3REYXRhLmZpbmQoZWxlbWVudCA9PiAgZWxlbWVudC5uYW1lID09IGV2ZW50LnRhcmdldC52YWx1ZSk7XG5cbiAgICBpZiAodHlwZW9mKHNlbGVjdE9wdGlvbikgIT0gJ3VuZGVmaW5lZCcpIHtcbiAgICAgIHRoaXMuaXNDaGFuZ2VkLmVtaXQoc2VsZWN0T3B0aW9uLmNvZGUpO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmlzQ2hhbmdlZC5lbWl0KCctMScpO1xuICAgICAgdGhpcy5mb3JtQ29udHJvbC5jb250cm9sc1snZGF0YUxpc3RDb250cm9sJ10uc2V0VmFsdWUobnVsbCk7XG4gICAgfVxuICB9XG5cbiAgY2xpY2sodmFsdWU6IE1vdXNlRXZlbnQpIHtcbiAgICB0aGlzLmNsaWNrZWQgPSB2YWx1ZS5pc1RydXN0ZWQ7XG4gIH1cblxuICBwdWJsaWMgZ2V0IGxhYmVsQ2xhc3MoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5jbGlja2VkID09PSBmYWxzZSA/ICdsYWJlbCcgOiAnbGFiZWxVcCc7XG4gIH1cbn1cbiJdfQ==

package/esm2020/lib/components/atoms/input/input.component.mjs

@@ -1,109 +1,109 @@
-import { Component, Input } from '@angular/core';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "@angular/forms";
-export class InputComponent {
-    constructor() {
-        this.data = [];
-        this.clicked = false;
-    }
-    set control(value) {
-        if (this.formControl !== value) {
-            this.formControl = value;
-        }
-    }
-    click(value) {
-        this.clicked = value.isTrusted;
-    }
-}
-InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: InputComponent, selector: "ipt-input", inputs: { inputType: "inputType", placeHolder: "placeHolder", validateText: "validateText", list: "list", iconUrl: "iconUrl", control: "control" }, ngImport: i0, template: `
-    <div class="input-container">
-      <input *ngIf="inputType === 'date'"
-        class="input"
-        type="{{ inputType ? 'text' : 'date' }}"
-        [formControl]="formControl"
-        onfocus="this.type='date';"
-        onblur="javascript: if( !this.value ) this.type='text';"
-        uib-datepicker-popup="dd/MM/yyyy"
-        ng-model="inputType"/>
-
-      <input *ngIf="inputType !== 'date' && inputType !== 'time'"
-        class="input"
-        class="input"
-        type="{{ inputType }}"
-        [formControl]="formControl"
-        [attr.list]="list"/>
-
-        <input *ngIf="inputType === 'time'"
-          class="input"
-          type="time"
-          [formControl]="formControl"
-          [min]="'06:00:00'"
-          max="22:00:00"
-          step="900"
-          autocomplete="on"
-          value="08:00:00"
-          (click)="click($event)"
-        />
-
-      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
-
-      <p *ngIf="!formControl.valid && formControl.value !== '' && formControl.touched">
-        {{ validateText }}
-      </p>
-    </div>
-    `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){p{color:#c73a3a;font-size:12px;padding-left:15px;margin-top:35px}}@media screen and (min-width: 768px){p{color:#c73a3a;font-size:14px;padding-left:15px}}@media screen and (min-width: 1024px){p{color:#c73a3a;font-size:16px;padding-left:15px}}.input-container{position:relative;margin-top:30px}input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff;-webkit-appearance:none}input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input:focus~label,.input:invalid~label{top:-20px;font-size:15px;color:#1c77f7}.labelUp{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: InputComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ipt-input', template: `
-    <div class="input-container">
-      <input *ngIf="inputType === 'date'"
-        class="input"
-        type="{{ inputType ? 'text' : 'date' }}"
-        [formControl]="formControl"
-        onfocus="this.type='date';"
-        onblur="javascript: if( !this.value ) this.type='text';"
-        uib-datepicker-popup="dd/MM/yyyy"
-        ng-model="inputType"/>
-
-      <input *ngIf="inputType !== 'date' && inputType !== 'time'"
-        class="input"
-        class="input"
-        type="{{ inputType }}"
-        [formControl]="formControl"
-        [attr.list]="list"/>
-
-        <input *ngIf="inputType === 'time'"
-          class="input"
-          type="time"
-          [formControl]="formControl"
-          [min]="'06:00:00'"
-          max="22:00:00"
-          step="900"
-          autocomplete="on"
-          value="08:00:00"
-          (click)="click($event)"
-        />
-
-      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
-
-      <p *ngIf="!formControl.valid && formControl.value !== '' && formControl.touched">
-        {{ validateText }}
-      </p>
-    </div>
-    `, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){p{color:#c73a3a;font-size:12px;padding-left:15px;margin-top:35px}}@media screen and (min-width: 768px){p{color:#c73a3a;font-size:14px;padding-left:15px}}@media screen and (min-width: 1024px){p{color:#c73a3a;font-size:16px;padding-left:15px}}.input-container{position:relative;margin-top:30px}input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff;-webkit-appearance:none}input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input:focus~label,.input:invalid~label{top:-20px;font-size:15px;color:#1c77f7}.labelUp{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"] }]
-        }], propDecorators: { inputType: [{
-                type: Input
-            }], placeHolder: [{
-                type: Input
-            }], validateText: [{
-                type: Input
-            }], list: [{
-                type: Input
-            }], iconUrl: [{
-                type: Input
-            }], control: [{
-                type: Input
-            }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvaW5wdXQvaW5wdXQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFtQyxNQUFNLGVBQWUsQ0FBQzs7OztBQTRDbEYsTUFBTSxPQUFPLGNBQWM7SUF6QzNCO1FBNENFLFNBQUksR0FBVSxFQUFFLENBQUM7UUFFakIsWUFBTyxHQUFZLEtBQUssQ0FBQztLQWlCMUI7SUFWQyxJQUFhLE9BQU8sQ0FBQyxLQUErQjtRQUNsRCxJQUFJLElBQUksQ0FBQyxXQUFXLEtBQUssS0FBSyxFQUFFO1lBQzlCLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBb0IsQ0FBQztTQUN6QztJQUNILENBQUM7SUFFRCxLQUFLLENBQUMsS0FBaUI7UUFDckIsSUFBSSxDQUFDLE9BQU8sR0FBRyxLQUFLLENBQUMsU0FBUyxDQUFDO0lBQ2pDLENBQUM7OzJHQXBCVSxjQUFjOytGQUFkLGNBQWMscU1BdkNmOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7S0FvQ1A7MkZBR1EsY0FBYztrQkF6QzFCLFNBQVM7K0JBQ0UsV0FBVyxZQUNYOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7S0FvQ1A7OEJBVU0sU0FBUztzQkFBakIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDTyxPQUFPO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIsIFZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBBYnN0cmFjdENvbnRyb2wsIEZvcm1CdWlsZGVyLCBGb3JtQ29udHJvbCwgRm9ybUdyb3VwLCBOZ0Zvcm0sIFZhbGlkYXRvcnMgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2lwdC1pbnB1dCcsXHJcbiAgdGVtcGxhdGU6IGBcclxuICAgIDxkaXYgY2xhc3M9XCJpbnB1dC1jb250YWluZXJcIj5cclxuICAgICAgPGlucHV0ICpuZ0lmPVwiaW5wdXRUeXBlID09PSAnZGF0ZSdcIlxyXG4gICAgICAgIGNsYXNzPVwiaW5wdXRcIlxyXG4gICAgICAgIHR5cGU9XCJ7eyBpbnB1dFR5cGUgPyAndGV4dCcgOiAnZGF0ZScgfX1cIlxyXG4gICAgICAgIFtmb3JtQ29udHJvbF09XCJmb3JtQ29udHJvbFwiXHJcbiAgICAgICAgb25mb2N1cz1cInRoaXMudHlwZT0nZGF0ZSc7XCJcclxuICAgICAgICBvbmJsdXI9XCJqYXZhc2NyaXB0OiBpZiggIXRoaXMudmFsdWUgKSB0aGlzLnR5cGU9J3RleHQnO1wiXHJcbiAgICAgICAgdWliLWRhdGVwaWNrZXItcG9wdXA9XCJkZC9NTS95eXl5XCJcclxuICAgICAgICBuZy1tb2RlbD1cImlucHV0VHlwZVwiLz5cclxuXHJcbiAgICAgIDxpbnB1dCAqbmdJZj1cImlucHV0VHlwZSAhPT0gJ2RhdGUnICYmIGlucHV0VHlwZSAhPT0gJ3RpbWUnXCJcclxuICAgICAgICBjbGFzcz1cImlucHV0XCJcclxuICAgICAgICBjbGFzcz1cImlucHV0XCJcclxuICAgICAgICB0eXBlPVwie3sgaW5wdXRUeXBlIH19XCJcclxuICAgICAgICBbZm9ybUNvbnRyb2xdPVwiZm9ybUNvbnRyb2xcIlxyXG4gICAgICAgIFthdHRyLmxpc3RdPVwibGlzdFwiLz5cclxuXHJcbiAgICAgICAgPGlucHV0ICpuZ0lmPVwiaW5wdXRUeXBlID09PSAndGltZSdcIlxyXG4gICAgICAgICAgY2xhc3M9XCJpbnB1dFwiXHJcbiAgICAgICAgICB0eXBlPVwidGltZVwiXHJcbiAgICAgICAgICBbZm9ybUNvbnRyb2xdPVwiZm9ybUNvbnRyb2xcIlxyXG4gICAgICAgICAgW21pbl09XCInMDY6MDA6MDAnXCJcclxuICAgICAgICAgIG1heD1cIjIyOjAwOjAwXCJcclxuICAgICAgICAgIHN0ZXA9XCI5MDBcIlxyXG4gICAgICAgICAgYXV0b2NvbXBsZXRlPVwib25cIlxyXG4gICAgICAgICAgdmFsdWU9XCIwODowMDowMFwiXHJcbiAgICAgICAgICAoY2xpY2spPVwiY2xpY2soJGV2ZW50KVwiXHJcbiAgICAgICAgLz5cclxuXHJcbiAgICAgIDxsYWJlbCBbbmdDbGFzc109XCJ7J2xhYmVsVXAnOiBmb3JtQ29udHJvbC52YWx1ZSAhPT0gJyd9XCI+e3sgcGxhY2VIb2xkZXIgfX08L2xhYmVsPlxyXG5cclxuICAgICAgPHAgKm5nSWY9XCIhZm9ybUNvbnRyb2wudmFsaWQgJiYgZm9ybUNvbnRyb2wudmFsdWUgIT09ICcnICYmIGZvcm1Db250cm9sLnRvdWNoZWRcIj5cclxuICAgICAgICB7eyB2YWxpZGF0ZVRleHQgfX1cclxuICAgICAgPC9wPlxyXG4gICAgPC9kaXY+XHJcbiAgICBgLFxyXG4gIHN0eWxlVXJsczogWycuL2lucHV0LmNzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgSW5wdXRDb21wb25lbnQge1xyXG5cclxuICBwdWJsaWMgY29kZVZhbHVlITogc3RyaW5nO1xyXG4gIGRhdGE6IGFueVtdID0gW107XHJcbiAgZm9ybUNvbnRyb2whOiBGb3JtQ29udHJvbDtcclxuICBjbGlja2VkOiBib29sZWFuID0gZmFsc2U7XHJcblxyXG4gIEBJbnB1dCgpIGlucHV0VHlwZSE6IHN0cmluZztcclxuICBASW5wdXQoKSBwbGFjZUhvbGRlciE6IHN0cmluZztcclxuICBASW5wdXQoKSB2YWxpZGF0ZVRleHQ/OiBzdHJpbmc7XHJcbiAgQElucHV0KCkgbGlzdD86IHN0cmluZzsgLy9QYXJhIGVsIGRhdGFsaXN0XHJcbiAgQElucHV0KCkgaWNvblVybD86IHN0cmluZztcclxuICBASW5wdXQoKSBzZXQgY29udHJvbCh2YWx1ZTogQWJzdHJhY3RDb250cm9sIHwgc3RyaW5nKSB7XHJcbiAgICBpZiAodGhpcy5mb3JtQ29udHJvbCAhPT0gdmFsdWUpIHtcclxuICAgICAgdGhpcy5mb3JtQ29udHJvbCA9IHZhbHVlIGFzIEZvcm1Db250cm9sO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgY2xpY2sodmFsdWU6IE1vdXNlRXZlbnQpIHtcclxuICAgIHRoaXMuY2xpY2tlZCA9IHZhbHVlLmlzVHJ1c3RlZDtcclxuICB9XHJcblxyXG59XHJcbiJdfQ==
+import { Component, Input } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/forms";
+export class InputComponent {
+    constructor() {
+        this.data = [];
+        this.clicked = false;
+    }
+    set control(value) {
+        if (this.formControl !== value) {
+            this.formControl = value;
+        }
+    }
+    click(value) {
+        this.clicked = value.isTrusted;
+    }
+}
+InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: InputComponent, selector: "ipt-input", inputs: { inputType: "inputType", placeHolder: "placeHolder", validateText: "validateText", list: "list", iconUrl: "iconUrl", control: "control" }, ngImport: i0, template: `
+    <div class="input-container">
+      <input *ngIf="inputType === 'date'"
+        class="input"
+        type="{{ inputType ? 'text' : 'date' }}"
+        [formControl]="formControl"
+        onfocus="this.type='date';"
+        onblur="javascript: if( !this.value ) this.type='text';"
+        uib-datepicker-popup="dd/MM/yyyy"
+        ng-model="inputType"/>
+
+      <input *ngIf="inputType !== 'date' && inputType !== 'time'"
+        class="input"
+        class="input"
+        type="{{ inputType }}"
+        [formControl]="formControl"
+        [attr.list]="list"/>
+
+        <input *ngIf="inputType === 'time'"
+          class="input"
+          type="time"
+          [formControl]="formControl"
+          [min]="'06:00:00'"
+          max="22:00:00"
+          step="900"
+          autocomplete="on"
+          value="08:00:00"
+          (click)="click($event)"
+        />
+
+      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
+
+      <p *ngIf="!formControl.valid && formControl.value !== '' && formControl.touched">
+        {{ validateText }}
+      </p>
+    </div>
+    `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){p{color:#c73a3a;font-size:12px;padding-left:15px;margin-top:35px}}@media screen and (min-width: 768px){p{color:#c73a3a;font-size:14px;padding-left:15px}}@media screen and (min-width: 1024px){p{color:#c73a3a;font-size:16px;padding-left:15px}}.input-container{position:relative;margin-top:30px}input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff;-webkit-appearance:none}input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input:focus~label,.input:invalid~label{top:-20px;font-size:15px;color:#1c77f7}.labelUp{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ipt-input', template: `
+    <div class="input-container">
+      <input *ngIf="inputType === 'date'"
+        class="input"
+        type="{{ inputType ? 'text' : 'date' }}"
+        [formControl]="formControl"
+        onfocus="this.type='date';"
+        onblur="javascript: if( !this.value ) this.type='text';"
+        uib-datepicker-popup="dd/MM/yyyy"
+        ng-model="inputType"/>
+
+      <input *ngIf="inputType !== 'date' && inputType !== 'time'"
+        class="input"
+        class="input"
+        type="{{ inputType }}"
+        [formControl]="formControl"
+        [attr.list]="list"/>
+
+        <input *ngIf="inputType === 'time'"
+          class="input"
+          type="time"
+          [formControl]="formControl"
+          [min]="'06:00:00'"
+          max="22:00:00"
+          step="900"
+          autocomplete="on"
+          value="08:00:00"
+          (click)="click($event)"
+        />
+
+      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
+
+      <p *ngIf="!formControl.valid && formControl.value !== '' && formControl.touched">
+        {{ validateText }}
+      </p>
+    </div>
+    `, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){p{color:#c73a3a;font-size:12px;padding-left:15px;margin-top:35px}}@media screen and (min-width: 768px){p{color:#c73a3a;font-size:14px;padding-left:15px}}@media screen and (min-width: 1024px){p{color:#c73a3a;font-size:16px;padding-left:15px}}.input-container{position:relative;margin-top:30px}input{box-shadow:#64646f33 0 7px 29px;border-radius:10px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:10px;background-color:#fff;-webkit-appearance:none}input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input:focus~label,.input:invalid~label{top:-20px;font-size:15px;color:#1c77f7}.labelUp{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"] }]
+        }], propDecorators: { inputType: [{
+                type: Input
+            }], placeHolder: [{
+                type: Input
+            }], validateText: [{
+                type: Input
+            }], list: [{
+                type: Input
+            }], iconUrl: [{
+                type: Input
+            }], control: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvaW5wdXQvaW5wdXQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFtQyxNQUFNLGVBQWUsQ0FBQzs7OztBQTRDbEYsTUFBTSxPQUFPLGNBQWM7SUF6QzNCO1FBNENFLFNBQUksR0FBVSxFQUFFLENBQUM7UUFFakIsWUFBTyxHQUFZLEtBQUssQ0FBQztLQWlCMUI7SUFWQyxJQUFhLE9BQU8sQ0FBQyxLQUErQjtRQUNsRCxJQUFJLElBQUksQ0FBQyxXQUFXLEtBQUssS0FBSyxFQUFFO1lBQzlCLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBb0IsQ0FBQztTQUN6QztJQUNILENBQUM7SUFFRCxLQUFLLENBQUMsS0FBaUI7UUFDckIsSUFBSSxDQUFDLE9BQU8sR0FBRyxLQUFLLENBQUMsU0FBUyxDQUFDO0lBQ2pDLENBQUM7OzJHQXBCVSxjQUFjOytGQUFkLGNBQWMscU1BdkNmOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7S0FvQ1A7MkZBR1EsY0FBYztrQkF6QzFCLFNBQVM7K0JBQ0UsV0FBVyxZQUNYOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7S0FvQ1A7OEJBVU0sU0FBUztzQkFBakIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDTyxPQUFPO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIsIFZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQWJzdHJhY3RDb250cm9sLCBGb3JtQnVpbGRlciwgRm9ybUNvbnRyb2wsIEZvcm1Hcm91cCwgTmdGb3JtLCBWYWxpZGF0b3JzIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdpcHQtaW5wdXQnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXYgY2xhc3M9XCJpbnB1dC1jb250YWluZXJcIj5cbiAgICAgIDxpbnB1dCAqbmdJZj1cImlucHV0VHlwZSA9PT0gJ2RhdGUnXCJcbiAgICAgICAgY2xhc3M9XCJpbnB1dFwiXG4gICAgICAgIHR5cGU9XCJ7eyBpbnB1dFR5cGUgPyAndGV4dCcgOiAnZGF0ZScgfX1cIlxuICAgICAgICBbZm9ybUNvbnRyb2xdPVwiZm9ybUNvbnRyb2xcIlxuICAgICAgICBvbmZvY3VzPVwidGhpcy50eXBlPSdkYXRlJztcIlxuICAgICAgICBvbmJsdXI9XCJqYXZhc2NyaXB0OiBpZiggIXRoaXMudmFsdWUgKSB0aGlzLnR5cGU9J3RleHQnO1wiXG4gICAgICAgIHVpYi1kYXRlcGlja2VyLXBvcHVwPVwiZGQvTU0veXl5eVwiXG4gICAgICAgIG5nLW1vZGVsPVwiaW5wdXRUeXBlXCIvPlxuXG4gICAgICA8aW5wdXQgKm5nSWY9XCJpbnB1dFR5cGUgIT09ICdkYXRlJyAmJiBpbnB1dFR5cGUgIT09ICd0aW1lJ1wiXG4gICAgICAgIGNsYXNzPVwiaW5wdXRcIlxuICAgICAgICBjbGFzcz1cImlucHV0XCJcbiAgICAgICAgdHlwZT1cInt7IGlucHV0VHlwZSB9fVwiXG4gICAgICAgIFtmb3JtQ29udHJvbF09XCJmb3JtQ29udHJvbFwiXG4gICAgICAgIFthdHRyLmxpc3RdPVwibGlzdFwiLz5cblxuICAgICAgICA8aW5wdXQgKm5nSWY9XCJpbnB1dFR5cGUgPT09ICd0aW1lJ1wiXG4gICAgICAgICAgY2xhc3M9XCJpbnB1dFwiXG4gICAgICAgICAgdHlwZT1cInRpbWVcIlxuICAgICAgICAgIFtmb3JtQ29udHJvbF09XCJmb3JtQ29udHJvbFwiXG4gICAgICAgICAgW21pbl09XCInMDY6MDA6MDAnXCJcbiAgICAgICAgICBtYXg9XCIyMjowMDowMFwiXG4gICAgICAgICAgc3RlcD1cIjkwMFwiXG4gICAgICAgICAgYXV0b2NvbXBsZXRlPVwib25cIlxuICAgICAgICAgIHZhbHVlPVwiMDg6MDA6MDBcIlxuICAgICAgICAgIChjbGljayk9XCJjbGljaygkZXZlbnQpXCJcbiAgICAgICAgLz5cblxuICAgICAgPGxhYmVsIFtuZ0NsYXNzXT1cInsnbGFiZWxVcCc6IGZvcm1Db250cm9sLnZhbHVlICE9PSAnJ31cIj57eyBwbGFjZUhvbGRlciB9fTwvbGFiZWw+XG5cbiAgICAgIDxwICpuZ0lmPVwiIWZvcm1Db250cm9sLnZhbGlkICYmIGZvcm1Db250cm9sLnZhbHVlICE9PSAnJyAmJiBmb3JtQ29udHJvbC50b3VjaGVkXCI+XG4gICAgICAgIHt7IHZhbGlkYXRlVGV4dCB9fVxuICAgICAgPC9wPlxuICAgIDwvZGl2PlxuICAgIGAsXG4gIHN0eWxlVXJsczogWycuL2lucHV0LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBJbnB1dENvbXBvbmVudCB7XG5cbiAgcHVibGljIGNvZGVWYWx1ZSE6IHN0cmluZztcbiAgZGF0YTogYW55W10gPSBbXTtcbiAgZm9ybUNvbnRyb2whOiBGb3JtQ29udHJvbDtcbiAgY2xpY2tlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpIGlucHV0VHlwZSE6IHN0cmluZztcbiAgQElucHV0KCkgcGxhY2VIb2xkZXIhOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHZhbGlkYXRlVGV4dD86IHN0cmluZztcbiAgQElucHV0KCkgbGlzdD86IHN0cmluZzsgLy9QYXJhIGVsIGRhdGFsaXN0XG4gIEBJbnB1dCgpIGljb25Vcmw/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIHNldCBjb250cm9sKHZhbHVlOiBBYnN0cmFjdENvbnRyb2wgfCBzdHJpbmcpIHtcbiAgICBpZiAodGhpcy5mb3JtQ29udHJvbCAhPT0gdmFsdWUpIHtcbiAgICAgIHRoaXMuZm9ybUNvbnRyb2wgPSB2YWx1ZSBhcyBGb3JtQ29udHJvbDtcbiAgICB9XG4gIH1cblxuICBjbGljayh2YWx1ZTogTW91c2VFdmVudCkge1xuICAgIHRoaXMuY2xpY2tlZCA9IHZhbHVlLmlzVHJ1c3RlZDtcbiAgfVxuXG59XG4iXX0=

package/esm2020/lib/components/atoms/level-button/level-button.component.mjs

@@ -1,64 +1,64 @@
-import { Component, Input, Output, EventEmitter } from '@angular/core';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-export class LevelButtonComponent {
-    constructor() {
-        this.isClicked = new EventEmitter();
-    }
-    clickAction() {
-        this.isClicked.emit(true);
-    }
-}
-LevelButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: LevelButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LevelButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: LevelButtonComponent, selector: "ipt-level-button", inputs: { level: "level", buttonActive: "buttonActive", idColor: "idColor" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
-    <div [ngSwitch]="buttonActive">
-      <button
-        *ngSwitchCase="0"
-        (click)="clickAction()"
-        id="level"
-        class="courses"
-      >
-      <p class="p-level">{{ level }}</p>
-      </button>
-
-      <button
-        *ngSwitchCase="1"
-        (click)="clickAction()"
-        id="{{ idColor }}"
-        class="courses">
-      <p class="p-level p-level-active">{{ level }}</p>
-      </button>
-    </div>
-  `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.courses{cursor:pointer;text-decoration:none;display:flex;border-radius:10px;width:100%;height:30px;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset;border:none;outline:none;align-items:center;background-color:transparent;color:#1c77f7}.p-level{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px}#level-1{background-color:#02eed8}#level-2{background-color:#61acff}#level-3{background-color:#f168f4}#level-4{background-color:#ff3737}#level-5{background-color:#004dfa}#level-6{background-color:#14c25a}#level-7{background-color:#a052da}#level-8{background-color:#f2583d}#level-9{background-color:#291d26}#level-10{background-color:#1c77f7}.p-level-active{color:#fff}}@media (min-width: 375px){.courses{height:40px}.p-level{font-size:18px}}@media (min-width: 425px){.courses{height:30px}}@media (min-width: 768px){.courses{height:40px}}@media (min-width: 1024px){.courses{transition:.6s}.courses:active{transform:scale(1.05);box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.p-level{font-weight:700}}@media (min-width: 1440px){.p-level{font-weight:600}}\n"], directives: [{ type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: LevelButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ipt-level-button', template: `
-    <div [ngSwitch]="buttonActive">
-      <button
-        *ngSwitchCase="0"
-        (click)="clickAction()"
-        id="level"
-        class="courses"
-      >
-      <p class="p-level">{{ level }}</p>
-      </button>
-
-      <button
-        *ngSwitchCase="1"
-        (click)="clickAction()"
-        id="{{ idColor }}"
-        class="courses">
-      <p class="p-level p-level-active">{{ level }}</p>
-      </button>
-    </div>
-  `, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.courses{cursor:pointer;text-decoration:none;display:flex;border-radius:10px;width:100%;height:30px;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset;border:none;outline:none;align-items:center;background-color:transparent;color:#1c77f7}.p-level{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px}#level-1{background-color:#02eed8}#level-2{background-color:#61acff}#level-3{background-color:#f168f4}#level-4{background-color:#ff3737}#level-5{background-color:#004dfa}#level-6{background-color:#14c25a}#level-7{background-color:#a052da}#level-8{background-color:#f2583d}#level-9{background-color:#291d26}#level-10{background-color:#1c77f7}.p-level-active{color:#fff}}@media (min-width: 375px){.courses{height:40px}.p-level{font-size:18px}}@media (min-width: 425px){.courses{height:30px}}@media (min-width: 768px){.courses{height:40px}}@media (min-width: 1024px){.courses{transition:.6s}.courses:active{transform:scale(1.05);box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.p-level{font-weight:700}}@media (min-width: 1440px){.p-level{font-weight:600}}\n"] }]
-        }], propDecorators: { level: [{
-                type: Input
-            }], buttonActive: [{
-                type: Input
-            }], idColor: [{
-                type: Input
-            }], isClicked: [{
-                type: Output
-            }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGV2ZWwtYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2Rlc2lnbi1zeXN0ZW0vc3JjL2xpYi9jb21wb25lbnRzL2F0b21zL2xldmVsLWJ1dHRvbi9sZXZlbC1idXR0b24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQTJCdkUsTUFBTSxPQUFPLG9CQUFvQjtJQXpCakM7UUE4QlksY0FBUyxHQUFHLElBQUksWUFBWSxFQUFXLENBQUM7S0FNbkQ7SUFKQyxXQUFXO1FBQ1QsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDNUIsQ0FBQzs7aUhBVFUsb0JBQW9CO3FHQUFwQixvQkFBb0IsMktBdkJyQjs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CVDsyRkFJVSxvQkFBb0I7a0JBekJoQyxTQUFTOytCQUNFLGtCQUFrQixZQUNsQjs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CVDs4QkFNUSxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0ksU0FBUztzQkFBbEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2lwdC1sZXZlbC1idXR0b24nLFxyXG4gIHRlbXBsYXRlOiBgXHJcbiAgICA8ZGl2IFtuZ1N3aXRjaF09XCJidXR0b25BY3RpdmVcIj5cclxuICAgICAgPGJ1dHRvblxyXG4gICAgICAgICpuZ1N3aXRjaENhc2U9XCIwXCJcclxuICAgICAgICAoY2xpY2spPVwiY2xpY2tBY3Rpb24oKVwiXHJcbiAgICAgICAgaWQ9XCJsZXZlbFwiXHJcbiAgICAgICAgY2xhc3M9XCJjb3Vyc2VzXCJcclxuICAgICAgPlxyXG4gICAgICA8cCBjbGFzcz1cInAtbGV2ZWxcIj57eyBsZXZlbCB9fTwvcD5cclxuICAgICAgPC9idXR0b24+XHJcblxyXG4gICAgICA8YnV0dG9uXHJcbiAgICAgICAgKm5nU3dpdGNoQ2FzZT1cIjFcIlxyXG4gICAgICAgIChjbGljayk9XCJjbGlja0FjdGlvbigpXCJcclxuICAgICAgICBpZD1cInt7IGlkQ29sb3IgfX1cIlxyXG4gICAgICAgIGNsYXNzPVwiY291cnNlc1wiPlxyXG4gICAgICA8cCBjbGFzcz1cInAtbGV2ZWwgcC1sZXZlbC1hY3RpdmVcIj57eyBsZXZlbCB9fTwvcD5cclxuICAgICAgPC9idXR0b24+XHJcbiAgICA8L2Rpdj5cclxuICBgLFxyXG4gIHN0eWxlVXJsczogWycuL2xldmVsLWJ1dHRvbi5jc3MnXSxcclxufSlcclxuXHJcbmV4cG9ydCBjbGFzcyBMZXZlbEJ1dHRvbkNvbXBvbmVudCB7XHJcblxyXG4gIEBJbnB1dCgpIGxldmVsITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGJ1dHRvbkFjdGl2ZSE6IGJvb2xlYW47XHJcbiAgQElucHV0KCkgaWRDb2xvciE6IHN0cmluZztcclxuICBAT3V0cHV0KCkgaXNDbGlja2VkID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xyXG5cclxuICBjbGlja0FjdGlvbigpIHtcclxuICAgIHRoaXMuaXNDbGlja2VkLmVtaXQodHJ1ZSk7XHJcbiAgfVxyXG5cclxufVxyXG4iXX0=
+import { Component, Input, Output, EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+export class LevelButtonComponent {
+    constructor() {
+        this.isClicked = new EventEmitter();
+    }
+    clickAction() {
+        this.isClicked.emit(true);
+    }
+}
+LevelButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: LevelButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+LevelButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: LevelButtonComponent, selector: "ipt-level-button", inputs: { level: "level", buttonActive: "buttonActive", idColor: "idColor" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
+    <div [ngSwitch]="buttonActive">
+      <button
+        *ngSwitchCase="0"
+        (click)="clickAction()"
+        id="level"
+        class="courses"
+      >
+      <p class="p-level">{{ level }}</p>
+      </button>
+
+      <button
+        *ngSwitchCase="1"
+        (click)="clickAction()"
+        id="{{ idColor }}"
+        class="courses">
+      <p class="p-level p-level-active">{{ level }}</p>
+      </button>
+    </div>
+  `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.courses{cursor:pointer;text-decoration:none;display:flex;border-radius:10px;width:100%;height:30px;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset;border:none;outline:none;align-items:center;background-color:transparent;color:#1c77f7}.p-level{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px}#level-1{background-color:#02eed8}#level-2{background-color:#61acff}#level-3{background-color:#f168f4}#level-4{background-color:#ff3737}#level-5{background-color:#004dfa}#level-6{background-color:#14c25a}#level-7{background-color:#a052da}#level-8{background-color:#f2583d}#level-9{background-color:#291d26}#level-10{background-color:#1c77f7}.p-level-active{color:#fff}}@media (min-width: 375px){.courses{height:40px}.p-level{font-size:18px}}@media (min-width: 425px){.courses{height:30px}}@media (min-width: 768px){.courses{height:40px}}@media (min-width: 1024px){.courses{transition:.6s}.courses:active{transform:scale(1.05);box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.p-level{font-weight:700}}@media (min-width: 1440px){.p-level{font-weight:600}}\n"], directives: [{ type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: LevelButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ipt-level-button', template: `
+    <div [ngSwitch]="buttonActive">
+      <button
+        *ngSwitchCase="0"
+        (click)="clickAction()"
+        id="level"
+        class="courses"
+      >
+      <p class="p-level">{{ level }}</p>
+      </button>
+
+      <button
+        *ngSwitchCase="1"
+        (click)="clickAction()"
+        id="{{ idColor }}"
+        class="courses">
+      <p class="p-level p-level-active">{{ level }}</p>
+      </button>
+    </div>
+  `, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.courses{cursor:pointer;text-decoration:none;display:flex;border-radius:10px;width:100%;height:30px;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset;border:none;outline:none;align-items:center;background-color:transparent;color:#1c77f7}.p-level{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px}#level-1{background-color:#02eed8}#level-2{background-color:#61acff}#level-3{background-color:#f168f4}#level-4{background-color:#ff3737}#level-5{background-color:#004dfa}#level-6{background-color:#14c25a}#level-7{background-color:#a052da}#level-8{background-color:#f2583d}#level-9{background-color:#291d26}#level-10{background-color:#1c77f7}.p-level-active{color:#fff}}@media (min-width: 375px){.courses{height:40px}.p-level{font-size:18px}}@media (min-width: 425px){.courses{height:30px}}@media (min-width: 768px){.courses{height:40px}}@media (min-width: 1024px){.courses{transition:.6s}.courses:active{transform:scale(1.05);box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.p-level{font-weight:700}}@media (min-width: 1440px){.p-level{font-weight:600}}\n"] }]
+        }], propDecorators: { level: [{
+                type: Input
+            }], buttonActive: [{
+                type: Input
+            }], idColor: [{
+                type: Input
+            }], isClicked: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGV2ZWwtYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2Rlc2lnbi1zeXN0ZW0vc3JjL2xpYi9jb21wb25lbnRzL2F0b21zL2xldmVsLWJ1dHRvbi9sZXZlbC1idXR0b24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQTJCdkUsTUFBTSxPQUFPLG9CQUFvQjtJQXpCakM7UUE4QlksY0FBUyxHQUFHLElBQUksWUFBWSxFQUFXLENBQUM7S0FNbkQ7SUFKQyxXQUFXO1FBQ1QsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDNUIsQ0FBQzs7aUhBVFUsb0JBQW9CO3FHQUFwQixvQkFBb0IsMktBdkJyQjs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CVDsyRkFJVSxvQkFBb0I7a0JBekJoQyxTQUFTOytCQUNFLGtCQUFrQixZQUNsQjs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CVDs4QkFNUSxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0ksU0FBUztzQkFBbEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2lwdC1sZXZlbC1idXR0b24nLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXYgW25nU3dpdGNoXT1cImJ1dHRvbkFjdGl2ZVwiPlxuICAgICAgPGJ1dHRvblxuICAgICAgICAqbmdTd2l0Y2hDYXNlPVwiMFwiXG4gICAgICAgIChjbGljayk9XCJjbGlja0FjdGlvbigpXCJcbiAgICAgICAgaWQ9XCJsZXZlbFwiXG4gICAgICAgIGNsYXNzPVwiY291cnNlc1wiXG4gICAgICA+XG4gICAgICA8cCBjbGFzcz1cInAtbGV2ZWxcIj57eyBsZXZlbCB9fTwvcD5cbiAgICAgIDwvYnV0dG9uPlxuXG4gICAgICA8YnV0dG9uXG4gICAgICAgICpuZ1N3aXRjaENhc2U9XCIxXCJcbiAgICAgICAgKGNsaWNrKT1cImNsaWNrQWN0aW9uKClcIlxuICAgICAgICBpZD1cInt7IGlkQ29sb3IgfX1cIlxuICAgICAgICBjbGFzcz1cImNvdXJzZXNcIj5cbiAgICAgIDxwIGNsYXNzPVwicC1sZXZlbCBwLWxldmVsLWFjdGl2ZVwiPnt7IGxldmVsIH19PC9wPlxuICAgICAgPC9idXR0b24+XG4gICAgPC9kaXY+XG4gIGAsXG4gIHN0eWxlVXJsczogWycuL2xldmVsLWJ1dHRvbi5jc3MnXSxcbn0pXG5cbmV4cG9ydCBjbGFzcyBMZXZlbEJ1dHRvbkNvbXBvbmVudCB7XG5cbiAgQElucHV0KCkgbGV2ZWwhOiBzdHJpbmc7XG4gIEBJbnB1dCgpIGJ1dHRvbkFjdGl2ZSE6IGJvb2xlYW47XG4gIEBJbnB1dCgpIGlkQ29sb3IhOiBzdHJpbmc7XG4gIEBPdXRwdXQoKSBpc0NsaWNrZWQgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgY2xpY2tBY3Rpb24oKSB7XG4gICAgdGhpcy5pc0NsaWNrZWQuZW1pdCh0cnVlKTtcbiAgfVxuXG59XG4iXX0=