keevo-components 1.8.127 → 1.8.130

package/src/lib/components/kv-modal/kv-modal.module.ts

@@ -1,21 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { KvModalComponent } from './kv-modal.component';
-import { KvButtonsModule, PrimeNgModule } from '../../../public-api';
-
-
-
-@NgModule({
-  declarations: [
-    KvModalComponent
-  ],
-  imports: [
-    CommonModule,
-    PrimeNgModule,
-    KvButtonsModule,
-  ],
-  exports: [
-    KvModalComponent
-  ]
-})
-export class KvModalModule { }

package/src/lib/components/kv-orgchart/kv-orgchart.component.html

@@ -1,58 +0,0 @@
-<div #chartContainer id="chartContainer" [ngClass]="{'backGround': true}">
-
-
-  <div class="div-botoes w-full flex gap-1" >
-
-
-    <span *ngIf="!mostraMenu" class="surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer"
-    (click)="mostraMenu = !mostraMenu" pTooltip="Expandir menu">menu</span>
-
-
-
-    <span *ngIf="mostraMenu" class="surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer"
-    (click)="mostraMenu = !mostraMenu" pTooltip="Recolher menu">menu_open</span>
-
-    <div *ngIf="mostraMenu">
-      <span class="surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer"
-      (click)="chart.zoomIn()" pTooltip="Zoom +">zoom_in</span>
-    <span class="surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer"
-      (click)="chart.zoomOut()" pTooltip="Zoom -">zoom_out</span>
-
-    <span class="surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer"
-      (click)="chart.collapseAll()" pTooltip="Expandir">expand_less</span>
-
-    <span class="surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer"
-      (click)="chart.expandAll()" pTooltip="Recolher">expand_more</span>
-
-
-    <!-- <span class="surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer"
-      (click)="compactSwap()" pTooltip="Compactar">cached</span> -->
-
-    <span class="material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer"
-      (click)="chart.fit().render()" pTooltip="Centralizar">
-      filter_center_focus
-    </span>
-
-    <span class="material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer"
-      (click)="chart.fullscreen('#chartContainer')" pTooltip="Tela cheia" >
-      fullscreen
-    </span>
-
-    </div>
-
-
-  </div>
-
-
-</div>
-
-
-<link
-  rel="stylesheet"
-  href="https://fonts.googleapis.com/icon?family=Material+Icons"
-/>
-
-<link
-  rel="stylesheet"
-  href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0"
-/>

package/src/lib/components/kv-orgchart/kv-orgchart.component.scss

@@ -1,21 +0,0 @@
-#chartContainer{
-  height: 100%;
-  overflow: hidden;
-
-}
-:host ::ng-deep #chartContainer svg.svg-chart-container {
-  height: 100% !important;
-  position: relative;
-  width: 100%;
-  top: -56px;
-  z-index: 0;
-  background-color: #fff;
-}
-.div-botoes{
-  z-index: 1;
-  width:  100%;
-  position: relative;
-}
-
-
-

package/src/lib/components/kv-orgchart/kv-orgchart.component.ts

@@ -1,110 +0,0 @@
-import {
-  Component,
-  ElementRef,
-  Input,
-  OnInit,
-  Renderer2,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-
-import { OrgChart } from 'd3-org-chart';
-import * as d3 from 'd3';
-
-import OrgChartConfig from '../../api/components/chart/orchart.config';
-import OrgChartItem from '../../api/components/chart/orchart.item';
-
-@Component({
-  selector: 'kv-orgchart',
-  templateUrl: './kv-orgchart.component.html',
-  styleUrls: ['./kv-orgchart.component.scss',],
-})
-export class KvOrgchartComponent implements OnInit {
-  @ViewChild('chartContainer') chartContainer!: ElementRef;
-  chart!: any;
-
-  @Input() dataSource!: OrgChartItem[];
-  @Input() config!: OrgChartConfig;
-  @Input() template!: string;
-  @Input() nodeTemplate!: TemplateRef<any>;
-
-  @Input() generateTemplate: Function = (data: any, node: any, nodes: any[], index: number): string => '';
-  @Input() templateFuncion: boolean = false;
-
-  @Input() corDeFundo: string = 'red';
-
-  compact: boolean = true;
-  mostraMenu: boolean = false;
-
-  constructor(private renderer: Renderer2) { }
-
-  ngOnInit() {
-  }
-
-  ngAfterViewInit() {
-    if (!this.chart) {
-      this.chart = new OrgChart();
-    }
-    this.updateChart();
-  }
-
-  ngOnChanges() {
-    this.updateChart();
-  }
-
-  updateChart() {
-    if (!this.dataSource) {
-      return;
-    }
-    if (!this.chart) {
-      return;
-    }
-
-    const chartContainer = this.chartContainer.nativeElement;
-    this.chart
-      .container(chartContainer)
-      .data(this.dataSource)
-      .nodeWidth(() => this.config.cardWidht)
-      .nodeHeight(() => this.config.cardHeight)
-      .nodeUpdate(function (d: any) {
-      })
-      .linkUpdate((node: any, index: any, nodes: any) => {
-        d3.select(nodes[index])
-          .attr('stroke-width', this.config.conectionWidth || '2px')
-          .style('stroke', this.config.connectionColor || '#d6d6d6').style('backgroundColor', 'red')
-      })
-      .nodeContent((d: any) => {
-        if (!this.templateFuncion) {
-          if (d.data.template) {
-            const jsTemplate = this.stringToTemplateLiteral(d.data.template);
-            var templateConverter = new Function('data', 'return' + jsTemplate);
-            var x = templateConverter(d.data.data);
-          } else {
-            const jsTemplate = this.stringToTemplateLiteral(this.config.templateItem);
-            var templateConverter = new Function('data', 'return' + jsTemplate);
-            var x = templateConverter(d.data.data);
-          }
-        } else {
-          var x = this.generateTemplate(d)
-
-        }
-        return x;
-      })
-      .defaultFont('Roboto')
-      .render()
-  }
-
-  stringToTemplateLiteral(string: string): string {
-    const convertedTemplate = string.replace(
-      /\{\{([^}]*)\}\}/g,
-      '${$1}'
-    );
-
-    return '`' + convertedTemplate + '`';
-  }
-
-  compactSwap() {
-    this.compact = !this.compact;
-    this.chart.compact(this.compact).render();
-  }
-}

package/src/lib/components/kv-orgchart/kv-orgchart.module.ts

@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { KvOrgchartComponent } from './kv-orgchart.component';
-import { PrimeNgModule } from '../../../public-api';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    PrimeNgModule
-  ],
-  declarations: [KvOrgchartComponent],
-  exports: [KvOrgchartComponent]
-})
-export class KvOrgchartModule { }

package/src/lib/components/kv-page-form/kv-page-form.component.html

@@ -1,117 +0,0 @@
-<div
-  [formGroup]="formGroup"
-  class="grid-nogutter m-0"
-  id="page-form-container"
->
-
-  <!-- Renderização do form -->
-  <div class="col-12 p-0" id="page-form-content">
-    <ng-content></ng-content>
-  </div>
-
-  <!-- Divider -->
-  <!-- <p-divider class="col-12"></p-divider> -->
-
-  <!-- Barra de ações -->
-  <div class="flex flex-column lg:flex-row justify-content-end col-12 gap-2 barra-acoes grid grid-nogutter p-fluid">
-
-    @if(positionBtnToogle == 'start'){
-      <kv-button-popup
-        *ngIf="actionsToogle && showBtnToogle"
-        [label]="txtBtnToogle"
-        [icon]="iconBtnToogle"
-        (click)="menuToogle.toggle($event)"
-        [disabled]="disableBtnToogle"
-        class="w-full lg:w-auto"
-        classBtn="{{classBtnToogle}}"
-      >
-      </kv-button-popup>
-      <p-menu
-        #menuToogle
-        [popup]="true"
-        [model]="actionsToogle"
-        appendTo="body"
-        class="w-full lg:w-auto"
-      ></p-menu>
-    }
-
-    <kv-button-popup
-        *ngIf="actionsCancelToogle && showBtnCancelToogle"
-        [label]="txtBtnCancelToogle"
-        [icon]="iconBtnCancelToogle"
-        (click)="menuCancel.toggle($event)"
-        class="w-full lg:w-auto"
-        [classBtn]="'btn-secondary border-300'"
-      >
-      </kv-button-popup>
-      <p-menu
-        #menuCancel
-        [popup]="true"
-        [model]="actionsCancelToogle"
-        appendTo="body"
-        class="w-full lg:w-auto"
-      ></p-menu>
-
-    <kv-button-secondary
-      *ngIf="showBtnCancel"
-      [label]="txtBtnCancel"
-      [icon]="iconBtnCancel"
-      [disabled]="isSaveLoading"
-      (click)="cancel($event)"
-      class="w-full lg:w-auto"
-    >
-    </kv-button-secondary>
-
-    <kv-button-success
-      *ngIf="showBtnSave"
-      [label]="txtBtnSave"
-      [icon]="iconBtnSave"
-      [disabled]="disableBtnSave"
-      [loading]="isSaveLoading"
-      (click)="!disableBtnSave ? save($event) : ''"
-      class="w-full lg:w-auto"
-    />
-
-
-    <kv-button-popup
-      *ngIf="actionsSaveToogle && showBtnSaveToogle"
-      [label]="txtBtnSaveToogle"
-      [icon]="iconBtnSaveToogle"
-      (click)="menuSave.toggle($event)"
-      [loading]="isSaveLoading"
-      class="w-full lg:w-auto"
-      [classBtn]="'btn-success border-green-500'"
-    >
-    </kv-button-popup>
-
-    <p-menu
-      #menuSave
-      [popup]="true"
-      [model]="actionsSaveToogle"
-      appendTo="body"
-      class="w-full lg:w-auto"
-    ></p-menu>
-
-
-    @if(positionBtnToogle == 'end'){
-      <kv-button-popup
-        *ngIf="actionsToogle && showBtnToogle"
-        [label]="txtBtnToogle"
-        [icon]="iconBtnToogle"
-        (click)="menuToogle.toggle($event)"
-        [disabled]="disableBtnToogle"
-        class="w-full lg:w-auto"
-        classBtn="{{classBtnToogle}}"
-      >
-      </kv-button-popup>
-      <p-menu
-        #menuToogle
-        [popup]="true"
-        [model]="actionsToogle"
-        appendTo="body"
-        class="w-full lg:w-auto"
-      ></p-menu>
-    }
-  </div>
-
-</div>

package/src/lib/components/kv-page-form/kv-page-form.component.scss

@@ -1,76 +0,0 @@
-::ng-deep .p-dialog .p-dialog-header {
-    color: white !important;
-    background: #002542 !important;
-    display: flex !important;
-    flex-wrap: wrap;
-}
-
-::ng-deep .p-dialog .p-dialog-content {
-    padding-top: 1rem;
-}
-
-::ng-deep .p-dialog {
-    min-width: 320px;
-}
-
-.sub-title {
-    // color: white !important;
-    color: yellow;
-    position: relative;
-    bottom: 25px;
-    z-index: 1;
-}
-
-::ng-deep .p-dialog-content {
-
-    &::-webkit-scrollbar {
-        width: 8px;
-
-        &:hover {
-            background-color: rgba(222, 222, 222, 0.75);
-        }
-    }
-
-    &::-webkit-scrollbar-thumb {
-        border-radius: 4px;
-        background-color: transparent;
-    }
-
-    &:hover::-webkit-scrollbar-thumb {
-        border-left: 2px solid white;
-        background-color: rgba(0, 0, 0, 0.5);
-    }
-
-    &::-webkit-scrollbar-track {
-        border-left: 2px solid white;
-        background-color: rgba(222, 222, 222, 0.75);
-    }
-
-    overflow-x: hidden;
-}
-
-* {
-    padding-bottom: 0rem;
-    padding-top: 0rem;
-}
-
-.barra-acoes {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    background-color: rgb(255, 255, 255);
-    padding: 10px;
-    z-index: 999;
-}
-
-
-#page-form-container {
-    padding-bottom: 40px;
-}
-
-@media screen and (max-width: 991px) {
-    #page-form-container {
-        padding-bottom: 100px;
-    }
-}

package/src/lib/components/kv-page-form/kv-page-form.component.spec.ts

@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { KvPageFormComponent } from './kv-page-form.component';
-
-describe('PageFormComponent', () => {
-  let component: KvPageFormComponent;
-  let fixture: ComponentFixture<KvPageFormComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ KvPageFormComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(KvPageFormComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

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

@@ -1,152 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  EventEmitter,
-  Input,
-  OnInit,
-  Output
-} from '@angular/core';
-
-import {
-  FormBuilder,
-  FormGroup
-} from '@angular/forms';
-
-import { ActionItem } from '../../api/components/table/action-item';
-
-@Component({
-  selector: 'kv-page-form',
-  templateUrl: './kv-page-form.component.html',
-  styleUrls: ['./kv-page-form.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class KvPageFormComponent implements OnInit {
-
-  /**
-   * 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) { }
-
-  /**
-   * 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-form/kv-page-form.module.ts

@@ -1,31 +0,0 @@
-import { CommonModule } from "@angular/common";
-import { NgModule } from "@angular/core";
-
-import {
-    FormsModule,
-    ReactiveFormsModule
-} from "@angular/forms";
-
-import { KvPageFormComponent } from "./kv-page-form.component";
-
-import {
-    KvButtonsModule,
-    PrimeNgModule
-} from "../../../public-api";
-
-@NgModule({
-    declarations: [
-        KvPageFormComponent
-    ],
-    imports: [
-        CommonModule,
-        FormsModule,
-        PrimeNgModule,
-        KvButtonsModule,
-        ReactiveFormsModule
-    ],
-    exports: [
-        KvPageFormComponent
-    ]
-})
-export class KvPageFormModule { }

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

@@ -1,19 +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"
->
-    <ng-template let-item pTemplate="item" *ngIf="itemTemplate">
-        <ng-container [ngTemplateOutlet]="itemTemplate" [ngTemplateOutletContext]="{ $implicit: item }"></ng-container>
-    </ng-template>
-</p-pickList>

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();
-  });
-});