keevo-components 1.8.262 → 1.8.264

package/src/lib/api/components/table/kv-menuitem.ts

@@ -0,0 +1,198 @@
+import { MenuItem, MenuItemCommandEvent } from "primeng/api/menuitem";
+import { QueryParamsHandling } from "@angular/router";
+import { TooltipOptions } from "primeng/api";
+
+export interface KvMenuItem {
+  /**
+   * Texto do item.
+   */
+  label?: ValueOrFn<string | undefined>;
+  /**
+   * Ícone do item.
+   */
+  icon?: ValueOrFn<string | undefined>;
+  /**
+   * Callback a ser executada quando o item é clicado.
+   */
+  command?: (event: MenuItemCommandEvent) => void;
+  /**
+   * Link externo para navegar quando o item é clicado.
+   */
+  url?: ValueOrFn<string | undefined>;
+  /**
+   * Array de filhos do item.
+   */
+  items?: ValueOrFn<KvMenuItem[] | undefined>;
+  /**
+   * Visibilidade do submenu.
+   */
+  expanded?: ValueOrFn<boolean | undefined>;
+  /**
+   * Quando verdadeiro, desabilita o item.
+   */
+  disabled?: ValueOrFn<boolean | undefined>;
+  /**
+   * Define se o elemento da dom do item é ou não criado.
+   */
+  visible?: ValueOrFn<boolean | undefined>;
+  /**
+   * Specifies where to open the linked document.
+   */
+  target?: ValueOrFn<string | undefined>;
+  /**
+   * Whether to escape the label or not. Set to false to display html content.
+   */
+  escape?: boolean;
+  /**
+   * Configuration for active router link.
+   */
+  routerLinkActiveOptions?: ValueOrFn<any | undefined>;
+  /**
+   * Defines the item as a separator.
+   */
+  separator?: boolean;
+  /**
+   * Value of the badge.
+   */
+  badge?: ValueOrFn<string | undefined>;
+  /**
+   * Tooltip of the item.
+   */
+  tooltip?: ValueOrFn<string | undefined>;
+  /**
+   * Position of the tooltip item.
+   */
+  tooltipPosition?: ValueOrFn<string | undefined>;
+  /**
+   * Style class of the badge.
+   */
+  badgeStyleClass?: ValueOrFn<string | undefined>;
+  /**
+   * Inline style of the menuitem.
+   */
+  style?: ValueOrFn<{
+    [klass: string]: any;
+  } | null | undefined>;
+  /**
+   * Style class of the menuitem.
+   */
+  styleClass?: ValueOrFn<string | undefined>;
+  /**
+   * Tooltip text of the item.
+   */
+  title?: ValueOrFn<string | undefined>;
+  /**
+   * Identifier of the element.
+   */
+  id?: ValueOrFn<string | undefined>;
+  /**
+   * Value of HTML data-* attribute.
+   */
+  automationId?: ValueOrFn<any | undefined>;
+  /**
+   * Specifies tab order of the item.
+   */
+  tabindex?: ValueOrFn<string | undefined>;
+  /**
+   * RouterLink definition for internal navigation.
+   */
+  routerLink?: ValueOrFn<any | undefined>;
+  /**
+   * Query parameters for internal navigation via routerLink.
+   */
+  queryParams?: ValueOrFn<{
+    [k: string]: any;
+  } | undefined>;
+  /**
+   * Sets the hash fragment for the URL.
+   */
+  fragment?: ValueOrFn<string | undefined>;
+  /**
+   *  How to handle query parameters in the router link for the next navigation. One of:
+      merge : Merge new with current parameters.
+      preserve : Preserve current parameters.k.
+   */
+  queryParamsHandling?: ValueOrFn<QueryParamsHandling | undefined>;
+  /**
+   * When true, preserves the URL fragment for the next navigation.
+   */
+  preserveFragment?: ValueOrFn<boolean | undefined>;
+  /**
+   * When true, navigates without pushing a new state into history.
+   */
+  skipLocationChange?: ValueOrFn<boolean | undefined>;
+  /**
+   * When true, navigates while replacing the current state in history.
+   */
+  replaceUrl?: ValueOrFn<boolean | undefined>;
+  /**
+   * Inline style of the item's icon.
+   */
+  iconStyle?: ValueOrFn<{
+    [klass: string]: any;
+  } | null | undefined>;
+  /**
+   * Class of the item's icon.
+   */
+  iconClass?: ValueOrFn<string | undefined>;
+  /**
+   * Developer-defined state that can be passed to any navigation.
+   * @see {MenuItemState}
+   */
+  state?: ValueOrFn<{
+    [k: string]: any;
+  } | undefined>;
+  /**
+   * Options of the item's tooltip.
+   * @see {TooltipOptions}
+   */
+  tooltipOptions?: ValueOrFn<TooltipOptions | undefined>;
+}
+
+export type ValueOrFn<T> = T | ((data: any) => T);
+
+export function getOrExecute<T>(vof: ValueOrFn<T>, data: any): T {
+  if (typeof vof === "function") {
+    return (vof as (data: any) => T)(data);
+  } else {
+    return vof;
+  }
+}
+
+export function mapToMenuItem(kvMenuItem: KvMenuItem, data: any): MenuItem {
+  return {
+    label: getOrExecute(kvMenuItem.label, data),
+    icon: getOrExecute(kvMenuItem.icon, data),
+    command: kvMenuItem.command,
+    url: getOrExecute(kvMenuItem.url, data),
+    items: getOrExecute(kvMenuItem.items, data)?.map(x => mapToMenuItem(x, data)),
+    expanded: getOrExecute(kvMenuItem.expanded, data),
+    disabled: getOrExecute(kvMenuItem.disabled, data),
+    visible: getOrExecute(kvMenuItem.visible, data),
+    target: getOrExecute(kvMenuItem.target, data),
+    escape: kvMenuItem.escape,
+    routerLinkActiveOptions: getOrExecute(kvMenuItem.routerLinkActiveOptions, data),
+    separator: kvMenuItem.separator,
+    badge: getOrExecute(kvMenuItem.badge, data),
+    tooltip: getOrExecute(kvMenuItem.tooltip, data),
+    tooltipPosition: getOrExecute(kvMenuItem.tooltipPosition, data),
+    badgeStyleClass: getOrExecute(kvMenuItem.badgeStyleClass, data),
+    style: getOrExecute(kvMenuItem.style, data),
+    styleClass: getOrExecute(kvMenuItem.styleClass, data),
+    title: getOrExecute(kvMenuItem.title, data),
+    id: getOrExecute(kvMenuItem.id, data),
+    automationId: getOrExecute(kvMenuItem.automationId, data),
+    tabindex: getOrExecute(kvMenuItem.tabindex, data),
+    routerLink: getOrExecute(kvMenuItem.routerLink, data),
+    queryParams: getOrExecute(kvMenuItem.queryParams, data),
+    fragment: getOrExecute(kvMenuItem.fragment, data),
+    queryParamsHandling: getOrExecute(kvMenuItem.queryParamsHandling, data),
+    preserveFragment: getOrExecute(kvMenuItem.preserveFragment, data),
+    skipLocationChange: getOrExecute(kvMenuItem.skipLocationChange, data),
+    replaceUrl: getOrExecute(kvMenuItem.replaceUrl, data),
+    iconStyle: getOrExecute(kvMenuItem.iconStyle, data),
+    iconClass: getOrExecute(kvMenuItem.iconClass, data),
+    state: getOrExecute(kvMenuItem.state, data),
+    tooltipOptions: getOrExecute(kvMenuItem.tooltipOptions, data),
+  };
+}

package/src/lib/api/components/table/table-dropdown-control.ts

@@ -0,0 +1,6 @@
+export default interface FieldDropDownControl {
+  fieldControlDropdownService?: any;
+  fieldControlDropdownSource?: any;
+  idobjeto: string;
+  descricaoobjeto: string;
+}

package/src/lib/api/components/table/table.config.column.ts

@@ -0,0 +1,31 @@
+import { ValueOrFn } from "./kv-menuitem";
+import FieldDropDownControl from "./table-dropdown-control";
+
+export interface TableConfigColumn {
+  position?: number;
+  field: string;
+  header: string;
+  headerTooltip?: string;
+  fieldType?: string;
+  onlyReadField?: boolean;
+  width?: string;
+  pipe?: 'date' | 'datetime' | 'dateMonthYear' | 'decimal' | 'cpfcnpj' | 'telefone' | 'codigofipe' | 'money' | 'percentage' | 'capitalize';
+  sortable: boolean;
+  grouped?: boolean;
+  centralize?: boolean;
+  expiredDate?: boolean;
+  icon?: string;
+  iconField?: boolean;
+  indIconMaterial?: boolean;
+  checked?: boolean;
+  hideColumn?: boolean;
+  fixedColumn?: boolean;
+  template?: any;
+  align?: string;
+  subtitle?: string;
+  boolean?: boolean;
+  templateOnly?: 'pai' | 'filho'
+  tagColor?: ((rowData: any, col: any, data?: any) => string);
+  tooltipTag?: ((rowData: any, col: any, data?: any) => string);
+  tooltip?: ((rowData: any, col: any, data?: any) => string);
+}

package/src/lib/api/components/table/table.config.ts

@@ -0,0 +1,36 @@
+import { TableConfigColumn } from './table.config.column';
+import { KvMenuItem, ValueOrFn } from './kv-menuitem';
+import Severity from '../../types/severity';
+
+export interface TableConfig {
+  actions?: KvMenuItem[];
+  actionsLote?: ActionsLoteItem[];
+  columns: TableConfigColumn[];
+  dataKey?: string;
+  rows?: any;
+  title?: string;
+  subtitle?: string;
+  lazy: boolean;
+  fieldGroup?: string;
+  enableCation?: boolean;
+  enableFilter?: boolean;
+  enableSelect?: boolean;
+  enableToggleNodes?: boolean;
+  // visibleControlCheckboxFunction?: (rowData: any) => boolean; // A função que controla a edição
+  disableControlCheckboxFunction?: (rowData: any, rowNode?: any) => boolean; // A função que controla a edição
+  fieldGroupColorFunction?: (data: any) => string;
+  disableRow?: (rowData: any) => boolean;
+}
+
+export interface ActionsLoteItem {
+  /**
+   * Ignorado por enquanto
+   */
+  severity?: 'primary' | 'secondary' | 'tertiary';
+  icon: string;
+  showAcoesLote?: boolean;
+  tooltip?: ValueOrFn<string | undefined>;
+  disabled?: ValueOrFn<boolean | undefined>;
+  visible?: ValueOrFn<boolean | undefined>;
+  command?: () => void;
+}

package/src/lib/api/components/table/table.paginate.ts

@@ -0,0 +1,6 @@
+export class TablePaginate {
+  paginaInicial: number = 1;
+  tamanhoPagina: number = 10;
+  termoPesquisa: string = '';
+  ordenacao: string = '';
+}

package/src/lib/api/components/table/tabledit.config.ts

@@ -0,0 +1,10 @@
+import { TableConfig } from "./table.config";
+import { TableConfigColumn } from "./table.config.column";
+import { TableEditConfigColumn } from "./tableedit.config.column";
+
+export default interface TableEditConfig extends TableConfig {
+  columns: TableEditConfigColumn[];
+  dataKey: string;
+  reorderableColumns?: boolean;
+  disableEditRowFunction?: (rowData: any, rowNode?: any) => boolean;
+}

package/src/lib/api/components/table/tableedit.config.column.ts

@@ -0,0 +1,12 @@
+import FieldDropDownControl from "./table-dropdown-control";
+import { TableConfigColumn } from "./table.config.column";
+
+export interface TableEditConfigColumn extends TableConfigColumn {
+  required?: boolean;
+  validator?: any;
+  mask?: string;
+  fieldControlType?: 'text' | 'switch' | 'dropdown' | 'multiselect' | 'number' | 'calendar' | 'mask';
+  fieldDropDownControl?: FieldDropDownControl;
+  disableEditRowCellFunction?: (rowData: any, rowNode?: any) => boolean;
+
+}

package/src/lib/api/components/tree-table/tree-table.config.ts

@@ -0,0 +1,31 @@
+import { TableConfigColumn } from '../table/table.config.column';
+import { KvMenuItem, ValueOrFn } from '../table/kv-menuitem';
+import Severity from '../../types/severity';
+import { ActionsLoteItem } from '../table/table.config';
+
+export interface TreeTableConfig {
+  actions?: KvMenuItem[];
+  actionsLote?: ActionsLoteItem[];
+  actionsPai?: ActionsPaiItem[];
+  columns: TableConfigColumn[];
+  dataKey?: string;
+  rows?: any;
+  title?: string;
+  subtitle?: string;
+  lazy: boolean;
+  fieldGroup?: string;
+  enableCation?: boolean;
+  enableFilter?: boolean;
+  enableSelect?: boolean;
+  enableToggleNodes?: boolean;
+  // visibleControlCheckboxFunction?: (rowData: any) => boolean; // A função que controla a edição
+  disableControlCheckboxFunction?: (rowData: any, rowNode?: any) => boolean; // A função que controla a edição
+  disableControlEnableFunction?: (rowData: any, rowNode?: any) => boolean; // A função que controla a edição
+}
+
+interface ActionsPaiItem {
+  severity?: 'primary' | 'secondary' | 'tertiary';
+  visible?: ValueOrFn<boolean | undefined>;
+  command: (event: MouseEvent) => void;
+  icon: string;
+};

package/src/lib/api/directives/directives.module.ts

@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+
+import { DragDirective } from './drag/drag.directive';
+import { TemplateDirective } from './template/template.directive';
+import { DynamicInputDirective } from './stepper/dynamicinput.directive';
+
+@NgModule({
+  declarations: [
+    DragDirective,
+    TemplateDirective,
+    DynamicInputDirective
+  ],
+  exports:[
+    DragDirective,
+    TemplateDirective,
+    DynamicInputDirective
+  ]
+})
+export class DirectiveModule { }

package/src/lib/api/directives/drag/drag.directive.ts

@@ -0,0 +1,40 @@
+import {
+    Directive,
+    Output,
+    EventEmitter,
+    HostBinding,
+    HostListener
+  } from '@angular/core';
+
+  @Directive({
+    selector: '[appDrag]'
+  })
+  export class DragDirective {
+    @HostBinding('class.fileover') fileOver!: boolean;
+    @Output() fileDropped = new EventEmitter<any>();
+
+    // Dragover listener
+    @HostListener('dragover', ['$event']) onDragOver(evt: any) {
+      evt.preventDefault();
+      evt.stopPropagation();
+      this.fileOver = true;
+    }
+
+    // Dragleave listener
+    @HostListener('dragleave', ['$event']) public onDragLeave(evt: any) {
+      evt.preventDefault();
+      evt.stopPropagation();
+      this.fileOver = false;
+    }
+
+    // Drop listener
+    @HostListener('drop', ['$event']) public ondrop(evt: any) {
+      evt.preventDefault();
+      evt.stopPropagation();
+      this.fileOver = false;
+      let files = evt.dataTransfer.files;
+      if (files.length > 0) {
+        this.fileDropped.emit(files);
+      }
+    }
+  }

package/src/lib/api/directives/stepper/dynamicinput.directive.ts

@@ -0,0 +1,23 @@
+import { Directive, Input, ViewContainerRef, ComponentRef, Type } from '@angular/core';
+
+@Directive({
+  selector: '[dynamicComponent]'
+})
+export class DynamicInputDirective {
+  @Input() set dynamicComponent({ component, inputs }: { component: Type<any>, inputs: { [key: string]: any } }) {
+    if (component) {
+      const componentRef = this.vcr.createComponent(component);
+      this.applyInputs(componentRef, inputs);
+    }
+  }
+
+  constructor(private vcr: ViewContainerRef) { }
+
+  private applyInputs(componentRef: ComponentRef<any>, inputs: { [key: string]: any }) {
+    if (inputs) {
+      for (const key of Object.keys(inputs)) {
+        componentRef.instance[key] = inputs[key];
+      }
+    }
+  }
+}

package/src/lib/api/directives/template/template.directive.ts

@@ -0,0 +1,15 @@
+import { Directive, Input, TemplateRef } from '@angular/core';
+
+@Directive({
+  selector: '[cTemplate]'
+})
+export class TemplateDirective {
+  @Input() type!: string;
+  @Input('cTemplate') name!: string;
+
+  constructor(public template: TemplateRef<any>) { }
+
+  getType(): string {
+    return this.name;
+  }
+}

package/src/lib/api/helpers/component-providers.ts

@@ -0,0 +1,16 @@
+import { Provider, forwardRef } from "@angular/core";
+import { NG_VALUE_ACCESSOR } from "@angular/forms";
+import { ComponentService } from '../services/component.service';
+
+export function ComponentProviders(ref: any): Provider[] {
+  return [
+    {
+      provide: NG_VALUE_ACCESSOR,
+      useExisting: forwardRef(() => ref),
+      multi: true,
+    },
+    {
+      provide: ComponentService
+    }
+  ]
+}

package/src/lib/api/helpers/keevo-validators.ts

@@ -0,0 +1,126 @@
+import { AbstractControl, FormGroup, ValidationErrors, ValidatorFn, Validators } from '@angular/forms';
+import { DocsService } from '../services/docs.service';
+
+export class KeevoValidators {
+  static required(erroMessage?: string): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      if (Validators.required(control))
+        return { required: true, erroMessage: `${erroMessage ? erroMessage : 'Campo obrigatório'}` };
+
+      return null;
+    };
+  }
+
+  static dateGreaterThan(startControlName: string, erroMessage?: string): ValidatorFn {
+    return (endControl: AbstractControl): ValidationErrors | null => {
+      const parent = endControl.parent as FormGroup;
+
+      if (!parent) return null;
+
+      const startControl: AbstractControl = parent.get(startControlName) as AbstractControl;
+
+      const startDate: Date = startControl.value;
+      const endDate: Date = endControl.value;
+
+      if (!startDate || !endDate) {
+        return null;
+      }
+      if (startDate > endDate) {
+        return { greaterThan: true, erroMessage: erroMessage };
+      }
+      return null;
+    };
+  }
+
+  static dateLessThan(startControlName: string, erroMessage?: string): ValidatorFn {
+    return (endControl: AbstractControl): ValidationErrors | null => {
+      const parent = endControl.parent as FormGroup;
+
+      if (!parent) return null;
+
+      const startControl: AbstractControl = parent.get(startControlName) as AbstractControl;
+
+      const startDate: Date = startControl.value;
+      const endDate: Date = endControl.value;
+
+      if (!startDate || !endDate) {
+        return null;
+      }
+      if (startDate < endDate) {
+        return { greaterThan: true, erroMessage: erroMessage };
+      }
+      return null;
+    };
+  }
+
+  static min(min: number, erroMessage?: string): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      if (Validators.min(min)(control))
+        return { min: true, erroMessage: `${erroMessage ? erroMessage : 'Informe um valor maior ou igual à '}${min}` };
+
+      return null;
+    };
+  }
+
+  static max(min: number, erroMessage?: string): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      if (Validators.max(min)(control))
+        return { min: true, erroMessage: `${erroMessage ? erroMessage : 'Informe um valor menor ou igual à '}${min}` };
+
+      return null;
+    };
+  }
+
+  static email(erroMessage?: string): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      if (Validators.email(control)) {
+        return { email: true, erroMessage: `${erroMessage ? erroMessage : 'Endereço de e-mail inválido!'}` };
+      }
+      return null;
+    };
+  }
+
+  static maxLengthArray(max: number): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      if (control.value.length < max)
+        return null;
+
+      return { maxLengthArray: true, erroMessage: 'Tamanho máximo excedido!' };
+    }
+  }
+
+  static maxLength(max: number, erroMessage?: string): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      if (Validators.maxLength(max)(control))
+        return { maxLength: true, erroMessage: `${erroMessage ? erroMessage : 'Limite máximo de ${max} caracteres atingido!'}` };
+      return null;
+    }
+  }
+
+  static minLength(min: number, erroMessage?: string): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      if (Validators.minLength(min)(control))
+        return { minLength: true, erroMessage: `${erroMessage ? erroMessage : 'É necessário mínimo de ${min} caracteres!'}` };
+      return null;
+    }
+  }
+
+  static nome(): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      let palavras = control.value.trim().split(' ');
+      if (palavras?.length < 2)
+        return { nome: true, erroMessage: 'Digite seu nome completo.' };
+      return null;
+    }
+  }
+
+  static cpfCnpjValido(erroMessage?: string): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+      let value = (control.value ?? '').replace(/\D/g, '');
+      if (!DocsService.validaCpfCnpj(value)) {
+        return { cpfcnpj: true, erroMessage: `${erroMessage ? erroMessage : 'CPF/CNPJ inválido!'}` };
+      }
+      return null;
+    };
+  }
+}

package/src/lib/api/helpers/severity-color.ts

@@ -0,0 +1,77 @@
+import Severity from "../types/severity";
+
+export function severityColorNormal(severity: Severity): string {
+  switch (severity) {
+    case "primary":
+      return "#002542";
+    case "secondary":
+      return "#F2F3F5";
+    case "success":
+      return "#29B92D";
+    case "info":
+      return "#03A9F4";
+    case "warning":
+      return "#FFC107";
+    case "help":
+      return "#9C27B0";
+    case "danger":
+      return "#F44336";
+  }
+}
+
+export function severityColorHover(severity: Severity): string {
+  switch (severity) {
+    case "primary":
+      return "#002038";
+    case "secondary":
+      return "#D9DADB";
+    case "success":
+      return "#249A29";
+    case "info":
+      return "#039BE5";
+    case "warning":
+      return "#FFB300";
+    case "help":
+      return "#8E24AA";
+    case "danger":
+      return "#E53935";
+  }
+}
+
+export function severityColorActive(severity: Severity): string {
+  switch (severity) {
+    case "primary":
+      return "#001729";
+    case "secondary":
+      return "#C0C1C2";
+    case "success":
+      return "#1C801F";
+    case "info":
+      return "#0288D1";
+    case "warning":
+      return "#FFA000";
+    case "help":
+      return "#7B1FA2";
+    case "danger":
+      return "#d32f2f";
+  }
+}
+
+export function severityColorText(severity: Severity): string {
+  switch (severity) {
+    case "primary":
+      return "#FFFFFF";
+    case "secondary":
+      return "#212121";
+    case "success":
+      return "#FFFFFF";
+    case "info":
+      return "#FFFFFF";
+    case "warning":
+      return "#495057"
+    case "help":
+      return "#FFFFFF";
+    case "danger":
+      return "#FFFFFF";
+  }
+}

package/src/lib/api/helpers/translate-primeng.ts

@@ -0,0 +1,25 @@
+import { PrimeNGConfig } from 'primeng/api';
+
+export class TranslatePrimeng {
+  public config(config: PrimeNGConfig): void {
+    config.ripple = true;
+
+    config.setTranslation({
+      monthNames: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'],
+      monthNamesShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
+      dayNames: ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sabádo'],
+      dayNamesShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sab'],
+      dayNamesMin: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sab'],
+      today: 'Hoje',
+      weekHeader: 'Semana',
+      emptyMessage: 'Nenhum resultado encontrado',
+      emptyFilterMessage: 'Nenhum registro encontrado com o filtro informado',
+      weak: 'Fraca',
+      medium: 'Média',
+      strong: 'Forte',
+      passwordPrompt: 'Informe a senha',
+      clear: 'Limpar',
+      apply: 'Aplicar'
+    });
+  }
+}