@dev-tcloud/tcloud-ui 2.2.3 → 2.2.4

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-accordion/tcloud-ui-accordion.component.html

@@ -1,3 +0,0 @@
-<div class="tcloud-ui-accordion tc-accordion" [class.tc-accordion-disabled]="disabled">
-    <ng-content></ng-content>
-</div>

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-accordion/tcloud-ui-accordion.component.ts

@@ -1,77 +0,0 @@
-import { Subscription } from 'rxjs';
-import { Component, EventEmitter, Input, OnInit, Output, OnDestroy } from '@angular/core';
-import { TCloudUiAccordionService } from './services/tcloud-ui-accordion.service';
-
-@Component({
-  selector: 'tcloud-ui-accordion',
-  templateUrl: './tcloud-ui-accordion.component.html',
-  styleUrls: ['./tcloud-ui-accordion.component.css'],
-  providers: [
-    TCloudUiAccordionService
-  ],
-})
-export class TCloudUiAccordionComponent implements OnInit, OnDestroy {
-
-  subscription_01: Subscription | undefined;
-  subscription_02: Subscription | undefined;
-  
-  private _disabled: boolean = false;
-  @Input() set disabled(v: boolean){  
-    this._disabled = v;
-    if( this._disabled ){      
-      setTimeout(() => { 
-        this._tCloudUiAccordionService.setDisabled(this._disabled);
-        this._tCloudUiAccordionService.toggle(false); 
-      });
-    }
-  }
-  get disabled(){ return this._disabled; }
-
-
-  private _show: boolean = false;
-  @Input() set show(v: boolean){    
-    if( this._show !== v ){
-      this._show = v;
-      if( !this.disabled ){
-        setTimeout(() => { this._tCloudUiAccordionService.toggle(this._show); }); 
-      }           
-    }
-  }
-
-  get show(){ return this._show; }
-
-
-  @Output() onAction = new EventEmitter<'open'|'close'>();
-
-  private _loading: boolean = false;
-  /**
-   * loading - boolean - Coloca o modal em modo de carregamento - default false
-   */
-  @Input() set loading(loading: boolean){ 
-    this._loading = loading;
-    this._tCloudUiAccordionService.setLoading(loading);
-  }
-  get loading(): boolean { return this._loading; }
-
-  constructor(
-    private _tCloudUiAccordionService: TCloudUiAccordionService
-  ) { }
-
-  ngOnInit(): void {
-
-    this.subscription_01 = this._tCloudUiAccordionService.stateLoading$.subscribe((loading: boolean) => {
-      this.loading = loading;      
-    });
-    
-    this.subscription_02 = this._tCloudUiAccordionService.stateToggle$.subscribe((show: boolean) => {
-      this.onAction.emit( (show === true) ? 'open' : 'close' );
-    })
-
-  }
-
-  ngOnDestroy(): void {
-    if( this.subscription_01 ){ this.subscription_01.unsubscribe(); }
-    if( this.subscription_02 ){ this.subscription_02.unsubscribe(); }
-  }
-
-}

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-accordion/tcloud-ui-accordion.module.ts

@@ -1,25 +0,0 @@
-import { CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { TCloudUiAccordionComponent } from './tcloud-ui-accordion.component';
-import { TCloudUiAccordionTitleComponent } from './components/tcloud-ui-accordion-title/tcloud-ui-accordion-title.component';
-import { TCloudUiAccordionBodyComponent } from './components/tcloud-ui-accordion-body/tcloud-ui-accordion-body.component';
-
-
-
-@NgModule({
-  declarations: [
-    TCloudUiAccordionComponent,
-    TCloudUiAccordionTitleComponent,
-    TCloudUiAccordionBodyComponent
-  ],
-  exports: [
-    TCloudUiAccordionComponent,
-    TCloudUiAccordionTitleComponent,
-    TCloudUiAccordionBodyComponent
-  ],
-  imports: [
-    CommonModule
-  ],
-  schemas: [ CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA ]
-})
-export class TCloudUiAccordionModule { }

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-choice-issues/tcloud-ui-choice-issues.component.html

@@ -1,42 +0,0 @@
-<div class="tcloud-ui-choice-issues box p-2 mt-3 mb-2">
-  <input #campo [(ngModel)]="value" type="hidden" [value]="false" >
-  <div class="row">
-    <div class="col-md-8">
-      <p class="titulo">{{ titulo }}</p>      
-    </div>
-    <div class="col-md-4 text-right">  
-
-      <table class="mt-2 mr-2" *ngIf="!view" >
-        <tr>
-          <td>
-            <div class="form-fieldset">
-              <label [class.v-true]="value" class="mr-1"><input #campo name="{{ ID }}" [value]="true" type="radio" [(ngModel)]="value" (click)="setV(true)" >Sim</label>
-            </div>
-          </td>
-          <td>
-            <div class="form-fieldset">
-              <label [class.v-true]="!value" class="ml-2"><input #campo name="{{ ID }}" [value]="false" type="radio" [(ngModel)]="value" (click)="setV(false)" >Não</label>
-            </div>
-          </td>
-        </tr>
-      </table>    
-
-      <table class="mt-2 mr-2" *ngIf="view" >
-        <tr>
-          <td>
-            <div class="form-fieldset view" >
-              <label *ngIf="value" class="v-true disabled" >Sim</label>
-              <label *ngIf="!value">Não</label>
-            </div>
-          </td>
-        </tr>
-      </table>
-    </div>
-    <div class="col-md-12 mt-1">
-      <p class="sub-titulo">{{ subTitulo }}</p>
-    </div>
-    <div class="col-md-12 mt-2 mb-1">
-      <ng-content></ng-content>
-    </div>
-  </div>
-</div>

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-choice-issues/tcloud-ui-choice-issues.component.scss

@@ -1,88 +0,0 @@
-// ------------------------------------
-// Colors
-// ------------------------------------
-$green: var(--tc-primary);
-$gray: var(--cinza);
-$gray2: var(--cinza2);
-$gray3: var(--cinza3);
-$gray4: var(--cinza4);
-$gray5: var(--cinza5);
-$red: var(--red);
-
-.titulo{
-  font-size: 1rem;
-  color: $gray;
-}
-.sub-titulo{
-  color: #b0adaa;
-}
-
-.box {
-  border: 1px solid $gray3;
-  border-radius: 10px;
-
-  &.box-icon {
-    display: flex;
-    justify-content: center;
-    padding: 35px 20px;
-  }
-}
-
-.form-fieldset {
-  
-
-  input {
-    display: none;
-  }
-
-  .v-true{
-    background: $green;
-    color: white;
-  }
-
-  label {
-    font-size: 11px;
-    background: $gray4;
-    cursor: pointer;
-    position: relative;
-    display: inline-flex;
-    align-items: center;
-    justify-content: space-around;
-    text-transform: uppercase;
-    border-radius: 30px;
-    padding: 7px;
-    margin: 0;
-    width: 66px;
-
-    &:before {
-      content: '';
-      background: #fff;
-      border-radius: 50%;
-      height: 15px;
-      width: 15px;
-    }
-
-    &:nth-child(2) {
-      margin-right: 20px;
-    }
-  }
-}
-
-table{
-  width: 100%;
-  max-width: 200px;
-
-  th, td{
-    vertical-align: top;
-  }
-}
-.view{
-  cursor: inherit !important;
-  label{
-    cursor: inherit !important;
-  }
-}
-
-.disabled{
-  background-color: #8fdfe8 !important;
-}

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-choice-issues/tcloud-ui-choice-issues.component.ts

@@ -1,94 +0,0 @@
-import { Subscription } from 'rxjs';
-import { Component, EventEmitter, Input, forwardRef, ViewChild, ElementRef, Output } from '@angular/core';
-import { NG_VALUE_ACCESSOR } from '@angular/forms';
-
-const CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR: any = {
-  provide: NG_VALUE_ACCESSOR,
-  useExisting: forwardRef(() => TCloudUiChoiceIssuesComponent),
-  multi: true
-};
-
-const noop = () => {
-};
-
-@Component({
-  selector: 'tcloud-ui-choice-issues',
-  templateUrl: './tcloud-ui-choice-issues.component.html',
-  styleUrls: ['./tcloud-ui-choice-issues.component.scss'],
-  providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR]
-})
-export class TCloudUiChoiceIssuesComponent {
-
-    
-  @Input() view: boolean = false;
-  @Input() titulo: string = '';
-  @Input() subTitulo: string = '';
-
-  @Input() disabled: boolean = false;
-  @Output() onChange = new EventEmitter<any>();
-
-  subscription: Subscription | undefined;
-  // Referencia o campo (input,select,textarea)
-  @ViewChild('campo',{ read: true, static: false })  inputRef: ElementRef | undefined;
-
-  innerValue: boolean = false;
-
-  ID: string;
-
-  constructor(){
-    this.ID = 'tc-issue-' + Math.random().toString(36).substr(2, 9);
-  }
-  //Placeholders for the callbacks which are later providesd
-    //by the Control Value Accessor
-    private onTouchedCallback: () => void = noop;
-    private onChangeCallback: (_: any) => void = noop;
-
-    //get accessor
-    get value(): boolean {
-        return this.innerValue;
-    };
-
-    //set accessor including call the onchange callback
-    set value(v: boolean) {
-        if (v !== this.innerValue) {
-            this.innerValue = v;
-            this.onChangeCallback(v);
-        }
-    }
-
-    //Set touched on blur
-    onBlur() {
-        this.onTouchedCallback();
-    }
-
-    //From ControlValueAccessor interface
-    writeValue(value: any) {
-        if (value !== this.innerValue) {
-            this.innerValue = value;
-        }
-    }
-
-    //From ControlValueAccessor interface
-    registerOnChange(fn: any) {
-        this.onChangeCallback = fn;
-    }
-
-    //From ControlValueAccessor interface
-    registerOnTouched(fn: any) {
-        this.onTouchedCallback = fn;
-    }
-
-    setV(v: any){
-        this.value = v;
-        this.onChange.emit(v);
-    }
-
-    createID() {
-        // Math.random should be unique because of its seeding algorithm.
-        // Convert it to base 36 (numbers + letters), and grab the first 9 characters
-        // after the decimal.
-        return '_' + Math.random().toString(36).substr(2, 9);
-    }
-
-
-}

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-choice-issues/tcloud-ui-choice-issues.module.ts

@@ -1,22 +0,0 @@
-import { CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { TCloudUiChoiceIssuesComponent } from './tcloud-ui-choice-issues.component';
-
-
-
-@NgModule({
-  declarations: [
-    TCloudUiChoiceIssuesComponent,
-  ],
-  exports: [
-    TCloudUiChoiceIssuesComponent,
-  ],
-  imports: [
-    CommonModule,
-    FormsModule,
-    ReactiveFormsModule
-  ],
-  schemas: [ CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA]
-})
-export class TCloudUiChoiceIssuesModule { }

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-data-list/services/data-list.service.ts

@@ -1,42 +0,0 @@
-import { Injectable } from '@angular/core';
-import { Observable, Subject } from 'rxjs';
-
-@Injectable()
-export class DataListService {
-  private _stateSourceValue: Subject<any> = new Subject<any>();
-  public stateValue$: Observable<Subject<any>> = this._stateSourceValue.asObservable();
-
-  private _stateSourceDescription: Subject<any> = new Subject<any>();
-  public stateDescription$: Observable<Subject<any>> = this._stateSourceDescription.asObservable();
-
-  private _stateSourceOptions: Subject<any> = new Subject<any>();
-  public stateOptions$: Observable<Subject<any>> = this._stateSourceOptions.asObservable();
-
-  private _stateSourceActive: Subject<any> = new Subject<any>();
-  public stateActive$: Observable<Subject<any>> = this._stateSourceActive.asObservable();
-
-  private actived_value: any | undefined;
-
-  public setItemValue(v: any): void {
-    this.actived_value = v;
-    this._stateSourceValue.next(v);
-  }
-
-  public setItemDescription(v: any): void {
-    this._stateSourceDescription.next(v);
-  }
-
-  public registerSelectionOptionsDescription(v: any): void {
-    this._stateSourceOptions.next(v);
-  }
-
-  public setActiveItem(v: any): void {
-    this._stateSourceActive.next(v);   
-  }
-
-  public getActiveItem(): any {
-    // console.log('getActiveItem', this.actived_value);
-    return this.actived_value;
-  }
- 
-}

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-data-list/tcloud-ui-data-list-option/tcloud-ui-data-list-option.component.html

@@ -1,15 +0,0 @@
-<button 
-  [disabled]="disabled"
-  [title]="select_options.description"
-  id="{{id}}"
-  [attr.data-description]="select_options.description"
-  [attr.data-actived-value]="actived_value"
-  class="tcloud-ui-data-list-option dropdown-item" 
-  [class.null-value]="value === undefined || value === null || value === ''"
-  [class.active]="value === actived_value" 
-  [class.option-disabled]="disabled"
-  type="button" 
-  [value]="value"
-  (click)="setSelectedItem(value)" >
-  <ng-content></ng-content>
-</button>

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-data-list/tcloud-ui-data-list-option/tcloud-ui-data-list-option.component.scss

@@ -1,31 +0,0 @@
-button{
-  color: #666;
-  width: 100%;
-
-  padding: 10px;
-  font-size: 14px;
-
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-}
-
-button:hover{
-  background-color: #e5f5f9;
-  color: #333;
-}
-
-button.active{
-  background-color: #ceedf5;
-  color: #333;
-}
-
-.null-value{
-  height: 35px;
-}
-
-.option-disabled{
-  background-color: #fff !important;
-  color: #b5b5b5 !important;
-  cursor: not-allowed !important;
-}

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-data-list/tcloud-ui-data-list-option/tcloud-ui-data-list-option.component.ts

@@ -1,65 +0,0 @@
-import { OnDestroy } from '@angular/core';
-import { ISelectOptions } from './../tcloud-ui-data-list';
-import { Component, Input, OnInit, Output, EventEmitter } from '@angular/core';
-import { DataListService } from '../services/data-list.service';
-import { Subscription } from 'rxjs';
-
-@Component({
-  selector: 'tcloud-ui-data-list-option',
-  templateUrl: './tcloud-ui-data-list-option.component.html',
-  styleUrls: ['./tcloud-ui-data-list-option.component.scss']
-})
-export class TCloudUiDataListOptionComponent implements OnInit, OnDestroy {
-
-  id: string = '';  
-  actived_value: any;
-  select_options = new ISelectOptions();
-  private subscription_active: Subscription | undefined;
-
-  @Input() disabled: boolean | undefined = false;
-  @Input() value: any | undefined;
-
-  @Output() selected = new EventEmitter<any>();  
-
-  constructor( private dataListService: DataListService ) { 
-  }
-
-  ngOnInit(): void {
-    this.actived_value = this.dataListService.getActiveItem();
-    this.subscription_active = this.dataListService.stateActive$.subscribe(v => { 
-      this.actived_value = v; 
-    });
-    this.id = this.generateID();
-    this.setSelectOptions();
-  }
-
-  generateID(): string{
-    return `data-list-option-${Math.floor(Math.random() * Math.floor(Math.random() * Date.now()))}`;
-  }
-
-  setSelectedItem(value: any){
-    if( this.disabled ){ return; }
-    if( value === '' ){ this.value = ''; }    
-
-    this.dataListService.setItemValue(this.value);
-    const description = <any> document.getElementById(this.id)?.innerText || '';
-    this.dataListService.setItemDescription(description);
-    this.setSelectOptions();    
-  }
-
-  setSelectOptions(){
-    setTimeout(() => {
-      try {
-        const description = <any> document.getElementById(this.id)?.innerText;
-        this.select_options.value = this.value;
-        this.select_options.description = description;  
-        this.dataListService.registerSelectionOptionsDescription(this.select_options);
-      } catch (error) { }
-    });    
-  }
-
-  ngOnDestroy() {
-    if( this.subscription_active ){ this.subscription_active.unsubscribe(); }    
-  }
-
-}

package/projects/tcloud-ui/src/lib/_modules/tcloud-ui-data-list/tcloud-ui-data-list.component.html

@@ -1,58 +0,0 @@
-<div *ngIf="formulario" id="area-{{ id }}" class="tcloud-ui-data-list tc-dropdown" [class.disabled]="disabled || loading">
-  <div *ngIf="loading" class="loading-area">
-    <i class="fas fa-spinner fa-spin"></i>
-  </div>
-  <!-- [attr.data-bs-toggle]="'dropdown'"  -->
-  <button 
-    #_option
-    [class.input-hidden]="!showInput"
-    [class.in-border]="border"
-    [class.loading-box]="loading"
-    [disabled]="disabled || loading"
-    class="dropdown-toggle button-select no-margin-bottom" 
-    type="button" 
-    id="{{ id }}" 
-    
-    [attr.aria-haspopup]="'true'" 
-    [attr.aria-expanded]="'false'" 
-    (click)="toOpen();toInput(_option)" >
-
-    <i class="tc-placeholder" *ngIf="(selected_description === undefined || selected_description === null || selected_description === '' ) && !loading ">{{ placeholder }}</i>
-    {{ selected_description }}
-    <span><i class="fas fa-angle-down"></i></span>
-  </button>
-  <div class="tc-dropdown-menu {{ menu_on_top }}" id="box-{{ id }}" [attr.aria-labelledby]="id" [class.to-hide]="!menu_show" [style]="box_style">
-
-    <div class="line-search" *ngIf="search">
-      <table class="box-search">
-        <tr>
-
-          <td class="area-input">
-            <input type="text" class="tc-form-control" [(ngModel)]="search_text" (input)="toSearch($event)" placeholder="Buscar..." >            
-          </td>
-
-          <td class="area-icon">
-            <i *ngIf="search_text === ''" class="fas fa-search icon-search"></i>
-            <button type="button" *ngIf="search_text !== ''" (click)="clearTextSearch()"><i class="fas fa-times"></i></button>
-          </td>
-          
-        </tr>
-      </table>
-    </div>
-    
-    <div class="area-options" id="{{ id }}-options" (click)="toClose()">
-      <ng-content></ng-content>  
-      <ng-container *ngIf="listItems && (listItems).length > 0">
-        <ng-container *ngFor="let item of listItems">
-          <tcloud-ui-data-list-option [value]="item.value" [disabled]="item?.disabled" >{{ item?.description }}</tcloud-ui-data-list-option>
-          </ng-container>
-      </ng-container>    
-    </div>
-  </div>
-</div>
-
-<div *ngIf="formulario">
-  <form [formGroup]="formulario" style="display: none;" >
-    <input id="{{ id }}-hidden" formControlName="selected_item" type="hidden">
-  </form>
-</div>