keevo-components 2.0.107 → 2.0.108

package/src/lib/components/kv-file-viewer-preview/kv-file-viewer-preview.component.scss

@@ -1,153 +0,0 @@
-.farol-statuspublicacao {
-    margin-right: 0.5rem;
-    width: 0.35rem;
-    // height: 1rem;
-    border-radius: 1rem;
-    -webkit-border-radius: 1rem;
-    -moz-border-radius: 1rem;
-    -ms-border-radius: 1rem;
-    -o-border-radius: 1rem;
-  }
-  
-  :host ::ng-deep .p-sidebar {
-    border-radius: 5px;
-    position: absolute;
-    height: var(--sidebar-height);
-  }
-  
-  :host ::ng-deep .p-sidebar .p-sidebar-content {
-   overflow: auto;
-   border: 1px solid #e5e7eb;
-   border-radius: 5px;
-   margin-top: 1rem;
-  }
-  
-  .card-perfil{
-    border: 1.5px solid #CBD5E1;
-    background: #fff;
-    border-radius: 6px;
-    max-height: 100%
-  }
-  
-  :host ::ng-deep .p-fieldset .p-fieldset-content{
-    padding-bottom: 0;
-  }
-  
-  :host ::ng-deep .p-sidebar .p-sidebar-close {
-    display: none;
-  }
-  
-  .card-normal {
-    border: 1.5px solid #CBD5E1;
-  }
-  
-  .card-naoVisualizado {
-    border-left: 4px solid #e6671f !important;
-  }
-  
-  .parent-container {
-    height: 100%; /* Garante que o componente pai ocupe 100% da altura disponível */
-    display: flex; /* Use flexbox para layout dinâmico */
-    flex-direction: column;
-  }
-  
-  .file-viewer {
-    margin: auto; /* Centraliza o conteúdo */
-  }
-  
-  .ekp-content {
-    min-height: 20rem;
-    padding: 1rem; /* Adiciona espaçamento interno */
-    overflow-y: auto;
-    border-radius: 5px;
-  }
-  
-  ngx-loading {
-    position: absolute; /* ou fixed, dependendo do contexto */
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    z-index: 1000; /* Certifique-se de que está acima dos outros elementos */
-  }
-  
-  
-  .card {
-    transition: all 0.3s ease;
-    border: 1px solid transparent;
-  }
-  
-  .card-normal:hover {
-    border: 1px solid #a9a9a9; /* Cinza suave para hover */
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Sombra leve */
-  }
-  
-  .card-selected {
-    background-color: #f0f0f0; /* Cinza claro para o fundo */
-    border: 1px solid #c0c0c0; /* Borda cinza médio */
-    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); /* Sombra suave */
-    transform: scale(1.02); /* Leve aumento no tamanho */
-  }
-  
-  .loading-spinner {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100%;
-    font-size: 1.5rem;
-    color: #666;
-  }
-  
-  #html-content {
-    width: 100%;
-    height: 100%;
-    overflow-y: auto;
-  }
-  
-  :host ::ng-deep .list-card-button .kv-button {
-    width: 22px;
-    height: 22px;
-  }
-  
-  :host ::ng-deep .list-card-button .kv-button .material-symbols-outlined.only-icon.icon-normal[_ngcontent-ng-c4083184952] {
-    font-size: 1rem;
-  }
-  
-  .custom-max-height {
-    max-height: 98%;
-  }
-  
-  @media (max-height: 915px){
-    .custom-max-height {
-      max-height: 94%;
-    }
-  }
-  
-  @media (max-height: 805px){
-    .custom-max-height {
-      max-height: 90%;
-    }
-  }
-  
-  @media (max-height: 720px){
-    .custom-max-height {
-      max-height: 85%;
-    }
-  }
-  
-  /* Estilo padrão do span */
-  .download-icon {
-    font-size: 20px;
-    cursor: pointer;
-    transition: transform 0.3s ease, color 0.3s ease;
-  }
-  
-  /* Estilo aplicado no hover */
-  .download-icon:hover {
-    color: #0F6CBD; /* Cor de destaque no hover */
-    transform: scale(1.2); /* Aumenta o ícone um pouco no hover */
-  }
-  
-  
-  
-    

package/src/lib/components/kv-file-viewer-preview/kv-file-viewer-preview.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { KvFileViewerPreviewComponent } from './kv-file-viewer-preview.component';
-
-describe('KvFileViewerPreviewComponent', () => {
-  let component: KvFileViewerPreviewComponent;
-  let fixture: ComponentFixture<KvFileViewerPreviewComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [KvFileViewerPreviewComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(KvFileViewerPreviewComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/kv-file-viewer-preview/kv-file-viewer-preview.component.ts

@@ -1,73 +0,0 @@
-import { Component, computed, EventEmitter, input, Input, InputSignal, Output, signal, TemplateRef } from '@angular/core';
-import { SafeHtml } from '@angular/platform-browser';
-
-@Component({
-  selector: 'kv-file-viewer-preview',
-  standalone: false,
-  templateUrl: './kv-file-viewer-preview.component.html',
-  styleUrl: './kv-file-viewer-preview.component.scss'
-})
-export class KvFileViewerPreviewComponent {
-
-// #region Signals
- dataSource: InputSignal<any[]> = input<any[]>([]);
- paginaInicial = signal<number>(1);
- arquivo = input<string | undefined>(undefined);
- arquivoPreview = signal<any>(undefined);
- nomeArquivo = signal<string>('');
- type = input<string | undefined>(undefined);
- blob = input<Blob>('' as any);
- idarquivo = signal<number | undefined>(undefined);
- ekpContent = input<SafeHtml | undefined>(undefined);
- totalItensCarregado = computed(
-  () => this.dataSource()?.length || 0
-);
-// #endregion
-
-// #region Properties
-empresaSelecionada!: any;
-idtipodocumento!: number[];
-extencaoDocumento!: string;
-previewOn: boolean = false;
-selectedItem: any = {};
-totalRecords: number = 0;
-isLoading: boolean = false;
-displaySidebar: boolean = false;
-isSelected: boolean = false;
-@Input() cardTemplate!: TemplateRef<any>;
-todayDate(): string {
-  const today = new Date();
-  return today.toLocaleDateString('pt-BR', { day: '2-digit', month: '2-digit', year: 'numeric' });
-}
-// #endregion
-
-// #region Outputs
-@Output() onScrollHandler: EventEmitter<any> = new EventEmitter();
-@Output() onSelectFile: EventEmitter<any> = new EventEmitter();
-// #endregion
-
-
-visualizarPreview(arquivo: any): void {
-  this.arquivoPreview.set(arquivo);
-  this.onSelectFile.emit(arquivo);
-}
-
-trackByFn(index: number, item: any): any {
-  return item.idarquivo; // Use uma propriedade única como identificador
-}
-
-// #region Scroll Handling
-scrollHandler($event: Event) {
-  const element = $event.target as HTMLElement;
-
-  //se o escroll chegar até o final
-  if (element.scrollHeight - element.scrollTop === element.clientHeight) {
-    // this.buscarProximosDocumentos();
-    this.onScrollHandler.emit();
-  }
-}
-
-// #endregion
-
-}
-

package/src/lib/components/kv-file-viewer-preview/kv-file-viewer-preview.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PdfViewerModule } from 'ng2-pdf-viewer';
-import { KvFileViewerPreviewComponent } from './kv-file-viewer-preview.component';
-import { KvFileViewerNovoModule } from '../kv-file-viewer-novo/kv-file-viewer-novo.module';
-import { NgxLoadingModule } from 'ngx-loading';
-
-@NgModule({
-  declarations: [KvFileViewerPreviewComponent],
-  imports: [
-    CommonModule,
-    PdfViewerModule,
-    NgxLoadingModule,
-    KvFileViewerNovoModule
-  ],
-  exports: [KvFileViewerPreviewComponent]
-})
-export class KvFileViewerPreviewModule { }

package/src/lib/components/kv-filter-card/kv-filter-card.component.html

@@ -1,12 +0,0 @@
-<div [style]='{"--accent-color": color}' [ngClass]='[cardState == "inactive" ? "card-disabled" : "card", cardState == "selected" ? "clickable-selected" : "clickable"]'>
-  <div class="filter-card-content">
-    <div class="filter-card-title">
-      @if (gIcon) {
-      <kv-g-icon>{{ gIcon }}</kv-g-icon>
-      }
-      <ng-content select="[icon]"></ng-content>
-      <div style="font-weight: bold; font-size: .825em">{{ title }}</div>
-    </div>
-    <div class="flex align-items-center" style="font-size: 1.25em; font-weight: bold; min-height: 1.875rem">{{ amount }}</div>
-  </div>
-</div>

package/src/lib/components/kv-filter-card/kv-filter-card.component.scss

@@ -1,76 +0,0 @@
-.card {
-    --accent-color: #5289B4;
-    border: 1px solid rgba(0, 0, 0, 0.15);
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
-    background-color: rgb(249, 249, 249);
-    border-left: solid 0.325rem var(--accent-color);
-    * {
-	margin: 0px;
-	color: var(--accent-color);
-    }
-    border-radius: .625rem;
-}
-
-p {
-    font-size: 0.75rem;
-}
-
-.card-disabled {
-    --accent-color: #5289B4;
-    $transition-time: 0.2s;
-    border: 1px solid lightgrey;
-    border-left: solid 0.325rem lightgrey;
-    transition: border-left $transition-time ease;
-    &:hover {
-	border-left: solid 0.325rem var(--accent-color);
-	transition: border-left $transition-time ease;
-	* {
-	    color: var(--accent-color);
-	    transition: color $transition-time ease;
-	}
-    }
-    * {
-	margin: 0px;
-	color: lightgrey;
-	transition: color $transition-time ease;
-    }
-    border-radius: 10px;
-}
-
-.clickable-selected {
-    cursor: pointer;
-    background-color: #EAFAFF;
-    &:hover {
-	background-color: #DEEEFF;
-    }
-}
-
-.clickable {
-    cursor: pointer;
-    &:hover {
-	background-color: #F0F0F0;
-    }
-}
-
-.filter-card-content {
-    display: flex;
-    flex-direction: row;
-    padding: .4rem;
-    padding-top: .575rem;
-    gap: .5rem;
-    // * {
-	// color: var(--accent-color);
-    // }
-}
-
-.select-none {
-    user-select: none;
-}
-
-.filter-card-title {
-    flex: 1 1 0%;
-    display:flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 0.4rem;
-}

package/src/lib/components/kv-filter-card/kv-filter-card.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { KvFilterCardComponent } from './kv-filter-card.component';
-
-describe('KvFilterCardComponent', () => {
-  let component: KvFilterCardComponent;
-  let fixture: ComponentFixture<KvFilterCardComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [KvFilterCardComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(KvFilterCardComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/kv-filter-card/kv-filter-card.component.ts

@@ -1,18 +0,0 @@
-import { Component, Input } from '@angular/core';
-
-@Component({
-  selector: 'kv-filter-card',
-  templateUrl: './kv-filter-card.component.html',
-  styleUrl: './kv-filter-card.component.scss',
-})
-export class KvFilterCardComponent {
-  @Input() cardState: CardState = "normal";
-  @Input() color!: string;
-  @Input() title!: string;
-  @Input() amount?: number;
-  @Input() gIcon?: string;
-  @Input() spaceNowrap: boolean = false;
-}
-
-export type CardState = "normal" | "selected" | "inactive";
-export type CardStateClass = "card" | "PLACEHOLDER" | "card-disabled";

package/src/lib/components/kv-filter-card/kv-filter-card.module.ts

@@ -1,23 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule, NgClass } from '@angular/common';
-import { KvFilterCardComponent } from './kv-filter-card.component';
-import { KvGIconModule } from '../kv-g-icon/kv-g-icon.module';
-import { PrimeNgModule } from '../../api/modules/primeng.module';
-
-
-
-@NgModule({
-  declarations:[
-    KvFilterCardComponent
-  ],
-  imports: [
-    CommonModule,
-    KvGIconModule,  
-    PrimeNgModule,
-    NgClass  
-  ],
-  exports:[
-    KvFilterCardComponent
-  ]
-})
-export class KvFilterCardModule { }

package/src/lib/components/kv-filter-cards/kv-filter-cards.component.html

@@ -1,81 +0,0 @@
-<div 
-  id="filter-card-container" 
-  class="flex flex-row w-full justify-content-between"
->
-  <div 
-    class="flex p-fluid formgrid w-full gap-1 px-3 py-1" 
-    [ngClass]="[
-        wrapCards() ? 'flex-wrap' : 'flex-nowrap overflow-x-auto',
-        alignCardsCenter() ? 'justify-content-center' : 'justify-content-start'    
-    ]" 
-    #filterCardsContainer
-  >
-
-    @for (card of cards(); track card.id) {
-    
-      <div 
-        (click)="handleCardClick(card)" 
-        [style.--main-color]="color()(card)" 
-        [style.--mixed-color]="mixedColor()(card)"
-        class="filter-card" 
-
-        [ngClass]="[
-            'filter-card-size',
-            verificarSeCardEstaSelecionado(card)  ? 'filter-card-active' : 'clickable',
-            staticCards() ? 'filter-card-active' : '',
-            !staticCards() && !verificarSeCardEstaSelecionado(card) ? 'filter-card-hover' : '',
-            cursorPointer() ? 'cursor-pointer' : '',
-
-        ]"
-      >
-
-      <div class="filter-card-content">
-
-        <div class="filter-card-title">
-
-          @if (card.icon) {
-
-          <div class="hex-icon-svg">
-            <svg style="overflow: visible;" viewBox="0 0 100 100" class="hex-bg">
-              <polygon
-                [attr.fill]="getColorFillPolygon(card)"
-                points="93.3 75,50 100,6.7 75,6.7 25,50 0,93.3 25" 
-                stroke="var(--main-color)" 
-                stroke-width="3"
-                stroke-linejoin="round" 
-                stroke-linecap="round" 
-                opacity="0.8" 
-              />
-            </svg>
-
-            <span [style.color]="getColorIconPolygon(card)"
-              class="material-symbols-outlined icon">
-              {{ card?.icon }}
-            </span>
-
-          </div>
-
-          }
-
-          <div style="font-weight: bold; font-size: .825em; color: #414141;">{{ card?.titulo }}</div>
-      
-        </div>
-
-        @if(loadingCards()){
-
-          <span class="loading-spinner"></span>
-
-        }@else {
-
-          <div class="flex align-items-center" [style.color]="color()(card)"
-            style="font-size: 1.25em; font-weight: bold; min-height: 1.875rem">
-            {{ card.valor | kvFilterCardsFormatter:card.formato}}
-          </div>
-
-        }
-
-      </div>
-    </div>
-    }
-  </div>
-</div>

package/src/lib/components/kv-filter-cards/kv-filter-cards.component.scss

@@ -1,197 +0,0 @@
-
-
-.card {
-
-}
-
-.card, .card-disabled, .filter-card-active {
-  transition: border 0.3s ease, background-color 0.3s ease;
-  border: 1px solid #CBD5E1; /* Borda padrão */
-}
-
-.filter-card{
-    transition: all ease-in-out 0.1s;
-    border: 1px solid #CBD5E1;
-    border-radius: 1rem;
-    user-select: none;
-}
-.filter-card-hover:hover{
-    background: #f8fafc;
-    transform: scale(1.01);
-    border: var(--main-color) 0.5px solid; // Borda colorida
-}
-.filter-card-hover:active{
-    background: #f8fafc;
-    border: var(--main-color) 0.5px solid; // Borda colorida
-}
-
-
-// .filter-card:hover{
-//     background: #f8fafc;
-//     transform: scale(1.01);
-//     border: var(--main-color) 0.5px solid; // Borda colorida
-// }
-// .filter-card:active{
-//     background: #f8fafc;
-//     border: var(--main-color) 0.5px solid; // Borda colorida
-// }
-
-
-.filter-card-active{
-    border: var(--main-color) 0.5px solid; // Borda colorida
-    // background: #f8fafc;
-    background-color: color-mix(in srgb, var(--mixed-color) 20%, white 80%);
-    
-}
-
-p {
-    font-size: 0.75rem;
-}
-
-
-.select-none {
-    user-select: none;
-}
-.filter-card-content {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    padding: .4rem 0.6rem .4rem 0.5rem; 
-    gap: .5rem;
-}
-.filter-card-title {
-    flex: 1 1 0%;
-    display:flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 0.4rem;
-}
-
-
-.hex-icon-svg {
-  position: relative;
-  width: 2rem;
-  height: 2rem;
-  font-size: 2rem;
-}
-
-.hex-icon-svg .hex-bg {
-  width: 100%;
-  height: 100%;
-}
-
-.hex-icon-svg .icon {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  color: var(--main-color);
-  font-size: 24px;
-  pointer-events: none;
-}
-.icon{
-    font-weight: 500 !important;
-    font-size:.65em !important;
-}
-
-
-div.filter-card-hover:hover .hex-icon-svg > svg > polygon {
-    fill: var(--mixed-color);
-};
-
-polygon{
-    transition: all ease-in-out 0.1s;
-}
-
-
-#filter-card-container {
-    container: filter-card-container / inline-size;
-}
-
-.filter-card-size {
-  flex: 1 1 auto;
-  padding: 0 0.25rem;
-  min-width: 170px; // menor que antes
-  box-sizing: border-box;
-
-  // Se wrap estiver ativado, permite os cards se ajustarem dinamicamente
-  @container filter-card-container (min-width: 360px) {
-    width: 50%;
-  }
-
-  @container filter-card-container (min-width: 600px) {
-    width: 33.3333%;
-  }
-
-  @container filter-card-container (min-width: 900px) {
-    width: 25%;
-  }
-
-  @container filter-card-container (min-width: 1200px) {
-    width: 16.6667%;
-  }
-
-  @container filter-card-container (min-width: 1500px) {
-    width: 14.2857%; // até 7 cards lado a lado
-  }
-}
-@media (min-width: 360px) {
-  .filter-card-size {
-    width: 50%;
-  }
-}
-@media (min-width: 600px) {
-  .filter-card-size {
-    width: 33.3333%;
-  }
-}
-@media (min-width: 900px) {
-  .filter-card-size {
-    width: 25%;
-  }
-}
-@media (min-width: 1200px) {
-  .filter-card-size {
-    width: 16.6667%;
-  }
-}
-@media (min-width: 1500px) {
-  .filter-card-size {
-    width: 14.2857%;
-  }
-}
-
-
-
-.flex-nowrap.overflow-x-auto {
-  overflow-x: auto;
-  scrollbar-width: thin;
-}
-
-.flex-wrap .filter-card-size {
-  flex: 1 1 auto;
-}
-
-
-
-
-
-.loading-spinner {
-  width: 1.5rem;
-  height: 1.5rem;
-  border: 2px solid var(--main-color);
-  border-bottom-color: transparent;
-  border-radius: 50%;
-  display: inline-block;
-  box-sizing: border-box;
-  animation: rotation 0.8s linear infinite;
-}
-
-@keyframes rotation {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}