@dev-tcloud/tcloud-ui 0.0.65 → 0.0.67

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3543,10 +3543,10 @@ class TCloudUiFiltersComponent {
3543
3543
  }
3544
3544
  }
3545
3545
  TCloudUiFiltersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiFiltersComponent, deps: [{ token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Component });
3546
- 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" }, 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=\"area-filter\">\n <ng-container *ngFor=\"let item of filters; let i = index\">\n\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\n \n <div class=\"box-filter-input type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <tcloud-ui-datepicker-time #_input [(ngModel)]=\"item.value\" name=\"input_{{i+1}}\" (eventChange)=\"searchIn(item, _input, 'teste')\" ></tcloud-ui-datepicker-time>\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 = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div> \n </ng-container>\n \n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <input \n #_input\n [(ngModel)]=\"item.value\"\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \n class=\"form-control tc-form-control\" \n (keyup)=\"searchIn(item, $event)\"> \n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <select \n #_input\n [(ngModel)]=\"item.value\"\n name=\"input_{{i+1}}\" \n class=\"form-control tc-form-control\" \n (change)=\"searchIn(item, $event)\">\n <option [ngValue]=\"\"></option>\n <ng-container *ngFor=\"let v of item.data\">\n <option [value]=\"v.value\">{{ v.description }}</option>\n </ng-container>\n </select>\n <!-- <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button> -->\n </div>\n </ng-container>\n\n </div>\n\n\n \n </ng-container>\n\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\n \n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div class=\"area-input-checkbox\">\n <div class=\"form-control tc-form-control\">\n <label>\n {{ item.placeholder }}\n <input \n #_input\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"checkbox\" \n (change)=\"searchIn(item, _input.checked)\"> \n </label>\n </div> \n </div>\n </div>\n\n </ng-container>\n\n\n </ng-container>\n\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\n </div>\n\n</div>\n\n<!-- <pre>{{ inputs | json }}</pre> -->\n <!-- <pre> {{ data | json }} </pre>\n\n<p>FILTERS</p>\n<pre> {{ filters | json }}</pre> -->", 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(--verde)}.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}.type-hidden{display:none;width:0px!important}\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.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"], outputs: ["ngModelChange", "onChange", "eventChange"] }] });
3546
+ 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" }, 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=\"area-filter\">\n <ng-container *ngFor=\"let item of filters; let i = index\">\n\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\n \n <div class=\"box-filter-input type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <tcloud-ui-datepicker-time #_input [(ngModel)]=\"item.value\" name=\"input_{{i+1}}\" (eventChange)=\"searchIn(item, _input, 'teste')\" ></tcloud-ui-datepicker-time>\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 = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div> \n </ng-container>\n \n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <input \n #_input\n [(ngModel)]=\"item.value\"\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \n class=\"form-control tc-form-control\" \n (keyup)=\"searchIn(item, $event)\"> \n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <select \n #_input\n [(ngModel)]=\"item.value\"\n name=\"input_{{i+1}}\" \n class=\"form-control tc-form-control\" \n (change)=\"searchIn(item, $event)\">\n <option [ngValue]=\"\"></option>\n <ng-container *ngFor=\"let v of item.data\">\n <option [value]=\"v.value\">{{ v.description }}</option>\n </ng-container>\n </select>\n <!-- <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button> -->\n </div>\n </ng-container>\n\n </div>\n\n\n \n </ng-container>\n\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\n \n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div class=\"area-input-checkbox\">\n <div class=\"form-control tc-form-control\">\n <label>\n {{ item.placeholder }}\n <input \n #_input\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"checkbox\" \n (change)=\"searchIn(item, _input.checked)\"> \n </label>\n </div> \n </div>\n </div>\n\n </ng-container>\n\n\n </ng-container>\n\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\n </div>\n\n</div>\n\n<!-- <pre>{{ inputs | json }}</pre> -->\n <!-- <pre> {{ data | json }} </pre>\n\n<p>FILTERS</p>\n<pre> {{ filters | json }}</pre> -->", 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(--verde)}.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}.type-hidden{display:none;width:0px!important}\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.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"], outputs: ["ngModelChange", "onChange", "eventChange"] }] });
3547
3547
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiFiltersComponent, decorators: [{
3548
3548
  type: Component,
3549
- args: [{ selector: 'tcloud-ui-filters', template: "<div *ngIf=\"show_filters\" class=\"area-filter\">\n <ng-container *ngFor=\"let item of filters; let i = index\">\n\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\n \n <div class=\"box-filter-input type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <tcloud-ui-datepicker-time #_input [(ngModel)]=\"item.value\" name=\"input_{{i+1}}\" (eventChange)=\"searchIn(item, _input, 'teste')\" ></tcloud-ui-datepicker-time>\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 = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div> \n </ng-container>\n \n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <input \n #_input\n [(ngModel)]=\"item.value\"\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \n class=\"form-control tc-form-control\" \n (keyup)=\"searchIn(item, $event)\"> \n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <select \n #_input\n [(ngModel)]=\"item.value\"\n name=\"input_{{i+1}}\" \n class=\"form-control tc-form-control\" \n (change)=\"searchIn(item, $event)\">\n <option [ngValue]=\"\"></option>\n <ng-container *ngFor=\"let v of item.data\">\n <option [value]=\"v.value\">{{ v.description }}</option>\n </ng-container>\n </select>\n <!-- <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button> -->\n </div>\n </ng-container>\n\n </div>\n\n\n \n </ng-container>\n\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\n \n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div class=\"area-input-checkbox\">\n <div class=\"form-control tc-form-control\">\n <label>\n {{ item.placeholder }}\n <input \n #_input\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"checkbox\" \n (change)=\"searchIn(item, _input.checked)\"> \n </label>\n </div> \n </div>\n </div>\n\n </ng-container>\n\n\n </ng-container>\n\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\n </div>\n\n</div>\n\n<!-- <pre>{{ inputs | json }}</pre> -->\n <!-- <pre> {{ data | json }} </pre>\n\n<p>FILTERS</p>\n<pre> {{ filters | json }}</pre> -->", 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(--verde)}.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}.type-hidden{display:none;width:0px!important}\n"] }]
3549
+ args: [{ selector: 'tcloud-ui-filters', template: "<div *ngIf=\"show_filters\" class=\"area-filter\">\n <ng-container *ngFor=\"let item of filters; let i = index\">\n\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\n \n <div class=\"box-filter-input type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <tcloud-ui-datepicker-time #_input [(ngModel)]=\"item.value\" name=\"input_{{i+1}}\" (eventChange)=\"searchIn(item, _input, 'teste')\" ></tcloud-ui-datepicker-time>\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 = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div> \n </ng-container>\n \n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local'\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <input \n #_input\n [(ngModel)]=\"item.value\"\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \n class=\"form-control tc-form-control\" \n (keyup)=\"searchIn(item, $event)\"> \n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\n <div class=\"m-description\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div>\n <select \n #_input\n [(ngModel)]=\"item.value\"\n name=\"input_{{i+1}}\" \n class=\"form-control tc-form-control\" \n (change)=\"searchIn(item, $event)\">\n <option [ngValue]=\"\"></option>\n <ng-container *ngFor=\"let v of item.data\">\n <option [value]=\"v.value\">{{ v.description }}</option>\n </ng-container>\n </select>\n <!-- <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\n <i class=\"fas fa-times\"></i>\n </button> -->\n </div>\n </ng-container>\n\n </div>\n\n\n \n </ng-container>\n\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\n \n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\n <div class=\"m-description\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i>&nbsp;{{ item.description }}</div>\n <div class=\"area-input-checkbox\">\n <div class=\"form-control tc-form-control\">\n <label>\n {{ item.placeholder }}\n <input \n #_input\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\n name=\"input_{{i+1}}\" \n type=\"checkbox\" \n (change)=\"searchIn(item, _input.checked)\"> \n </label>\n </div> \n </div>\n </div>\n\n </ng-container>\n\n\n </ng-container>\n\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\n </div>\n\n</div>\n\n<!-- <pre>{{ inputs | json }}</pre> -->\n <!-- <pre> {{ data | json }} </pre>\n\n<p>FILTERS</p>\n<pre> {{ filters | json }}</pre> -->", 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(--verde)}.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}.type-hidden{display:none;width:0px!important}\n"] }]
3550
3550
  }], ctorParameters: function () { return [{ type: i1.DatePipe }]; }, propDecorators: { _formulario: [{
3551
3551
  type: ViewChild,
3552
3552
  args: ['_formulario']
@@ -4340,19 +4340,25 @@ class TCloudUiMultiplesValuesComponent {
4340
4340
  items = (input_items).split(this.delimiter);
4341
4341
  }
4342
4342
  if ((items).length === 0) {
4343
- let txt = `${(input_items).trim()}`;
4344
- items = [txt];
4343
+ if (input_items && input_items !== '') {
4344
+ let txt = `${(input_items).trim()}`;
4345
+ items = [txt];
4346
+ }
4345
4347
  }
4346
4348
  //items = [...new Set(items)];
4347
4349
  for (let i = 0; i < (items).length; i++) {
4348
4350
  let txt = `${(items[i]).trim()}`;
4349
4351
  if (this.uppercase) {
4350
- txt = (txt).toLocaleUpperCase();
4352
+ if (txt && txt !== '') {
4353
+ txt = (txt).toLocaleUpperCase();
4354
+ }
4351
4355
  }
4352
4356
  if (this.lowercase) {
4353
- txt = (txt).toLocaleLowerCase();
4357
+ if (txt && txt !== '') {
4358
+ txt = (txt).toLocaleLowerCase();
4359
+ }
4354
4360
  }
4355
- if (txt !== '') {
4361
+ if (txt && txt !== '') {
4356
4362
  (this.items).push(txt);
4357
4363
  }
4358
4364
  }
@@ -4517,10 +4523,10 @@ class TCloudUiMultiplesValuesComponent {
4517
4523
  }
4518
4524
  }
4519
4525
  TCloudUiMultiplesValuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4520
- TCloudUiMultiplesValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiMultiplesValuesComponent, selector: "tcloud-ui-multiples-values", inputs: { delimiter: "delimiter", placeholder: "placeholder", disabled: "disabled", loading: "loading", required: "required", search: "search", uppercase: "uppercase", lowercase: "lowercase" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, CUSTOM_INPUT_VALIDATORS], ngImport: i0, template: "<div class=\"tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\n\n\n <form #_formulario=\"ngForm\">\n\n <!-- {{ input_items }} -->\n\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\n <table class=\"group-input-action\">\n <tr>\n <td class=\"box-input\">\n <div class=\"input\">\n <input \n (keydown.enter)=\"add_items();toOpen()\"\n [disabled]=\"disabled\"\n [class.text-lowercase]=\"lowercase\"\n [class.text-uppercase]=\"uppercase\"\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\n </div>\n </td>\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\n <div class=\"input\">\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>\n \n </div>\n </td>\n <td class=\"action-input-arrow\">\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\n </button>\n </td>\n <td class=\"action-input\" *ngIf=\"!disabled\">\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\n <i class=\"fas fa-plus\"></i>\n </button>\n </td>\n </tr>\n </table>\n </div>\n \n <!-- <pre>\n {{ items | json }}\n </pre> -->\n\n </form> \n\n <!-- box-itens-selected -->\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\">\n \n\n <div class=\"line-search\" *ngIf=\"search\">\n <table class=\"box-search\">\n <tr>\n \n <td class=\"area-input\">\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \n </td>\n \n <td class=\"area-icon\">\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\n </td>\n \n </tr>\n </table>\n </div>\n\n <div class=\"area-options\" id=\"{{ id }}-options\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n \n <label class=\"box-label\" [ngStyle]=\"item_width(item)\">\n <div class=\"box-value\" [title]=\"item\" >\n {{ item }} \n </div>\n <div class=\"box-action\">\n <button\n class=\"box-action\"\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\n title=\"Remover\"\n type=\"button\"\n (click)=\"removeItem(item, i)\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </label>\n\n </ng-container>\n </div>\n\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\n <div class=\"btn-remove-all\">\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\n Limpar toda a lista\n </button>\n </div>\n </div>\n\n </div>\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-left:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:#ccc!important}.group-input-action{width:100%}.group-input-action input{height:40px;border:none}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:#fff;border-bottom:1px solid #ccc;border-top:1px solid #ccc}.count-list .input input{height:40px;border:none;text-align:center;width:100px}.action-input-arrow{width:30px;background-color:#fff;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;height:42px!important;border-top:1px solid #ccc;border-right:1px solid #ccc;border-bottom:1px solid #ccc;border-left:none;width:30px;border-radius:0 3px 3px 0}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:10px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:3px;display:block;margin:0;height:40px}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important}.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(--verde);color:#fff;padding:8px 15px 10px;border:none;border-radius:5px;margin:2px;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:#d72020;background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid #ccc;background-color:#fff;position:absolute;z-index:1}.tc-dropdown .area-options{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 #ccc;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}\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: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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"] }] });
4526
+ TCloudUiMultiplesValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiMultiplesValuesComponent, selector: "tcloud-ui-multiples-values", inputs: { delimiter: "delimiter", placeholder: "placeholder", disabled: "disabled", loading: "loading", required: "required", search: "search", uppercase: "uppercase", lowercase: "lowercase" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, CUSTOM_INPUT_VALIDATORS], ngImport: i0, template: "<div class=\"tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\n\n\n <form #_formulario=\"ngForm\">\n\n <!-- {{ input_items }} -->\n\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\n <table class=\"group-input-action\">\n <tr>\n <td class=\"box-input\">\n <div class=\"input\">\n <input \n (keydown.enter)=\"add_items();toOpen()\"\n [disabled]=\"disabled\"\n [class.text-lowercase]=\"lowercase\"\n [class.text-uppercase]=\"uppercase\"\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\n </div>\n </td>\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\n <div class=\"input\">\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>\n \n </div>\n </td>\n <td class=\"action-input-arrow\">\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\n </button>\n </td>\n <td class=\"action-input\" *ngIf=\"!disabled\">\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\n <i class=\"fas fa-plus\"></i>\n </button>\n </td>\n </tr>\n </table>\n </div>\n \n <!-- <pre>\n {{ items | json }}\n </pre> -->\n\n </form> \n\n <!-- box-itens-selected -->\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\">\n \n\n <div class=\"line-search\" *ngIf=\"search\">\n <table class=\"box-search\">\n <tr>\n \n <td class=\"area-input\">\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \n </td>\n \n <td class=\"area-icon\">\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\n </td>\n \n </tr>\n </table>\n </div>\n\n <div class=\"area-options\" id=\"{{ id }}-options\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n \n <label class=\"box-label\" [ngStyle]=\"item_width(item)\">\n <div class=\"box-value\" [title]=\"item\" >\n {{ item }} \n </div>\n <div class=\"box-action\">\n <button\n class=\"box-action\"\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\n title=\"Remover\"\n type=\"button\"\n (click)=\"removeItem(item, i)\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </label>\n\n </ng-container>\n </div>\n\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\n <div class=\"btn-remove-all\">\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\n Limpar toda a lista\n </button>\n </div>\n </div>\n\n </div>\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-left:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.group-input-action{width:100%}.group-input-action input{height:40px;border:none}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:#fff;border-bottom:1px solid #ccc;border-top:1px solid #ccc}.count-list .input input{height:40px;border:none;text-align:center;width:100px}.action-input-arrow{width:30px;background-color:#fff;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;height:42px!important;border-top:1px solid #ccc;border-right:1px solid #ccc;border-bottom:1px solid #ccc;border-left:none;width:30px;border-radius:0 3px 3px 0}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:10px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:3px;display:block;margin:0;height:40px}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important}.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(--verde);color:#fff;padding:8px 15px 10px;border:none;border-radius:5px;margin:2px;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:#d72020;background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid #ccc;background-color:#fff;position:absolute;z-index:1}.tc-dropdown .area-options{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 #ccc;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}\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: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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"] }] });
4521
4527
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, decorators: [{
4522
4528
  type: Component,
4523
- args: [{ selector: 'tcloud-ui-multiples-values', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, CUSTOM_INPUT_VALIDATORS], template: "<div class=\"tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\n\n\n <form #_formulario=\"ngForm\">\n\n <!-- {{ input_items }} -->\n\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\n <table class=\"group-input-action\">\n <tr>\n <td class=\"box-input\">\n <div class=\"input\">\n <input \n (keydown.enter)=\"add_items();toOpen()\"\n [disabled]=\"disabled\"\n [class.text-lowercase]=\"lowercase\"\n [class.text-uppercase]=\"uppercase\"\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\n </div>\n </td>\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\n <div class=\"input\">\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>\n \n </div>\n </td>\n <td class=\"action-input-arrow\">\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\n </button>\n </td>\n <td class=\"action-input\" *ngIf=\"!disabled\">\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\n <i class=\"fas fa-plus\"></i>\n </button>\n </td>\n </tr>\n </table>\n </div>\n \n <!-- <pre>\n {{ items | json }}\n </pre> -->\n\n </form> \n\n <!-- box-itens-selected -->\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\">\n \n\n <div class=\"line-search\" *ngIf=\"search\">\n <table class=\"box-search\">\n <tr>\n \n <td class=\"area-input\">\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \n </td>\n \n <td class=\"area-icon\">\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\n </td>\n \n </tr>\n </table>\n </div>\n\n <div class=\"area-options\" id=\"{{ id }}-options\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n \n <label class=\"box-label\" [ngStyle]=\"item_width(item)\">\n <div class=\"box-value\" [title]=\"item\" >\n {{ item }} \n </div>\n <div class=\"box-action\">\n <button\n class=\"box-action\"\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\n title=\"Remover\"\n type=\"button\"\n (click)=\"removeItem(item, i)\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </label>\n\n </ng-container>\n </div>\n\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\n <div class=\"btn-remove-all\">\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\n Limpar toda a lista\n </button>\n </div>\n </div>\n\n </div>\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-left:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:#ccc!important}.group-input-action{width:100%}.group-input-action input{height:40px;border:none}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:#fff;border-bottom:1px solid #ccc;border-top:1px solid #ccc}.count-list .input input{height:40px;border:none;text-align:center;width:100px}.action-input-arrow{width:30px;background-color:#fff;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;height:42px!important;border-top:1px solid #ccc;border-right:1px solid #ccc;border-bottom:1px solid #ccc;border-left:none;width:30px;border-radius:0 3px 3px 0}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:10px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:3px;display:block;margin:0;height:40px}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important}.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(--verde);color:#fff;padding:8px 15px 10px;border:none;border-radius:5px;margin:2px;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:#d72020;background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid #ccc;background-color:#fff;position:absolute;z-index:1}.tc-dropdown .area-options{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 #ccc;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}\n"] }]
4529
+ args: [{ selector: 'tcloud-ui-multiples-values', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, CUSTOM_INPUT_VALIDATORS], template: "<div class=\"tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\n\n\n <form #_formulario=\"ngForm\">\n\n <!-- {{ input_items }} -->\n\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\n <table class=\"group-input-action\">\n <tr>\n <td class=\"box-input\">\n <div class=\"input\">\n <input \n (keydown.enter)=\"add_items();toOpen()\"\n [disabled]=\"disabled\"\n [class.text-lowercase]=\"lowercase\"\n [class.text-uppercase]=\"uppercase\"\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\n </div>\n </td>\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\n <div class=\"input\">\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly>\n \n </div>\n </td>\n <td class=\"action-input-arrow\">\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\n </button>\n </td>\n <td class=\"action-input\" *ngIf=\"!disabled\">\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\n <i class=\"fas fa-plus\"></i>\n </button>\n </td>\n </tr>\n </table>\n </div>\n \n <!-- <pre>\n {{ items | json }}\n </pre> -->\n\n </form> \n\n <!-- box-itens-selected -->\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\">\n \n\n <div class=\"line-search\" *ngIf=\"search\">\n <table class=\"box-search\">\n <tr>\n \n <td class=\"area-input\">\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \n </td>\n \n <td class=\"area-icon\">\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\n </td>\n \n </tr>\n </table>\n </div>\n\n <div class=\"area-options\" id=\"{{ id }}-options\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n \n <label class=\"box-label\" [ngStyle]=\"item_width(item)\">\n <div class=\"box-value\" [title]=\"item\" >\n {{ item }} \n </div>\n <div class=\"box-action\">\n <button\n class=\"box-action\"\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\n title=\"Remover\"\n type=\"button\"\n (click)=\"removeItem(item, i)\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </label>\n\n </ng-container>\n </div>\n\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\n <div class=\"btn-remove-all\">\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\n Limpar toda a lista\n </button>\n </div>\n </div>\n\n </div>\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-left:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.group-input-action{width:100%}.group-input-action input{height:40px;border:none}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:#fff;border-bottom:1px solid #ccc;border-top:1px solid #ccc}.count-list .input input{height:40px;border:none;text-align:center;width:100px}.action-input-arrow{width:30px;background-color:#fff;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;height:42px!important;border-top:1px solid #ccc;border-right:1px solid #ccc;border-bottom:1px solid #ccc;border-left:none;width:30px;border-radius:0 3px 3px 0}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:10px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:3px;display:block;margin:0;height:40px}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important}.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(--verde);color:#fff;padding:8px 15px 10px;border:none;border-radius:5px;margin:2px;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:#d72020;background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid #ccc;background-color:#fff;position:absolute;z-index:1}.tc-dropdown .area-options{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 #ccc;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}\n"] }]
4524
4530
  }], ctorParameters: function () { return []; }, propDecorators: { delimiter: [{
4525
4531
  type: Input
4526
4532
  }], placeholder: [{