keevo-components 1.5.190 → 1.5.191

package/src/lib/inputs/input-text-checkbox/input-text-checkbox.component.spec.ts

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

package/src/lib/inputs/input-text-checkbox/input-text-checkbox.component.ts

@@ -0,0 +1,36 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { ComponentProviders } from '../../api/helpers/component-providers';
+import { BaseComponentInput } from '../../api/base-components/base-component-input';
+import { ComponentService } from '../../api/services/component.service';
+
+@Component({
+  selector: 'kv-input-text-checkbox',
+  templateUrl: './input-text-checkbox.component.html',
+  styleUrls: ['./input-text-checkbox.component.scss'],
+  providers: ComponentProviders(InputTextCheckboxComponent),
+})
+export class InputTextCheckboxComponent extends BaseComponentInput<string> implements OnInit {
+  constructor(componentService: ComponentService) {
+    super(componentService);
+  }
+
+  @Output() checkBoxEmit: EventEmitter<boolean> = new EventEmitter<boolean>();
+
+  @Input() tooltipCheckbox!: string;
+
+  private _checkBoxValue: boolean = false;
+
+  set checkBoxValue(value: boolean) {
+    this._checkBoxValue = value;
+    this.emitCheckBoxValue();
+  }
+
+  get checkBoxValue(): boolean {
+    return this._checkBoxValue;
+  }
+
+  emitCheckBoxValue(): void {
+    this.checkBoxEmit.emit(this._checkBoxValue);
+  }
+
+}

package/src/lib/inputs/input-textarea/input-textarea.component.html

@@ -0,0 +1,22 @@
+<span>
+
+  <kv-label
+    [componentId]="componentId"
+    [label]="label"
+  />
+  <textarea
+    pInputTextarea
+    [autoResize]="autoResize"
+    [class]="baseInputClass"
+    [cols]="cols"
+    [disabled]="disabled"
+    [id]="componentId"
+    [rows]="rows"
+    [(ngModel)]="value"
+    (blur)="onInputBlur($event)"
+  >
+  </textarea>
+
+  <kv-error [hasError]="hasControlError()">{{ erroMessage() }}</kv-error>
+</span>
+<ng-content></ng-content>

package/src/lib/inputs/input-textarea/input-textarea.component.ts

@@ -0,0 +1,33 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { BaseComponentInput } from '../../api/base-components/base-component-input';
+import { ComponentProviders } from '../../api/helpers/component-providers';
+import { ComponentService } from '../../api/services/component.service';
+
+
+@Component({
+  selector: 'kv-input-textarea',
+  templateUrl: './input-textarea.component.html',
+  styleUrls: ['./input-textarea.component.scss', '../../styles-components.scss'],
+  providers: ComponentProviders(InputTextareaComponent),
+})
+export class InputTextareaComponent extends BaseComponentInput<string> implements OnInit {
+  @Input() multiline: boolean = false;
+  @Input() rows: number = 2;
+  @Input() cols: number = 20;
+  @Input() autoResize: boolean = false;
+  @Input() maxValueLength: number = 0;
+
+  counterValueLength: number = 0;
+
+  constructor(componentService: ComponentService) {
+    super(componentService);
+  }
+
+  override ngOnInit(): void {
+    super.ngOnInit();
+
+    this.formControl?.valueChanges.subscribe((value: any) => {
+      this.counterValueLength = value?.length;
+    });
+  }
+}

package/src/lib/inputs/input-time/input-time.component.html

@@ -0,0 +1,23 @@
+<span>
+
+  <kv-label
+    [componentId]="componentId"
+    [label]="label"
+  />
+  <p-calendar
+    appendTo="body"
+    [class]="baseInputClass"
+    [id]="componentId"
+    [(ngModel)]="value"
+    [disabled]="disabled"
+    [showIcon]="showIcon"
+    styleClass="inputs"
+    [showTime]="true"
+    [timeOnly]="true"
+    (onBlur)="onInputBlur($event)"
+  >
+  </p-calendar>
+
+  <kv-error [hasError]="hasControlError()">{{ erroMessage() }}</kv-error>
+</span>
+<ng-content></ng-content>

package/src/lib/inputs/input-time/input-time.component.ts

@@ -0,0 +1,20 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { BaseComponentInput } from '../../api/base-components/base-component-input';
+import { ComponentProviders } from '../../api/helpers/component-providers';
+import { ComponentService } from '../../api/services/component.service';
+
+
+@Component({
+  selector: 'kv-input-time',
+  templateUrl: './input-time.component.html',
+  styleUrls: ['./input-time.component.scss', '../../styles-components.scss'],
+  providers: ComponentProviders(InputTimeComponent),
+})
+export class InputTimeComponent extends BaseComponentInput<string> implements OnInit {
+
+  @Input() showIcon: boolean = true;
+
+  constructor(componentService: ComponentService) {
+    super(componentService);
+  }
+}

package/src/lib/inputs/kvinputs.module.ts

@@ -0,0 +1,64 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { CheckComponent } from './check/check.component';
+import { DropdownComponent } from './dropdown/dropdown.component';
+import { InputCalendarComponent } from './input-calendar/input-calendar.component';
+import { InputMaskComponent } from './input-mask/input-mask.component';
+import { InputNumberComponent } from './input-number/input-number.component';
+import { InputPasswordComponent } from './input-password/input-password.component';
+import { InputTextComponent } from './input-text/input-text.component';
+import { InputTextareaComponent } from './input-textarea/input-textarea.component';
+import { InputTimeComponent } from './input-time/input-time.component';
+import { MultiSelectComponent } from './multi-select/multi-select.component';
+import { SwitchComponent } from './switch/switch.component';
+import { kvErrorModule } from '../api/components/error/kverror.module';
+import { PrimeNgModule } from '../api/modules/primeng.module';
+import { RadioGroupComponent } from './radio-group/radio-group.component';
+import { InputTextCheckboxComponent } from './input-text-checkbox/input-text-checkbox.component';
+import { LabelModule } from '../label/label.module';
+import { EditorComponent } from './editor/editor.component';
+
+@NgModule({
+  declarations: [
+    CheckComponent,
+    DropdownComponent,
+    InputCalendarComponent,
+    InputMaskComponent,
+    InputNumberComponent,
+    InputPasswordComponent,
+    InputTextComponent,
+    InputTextareaComponent,
+    InputTimeComponent,
+    MultiSelectComponent,
+    SwitchComponent,
+    RadioGroupComponent,
+    InputTextCheckboxComponent,
+    EditorComponent
+  ],
+  imports: [
+    CommonModule,
+    FormsModule,
+    kvErrorModule,
+    PrimeNgModule,
+    ReactiveFormsModule,
+    LabelModule
+  ],
+  exports: [
+    CheckComponent,
+    DropdownComponent,
+    InputCalendarComponent,
+    InputMaskComponent,
+    InputNumberComponent,
+    InputPasswordComponent,
+    InputTextComponent,
+    InputTextareaComponent,
+    InputTimeComponent,
+    MultiSelectComponent,
+    SwitchComponent,
+    RadioGroupComponent,
+    InputTextCheckboxComponent,
+    EditorComponent
+  ]
+})
+export class KvInputsModule { }

package/src/lib/inputs/multi-select/multi-select.component.html

@@ -0,0 +1,28 @@
+<span [ngClass]="{'disable':  optionInactive === true}">
+  <kv-label
+    [componentId]="componentId"
+    [label]="label"
+  />
+
+  <p-multiSelect
+    appendTo="body"
+    display="chip"
+    inputId="multiselect"
+    styleClass="inputs"
+    [class]="baseInputClass"
+    [group]="group"
+    [disabled]="disabled"
+    [options]="options"
+    [optionDisabled]=" inactiveOptions"
+    [optionLabel]="optionLabel"
+    [optionValue]="optionValue"
+    [filter]="filter"
+    [showClear]="showClear"
+    [(ngModel)]="value"
+    (onChange)="selectionChange($event)"
+    (onPanelHide)="panelHide($event)"
+  >
+  </p-multiSelect>
+  <kv-error [hasError]="hasControlError()">{{ erroMessage() }}</kv-error>
+</span>
+<ng-content></ng-content>

package/src/lib/inputs/multi-select/multi-select.component.scss

@@ -0,0 +1,8 @@
+:host ::ng-deep .disable .p-multiselect.p-multiselect-chip .p-multiselect-token .p-icon-wrapper {
+  display: none !important;
+}
+
+
+::ng-deep .p-multiselect.p-multiselect-chip .p-multiselect-token {
+  padding: 0.1rem 0.4rem;
+}

package/src/lib/inputs/multi-select/multi-select.component.ts

@@ -0,0 +1,31 @@
+import { Component, Input } from '@angular/core';
+import { ComponentProviders } from '../../api/helpers/component-providers';
+import { ComponentService } from '../../api/services/component.service';
+import { BaseComponentMultiSelect } from '../../api/base-components/base-component-multi-select';
+
+@Component({
+  selector: 'kv-multi-select',
+  templateUrl: './multi-select.component.html',
+  styleUrls: ['./multi-select.component.scss', '../../styles-components.scss'],
+  providers: ComponentProviders(MultiSelectComponent),
+})
+export class MultiSelectComponent extends BaseComponentMultiSelect {
+  @Input() optionInactive!: boolean;
+  @Input() group: boolean = false;
+
+  inactiveOptions!: string;
+  override ngOnInit(): void {
+    super.ngOnInit();
+    if (this.optionInactive == true) {
+      this.inactiveOptions = 'inactive';
+      this.options.map((element: Object, index: number) => {
+        Object.defineProperty(element, 'inactive', {
+          value: true,
+        });
+      });
+    }
+  }
+  constructor(componentService: ComponentService) {
+    super(componentService);
+  }
+}

package/src/lib/inputs/radio-group/radio-group.component.html

@@ -0,0 +1,19 @@
+<kv-label [label]="label" />
+<div [class.vertical-radio-group]="vertical">
+  <div class="option" *ngFor="let option of options; let isFirst = first">
+    <p-radioButton
+      [inputId]="option.id"
+      name="option"
+      [value]="option"
+      [(ngModel)]="selectedOpt"
+      (onClick)="selectedOption($event)"
+      [disabled]="disabled"
+      [class.ml-3]="!isFirst && !vertical"
+    >
+    </p-radioButton>
+    <label [for]="option.id" class="radio-option-label">
+      {{ option.description }}</label
+    >
+  </div>
+  <kv-error [hasError]="hasControlError()">{{ erroMessage() }}</kv-error>
+</div>

package/src/lib/inputs/radio-group/radio-group.component.scss

@@ -0,0 +1,15 @@
+.option {
+  display: inline-block;
+  margin: 0;
+  height: 35px;
+  padding-top: 0.75rem;
+}
+
+.vertical-radio-group {
+  display: flex;
+  flex-direction: column;
+}
+
+.radio-option-label {
+  font-size: 1rem;
+}

package/src/lib/inputs/radio-group/radio-group.component.ts

@@ -0,0 +1,50 @@
+import { Component, DoCheck, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { BaseComponentInput } from '../../api/base-components/base-component-input';
+import { ComponentService } from '../../api/services/component.service';
+import { ComponentProviders } from '../../api/helpers/component-providers';
+
+
+@Component({
+  selector: 'kv-radio-group',
+  templateUrl: './radio-group.component.html',
+  styleUrls: ['./radio-group.component.scss', '../../styles-components.scss'],
+  providers: ComponentProviders(RadioGroupComponent),
+})
+export class RadioGroupComponent extends BaseComponentInput<any> implements OnInit, DoCheck {
+
+  @Input() options: any[] = [
+    { id: 0, description: 'Não'},
+    { id: 1, description: 'Sim'},
+  ];
+
+  @Input() optionValueDefault!: any
+
+  @Output() onSelectedOption: EventEmitter<any> = new EventEmitter();
+
+  @Input() vertical: boolean = false;
+
+  selectedOpt: any = null;
+
+  constructor(componentService: ComponentService) {
+    super(componentService);
+  }
+
+  override ngOnInit(): void {
+    this.selectedDefault();
+  }
+
+  ngDoCheck(): void {
+    this.selectedDefault();
+  }
+
+  selectedDefault() {
+    if (this.optionValueDefault != undefined && !this.selectedOpt) {
+      let item = this.options.find(opt => opt.id === this.optionValueDefault);
+      if (item) this.selectedOpt = item;      
+    }
+  }
+
+  selectedOption(event: any) {
+    this.onSelectedOption.emit(event.value.id);
+  }
+}

package/src/lib/inputs/switch/switch.component.html

@@ -0,0 +1,12 @@
+<div class="center field-checkbox">
+
+  <p-inputSwitch
+    [inputId]="componentId"
+    [(ngModel)]="value"
+    [disabled]="disabled"
+    (ngModelChange)="emitOnSwitchChange($event)">
+  </p-inputSwitch>
+  <label [for]="componentId">{{ label }}</label>
+
+  <kv-error [hasError]="hasControlError()">{{ erroMessage() }}</kv-error>
+</div>

package/src/lib/inputs/switch/switch.component.scss

@@ -0,0 +1,3 @@
+p-inputSwitch {
+  padding-right: 0.5rem;
+}

package/src/lib/inputs/switch/switch.component.ts

@@ -0,0 +1,30 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { ComponentProviders } from '../../api/helpers/component-providers';
+import { BaseComponentInput } from '../../api/base-components/base-component-input';
+import { ComponentService } from '../../api/services/component.service';
+
+
+@Component({
+  selector: 'kv-switch',
+  templateUrl: './switch.component.html',
+  styleUrls: ['./switch.component.scss', '../../styles-components.scss'],
+  providers: ComponentProviders(SwitchComponent),
+})
+export class SwitchComponent extends BaseComponentInput<boolean> implements OnInit {
+
+  @Input() switchValue!: boolean;
+  @Output() onSwitchChange: EventEmitter<any> = new EventEmitter();
+
+  constructor(componentService: ComponentService) {
+    super(componentService);
+  }
+
+  override ngOnInit(): void {
+    if (this.switchValue)
+      this.value = this.switchValue;
+  }
+
+  emitOnSwitchChange(event: any) {
+    this.onSwitchChange.emit(event);
+  }
+}

package/src/lib/keevo-components.module.ts

@@ -0,0 +1,50 @@
+import { NgModule } from '@angular/core';
+import { KvButtonsModule } from './buttons/kvbutton.module';
+import { KvInputsModule } from './inputs/kvinputs.module';
+import { KvTableModule } from './table/kvtable.module';
+import { KvtreeViewModule } from './tree-view/kvtree-view.module';
+import { KvChartModule } from './chart/kvchart.module';
+import { KvMenuModule } from './menu/kvmenu.module';
+import { KvPickListModule } from './picklist/kvpicklist.module';
+import { KVTreeTableModule } from './tree-table/kv-treetable.module';
+import { OrgchartModule } from './orgchart/orgchart.module';
+import { KvWorkspaceModule } from './workspace/kvworkspace.module';
+import { KvLoginModule } from './login/kvlogin.module';
+import { KvPageFormModule } from './page-form/kv-page-form.module';
+import { KvLoaderModule } from './loader/kvloader.module';
+
+@NgModule({
+  declarations: [
+  ],
+  imports: [
+    KvInputsModule,
+    KvButtonsModule,
+    KvTableModule,
+    KvtreeViewModule,
+    KvChartModule,
+    KvMenuModule,
+    KvPickListModule,
+    KVTreeTableModule,
+    KvWorkspaceModule,
+    OrgchartModule,
+    KvLoginModule,
+    KvPageFormModule,
+    KvLoaderModule
+  ],
+  exports: [
+    KvInputsModule,
+    KvButtonsModule,
+    KvTableModule,
+    KvtreeViewModule,
+    KvChartModule,
+    KvMenuModule,
+    KvPickListModule,
+    KVTreeTableModule,
+    KvWorkspaceModule,
+    OrgchartModule,
+    KvLoginModule,
+    KvPageFormModule,
+    KvLoaderModule
+  ]
+})
+export class KeevoComponentsModule { }

package/src/lib/label/label.component.html

@@ -0,0 +1,6 @@
+<p class="m-0">
+    <label
+        [for]="componentId"
+        class="label-style"
+    >{{ label }}</label>
+</p>

package/src/lib/label/label.component.scss

@@ -0,0 +1,9 @@
+::ng-deep .label-style {
+    position: relative;
+    // top: 13px;
+    left: 1px;
+    font-size: 0.80rem !important;
+    padding-top: 0rem;
+    padding-bottom: 0rem;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
+}

package/src/lib/label/label.component.spec.ts

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

package/src/lib/label/label.component.ts

@@ -0,0 +1,13 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'kv-label',
+  templateUrl: './label.component.html',
+  styleUrls: ['./label.component.scss']
+})
+export class LabelComponent {
+
+  @Input() componentId!: string;
+  @Input() label!: string;
+
+}

package/src/lib/label/label.module.ts

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { LabelComponent } from './label.component';
+
+
+
+@NgModule({
+  declarations: [
+    LabelComponent
+  ],
+  imports: [
+    CommonModule
+  ],
+  exports: [
+    LabelComponent
+  ]
+})
+export class LabelModule { }

package/src/lib/loader/kvloader.module.ts

@@ -0,0 +1,17 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { NgxLoadingModule } from 'ngx-loading';
+
+import { LoaderComponent } from './loader.component';
+
+@NgModule({
+  declarations: [LoaderComponent],
+  exports: [LoaderComponent],
+  imports: [
+    CommonModule,
+    NgxLoadingModule.forRoot({
+      fullScreenBackdrop: true
+    })
+  ]
+})
+export class KvLoaderModule { }

package/src/lib/loader/loader.component.html

@@ -0,0 +1 @@
+<ngx-loading [show]="(loading | async) || false"></ngx-loading>

package/src/lib/loader/loader.component.ts

@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import { Subject } from 'rxjs';
+import { LoaderService } from './loader.service';
+
+@Component({
+  selector: 'kv-loader',
+  templateUrl: './loader.component.html'
+})
+export class LoaderComponent {
+
+  public loading: Subject<boolean> = LoaderService.isLoading;
+
+  constructor() { }
+}

package/src/lib/loader/loader.service.ts

@@ -0,0 +1,26 @@
+import { Injectable } from '@angular/core';
+import { Observable, Subject, finalize } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class LoaderService {
+  public static isLoading = new Subject<boolean>();
+
+  static show() {
+    this.isLoading.next(true);
+  }
+
+  static hide() {
+    this.isLoading.next(false);
+  }
+}
+
+export const loading = (): any => {
+  return (src: Observable<any>) => {
+    LoaderService.show();
+    return src.pipe(finalize(() => {
+      LoaderService.hide();
+    }));
+  };
+};

package/src/lib/login/kvlogin.module.ts

@@ -0,0 +1,28 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { LoginComponent } from './login.component';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { PrimeNgModule } from '../api/modules/primeng.module';
+import { KvInputsModule } from '../inputs/kvinputs.module';
+import { KvButtonsModule } from '../buttons/kvbutton.module';
+import { ProgressSpinnerModule } from 'primeng/progressspinner';
+
+
+@NgModule({
+  declarations: [
+    LoginComponent
+  ],
+  imports: [
+    CommonModule,
+    PrimeNgModule,
+    FormsModule,
+    ReactiveFormsModule,
+    KvInputsModule,
+    KvButtonsModule,
+    ProgressSpinnerModule,
+  ],
+  exports: [
+    LoginComponent
+  ]
+})
+export class KvLoginModule { }