keevo-components 1.8.262 → 1.8.264

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

@@ -0,0 +1,130 @@
+@layer primeng {
+  .p-progressbar {
+    background-color: #C0C1C2;
+    position: relative;
+    overflow: hidden;
+  }
+
+  .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 {
+    color: white !important;
+    text-shadow: -0.4px -0.4px 0 #002542,
+    0.4px -0.4px 0 #002542,
+   -0.4px  0.4px 0 #002542,
+    0.4px  0.4px 0 #002542;
+    font-weight: 600;
+    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

@@ -0,0 +1,21 @@
+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();
+  });
+});

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

@@ -0,0 +1,75 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'kv-progress-bar',
+  templateUrl: './kv-progress-bar.component.html',
+  styleUrls: ['./kv-progress-bar.component.scss'],
+})
+export class ProgressBarComponent {
+  /**
+   * Current value of the progress.
+   * @group Props
+   */
+  @Input() value: number | undefined;
+
+  /**
+   * Max value of the progress.
+   * @group Props
+   */
+  @Input() maxValue: number | undefined;
+
+  /**
+   * Label value of the progress.
+   * @group Props
+   */
+  @Input() label: string | undefined;
+
+  /**
+   * Whether to display the progress bar value.
+   * @group Props
+   */
+  @Input() showValue: boolean = true;
+  /**
+   * Whether to display the progress bar value.
+   * @group Props
+   */
+  @Input() showLabel: boolean = true;
+  /**
+   * Class of the element.
+   * @group Props
+   */
+  @Input() styleClass: string | undefined;
+
+  /**
+   * Class of the element.
+   * @group Props
+   */
+  @Input() labelStyleClass: string | undefined;
+
+  /**
+   * Class of the element.
+   * @group Props
+   */
+  @Input() barStyleClass: string | undefined;
+
+  /**
+   * Inline style of the element.
+   * @group Props
+   */
+  @Input() style: { [klass: string]: any } | null | undefined;
+  /**
+   * Unit sign appended to the value.
+   * @group Props
+   */
+  @Input() unit: string = '%';
+  /**
+   * Defines the mode of the progress
+   * @group Props
+   */
+  @Input() mode: 'determinate' | 'indeterminate' = 'determinate';
+  /**
+   * Color for the background of the progress.
+   * @group Props
+   */
+  @Input() color: string | undefined;
+}

package/src/lib/components/kv-progress-bar/kv-progress-bar.module.ts

@@ -0,0 +1,19 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+
+import { ProgressBarComponent as KvProgressBarComponent } from './kv-progress-bar.component';
+import { PrimeNgModule } from '../../../public-api';
+
+@NgModule({
+  declarations: [
+    KvProgressBarComponent
+  ],
+  imports: [
+    CommonModule,
+    PrimeNgModule,
+  ],
+  exports: [
+    KvProgressBarComponent
+  ]
+})
+export class KvProgressBarModule { }

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

@@ -0,0 +1,12 @@
+<div class='container'>
+  <div class="voltar">
+    <p-button
+      pRipple
+      label="Voltar"
+      icon="pi pi-angle-left"
+      styleClass="p-button-success"
+      (click)="close()">
+    </p-button>
+  </div>
+  <div id='viewer'></div>
+</div>

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

@@ -0,0 +1,21 @@
+:host {
+    display: block;
+    height: 100%;
+  }
+  
+  .container {
+    height: 100%;
+    margin: 10px;
+  
+    .viewer {
+      height: 100%;
+    }
+  
+    .voltar {
+      display: flex;
+      align-items: flex-end;
+      justify-content: flex-end;
+      margin: 0 0 15px 10px;
+    }
+  }
+  

package/src/lib/components/kv-report/kv-report.component.spec.ts

@@ -0,0 +1,28 @@
+/* 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 { KvReportComponent } from './kv-report.component';
+
+describe('KvReportComponent', () => {
+  let component: KvReportComponent;
+  let fixture: ComponentFixture<KvReportComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ KvReportComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(KvReportComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

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

@@ -0,0 +1,50 @@
+import { AfterViewInit, EventEmitter, Output } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
+
+declare var Stimulsoft: any;
+
+@Component({
+  selector: 'kv-report',
+  templateUrl: './kv-report.component.html',
+  styleUrls: ['./kv-report.component.scss']
+})
+export class KvReportComponent implements OnInit, AfterViewInit {
+
+  stiViewer = new Stimulsoft.Viewer.StiViewer(undefined, 'StiViewer', false);
+  stiReport = new Stimulsoft.Report.StiReport();
+
+  @Output() onClose: EventEmitter<any> = new EventEmitter();
+
+  @Input() dataReport: any;
+  @Input() dataReportAlias: string = 'root';
+  @Input() dataReportName: string = 'root';
+  @Input() report: any;
+  @Input() stimulSoftLocalizationFile!: string;
+  @Input() stimulSoftLicenseKey!: string;
+
+  constructor() { }
+
+  ngAfterViewInit(): void {
+    this.stiReport.load(this.report);
+    this.stiReport.dictionary.databases.clear();
+    this.stiReport.regData(this.dataReportAlias, this.dataReportName, this.dataReport);
+
+    this.stiViewer.report = this.stiReport;
+    this.stiViewer.renderHtml('viewer');
+  }
+
+  ngOnInit() {
+
+    if (this.stimulSoftLocalizationFile) {
+      const locName = 'Português (PT-BR)';
+      Stimulsoft.Base.Localization.StiLocalization.addLocalizationFile(this.stimulSoftLocalizationFile, false, locName);
+      Stimulsoft.Base.Localization.StiLocalization.cultureName = locName;
+    }
+
+    Stimulsoft.Base.StiLicense.key = this.stimulSoftLicenseKey;
+  }
+
+  close() {
+    this.onClose.emit();
+  }
+}

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

@@ -0,0 +1,18 @@
+import { NgModule } from "@angular/core";
+
+import { PrimeNgModule } from "../../api/modules/primeng.module";
+import { KvReportComponent } from "./kv-report.component";
+
+@NgModule({
+    declarations: [
+      KvReportComponent
+    ],
+    imports: [
+      PrimeNgModule
+      
+    ],
+    exports:[
+      KvReportComponent
+    ]
+  })
+  export class KvReportModule { }

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

@@ -0,0 +1,66 @@
+<p-stepper
+  [activeStep]="activeStep"
+  [orientation]="orientation"
+  [linear]="linear"
+  (activeStepChange)="onActiveStepChange($event)"
+>
+  <ng-container *ngFor="let panel of panels; let i = index">
+    <p-stepperPanel [header]="panel.header">
+
+      <ng-template
+        pTemplate="content"
+        let-nextCallback="nextCallback"
+        let-prevCallback="prevCallback"
+      >
+
+        <div class="flex flex-column h-12rem">
+          <div class="content-panel">
+            <ng-container
+              *ngComponentOutlet="panel.contentTemplate"
+            ></ng-container>
+          </div>
+        </div>
+
+        <div
+          class="flex pt-4"
+          [ngClass]="{
+            'justify-content-between': panel.id !== 0,
+            'justify-content-end': panel.id === 0,
+            'justify-content-start': orientation === 'vertical'
+          }"
+        >
+          <button
+            *ngIf="panel.id !== 0"
+            pButton
+            pRipple
+            class="btn-secondary border-300"
+            [icon]="'pi pi-arrow-left'"
+            [label]="'Back'"
+            (click)="prevCallback.emit()"
+          ></button>
+          <button
+            *ngIf="panel.id !== panels.length - 1"
+            pButton
+            pRipple
+            class="btn-success border-green-500"
+            [icon]="'pi pi-arrow-right'"
+            [label]="'Next'"
+            (click)="nextCallback.emit()"
+            iconPos="right"
+          ></button>
+          <button
+            *ngIf="btnConcluir && panel.id === panels.length - 1"
+            pButton
+            pRipple
+            class="btn-success border-green-500"
+            [label]="'Concluir'"
+            (click)="concluirCallback.emit()"
+            iconPos="right"
+          ></button>
+        </div>
+
+      </ng-template>
+
+    </p-stepperPanel>
+  </ng-container>
+</p-stepper>

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

@@ -0,0 +1,41 @@
+.kv-stepper {
+    display: flex;
+    flex-direction: column;
+}
+
+:host ::ng-deep .p-stepper .p-stepper-header.p-highlight .p-stepper-number {
+  background-color: #002542;
+  color: #fff;
+}
+
+:host ::ng-deep .p-stepper .p-stepper-header:has(~ .p-highlight) .p-stepper-separator {
+  background-color: #002542;
+}
+
+.btn-success {
+  background-color: #29b92d !important;
+  color: #fff !important;
+  height:35px;
+
+  &:hover {
+    background-color: #229925 !important;
+  }
+
+  &:disabled {
+    pointer-events: none;
+  }
+}
+
+.btn-secondary {
+  background-color: #f2f3f5 !important;
+  color: rgba(0, 0, 0, .87) !important;
+  height:35px;
+
+  &:hover {
+    background-color: #d8d9db !important;
+  }
+
+  &:disabled {
+    pointer-events: none;
+  }
+}

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

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

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

@@ -0,0 +1,48 @@
+import { Component, EventEmitter, Input, Output, ContentChildren, QueryList, TemplateRef, Type } from '@angular/core';
+
+@Component({
+  selector: 'kv-stepper',
+  templateUrl: './kv-stepper.component.html',
+  styleUrls: ['./kv-stepper.component.scss']
+})
+
+/**
+ * @deprecated Use kv-page-stepper
+ */
+export class KvStepperComponent {
+  /**
+ * @deprecated Use kv-page-stepper
+ */
+  @Input() panels: KvStepperPanel[] = [];
+  @Input() activeStep: number = 0;
+  @Input() orientation: 'vertical' | 'horizontal' = 'horizontal';
+  @Input() linear: boolean = false;
+  @Input() btnConcluir: boolean = true;
+
+  @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;
+    });
+  }
+
+  constructor() {
+    this.assignIdsToPanels();
+  }
+
+}
+
+interface KvStepperPanel {
+  id: number;
+  header: string;
+  contentTemplate: Type<any>;
+
+}
+

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

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { PrimeNgModule } from '../../api/modules/primeng.module';
+import { KvStepperComponent } from './kv-stepper.component';
+import { StepperModule } from 'primeng/stepper';
+
+@NgModule({
+  declarations: [
+    KvStepperComponent
+  ],
+  imports: [
+    CommonModule,
+    PrimeNgModule,
+    StepperModule,
+  ],
+  exports: [
+    KvStepperComponent
+  ]
+})
+export class KvStepperModule { }