@dev-tcloud/tcloud-ui 0.1.19 → 0.1.21

package/fesm2020/dev-tcloud-tcloud-ui.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, Input, NgModule, Injectable, EventEmitter, Output, ViewChild, forwardRef, Pipe, ViewEncapsulation, Directive, HostListener } from '@angular/core';
+import { Component, Input, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable, EventEmitter, Output, ViewChild, forwardRef, Pipe, ViewEncapsulation, Directive, HostListener } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, DatePipe } from '@angular/common';
 import { Subject } from 'rxjs';
@@ -86,7 +86,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     exports: [
                         TCloudUiLinhaLogoComponent
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -497,6 +498,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         TCloudUiTabSubtitleComponent,
                         TCloudUiTabHeadComponent
                     ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -814,10 +816,10 @@ class TCloudUiModalFooterComponent {
     }
 }
 TCloudUiModalFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModalFooterComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
-TCloudUiModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiModalFooterComponent, selector: "tcloud-ui-modal-footer", inputs: { btnCloseText: "btnCloseText", btnCancelText: "btnCancelText", btnConfirmText: "btnConfirmText" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], ngImport: i0, template: "<div class=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n  <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n    <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n    \r\n    <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n      <input \r\n        [disabled]=\"loading\"\r\n        placeholder=\"{{ param_confirm.confirmText }}\"\r\n        name=\"txt_value\" \r\n        [(ngModel)]=\"txt_value\" \r\n        type=\"text\" \r\n        class=\"form-control form-confirm\" \r\n        required \r\n        [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n    </form>\r\n\r\n  </div>\r\n\r\n  <hr>\r\n\r\n  <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n    <!-- {{ param_confirm | json }} -->\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n    <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn tc-btn-primary margin-l-5\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n  </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}.margin-l-5{margin-left:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
+TCloudUiModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiModalFooterComponent, selector: "tcloud-ui-modal-footer", inputs: { btnCloseText: "btnCloseText", btnCancelText: "btnCancelText", btnConfirmText: "btnConfirmText" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], ngImport: i0, template: "<div class=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n  <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n    <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n    \r\n    <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n      <input \r\n        [disabled]=\"loading\"\r\n        placeholder=\"{{ param_confirm.confirmText }}\"\r\n        name=\"txt_value\" \r\n        [(ngModel)]=\"txt_value\" \r\n        type=\"text\" \r\n        class=\"tc-form-confirm\" \r\n        required \r\n        [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n    </form>\r\n\r\n  </div>\r\n\r\n  <hr>\r\n\r\n  <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n    <!-- {{ param_confirm | json }} -->\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n    <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn tc-btn-primary margin-l-5\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n  </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}.margin-l-5{margin-left:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModalFooterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tcloud-ui-modal-footer', template: "<div class=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n  <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n    <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n    \r\n    <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n      <input \r\n        [disabled]=\"loading\"\r\n        placeholder=\"{{ param_confirm.confirmText }}\"\r\n        name=\"txt_value\" \r\n        [(ngModel)]=\"txt_value\" \r\n        type=\"text\" \r\n        class=\"form-control form-confirm\" \r\n        required \r\n        [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n    </form>\r\n\r\n  </div>\r\n\r\n  <hr>\r\n\r\n  <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n    <!-- {{ param_confirm | json }} -->\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n    <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn tc-btn-primary margin-l-5\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n  </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}.margin-l-5{margin-left:5px}\n"] }]
+            args: [{ selector: 'tcloud-ui-modal-footer', template: "<div class=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n  <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n    <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n    \r\n    <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n      <input \r\n        [disabled]=\"loading\"\r\n        placeholder=\"{{ param_confirm.confirmText }}\"\r\n        name=\"txt_value\" \r\n        [(ngModel)]=\"txt_value\" \r\n        type=\"text\" \r\n        class=\"tc-form-confirm\" \r\n        required \r\n        [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n    </form>\r\n\r\n  </div>\r\n\r\n  <hr>\r\n\r\n  <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n    <!-- {{ param_confirm | json }} -->\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n    <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn tc-btn-primary margin-l-5\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n  </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}.margin-l-5{margin-left:5px}\n"] }]
         }], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { btnCloseText: [{
                 type: Input
             }], btnCancelText: [{
@@ -863,7 +865,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         TCloudUiModalHeaderComponent,
                         TCloudUiModalBodyComponent,
                         TCloudUiModalFooterComponent
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -973,7 +976,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     exports: [
                         TCloudUiLineStepCircleComponent
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -1152,7 +1156,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         CommonModule,
                         FormsModule,
                         ReactiveFormsModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -1584,7 +1589,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         CommonModule,
                         FormsModule,
                         ReactiveFormsModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -1692,7 +1698,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         CommonModule,
                         FormsModule,
                         ReactiveFormsModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -1859,7 +1866,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         FormsModule,
                         ReactiveFormsModule,
                         CommonModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -2112,7 +2120,15 @@ class BytesPipe {
         const c = 0 > b ? 0 : b, d = Math.floor(Math.log(a) / Math.log(1024));
         return parseFloat((a / Math.pow(1024, d)).toFixed(c)) + ' ' + ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"][d];
     }
-    transform(value) {
+    transform(value, typeValue) {
+        if (typeValue !== undefined && typeValue !== null && typeValue !== '') {
+            if ((typeValue).toLowerCase() === 'kb') {
+                value = value * 1024;
+            }
+            if ((typeValue).toLowerCase() === 'mb') {
+                value = (value * 1024) * 1024;
+            }
+        }
         const b = +value;
         return this.formatBytes(b);
     }
@@ -2429,7 +2445,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         CommonModule,
                         FormsModule,
                         ReactiveFormsModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -2467,6 +2484,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     exports: [
                         TCloudUiNotFoundComponent
                     ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -2505,7 +2523,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     imports: [
                         CommonModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -2621,7 +2640,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     imports: [
                         CommonModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -2660,7 +2680,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     imports: [
                         CommonModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -3489,10 +3510,10 @@ class TCloudUiRangeDateComponent {
     }
 }
 TCloudUiRangeDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiRangeDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TCloudUiRangeDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: { defaultValuePeriodStartStop: "defaultValuePeriodStartStop", required: "required", descriptionStart: "descriptionStart", descriptionStop: "descriptionStop" }, outputs: { onChange: "onChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], ngImport: i0, template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n    <tr>\r\n\r\n        <td>\r\n            <div *ngIf=\"mode === 'select'\">\r\n                <div class=\"description-period\">Per\u00EDodo</div>\r\n                <select name=\"periodo\" class=\"form-control tc-form-control\" (change)=\"onChangeOptionsDateTime($event.target)\" [(ngModel)]=\"defaultValuePeriodStartStop\"  >\r\n                    <option value=\"\"></option> \r\n                    <ng-container *ngFor=\"let item of options_date_time\">\r\n                        <option [value]=\"item.value\">{{ item.description }}</option>\r\n                    </ng-container>\r\n                </select>\r\n            </div>\r\n            <div *ngIf=\"mode === 'datepickers'\">\r\n\r\n                <table class=\"area-range-datepickers\">\r\n                    <tr>\r\n                        <td>\r\n                            <div class=\"description-start\">{{ descriptionStart }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_start \r\n                                [(ngModel)]=\"result.start\" \r\n                                name=\"input_start\" \r\n                                (eventChange)=\"onChangeStartDateTime(_input_start)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                        <td>\r\n                            <div class=\"description-stop\">{{ descriptionStop }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_stop\r\n                                [(ngModel)]=\"result.stop\" \r\n                                name=\"input_stop\" \r\n                                (eventChange)=\"onChangeStopDateTime(_input_stop)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                    </tr>\r\n                </table>\r\n\r\n            </div>\r\n        </td>\r\n\r\n        <td>\r\n            <button class=\"btn-mode-range-date\" [class.active]=\"mode === 'select'\" (click)=\"toggle()\" type=\"button\">\r\n\r\n                <i *ngIf=\"mode === 'select'\" class=\"far fa-calendar-alt\" title=\"Alterar para calend\u00E1rio\"></i>\r\n                <i *ngIf=\"mode !== 'select'\" class=\"fas fa-calendar-week\" title=\"Selecionar per\u00EDodo\"></i>\r\n\r\n                <!-- <div *ngIf=\"mode === 'select'\">Exibir<br>Calend\u00E1rio</div> -->\r\n                <!-- <div *ngIf=\"mode !== 'select'\">Exibir<br>Per\u00EDodo</div> -->\r\n            </button>\r\n        </td>\r\n\r\n    </tr>\r\n</table>", styles: [".area-range-date{height:40px;width:100%}.area-range-date tr td:first-child{width:calc(100% - 35px)}.area-range-date tr td:first-child select{color:#535353;border-radius:3px 0 0 3px!important}.area-range-date tr td:first-child .area-range-datepickers{width:100%}.area-range-date tr td:first-child .area-range-datepickers td{width:50%!important}.area-range-date tr td:last-child{width:35px}.area-range-date tr td:last-child .btn-mode-range-date{width:100%;text-align:center;border:1px solid #ccc;background-color:#fff;font-size:17px;line-height:1;cursor:pointer;color:#6c6c6c;height:40px;border-radius:0 3px 3px 0}.area-range-date tr td:last-child .btn-mode-range-date:focus{color:#403d3d}.active{background-color:#eee!important}.description-period,.description-start{position:relative;left:17px;top:-15px;line-height:0}.description-stop{position:relative;top:-15px;line-height:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TCloudUiDatepickerTimeComponent, selector: "tcloud-ui-datepicker-time", inputs: ["ngModel", "useOptionsDateTime"], outputs: ["ngModelChange", "onChange", "eventChange"] }] });
+TCloudUiRangeDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: { defaultValuePeriodStartStop: "defaultValuePeriodStartStop", required: "required", descriptionStart: "descriptionStart", descriptionStop: "descriptionStop" }, outputs: { onChange: "onChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], ngImport: i0, template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n    <tr>\r\n\r\n        <td>\r\n            <div *ngIf=\"mode === 'select'\">\r\n                <div class=\"description-period\">Per\u00EDodo</div>\r\n                <select name=\"periodo\" class=\"tc-form-control\" (change)=\"onChangeOptionsDateTime($event.target)\" [(ngModel)]=\"defaultValuePeriodStartStop\"  >\r\n                    <option value=\"\"></option> \r\n                    <ng-container *ngFor=\"let item of options_date_time\">\r\n                        <option [value]=\"item.value\">{{ item.description }}</option>\r\n                    </ng-container>\r\n                </select>\r\n            </div>\r\n            <div *ngIf=\"mode === 'datepickers'\">\r\n\r\n                <table class=\"area-range-datepickers\">\r\n                    <tr>\r\n                        <td>\r\n                            <div class=\"description-start\">{{ descriptionStart }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_start \r\n                                [(ngModel)]=\"result.start\" \r\n                                name=\"input_start\" \r\n                                (eventChange)=\"onChangeStartDateTime(_input_start)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                        <td>\r\n                            <div class=\"description-stop\">{{ descriptionStop }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_stop\r\n                                [(ngModel)]=\"result.stop\" \r\n                                name=\"input_stop\" \r\n                                (eventChange)=\"onChangeStopDateTime(_input_stop)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                    </tr>\r\n                </table>\r\n\r\n            </div>\r\n        </td>\r\n\r\n        <td>\r\n            <button class=\"btn-mode-range-date\" [class.active]=\"mode === 'select'\" (click)=\"toggle()\" type=\"button\">\r\n\r\n                <i *ngIf=\"mode === 'select'\" class=\"far fa-calendar-alt\" title=\"Alterar para calend\u00E1rio\"></i>\r\n                <i *ngIf=\"mode !== 'select'\" class=\"fas fa-calendar-week\" title=\"Selecionar per\u00EDodo\"></i>\r\n\r\n                <!-- <div *ngIf=\"mode === 'select'\">Exibir<br>Calend\u00E1rio</div> -->\r\n                <!-- <div *ngIf=\"mode !== 'select'\">Exibir<br>Per\u00EDodo</div> -->\r\n            </button>\r\n        </td>\r\n\r\n    </tr>\r\n</table>", styles: [".area-range-date{height:40px;width:100%}.area-range-date tr td:first-child{width:calc(100% - 35px)}.area-range-date tr td:first-child select{color:#535353;border-radius:3px 0 0 3px!important}.area-range-date tr td:first-child .area-range-datepickers{width:100%}.area-range-date tr td:first-child .area-range-datepickers td{width:50%!important}.area-range-date tr td:last-child{width:35px}.area-range-date tr td:last-child .btn-mode-range-date{width:100%;text-align:center;border:1px solid #ccc;background-color:#fff;font-size:17px;line-height:1;cursor:pointer;color:#6c6c6c;height:40px;border-radius:0 3px 3px 0}.area-range-date tr td:last-child .btn-mode-range-date:focus{color:#403d3d}.active{background-color:#eee!important}.description-period,.description-start{position:relative;left:17px;top:-15px;line-height:0}.description-stop{position:relative;top:-15px;line-height:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TCloudUiDatepickerTimeComponent, selector: "tcloud-ui-datepicker-time", inputs: ["ngModel", "useOptionsDateTime"], outputs: ["ngModelChange", "onChange", "eventChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiRangeDateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'range-date', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n    <tr>\r\n\r\n        <td>\r\n            <div *ngIf=\"mode === 'select'\">\r\n                <div class=\"description-period\">Per\u00EDodo</div>\r\n                <select name=\"periodo\" class=\"form-control tc-form-control\" (change)=\"onChangeOptionsDateTime($event.target)\" [(ngModel)]=\"defaultValuePeriodStartStop\"  >\r\n                    <option value=\"\"></option> \r\n                    <ng-container *ngFor=\"let item of options_date_time\">\r\n                        <option [value]=\"item.value\">{{ item.description }}</option>\r\n                    </ng-container>\r\n                </select>\r\n            </div>\r\n            <div *ngIf=\"mode === 'datepickers'\">\r\n\r\n                <table class=\"area-range-datepickers\">\r\n                    <tr>\r\n                        <td>\r\n                            <div class=\"description-start\">{{ descriptionStart }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_start \r\n                                [(ngModel)]=\"result.start\" \r\n                                name=\"input_start\" \r\n                                (eventChange)=\"onChangeStartDateTime(_input_start)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                        <td>\r\n                            <div class=\"description-stop\">{{ descriptionStop }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_stop\r\n                                [(ngModel)]=\"result.stop\" \r\n                                name=\"input_stop\" \r\n                                (eventChange)=\"onChangeStopDateTime(_input_stop)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                    </tr>\r\n                </table>\r\n\r\n            </div>\r\n        </td>\r\n\r\n        <td>\r\n            <button class=\"btn-mode-range-date\" [class.active]=\"mode === 'select'\" (click)=\"toggle()\" type=\"button\">\r\n\r\n                <i *ngIf=\"mode === 'select'\" class=\"far fa-calendar-alt\" title=\"Alterar para calend\u00E1rio\"></i>\r\n                <i *ngIf=\"mode !== 'select'\" class=\"fas fa-calendar-week\" title=\"Selecionar per\u00EDodo\"></i>\r\n\r\n                <!-- <div *ngIf=\"mode === 'select'\">Exibir<br>Calend\u00E1rio</div> -->\r\n                <!-- <div *ngIf=\"mode !== 'select'\">Exibir<br>Per\u00EDodo</div> -->\r\n            </button>\r\n        </td>\r\n\r\n    </tr>\r\n</table>", styles: [".area-range-date{height:40px;width:100%}.area-range-date tr td:first-child{width:calc(100% - 35px)}.area-range-date tr td:first-child select{color:#535353;border-radius:3px 0 0 3px!important}.area-range-date tr td:first-child .area-range-datepickers{width:100%}.area-range-date tr td:first-child .area-range-datepickers td{width:50%!important}.area-range-date tr td:last-child{width:35px}.area-range-date tr td:last-child .btn-mode-range-date{width:100%;text-align:center;border:1px solid #ccc;background-color:#fff;font-size:17px;line-height:1;cursor:pointer;color:#6c6c6c;height:40px;border-radius:0 3px 3px 0}.area-range-date tr td:last-child .btn-mode-range-date:focus{color:#403d3d}.active{background-color:#eee!important}.description-period,.description-start{position:relative;left:17px;top:-15px;line-height:0}.description-stop{position:relative;top:-15px;line-height:0}\n"] }]
+            args: [{ selector: 'range-date', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n    <tr>\r\n\r\n        <td>\r\n            <div *ngIf=\"mode === 'select'\">\r\n                <div class=\"description-period\">Per\u00EDodo</div>\r\n                <select name=\"periodo\" class=\"tc-form-control\" (change)=\"onChangeOptionsDateTime($event.target)\" [(ngModel)]=\"defaultValuePeriodStartStop\"  >\r\n                    <option value=\"\"></option> \r\n                    <ng-container *ngFor=\"let item of options_date_time\">\r\n                        <option [value]=\"item.value\">{{ item.description }}</option>\r\n                    </ng-container>\r\n                </select>\r\n            </div>\r\n            <div *ngIf=\"mode === 'datepickers'\">\r\n\r\n                <table class=\"area-range-datepickers\">\r\n                    <tr>\r\n                        <td>\r\n                            <div class=\"description-start\">{{ descriptionStart }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_start \r\n                                [(ngModel)]=\"result.start\" \r\n                                name=\"input_start\" \r\n                                (eventChange)=\"onChangeStartDateTime(_input_start)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                        <td>\r\n                            <div class=\"description-stop\">{{ descriptionStop }}</div>\r\n                            <tcloud-ui-datepicker-time \r\n                                #_input_stop\r\n                                [(ngModel)]=\"result.stop\" \r\n                                name=\"input_stop\" \r\n                                (eventChange)=\"onChangeStopDateTime(_input_stop)\">\r\n                            </tcloud-ui-datepicker-time>\r\n                        </td>\r\n                    </tr>\r\n                </table>\r\n\r\n            </div>\r\n        </td>\r\n\r\n        <td>\r\n            <button class=\"btn-mode-range-date\" [class.active]=\"mode === 'select'\" (click)=\"toggle()\" type=\"button\">\r\n\r\n                <i *ngIf=\"mode === 'select'\" class=\"far fa-calendar-alt\" title=\"Alterar para calend\u00E1rio\"></i>\r\n                <i *ngIf=\"mode !== 'select'\" class=\"fas fa-calendar-week\" title=\"Selecionar per\u00EDodo\"></i>\r\n\r\n                <!-- <div *ngIf=\"mode === 'select'\">Exibir<br>Calend\u00E1rio</div> -->\r\n                <!-- <div *ngIf=\"mode !== 'select'\">Exibir<br>Per\u00EDodo</div> -->\r\n            </button>\r\n        </td>\r\n\r\n    </tr>\r\n</table>", styles: [".area-range-date{height:40px;width:100%}.area-range-date tr td:first-child{width:calc(100% - 35px)}.area-range-date tr td:first-child select{color:#535353;border-radius:3px 0 0 3px!important}.area-range-date tr td:first-child .area-range-datepickers{width:100%}.area-range-date tr td:first-child .area-range-datepickers td{width:50%!important}.area-range-date tr td:last-child{width:35px}.area-range-date tr td:last-child .btn-mode-range-date{width:100%;text-align:center;border:1px solid #ccc;background-color:#fff;font-size:17px;line-height:1;cursor:pointer;color:#6c6c6c;height:40px;border-radius:0 3px 3px 0}.area-range-date tr td:last-child .btn-mode-range-date:focus{color:#403d3d}.active{background-color:#eee!important}.description-period,.description-start{position:relative;left:17px;top:-15px;line-height:0}.description-stop{position:relative;top:-15px;line-height:0}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { onChange: [{
                 type: Output
             }], defaultValuePeriodStartStop: [{
@@ -3953,10 +3974,10 @@ class TCloudUiFiltersComponent {
     }
 }
 TCloudUiFiltersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiFiltersComponent, deps: [{ token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Component });
-TCloudUiFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiFiltersComponent, selector: "tcloud-ui-filters", inputs: { data: "data", filters: "filters", submitText: "submitText", btnSubmitClass: "btnSubmitClass", useOnChangeSubmit: "useOnChangeSubmit", useButtonSubmit: "useButtonSubmit", useNormalizeCaseSensitive: "useNormalizeCaseSensitive", useRangeDate: "useRangeDate", useFilterAccept: "useFilterAccept" }, outputs: { result: "result", onFilter: "onFilter", onChange: "onChange", onSubmit: "onSubmit" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n    <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n        <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n            <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <tcloud-ui-datepicker \r\n                            #_input\r\n                            name=\"input_{{i+1}}\"\r\n                            [modeInput]=\"true\"\r\n                            [(ngModel)]=\"item.value\"\r\n                            (ngModelChange)=\"searchIn(item, _input)\">\r\n                        </tcloud-ui-datepicker>\r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n\r\n                \r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n                <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n                    <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n                        <!-- PERIOD RANGE DATE -->\r\n                        <ng-container *ngIf=\"item.id === 'start'\">\r\n                            <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n                                <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i>&nbsp;</div>\r\n                                <range-date  \r\n                                    #_range_date ngModel name=\"input_{{i+1}}\" \r\n                                    [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n                                    [descriptionStart]=\"descriptionStart\"\r\n                                    [descriptionStop]=\"descriptionStop\"\r\n                                    required \r\n                                    (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n                                </range-date>\r\n                            </div>\r\n                        </ng-container>   \r\n                        <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\">  \r\n                        <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\">               \r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n                        <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                            <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                            <div class=\"box-type-{{item.type}}\">\r\n                                <tcloud-ui-datepicker-time \r\n                                    #_input \r\n                                    [(ngModel)]=\"item.value\" \r\n                                    name=\"input_{{i+1}}\" \r\n                                    [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n                                    (eventChange)=\"searchIn(item, _input)\" >\r\n                                </tcloud-ui-datepicker-time>\r\n                                <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                                    <i class=\"fas fa-times\"></i>\r\n                                </button>\r\n                            </div>\r\n                        </div>\r\n\r\n                    </ng-container>\r\n\r\n                </ng-container>\r\n            </ng-container>\r\n                        \r\n            <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <input \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                            name=\"input_{{i+1}}\" \r\n                            type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n                            class=\"form-control tc-form-control\"                     \r\n                            (keyup)=\"searchIn(item, $event)\">                    \r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <select \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            name=\"input_{{i+1}}\" \r\n                            class=\"form-control tc-form-control\"                     \r\n                            (change)=\"searchIn(item, $event)\">\r\n                            <option [ngValue]=\"\"></option>\r\n                            <ng-container *ngFor=\"let v of item.data\">\r\n                                <option [value]=\"v.value\">{{ v.description }}</option>\r\n                            </ng-container>\r\n                        </select>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n        </ng-container>\r\n\r\n\r\n        <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n            \r\n            <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                <div class=\"area-input-checkbox\">\r\n                    <div class=\"form-control tc-form-control\">\r\n                        <label>\r\n                            {{ item.placeholder }}\r\n                            <input \r\n                                #_input\r\n                                placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                                name=\"input_{{i+1}}\" \r\n                                type=\"checkbox\"                   \r\n                                (change)=\"searchIn(item, _input.checked)\">   \r\n                        </label>\r\n                    </div>                 \r\n                </div>\r\n            </div>\r\n\r\n        </ng-container>\r\n\r\n\r\n    </ng-container>\r\n\r\n    <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n        <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n    </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n    <pre>start_stop: {{ start_stop }}</pre>\r\n    <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n    <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", 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]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TCloudUiDatepickerTimeComponent, selector: "tcloud-ui-datepicker-time", inputs: ["ngModel", "useOptionsDateTime"], outputs: ["ngModelChange", "onChange", "eventChange"] }, { kind: "component", type: TCloudUiDatepickerComponent, selector: "tcloud-ui-datepicker", inputs: ["multiple", "maxNumberOfDates", "daysOfWeekDisabled", "minDate", "maxDate", "datesDisabled", "modeInput", "useBorder", "childInputDateTime", "ngModel", "code"], outputs: ["onChange", "ngModelChange"] }, { kind: "component", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: ["defaultValuePeriodStartStop", "required", "descriptionStart", "descriptionStop"], outputs: ["onChange"] }] });
+TCloudUiFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiFiltersComponent, selector: "tcloud-ui-filters", inputs: { data: "data", filters: "filters", submitText: "submitText", btnSubmitClass: "btnSubmitClass", useOnChangeSubmit: "useOnChangeSubmit", useButtonSubmit: "useButtonSubmit", useNormalizeCaseSensitive: "useNormalizeCaseSensitive", useRangeDate: "useRangeDate", useFilterAccept: "useFilterAccept" }, outputs: { result: "result", onFilter: "onFilter", onChange: "onChange", onSubmit: "onSubmit" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n    <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n        <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n            <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <tcloud-ui-datepicker \r\n                            #_input\r\n                            name=\"input_{{i+1}}\"\r\n                            [modeInput]=\"true\"\r\n                            [(ngModel)]=\"item.value\"\r\n                            (ngModelChange)=\"searchIn(item, _input)\">\r\n                        </tcloud-ui-datepicker>\r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n\r\n                \r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n                <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n                    <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n                        <!-- PERIOD RANGE DATE -->\r\n                        <ng-container *ngIf=\"item.id === 'start'\">\r\n                            <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n                                <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i>&nbsp;</div>\r\n                                <range-date  \r\n                                    #_range_date ngModel name=\"input_{{i+1}}\" \r\n                                    [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n                                    [descriptionStart]=\"descriptionStart\"\r\n                                    [descriptionStop]=\"descriptionStop\"\r\n                                    required \r\n                                    (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n                                </range-date>\r\n                            </div>\r\n                        </ng-container>   \r\n                        <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\">  \r\n                        <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\">               \r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n                        <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                            <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                            <div class=\"box-type-{{item.type}}\">\r\n                                <tcloud-ui-datepicker-time \r\n                                    #_input \r\n                                    [(ngModel)]=\"item.value\" \r\n                                    name=\"input_{{i+1}}\" \r\n                                    [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n                                    (eventChange)=\"searchIn(item, _input)\" >\r\n                                </tcloud-ui-datepicker-time>\r\n                                <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                                    <i class=\"fas fa-times\"></i>\r\n                                </button>\r\n                            </div>\r\n                        </div>\r\n\r\n                    </ng-container>\r\n\r\n                </ng-container>\r\n            </ng-container>\r\n                        \r\n            <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <input \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                            name=\"input_{{i+1}}\" \r\n                            type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n                            class=\"tc-form-control\"                     \r\n                            (keyup)=\"searchIn(item, $event)\">                    \r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <select \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            name=\"input_{{i+1}}\" \r\n                            class=\"tc-form-control\"                     \r\n                            (change)=\"searchIn(item, $event)\">\r\n                            <option [ngValue]=\"\"></option>\r\n                            <ng-container *ngFor=\"let v of item.data\">\r\n                                <option [value]=\"v.value\">{{ v.description }}</option>\r\n                            </ng-container>\r\n                        </select>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n        </ng-container>\r\n\r\n\r\n        <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n            \r\n            <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                <div class=\"area-input-checkbox\">\r\n                    <div class=\"tc-form-control\">\r\n                        <label>\r\n                            {{ item.placeholder }}\r\n                            <input \r\n                                #_input\r\n                                placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                                name=\"input_{{i+1}}\" \r\n                                type=\"checkbox\"                   \r\n                                (change)=\"searchIn(item, _input.checked)\">   \r\n                        </label>\r\n                    </div>                 \r\n                </div>\r\n            </div>\r\n\r\n        </ng-container>\r\n\r\n\r\n    </ng-container>\r\n\r\n    <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n        <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n    </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n    <pre>start_stop: {{ start_stop }}</pre>\r\n    <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n    <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", 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]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TCloudUiDatepickerTimeComponent, selector: "tcloud-ui-datepicker-time", inputs: ["ngModel", "useOptionsDateTime"], outputs: ["ngModelChange", "onChange", "eventChange"] }, { kind: "component", type: TCloudUiDatepickerComponent, selector: "tcloud-ui-datepicker", inputs: ["multiple", "maxNumberOfDates", "daysOfWeekDisabled", "minDate", "maxDate", "datesDisabled", "modeInput", "useBorder", "childInputDateTime", "ngModel", "code"], outputs: ["onChange", "ngModelChange"] }, { kind: "component", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: ["defaultValuePeriodStartStop", "required", "descriptionStart", "descriptionStop"], outputs: ["onChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiFiltersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tcloud-ui-filters', template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n    <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n        <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n            <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <tcloud-ui-datepicker \r\n                            #_input\r\n                            name=\"input_{{i+1}}\"\r\n                            [modeInput]=\"true\"\r\n                            [(ngModel)]=\"item.value\"\r\n                            (ngModelChange)=\"searchIn(item, _input)\">\r\n                        </tcloud-ui-datepicker>\r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n\r\n                \r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n                <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n                    <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n                        <!-- PERIOD RANGE DATE -->\r\n                        <ng-container *ngIf=\"item.id === 'start'\">\r\n                            <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n                                <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i>&nbsp;</div>\r\n                                <range-date  \r\n                                    #_range_date ngModel name=\"input_{{i+1}}\" \r\n                                    [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n                                    [descriptionStart]=\"descriptionStart\"\r\n                                    [descriptionStop]=\"descriptionStop\"\r\n                                    required \r\n                                    (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n                                </range-date>\r\n                            </div>\r\n                        </ng-container>   \r\n                        <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\">  \r\n                        <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\">               \r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n                        <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                            <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                            <div class=\"box-type-{{item.type}}\">\r\n                                <tcloud-ui-datepicker-time \r\n                                    #_input \r\n                                    [(ngModel)]=\"item.value\" \r\n                                    name=\"input_{{i+1}}\" \r\n                                    [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n                                    (eventChange)=\"searchIn(item, _input)\" >\r\n                                </tcloud-ui-datepicker-time>\r\n                                <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                                    <i class=\"fas fa-times\"></i>\r\n                                </button>\r\n                            </div>\r\n                        </div>\r\n\r\n                    </ng-container>\r\n\r\n                </ng-container>\r\n            </ng-container>\r\n                        \r\n            <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <input \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                            name=\"input_{{i+1}}\" \r\n                            type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n                            class=\"form-control tc-form-control\"                     \r\n                            (keyup)=\"searchIn(item, $event)\">                    \r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <select \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            name=\"input_{{i+1}}\" \r\n                            class=\"form-control tc-form-control\"                     \r\n                            (change)=\"searchIn(item, $event)\">\r\n                            <option [ngValue]=\"\"></option>\r\n                            <ng-container *ngFor=\"let v of item.data\">\r\n                                <option [value]=\"v.value\">{{ v.description }}</option>\r\n                            </ng-container>\r\n                        </select>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n        </ng-container>\r\n\r\n\r\n        <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n            \r\n            <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                <div class=\"area-input-checkbox\">\r\n                    <div class=\"form-control tc-form-control\">\r\n                        <label>\r\n                            {{ item.placeholder }}\r\n                            <input \r\n                                #_input\r\n                                placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                                name=\"input_{{i+1}}\" \r\n                                type=\"checkbox\"                   \r\n                                (change)=\"searchIn(item, _input.checked)\">   \r\n                        </label>\r\n                    </div>                 \r\n                </div>\r\n            </div>\r\n\r\n        </ng-container>\r\n\r\n\r\n    </ng-container>\r\n\r\n    <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n        <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n    </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n    <pre>start_stop: {{ start_stop }}</pre>\r\n    <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n    <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
+            args: [{ selector: 'tcloud-ui-filters', template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n    <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n        <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n            <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <tcloud-ui-datepicker \r\n                            #_input\r\n                            name=\"input_{{i+1}}\"\r\n                            [modeInput]=\"true\"\r\n                            [(ngModel)]=\"item.value\"\r\n                            (ngModelChange)=\"searchIn(item, _input)\">\r\n                        </tcloud-ui-datepicker>\r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n\r\n                \r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n                <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n                    <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n                        <!-- PERIOD RANGE DATE -->\r\n                        <ng-container *ngIf=\"item.id === 'start'\">\r\n                            <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n                                <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i>&nbsp;</div>\r\n                                <range-date  \r\n                                    #_range_date ngModel name=\"input_{{i+1}}\" \r\n                                    [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n                                    [descriptionStart]=\"descriptionStart\"\r\n                                    [descriptionStop]=\"descriptionStop\"\r\n                                    required \r\n                                    (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n                                </range-date>\r\n                            </div>\r\n                        </ng-container>   \r\n                        <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\">  \r\n                        <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\">               \r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n                        <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                            <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                            <div class=\"box-type-{{item.type}}\">\r\n                                <tcloud-ui-datepicker-time \r\n                                    #_input \r\n                                    [(ngModel)]=\"item.value\" \r\n                                    name=\"input_{{i+1}}\" \r\n                                    [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n                                    (eventChange)=\"searchIn(item, _input)\" >\r\n                                </tcloud-ui-datepicker-time>\r\n                                <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n                                    <i class=\"fas fa-times\"></i>\r\n                                </button>\r\n                            </div>\r\n                        </div>\r\n\r\n                    </ng-container>\r\n\r\n                </ng-container>\r\n            </ng-container>\r\n                        \r\n            <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <input \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                            name=\"input_{{i+1}}\" \r\n                            type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n                            class=\"tc-form-control\"                     \r\n                            (keyup)=\"searchIn(item, $event)\">                    \r\n                        <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n                <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n                    <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                    <div class=\"box-type-{{item.type}}\">\r\n                        <select \r\n                            #_input\r\n                            [(ngModel)]=\"item.value\"\r\n                            name=\"input_{{i+1}}\" \r\n                            class=\"tc-form-control\"                     \r\n                            (change)=\"searchIn(item, $event)\">\r\n                            <option [ngValue]=\"\"></option>\r\n                            <ng-container *ngFor=\"let v of item.data\">\r\n                                <option [value]=\"v.value\">{{ v.description }}</option>\r\n                            </ng-container>\r\n                        </select>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n\r\n        </ng-container>\r\n\r\n\r\n        <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n            \r\n            <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n                <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\r\n                <div class=\"area-input-checkbox\">\r\n                    <div class=\"tc-form-control\">\r\n                        <label>\r\n                            {{ item.placeholder }}\r\n                            <input \r\n                                #_input\r\n                                placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n                                name=\"input_{{i+1}}\" \r\n                                type=\"checkbox\"                   \r\n                                (change)=\"searchIn(item, _input.checked)\">   \r\n                        </label>\r\n                    </div>                 \r\n                </div>\r\n            </div>\r\n\r\n        </ng-container>\r\n\r\n\r\n    </ng-container>\r\n\r\n    <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n        <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n    </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n    <pre>start_stop: {{ start_stop }}</pre>\r\n    <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n    <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.DatePipe }]; }, propDecorators: { _formulario: [{
                 type: ViewChild,
                 args: ['_formulario']
@@ -4010,7 +4031,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         CommonModule,
                         FormsModule,
                         ReactiveFormsModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -4042,7 +4064,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         FormsModule,
                         ReactiveFormsModule,
                         TCloudUiDataListModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -4078,7 +4101,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         ReactiveFormsModule,
                         TCloudUiDatepickerTimeModule,
                         TCloudUiDatepickerModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -4293,7 +4317,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     imports: [
                         CommonModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -4547,7 +4572,13 @@ class TCloudUiElCopyDirective {
         const btn_copy = this.renderer.createElement('i');
         var copyText = () => {
             const elementWithCopyAttribute = document.querySelector(`[data-el-copy="${id}"]`);
-            const copyText = elementWithCopyAttribute?.textContent;
+            let copyText = '';
+            if (elementWithCopyAttribute && elementWithCopyAttribute.tagName && (elementWithCopyAttribute.tagName).toUpperCase() === 'INPUT') {
+                copyText = elementWithCopyAttribute?.value;
+            }
+            else {
+                copyText = elementWithCopyAttribute?.textContent;
+            }
             navigator.clipboard.writeText(copyText);
             this.renderer.removeClass(btn_copy, 'fa-copy');
             this.renderer.addClass(btn_copy, 'fa-check');
@@ -4566,7 +4597,19 @@ class TCloudUiElCopyDirective {
         this.renderer.setAttribute(btn_copy, 'id', id);
         this.renderer.setAttribute(btn_copy, 'title', 'Copy');
         this.renderer.listen(btn_copy, 'click', () => { copyText(); });
-        this.renderer.appendChild(this.el.nativeElement, btn_copy);
+        if (((this.el.nativeElement).tagName).toUpperCase() === 'INPUT') {
+            let classList = this.el.nativeElement?.classList;
+            if (classList && (classList).length > 0 && ('tc-form-control').indexOf(classList) > -1) {
+                this.renderer.addClass(btn_copy, 'tcloud-ui-el-input-copy-tc-form-control');
+            }
+            else {
+                this.renderer.addClass(btn_copy, 'tcloud-ui-el-input-copy');
+            }
+            this.renderer.appendChild(this.el.nativeElement.parentNode, btn_copy);
+        }
+        else {
+            this.renderer.appendChild(this.el.nativeElement, btn_copy);
+        }
     }
     generateID(target) {
         const ref = (target) ? `-${target}` : '';
@@ -5005,10 +5048,10 @@ class TCloudUiMultiplesValuesComponent {
     }
 }
 TCloudUiMultiplesValuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TCloudUiMultiplesValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiMultiplesValuesComponent, selector: "tcloud-ui-multiples-values", inputs: { listItems: "listItems", pattern: "pattern", delimiter: "delimiter", placeholder: "placeholder", disabled: "disabled", loading: "loading", required: "required", search: "search", uppercase: "uppercase", lowercase: "lowercase" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], ngImport: i0, template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n    <form #_formulario=\"ngForm\">\r\n\r\n        <!-- {{ input_items }} -->\r\n\r\n        <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n            <table style=\"width: 100%;\">\r\n                <tr>\r\n                    <td>\r\n                        <table class=\"group-input-action\">\r\n                            <tr>\r\n                                <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <div class=\"input\" (click)=\"show_itens = false\">\r\n                                            <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n                                        </div>\r\n                                    </ng-container>\r\n            \r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <div class=\"input\">\r\n                                            <input \r\n                                                required\r\n                                                [pattern]=\"pattern\"\r\n                                                (keydown.enter)=\"toEnterKey(input_items)\"\r\n                                                [disabled]=\"disabled\"\r\n                                                [class.text-lowercase]=\"lowercase\"\r\n                                                [class.text-uppercase]=\"uppercase\"\r\n                                                type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                                        \r\n                                        </div>\r\n                                    </ng-container>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                                    <div class=\"input\">\r\n                                        <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                                    </div>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                                    <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div>                       \r\n                                </td>\r\n                                <td class=\"action-input-arrow  bc-r\">\r\n                                    <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                                        <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                                        <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                                    </button>\r\n                                </td>\r\n                                \r\n                            </tr>\r\n                        </table> \r\n                    </td>\r\n                    <td style=\"width: 45px;\">\r\n                        <table>\r\n                            <tr>\r\n                                <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                </td>\r\n                            </tr>\r\n                        </table>\r\n                    </td>\r\n                </tr>\r\n            </table>\r\n\r\n            <!-- <table class=\"group-input-action\">\r\n                <tr>\r\n                    <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <div class=\"input\" (click)=\"show_itens = false\">\r\n                                <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n                            </div>\r\n                        </ng-container>\r\n\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <div class=\"input\">\r\n                                <input \r\n                                    (keydown.enter)=\"add_items();toOpen()\"\r\n                                    [disabled]=\"disabled\"\r\n                                    [class.text-lowercase]=\"lowercase\"\r\n                                    [class.text-uppercase]=\"uppercase\"\r\n                                    type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                            \r\n                            </div>\r\n                        </ng-container>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                        <div class=\"input\">\r\n                            <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                        </div>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                        <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div>                       \r\n                    </td>\r\n                    <td class=\"action-input-arrow  bc-r\">\r\n                        <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                            <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                            <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                        </button>\r\n                    </td>\r\n                    <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                    </td>\r\n                </tr>\r\n            </table> -->\r\n        </div>\r\n        \r\n        <!-- <pre>\r\n            {{ items | json }}\r\n        </pre> -->\r\n\r\n    </form> \r\n\r\n    <!-- box-itens-selected  -->\r\n    <div class=\"tc-dropdown-menu box-itens-selected  {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n        \r\n\r\n        <div class=\"line-search\" *ngIf=\"search\">\r\n            <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n              <tr>\r\n      \r\n                <td class=\"area-input\">\r\n                  <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" >            \r\n                </td>\r\n      \r\n                <td class=\"area-icon\">\r\n                  <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n                  <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n                </td>\r\n                \r\n              </tr>\r\n            </table>\r\n        </div>\r\n\r\n        <div class=\"area-options\" id=\"{{ id }}-options\">\r\n            <ng-container *ngFor=\"let item of items; let i = index\">\r\n            \r\n                <label class=\"box-label\">\r\n                    <div class=\"box-value\" [title]=\"item\"  >\r\n                    {{ item }}          \r\n                    </div>\r\n                    <div class=\"box-action\">\r\n                        <button\r\n                            class=\"box-action\"\r\n                            [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n                            title=\"Remover\"\r\n                            type=\"button\"\r\n                            (click)=\"removeItem(item, i)\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </label>\r\n\r\n            </ng-container>\r\n        </div>\r\n\r\n        <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n            <div class=\"btn-remove-all\">\r\n                <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n                    Limpar toda a lista\r\n                </button>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TCloudUiDataListComponent, selector: "tcloud-ui-data-list", inputs: ["placeholder", "disabled", "loading", "showInput", "search", "listItems", "open", "border", "ngModel"], outputs: ["onInputChange", "onChange", "onOpened", "onClosed", "ngModelChange"] }] });
+TCloudUiMultiplesValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiMultiplesValuesComponent, selector: "tcloud-ui-multiples-values", inputs: { listItems: "listItems", pattern: "pattern", delimiter: "delimiter", placeholder: "placeholder", disabled: "disabled", loading: "loading", required: "required", search: "search", uppercase: "uppercase", lowercase: "lowercase" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], ngImport: i0, template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n    <form #_formulario=\"ngForm\">\r\n\r\n        <!-- {{ input_items }} -->\r\n\r\n        <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n            <table style=\"width: 100%;\">\r\n                <tr>\r\n                    <td>\r\n                        <table class=\"group-input-action\">\r\n                            <tr>\r\n                                <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <div class=\"input\" (click)=\"show_itens = false\">\r\n                                            <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n                                        </div>\r\n                                    </ng-container>\r\n            \r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <div class=\"input\">\r\n                                            <input \r\n                                                required\r\n                                                [pattern]=\"pattern\"\r\n                                                (keydown.enter)=\"toEnterKey(input_items)\"\r\n                                                [disabled]=\"disabled\"\r\n                                                [class.text-lowercase]=\"lowercase\"\r\n                                                [class.text-uppercase]=\"uppercase\"\r\n                                                type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                                        \r\n                                        </div>\r\n                                    </ng-container>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                                    <div class=\"input\">\r\n                                        <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                                    </div>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                                    <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div>                       \r\n                                </td>\r\n                                <td class=\"action-input-arrow  bc-r\">\r\n                                    <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                                        <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                                        <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                                    </button>\r\n                                </td>\r\n                                \r\n                            </tr>\r\n                        </table> \r\n                    </td>\r\n                    <td style=\"width: 45px;\">\r\n                        <table>\r\n                            <tr>\r\n                                <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                </td>\r\n                            </tr>\r\n                        </table>\r\n                    </td>\r\n                </tr>\r\n            </table>\r\n\r\n            <!-- <table class=\"group-input-action\">\r\n                <tr>\r\n                    <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <div class=\"input\" (click)=\"show_itens = false\">\r\n                                <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n                            </div>\r\n                        </ng-container>\r\n\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <div class=\"input\">\r\n                                <input \r\n                                    (keydown.enter)=\"add_items();toOpen()\"\r\n                                    [disabled]=\"disabled\"\r\n                                    [class.text-lowercase]=\"lowercase\"\r\n                                    [class.text-uppercase]=\"uppercase\"\r\n                                    type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                            \r\n                            </div>\r\n                        </ng-container>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                        <div class=\"input\">\r\n                            <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                        </div>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                        <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div>                       \r\n                    </td>\r\n                    <td class=\"action-input-arrow  bc-r\">\r\n                        <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                            <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                            <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                        </button>\r\n                    </td>\r\n                    <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                    </td>\r\n                </tr>\r\n            </table> -->\r\n        </div>\r\n        \r\n        <!-- <pre>\r\n            {{ items | json }}\r\n        </pre> -->\r\n\r\n    </form> \r\n\r\n    <!-- box-itens-selected  -->\r\n    <div class=\"tc-dropdown-menu box-itens-selected  {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n        \r\n\r\n        <div class=\"line-search\" *ngIf=\"search\">\r\n            <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n              <tr>\r\n      \r\n                <td class=\"area-input\">\r\n                  <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" >            \r\n                </td>\r\n      \r\n                <td class=\"area-icon\">\r\n                  <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n                  <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n                </td>\r\n                \r\n              </tr>\r\n            </table>\r\n        </div>\r\n\r\n        <div class=\"area-options\" id=\"{{ id }}-options\">\r\n            <ng-container *ngFor=\"let item of items; let i = index\">\r\n            \r\n                <label class=\"box-label\">\r\n                    <div class=\"box-value\" [title]=\"item\"  >\r\n                    {{ item }}          \r\n                    </div>\r\n                    <div class=\"box-action\">\r\n                        <button\r\n                            class=\"box-action\"\r\n                            [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n                            title=\"Remover\"\r\n                            type=\"button\"\r\n                            (click)=\"removeItem(item, i)\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </label>\r\n\r\n            </ng-container>\r\n        </div>\r\n\r\n        <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n            <div class=\"btn-remove-all\">\r\n                <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n                    Limpar toda a lista\r\n                </button>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TCloudUiDataListComponent, selector: "tcloud-ui-data-list", inputs: ["placeholder", "disabled", "loading", "showInput", "search", "listItems", "open", "border", "ngModel"], outputs: ["onInputChange", "onChange", "onOpened", "onClosed", "ngModelChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tcloud-ui-multiples-values', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n    <form #_formulario=\"ngForm\">\r\n\r\n        <!-- {{ input_items }} -->\r\n\r\n        <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n            <table style=\"width: 100%;\">\r\n                <tr>\r\n                    <td>\r\n                        <table class=\"group-input-action\">\r\n                            <tr>\r\n                                <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <div class=\"input\" (click)=\"show_itens = false\">\r\n                                            <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n                                        </div>\r\n                                    </ng-container>\r\n            \r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <div class=\"input\">\r\n                                            <input \r\n                                                required\r\n                                                [pattern]=\"pattern\"\r\n                                                (keydown.enter)=\"toEnterKey(input_items)\"\r\n                                                [disabled]=\"disabled\"\r\n                                                [class.text-lowercase]=\"lowercase\"\r\n                                                [class.text-uppercase]=\"uppercase\"\r\n                                                type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                                        \r\n                                        </div>\r\n                                    </ng-container>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                                    <div class=\"input\">\r\n                                        <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                                    </div>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                                    <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div>                       \r\n                                </td>\r\n                                <td class=\"action-input-arrow  bc-r\">\r\n                                    <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                                        <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                                        <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                                    </button>\r\n                                </td>\r\n                                \r\n                            </tr>\r\n                        </table> \r\n                    </td>\r\n                    <td style=\"width: 45px;\">\r\n                        <table>\r\n                            <tr>\r\n                                <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                </td>\r\n                            </tr>\r\n                        </table>\r\n                    </td>\r\n                </tr>\r\n            </table>\r\n\r\n            <!-- <table class=\"group-input-action\">\r\n                <tr>\r\n                    <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <div class=\"input\" (click)=\"show_itens = false\">\r\n                                <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n                            </div>\r\n                        </ng-container>\r\n\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <div class=\"input\">\r\n                                <input \r\n                                    (keydown.enter)=\"add_items();toOpen()\"\r\n                                    [disabled]=\"disabled\"\r\n                                    [class.text-lowercase]=\"lowercase\"\r\n                                    [class.text-uppercase]=\"uppercase\"\r\n                                    type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                            \r\n                            </div>\r\n                        </ng-container>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                        <div class=\"input\">\r\n                            <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                        </div>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                        <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div>                       \r\n                    </td>\r\n                    <td class=\"action-input-arrow  bc-r\">\r\n                        <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                            <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                            <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                        </button>\r\n                    </td>\r\n                    <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                    </td>\r\n                </tr>\r\n            </table> -->\r\n        </div>\r\n        \r\n        <!-- <pre>\r\n            {{ items | json }}\r\n        </pre> -->\r\n\r\n    </form> \r\n\r\n    <!-- box-itens-selected  -->\r\n    <div class=\"tc-dropdown-menu box-itens-selected  {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n        \r\n\r\n        <div class=\"line-search\" *ngIf=\"search\">\r\n            <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n              <tr>\r\n      \r\n                <td class=\"area-input\">\r\n                  <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" >            \r\n                </td>\r\n      \r\n                <td class=\"area-icon\">\r\n                  <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n                  <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n                </td>\r\n                \r\n              </tr>\r\n            </table>\r\n        </div>\r\n\r\n        <div class=\"area-options\" id=\"{{ id }}-options\">\r\n            <ng-container *ngFor=\"let item of items; let i = index\">\r\n            \r\n                <label class=\"box-label\">\r\n                    <div class=\"box-value\" [title]=\"item\"  >\r\n                    {{ item }}          \r\n                    </div>\r\n                    <div class=\"box-action\">\r\n                        <button\r\n                            class=\"box-action\"\r\n                            [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n                            title=\"Remover\"\r\n                            type=\"button\"\r\n                            (click)=\"removeItem(item, i)\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </label>\r\n\r\n            </ng-container>\r\n        </div>\r\n\r\n        <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n            <div class=\"btn-remove-all\">\r\n                <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n                    Limpar toda a lista\r\n                </button>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\n"] }]
+            args: [{ selector: 'tcloud-ui-multiples-values', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n    <form #_formulario=\"ngForm\">\r\n\r\n        <!-- {{ input_items }} -->\r\n\r\n        <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n            <table style=\"width: 100%;\">\r\n                <tr>\r\n                    <td>\r\n                        <table class=\"group-input-action\">\r\n                            <tr>\r\n                                <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <div class=\"input\" (click)=\"show_itens = false\">\r\n                                            <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n                                        </div>\r\n                                    </ng-container>\r\n            \r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <div class=\"input\">\r\n                                            <input \r\n                                                required\r\n                                                [pattern]=\"pattern\"\r\n                                                (keydown.enter)=\"toEnterKey(input_items)\"\r\n                                                [disabled]=\"disabled\"\r\n                                                [class.text-lowercase]=\"lowercase\"\r\n                                                [class.text-uppercase]=\"uppercase\"\r\n                                                type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                                        \r\n                                        </div>\r\n                                    </ng-container>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                                    <div class=\"input\">\r\n                                        <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                                    </div>\r\n                                </td>\r\n                                <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                                    <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div>                       \r\n                                </td>\r\n                                <td class=\"action-input-arrow  bc-r\">\r\n                                    <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                                        <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                                        <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                                    </button>\r\n                                </td>\r\n                                \r\n                            </tr>\r\n                        </table> \r\n                    </td>\r\n                    <td style=\"width: 45px;\">\r\n                        <table>\r\n                            <tr>\r\n                                <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                                    <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                                        <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                            <i class=\"fas fa-plus\"></i>\r\n                                        </button>\r\n                                    </ng-container>\r\n                                </td>\r\n                            </tr>\r\n                        </table>\r\n                    </td>\r\n                </tr>\r\n            </table>\r\n\r\n            <!-- <table class=\"group-input-action\">\r\n                <tr>\r\n                    <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <div class=\"input\" (click)=\"show_itens = false\">\r\n                                <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n                            </div>\r\n                        </ng-container>\r\n\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <div class=\"input\">\r\n                                <input \r\n                                    (keydown.enter)=\"add_items();toOpen()\"\r\n                                    [disabled]=\"disabled\"\r\n                                    [class.text-lowercase]=\"lowercase\"\r\n                                    [class.text-uppercase]=\"uppercase\"\r\n                                    type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n                            \r\n                            </div>\r\n                        </ng-container>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n                        <div class=\"input\">\r\n                            <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>                            \r\n                        </div>\r\n                    </td>\r\n                    <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n                        <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div>                       \r\n                    </td>\r\n                    <td class=\"action-input-arrow  bc-r\">\r\n                        <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n                            <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n                            <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n                        </button>\r\n                    </td>\r\n                    <td class=\"action-input\" *ngIf=\"!disabled\">\r\n                        <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n                            <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n                                <i class=\"fas fa-plus\"></i>\r\n                            </button>\r\n                        </ng-container>\r\n                    </td>\r\n                </tr>\r\n            </table> -->\r\n        </div>\r\n        \r\n        <!-- <pre>\r\n            {{ items | json }}\r\n        </pre> -->\r\n\r\n    </form> \r\n\r\n    <!-- box-itens-selected  -->\r\n    <div class=\"tc-dropdown-menu box-itens-selected  {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n        \r\n\r\n        <div class=\"line-search\" *ngIf=\"search\">\r\n            <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n              <tr>\r\n      \r\n                <td class=\"area-input\">\r\n                  <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" >            \r\n                </td>\r\n      \r\n                <td class=\"area-icon\">\r\n                  <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n                  <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n                </td>\r\n                \r\n              </tr>\r\n            </table>\r\n        </div>\r\n\r\n        <div class=\"area-options\" id=\"{{ id }}-options\">\r\n            <ng-container *ngFor=\"let item of items; let i = index\">\r\n            \r\n                <label class=\"box-label\">\r\n                    <div class=\"box-value\" [title]=\"item\"  >\r\n                    {{ item }}          \r\n                    </div>\r\n                    <div class=\"box-action\">\r\n                        <button\r\n                            class=\"box-action\"\r\n                            [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n                            title=\"Remover\"\r\n                            type=\"button\"\r\n                            (click)=\"removeItem(item, i)\">\r\n                            <i class=\"fas fa-times\"></i>\r\n                        </button>\r\n                    </div>\r\n                </label>\r\n\r\n            </ng-container>\r\n        </div>\r\n\r\n        <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n            <div class=\"btn-remove-all\">\r\n                <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n                    Limpar toda a lista\r\n                </button>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { listItems: [{
                 type: Input
             }], pattern: [{
@@ -5056,7 +5099,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         FormsModule,
                         ReactiveFormsModule,
                         TCloudUiDataListModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -5110,7 +5154,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     imports: [
                         CommonModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -5123,6 +5168,9 @@ const noop = () => {
 };
 class TCloudUiInputPasswordComponent {
     constructor() {
+        this.actionView = true;
+        this.actionCopy = true;
+        this.actionGeneratePassword = true;
         this.numberOfCharacter = 14;
         this.atLeastOneUppercaseLetter = true;
         this.atLeastOneLowercaseLetter = true;
@@ -5224,11 +5272,17 @@ class TCloudUiInputPasswordComponent {
     }
 }
 TCloudUiInputPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TCloudUiInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiInputPasswordComponent, selector: "tcloud-ui-input-password", inputs: { numberOfCharacter: "numberOfCharacter", atLeastOneUppercaseLetter: "atLeastOneUppercaseLetter", atLeastOneLowercaseLetter: "atLeastOneLowercaseLetter", atLeastOneSpecialCharacter: "atLeastOneSpecialCharacter", ngModel: "ngModel" }, outputs: { ngModelChange: "ngModelChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "<div class=\"tcloud-ui-input-password\">\r\n    <table>\r\n        <tr>\r\n            <!-- input password -->\r\n            <td>\r\n                <form #_form=\"ngForm\">\r\n                    <ng-container *ngIf=\"passwordRegex\">\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n                    </ng-container>\r\n                </form>\r\n            </td>\r\n\r\n            <!-- action show hide -->\r\n            <td>\r\n                <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n                    <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n                    <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n                </button>\r\n            </td>\r\n\r\n            <!-- action generate pass -->\r\n            <td>\r\n                <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n                    <i class=\"fa-solid fa-key\"></i>\r\n                </button>\r\n            </td>\r\n\r\n            <!-- action copy pass -->\r\n            <td>\r\n                <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n                    <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n                    <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n                </button>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
+TCloudUiInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiInputPasswordComponent, selector: "tcloud-ui-input-password", inputs: { actionView: "actionView", actionCopy: "actionCopy", actionGeneratePassword: "actionGeneratePassword", numberOfCharacter: "numberOfCharacter", atLeastOneUppercaseLetter: "atLeastOneUppercaseLetter", atLeastOneLowercaseLetter: "atLeastOneLowercaseLetter", atLeastOneSpecialCharacter: "atLeastOneSpecialCharacter", ngModel: "ngModel" }, outputs: { ngModelChange: "ngModelChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "<div class=\"tcloud-ui-input-password\">\r\n    <table>\r\n        <tr>\r\n            <!-- input password -->\r\n            <td>\r\n                <form #_form=\"ngForm\">\r\n                    <ng-container *ngIf=\"passwordRegex\">\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n                    </ng-container>\r\n                </form>\r\n            </td>\r\n\r\n            <!-- action show hide -->\r\n            <td *ngIf=\"actionView\">\r\n                <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n                    <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n                    <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n                </button>\r\n            </td>\r\n\r\n            <!-- action generate pass -->\r\n            <td *ngIf=\"actionGeneratePassword\">\r\n                <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n                    <i class=\"fa-solid fa-key\"></i>\r\n                </button>\r\n            </td>\r\n\r\n            <!-- action copy pass -->\r\n            <td *ngIf=\"actionCopy\">\r\n                <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n                    <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n                    <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n                </button>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiInputPasswordComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tcloud-ui-input-password', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], template: "<div class=\"tcloud-ui-input-password\">\r\n    <table>\r\n        <tr>\r\n            <!-- input password -->\r\n            <td>\r\n                <form #_form=\"ngForm\">\r\n                    <ng-container *ngIf=\"passwordRegex\">\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n                    </ng-container>\r\n                </form>\r\n            </td>\r\n\r\n            <!-- action show hide -->\r\n            <td>\r\n                <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n                    <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n                    <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n                </button>\r\n            </td>\r\n\r\n            <!-- action generate pass -->\r\n            <td>\r\n                <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n                    <i class=\"fa-solid fa-key\"></i>\r\n                </button>\r\n            </td>\r\n\r\n            <!-- action copy pass -->\r\n            <td>\r\n                <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n                    <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n                    <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n                </button>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { numberOfCharacter: [{
+            args: [{ selector: 'tcloud-ui-input-password', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], template: "<div class=\"tcloud-ui-input-password\">\r\n    <table>\r\n        <tr>\r\n            <!-- input password -->\r\n            <td>\r\n                <form #_form=\"ngForm\">\r\n                    <ng-container *ngIf=\"passwordRegex\">\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n                        <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n                    </ng-container>\r\n                </form>\r\n            </td>\r\n\r\n            <!-- action show hide -->\r\n            <td *ngIf=\"actionView\">\r\n                <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n                    <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n                    <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n                </button>\r\n            </td>\r\n\r\n            <!-- action generate pass -->\r\n            <td *ngIf=\"actionGeneratePassword\">\r\n                <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n                    <i class=\"fa-solid fa-key\"></i>\r\n                </button>\r\n            </td>\r\n\r\n            <!-- action copy pass -->\r\n            <td *ngIf=\"actionCopy\">\r\n                <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n                    <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n                    <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n                </button>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { actionView: [{
+                type: Input
+            }], actionCopy: [{
+                type: Input
+            }], actionGeneratePassword: [{
+                type: Input
+            }], numberOfCharacter: [{
                 type: Input
             }], atLeastOneUppercaseLetter: [{
                 type: Input
@@ -5264,7 +5318,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     ],
                     exports: [
                         TCloudUiInputPasswordComponent
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });
 
@@ -5373,7 +5428,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     exports: [TCloudUiProgressBarComponent],
                     imports: [
                         CommonModule
-                    ]
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA]
                 }]
         }] });