keevo-components 1.8.541 → 1.8.543

package/src/lib/components/kv-page-stepper/kv-page-stepper.component.ts

@@ -1,223 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  EventEmitter,
-  Injector,
-  Input,
-  OnInit,
-  Output
-} from '@angular/core';
-import { ActionItem } from '../../api/components/table/action-item';
-import { FormBuilder, FormGroup } from '@angular/forms';
-import { KvStepperPanel } from '../../api/components/stepper/kv-stepperpanel';
-
-@Component({
-  selector: 'kv-page-stepper',
-  templateUrl: './kv-page-stepper.component.html',
-  styleUrl: './kv-page-stepper.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class KvPageStepperComponent implements OnInit {
-
-
-
-
-
-  /**
-   * Propiedade que recebe uma lista de painies
-   */
-  @Input() panels: KvStepperPanel[] = [];
-
-  // @Input() templatePanelsHeaders: KvStepperPanel[] = [];
-
-
-  /**
-   * Propiedade que define o stepper ativo no momento
-   */
-  @Input() activeStep: number = 0;
-
-  /**
-   * Propiedade que define a forma
-   */
-  @Input() orientation: 'vertical' | 'horizontal' = 'horizontal';
-  @Input() linear: boolean = false;
-
-    /**
-   * Dispara o evento para atualização da propiedade aciveStep
-   * @param event evento
-   */
-  @Output() activeStepChange = new EventEmitter<number>();
-  // @Output() concluirCallback = new EventEmitter<void>();
-
-  onActiveStepChange(step: number) {
-    this.activeStep = step;
-    this.activeStepChange.emit(step);
-  }
-
-  assignIdsToPanels() {
-    this.panels.forEach((panel, index) => {
-      panel.id = index;
-    });
-  }
-
-
-
-  createInjector(data: any) {
-    return Injector.create({
-      providers: [
-        { provide: 'inputData', useValue: data }
-      ]
-    });
-  }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-  /**
-   * Configurações do formulário
-   */
-  @Input() formGroup: FormGroup = new FormGroup({});
-  @Input() TituloForm: string | undefined = '';
-  @Input() SubTituloForm: string | undefined = '';
-  @Input() isSaveLoading!: boolean;
-  @Input() popup: boolean = false;
-  @Input() locationUseComponent: 'page' | 'dialog' = 'dialog';
-  // @Input() expandMenu!: boolean;
-
-  /**
-   * Botão cancelar
-   */
-  @Input() iconBtnCancel: string = 'pi pi-fw pi-times';
-  @Input() showBtnCancel: boolean = true;
-  @Input() txtBtnCancel: string = "Cancelar";
-
-  // /**
-  //  * Botão de cancelar com opções
-  //  */
-  // @Input() actionsCancelToogle!: ActionItem[];
-  // @Input() iconBtnCancelToogle: string = "pi pi-chevron-down";
-  // @Input() showBtnCancelToogle: boolean = false;
-  // @Input() txtBtnCancelToogle: string = "Cancelar";
-
-  /**
-   * Botão salvar
-   */
-  @Input() iconBtnSave: string = 'pi pi-save';
-  @Input() showBtnSave: boolean = true;
-  @Input() txtBtnSave: string = "Salvar";
-  @Input() disableBtnSave: boolean = false;
-
-  // /**
-  //  * Botão de salvar com opções
-  //  */
-  // @Input() actionsSaveToogle!: ActionItem[];
-  // @Input() iconBtnSaveToogle: string = "pi pi-chevron-down";
-  // @Input() showBtnSaveToogle: boolean = false;
-  // @Input() txtBtnSaveToogle: string = "Ações";
-
-  // /**
-  //  * Botão genérico com opções
-  //  */
-  // @Input() actionsToogle!: ActionItem[];
-  // @Input() iconBtnToogle: string = "pi pi-chevron-down";
-  // @Input() showBtnToogle: boolean = false;
-  // @Input() txtBtnToogle: string = "Ações";
-  // @Input() disableBtnToogle: boolean = false;
-  // @Input() positionBtnToogle: string = 'end';
-  // @Input() classBtnToogle: string = 'bg-glue-500';
-
-  /**
-   * Botão fechar
-   */
-  @Input() disableBtnSair: boolean = true;
-
-  /**
-   * Salvar dados
-   */
-  @Output() onSave: EventEmitter<any> = new EventEmitter();
-
-  /**
-   * Cancelar
-   */
-  @Output() onCancel: EventEmitter<any> = new EventEmitter();
-
-  constructor(private fb: FormBuilder) {
-    this.assignIdsToPanels();
-   }
-
-  /**
-   * Adiciona sub-título à tela
-   */
-  addSubTitle() {
-    if (this.SubTituloForm) {
-      const headerElement = document.querySelector('.p-dialog .p-dialog-header');
-      if (headerElement) {
-        const subtitleElement = document.createElement('span');
-        subtitleElement.textContent = this.SubTituloForm;
-        subtitleElement.style.fontSize = '0.75rem'
-        subtitleElement.style.width = '100%'
-        subtitleElement.style.marginLeft = '2px'
-
-        headerElement.appendChild(subtitleElement);
-      }
-    }
-  }
-
-  ngOnInit() {
-    this.addSubTitle();
-    this.setPageFormContainerAttributes();
-  }
-
-  /**
-   * Dispara o método de cancelamento da tela
-   * @param event evento
-   */
-  cancel(event: Event) {
-    this.onCancel.emit(event);
-  }
-
-  /**
-   * Dispara o método de salvar da tela
-   * @param event evento
-   */
-  save(event: Event) {
-    this.onSave.emit(event);
-  }
-
-  /**
-   * Ajusta o tamanho da tela considerando o menu lateral
-   */
-  setPageFormContainerAttributes() {
-    if (this.locationUseComponent == 'page') {
-      var form = document.getElementById('page-form-container');
-
-      if (form) {
-        var widthFull = form.clientWidth;
-        var widthAdjusted;
-
-        widthAdjusted = widthFull - 332
-
-      }
-    }
-
-
-  }
-}

package/src/lib/components/kv-page-stepper/kv-page-stepper.module.ts

@@ -1,34 +0,0 @@
-import { CommonModule } from "@angular/common";
-import { NgModule } from "@angular/core";
-
-import {
-    FormsModule,
-    ReactiveFormsModule
-} from "@angular/forms";
-
-
-
-import { KvPageStepperComponent } from "./kv-page-stepper.component";
-import { PrimeNgModule } from "../../api/modules/primeng.module";
-import { KvButtonsModule } from "../kv-buttons/kv-button.module";
-import { KvStepperModule } from "../kv-stepper/kv-stepper.module";
-import { DirectiveModule } from "../../api/directives/directives.module";
-
-@NgModule({
-    declarations: [
-      KvPageStepperComponent,
-    ],
-    imports: [
-        CommonModule,
-        FormsModule,
-        PrimeNgModule,
-        KvButtonsModule,
-        ReactiveFormsModule,
-        KvStepperModule,
-        DirectiveModule
-    ],
-    exports: [
-      KvPageStepperComponent
-    ]
-})
-export class KvPageStepperodule { }

package/src/lib/components/kv-pick-list/kv-pick-list.component.html

@@ -1,31 +0,0 @@
-<p-pickList
-  [source]="source"
-  [sourceHeader]="sourceHeader"
-  [sourceStyle]="sourceStyle"
-  [target]="target"
-  [targetHeader]="targetHeader"
-  [targetStyle]="targetStyle"
-  [dragdrop]="dragdrop"
-  [responsive]="responsive"
-  [filterBy]="filterBy"
-  [breakpoint]="breakpoint"
-  [stripedRows]="stripedRows"
-  [showSourceControls]="showSourceControls"
-  [showTargetControls]="showTargetControls"
-  (onMoveToSource)="OnMoveToSource($event)"
-  (onMoveToTarget)="OnMoveToTarget($event)"
-  (onMoveAllToSource)="OnMoveAllToSource($event)"
-  (onMoveAllToTarget)="OnMoveAllToTarget($event)"
-  (onSourceSelect)="OnSourceSelect($event)"
-  (onTargetSelect)="OnTargetSelect($event)"
->
-  <ng-template  let-item pTemplate="item" *ngIf="itemTemplate">
-      <div (click)="selectCheckBox(item)" class="flex mr-5">
-      <ng-container [ngTemplateOutlet]="itemTemplate" [ngTemplateOutletContext]="{ $implicit: item }">
-        @if(showCheckBox){
-            <kv-check (onCheckChange)="selectCheckBox(item)" [(ngModel)]="selectedItems[item[itemIdField]]" class="mr-1"></kv-check>
-        }
-        </ng-container>
-    </div> 
-  </ng-template>
-</p-pickList>

package/src/lib/components/kv-pick-list/kv-pick-list.component.scss

@@ -1,19 +0,0 @@
-:host ::ng-deep  .p-picklist .p-picklist-filter-container {
-  position: sticky !important;
-    top: 0 !important;
-    z-index: 99 !important;
-}
-
-:host ::ng-deep .p-picklist .p-picklist-filter-container {
-  border-left: 0px;
-  border-right: 0px ;
-}
-
-.item-with-checkbox {
-  display: flex;
-  align-items: center;
-}
-
-.item-with-checkbox kv-check {
-  margin-right: 8px; /* Ajuste a distância entre o checkbox e o conteúdo */
-}

package/src/lib/components/kv-pick-list/kv-pick-list.component.spec.ts

@@ -1,26 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { KvPickListComponent } from './kv-pick-list.component';
-
-describe('PickListComponent', () => {
-  let component: KvPickListComponent;
-  let fixture: ComponentFixture<KvPickListComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ KvPickListComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(KvPickListComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/kv-pick-list/kv-pick-list.component.ts

@@ -1,130 +0,0 @@
-import {
-  Component,
-  EventEmitter,
-  Input,
-  OnInit,
-  Output,
-  TemplateRef,
-  ViewChild
-} from '@angular/core';
-import { FormBuilder, FormGroup } from '@angular/forms';
-import { PickList } from 'primeng/picklist';
-
-@Component({
-  selector: 'kv-picklist',
-  templateUrl: './kv-pick-list.component.html',
-  styleUrls: [
-    './kv-pick-list.component.scss',
-    '../keevo-components-styles.scss'
-  ]
-})
-export class KvPickListComponent implements OnInit {
-
-  @ViewChild(PickList) picklist!: PickList;
-
-  form!: FormGroup;
-
-  constructor(private fb: FormBuilder) {
-    document.addEventListener('keydown', (event) => {
-      if (event.ctrlKey && event.key === 'a') {
-        event.preventDefault(); // Evita comportamento padrão do navegador
-        this.onSelectAll();
-      }
-    });
-  }
-  @Input() itemIdField: string = 'id';
-  @Input() breakpoint: string = "1400px"; // Define a largura da tela na qual o componente deve alterar seu comportamento responsivo.
-  @Input() dragdrop: boolean = true; // Ativa/Desativa o arrasta e solta
-  @Input() filterBy!: string; // Campo de filtro nas listas.
-  @Input() itemTemplate!: TemplateRef<any>; // Como as listas são dinâmicas, obrigatoriamente um template deve ser informado para exibir os itens das listas
-  @Input() responsive: boolean = true; // Ativa/Desativa a responsividade automática
-  @Input() source!: any[]; // Lista de origem
-  @Input() sourceHeader: string = 'Título da lista de origem';
-  @Input() sourceStyle!: any; // Estilização da lista de origem
-  @Input() stripedRows: boolean = false; // Ativa/Desativa linhas com cores alternadas ("zebradas")
-  @Input() target!: any[]; // Lista de destino (Itens selecionados)
-  @Input() targetHeader: string = 'Título de lista de destino';
-  @Input() targetStyle!: any; // Estilização da lista de destino
-  @Input() showSourceControls: boolean = true; // Exibir controls da lista de origem
-  @Input() showTargetControls: boolean = true; // Exibir controls da lista de destino
-  @Input() showCheckBox: boolean = false; // Exibir check na lista de origem
-  @Output() onMoveToSource: EventEmitter<any> = new EventEmitter();
-  @Output() onMoveToTarget: EventEmitter<any> = new EventEmitter();
-  @Output() onMoveAllToSource: EventEmitter<any> = new EventEmitter();
-  @Output() onMoveAllToTarget: EventEmitter<any> = new EventEmitter();
-  @Output() onSourceSelect: EventEmitter<any> = new EventEmitter();
-  @Output() onTargetSelect: EventEmitter<any> = new EventEmitter();
-
-  selectedPreview!: any;
-  ngModel: boolean = false;
-  selectedItems: { [key: number]: boolean } = {};
-
-  OnMoveToSource(event: any) {
-    this.picklist.moveLeft();
-    this.onMoveToSource.emit(event);
-    this.selectedItems = {};
-  }
-
-  OnMoveToTarget(event: any) {
-    this.picklist.moveRight();
-    this.onMoveToTarget.emit(event);
-    this.selectedItems = {};
-  }
-
-  OnMoveAllToSource(event: any) {
-    this.onMoveToSource.emit(event);
-    this.selectedItems = {};
-  }
-
-  OnMoveAllToTarget(event: any) {
-    this.onMoveToTarget.emit(event);
-    this.selectedItems = {};
-  }
-
-  OnSourceSelect(event: any) {
-    this.onSourceSelect.emit(event);
-  }
-
-  OnTargetSelect(event: any) {
-    this.onTargetSelect.emit(event);
-  }
-
-  onSelectAll() {
-    this.selectAllItems(true);
-  }
-  
-  selectAllItems(isSelected: boolean) {
-    // Selecionar todos os itens na lista de origem (source)
-    this.source.forEach(item => {
-      const itemId = item[this.itemIdField];
-      this.selectedItems[itemId] = isSelected;
-    });
-  
-    // Selecionar todos os itens na lista de destino (target)
-    this.target.forEach(item => {
-      const itemId = item[this.itemIdField];
-      this.selectedItems[itemId] = isSelected;
-    });
-  }
-  
- 
-  selectCheckBox(item: any) {
-    const itemId = item[this.itemIdField];
-    this.selectedPreview = item;
-  
-    this.selectedItems[itemId] = this.selectedItems[itemId] !== undefined
-      ? !this.selectedItems[itemId]
-      : true;
-    
-    this.ngModel = this.selectedItems[itemId];
-  }
-  
-
-  isItemSelected(item: any): boolean {
-    console.log(this.selectedPreview === item)
-    return this.selectedPreview === item;
-  }
-
-  ngOnInit() {
-  }
-}

package/src/lib/components/kv-pick-list/kv-pick-list.module.ts

@@ -1,24 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { NgModule } from "@angular/core";
-
-import { KvPickListComponent } from './kv-pick-list.component';
-import { PrimeNgModule } from '../../api/modules/primeng.module';
-import { KvInputsModule } from "../kv-inputs/kv-inputs.module";
-
-@NgModule({
-  declarations: [
-    KvPickListComponent
-  ],
-  imports: [
-    CommonModule,
-    PrimeNgModule,
-    FormsModule,
-    KvInputsModule,
-    ReactiveFormsModule
-],
-  exports: [
-    KvPickListComponent
-  ]
-})
-export class KvPickListModule { }

package/src/lib/components/kv-progress-bar/kv-progress-bar.component.html

@@ -1,38 +0,0 @@
-<div
-  role="progressbar"
-  [class]="styleClass ? styleClass : ''"
-  [ngStyle]="style"
-  [attr.aria-valuemin]="0"
-  [attr.aria-valuenow]="value"
-  [attr.aria-valuemax]="100"
-  [attr.data-pc-name]="'progressbar'"
-  [attr.data-pc-section]="'root'"
-  [ngClass]="{'p-progressbar p-component': true, 'p-progressbar-determinate': mode === 'determinate', 'p-progressbar-indeterminate': mode === 'indeterminate'}"
->
-  @if(mode === 'determinate') {
-  <div class="p-progressbar-value p-progressbar-value-animate {{ barStyleClass }} font-semibold"
-    [style.width]="maxValue && value ? (value / maxValue) * 100 + '%' : value + '%'"
-    [attr.data-pc-section]="'value'"
-  ></div>
-
-  <div
-    class="p-progressbar-label {{ labelStyleClass }} w-full"
-    [attr.data-pc-section]="'label'"
-  >
-    <label *ngIf="showValue && maxValue">{{ value }}/{{ maxValue }}</label>
-    <label *ngIf="showValue && !maxValue">{{ value }}%</label>
-    <label *ngIf="showLabel">{{ label }}</label>
-  </div>
-  } @if(mode === 'indeterminate') {
-  <div
-    class="p-progressbar-indeterminate-container"
-    [attr.data-pc-section]="'container'"
-  >
-    <div
-      class="p-progressbar-value p-progressbar-value-animate"
-      [style.background]="color"
-      [attr.data-pc-section]="'value'"
-    ></div>
-  </div>
-  }
-</div>

package/src/lib/components/kv-progress-bar/kv-progress-bar.component.scss

@@ -1,128 +0,0 @@
-@layer primeng {
-  .p-progressbar {
-    background-color: #adadad !important;
-    position: relative;
-    overflow: hidden;
-    height: 0.875rem;
-  }
-
-  .p-progressbar-determinate .p-progressbar-value {
-    height: 100%;
-    width: 0%;
-    position: absolute;
-    display: none;
-    border: 0 none;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    overflow: hidden;
-  }
-
-  .p-progressbar-determinate .p-progressbar-label {
-    font-size: 0.750rem;
-    color: white !important;
-    font-weight: 400;
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-
-  .p-progressbar-determinate .p-progressbar-value-animate {
-    background-color: #004172 !important;
-    transition: width 1s ease-in-out;
-  }
-
-  .p-progressbar-indeterminate .p-progressbar-value::before {
-    background-color: #004172 !important;
-    content: "";
-    position: absolute;
-    background-color: inherit;
-    top: 0;
-    left: 0;
-    bottom: 0;
-    will-change: left, right;
-    -webkit-animation: p-progressbar-indeterminate-anim 2.1s
-      cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
-    animation: p-progressbar-indeterminate-anim 2.1s
-      cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
-  }
-
-  .p-progressbar-indeterminate .p-progressbar-value::after {
-    background-color: #004172 !important;
-    content: "";
-    position: absolute;
-    background-color: inherit;
-    top: 0;
-    left: 0;
-    bottom: 0;
-    will-change: left, right;
-    -webkit-animation: p-progressbar-indeterminate-anim-short 2.1s
-      cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
-    animation: p-progressbar-indeterminate-anim-short 2.1s
-      cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
-    -webkit-animation-delay: 1.15s;
-    animation-delay: 1.15s;
-  }
-}
-
-@-webkit-keyframes p-progressbar-indeterminate-anim {
-  0% {
-    left: -35%;
-    right: 100%;
-  }
-  60% {
-    left: 100%;
-    right: -90%;
-  }
-  100% {
-    left: 100%;
-    right: -90%;
-  }
-}
-@keyframes p-progressbar-indeterminate-anim {
-  0% {
-    left: -35%;
-    right: 100%;
-  }
-  60% {
-    left: 100%;
-    right: -90%;
-  }
-  100% {
-    left: 100%;
-    right: -90%;
-  }
-}
-
-@-webkit-keyframes p-progressbar-indeterminate-anim-short {
-  0% {
-    left: -200%;
-    right: 100%;
-  }
-  60% {
-    left: 107%;
-    right: -8%;
-  }
-  100% {
-    left: 107%;
-    right: -8%;
-  }
-}
-@keyframes p-progressbar-indeterminate-anim-short {
-  0% {
-    left: -200%;
-    right: 100%;
-  }
-  60% {
-    left: 107%;
-    right: -8%;
-  }
-  100% {
-    left: 107%;
-    right: -8%;
-  }
-}

package/src/lib/components/kv-progress-bar/kv-progress-bar.component.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ProgressBarComponent } from './kv-progress-bar.component';
-
-describe('ProgressBarComponent', () => {
-  let component: ProgressBarComponent;
-  let fixture: ComponentFixture<ProgressBarComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [ProgressBarComponent]
-    });
-    fixture = TestBed.createComponent(ProgressBarComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});