@verisoft/ui-primeng 18.7.0 → 18.8.0

package/src/lib/components/shared-components/generic-form/generic-form.component.ts

@@ -1,57 +0,0 @@
-import { CommonModule } from '@angular/common';
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  OnChanges,
-  SimpleChanges,
-} from '@angular/core';
-import { ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
-import { TranslateModule } from '@ngx-translate/core';
-import { GenericFieldDefinition } from '@verisoft/ui-core';
-import { GenericFieldComponent } from '../generic-field';
-import {
-  generateFormGroup,
-  getColumnClass,
-} from './generic-form.model';
-
-@Component({
-  selector: 'v-generic-form',
-  standalone: true,
-  imports: [
-    CommonModule,
-    GenericFieldComponent,
-    ReactiveFormsModule,
-    TranslateModule,
-  ],
-  templateUrl: './generic-form.component.html',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class GenericFormComponent implements OnChanges {
-  @Input() formGroup?: UntypedFormGroup;
-
-  @Input() fields?: GenericFieldDefinition[];
-
-  @Input() columns?: number;
-
-  @Input() showAsRow!: boolean;
-
-  formGroupComputed!: UntypedFormGroup;
-
-  columnClass?: string;
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes['fields'] || changes['formGroup']) {
-      this.formGroupComputed = generateFormGroup(
-        this.fields,
-        this.formGroupComputed,
-        this.formGroup,
-        !!changes['formGroup']
-      );
-    }
-
-    if (changes['columns']) {
-      this.columnClass = getColumnClass(this.columns);
-    }
-  }
-}

package/src/lib/components/shared-components/generic-form/generic-form.model.spec.ts

@@ -1,82 +0,0 @@
-import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
-import { generateFormGroup, GenericFieldDefinition } from './generic-form.model';
-
-describe('GenericFormModel', () => {
-  describe('generateFormGroup', () => {
-    const fields = [{ name: 'name' }, { name: 'age' }];
-
-    const containsField = (formGroup: UntypedFormGroup, field: GenericFieldDefinition) => expect(formGroup.get(field.name)).toBeDefined();
-
-    test('Should create a new group when no group was provided', () => {
-      const formGroup = generateFormGroup([], undefined, undefined, false);
-
-      expect(formGroup).toBeDefined();
-    });
-
-    test('Should create a new group when no fields are provided', () => {
-      const formGroup = generateFormGroup(
-        undefined,
-        undefined,
-        undefined,
-        false
-      );
-
-      expect(formGroup).toBeDefined();
-    });
-
-    test('Should create a new group with defined control when fields are provided', () => {
-      const formGroup = generateFormGroup(fields, undefined, undefined, false);
-
-      expect(formGroup).toBeDefined();
-      containsField(formGroup, fields[0]);
-      containsField(formGroup, fields[1]);
-    });
-
-    test('Should used input group and creates control when fields are provided and formgroup does not have a controls', () => {
-      const inputGroup = new UntypedFormGroup({});
-
-      const formGroup = generateFormGroup(fields, undefined, inputGroup, false);
-
-      expect(formGroup).toBe(inputGroup);
-      containsField(formGroup, fields[0]);
-    });
-
-    test('Should not remove control from input group when input group is provided and fields does not contain control definition.', () => {
-      const inputGroup = new UntypedFormGroup({
-        student: new UntypedFormControl(),
-      });
-
-      const formGroup = generateFormGroup(fields, undefined, inputGroup, false);
-
-      expect(formGroup.get('student')).toBeDefined();
-    });
-
-    test('Should use existing group when input group is provided but have already defined group.', () => {
-      const inputGroup = new UntypedFormGroup({
-        student: new UntypedFormControl(),
-      });
-
-      const lastGroup = new UntypedFormGroup({
-      });
-
-      const formGroup = generateFormGroup(fields, lastGroup, inputGroup, false);
-
-      expect(formGroup).toBe(lastGroup);
-      containsField(formGroup, fields[0]);
-    });
-
-    test('Should use existing a new input group when last form group exists, but input group was changed.', () => {
-      const inputGroup = new UntypedFormGroup({
-        student: new UntypedFormControl(),
-      });
-
-      const lastGroup = new UntypedFormGroup({
-      });
-
-      const formGroup = generateFormGroup(fields, lastGroup, inputGroup, true);
-
-      expect(formGroup).toBe(inputGroup);
-      containsField(formGroup, fields[0]);
-    });
-  });
-});

package/src/lib/components/shared-components/generic-form/generic-form.model.ts

@@ -1,68 +0,0 @@
-import {
-  UntypedFormControl,
-  UntypedFormGroup,
-} from '@angular/forms';
-import { GenericFieldDefinition } from '@verisoft/ui-core';
-
-export function generateFormGroup(
-  fields: GenericFieldDefinition[] | undefined,
-  lastGroupValue: UntypedFormGroup | undefined,
-  inputGroup: UntypedFormGroup | undefined,
-  inputGroupChanged = false
-): UntypedFormGroup {
-  const formGroup =
-    (inputGroupChanged
-      ? inputGroup ?? lastGroupValue
-      : lastGroupValue ?? inputGroup) ?? new UntypedFormGroup({});
-
-  fields?.forEach((field) => {
-    const control = formGroup.get(field.name);
-    if (!control) {
-      formGroup.addControl(
-        field.name,
-        new UntypedFormControl(field.value, field.validator)
-      );
-    } else if (control && control.value !== field.value) {
-      control.setValue(field.value);
-      control.setValidators(field.validator ?? null);
-    }
-    else {
-      control.setValidators(field.validator ?? null);
-    }
-
-    if (field.readonly && (control || formGroup.get(field.name))) {
-      formGroup.get(field.name)?.disable();
-    }
-  });
-  if (!inputGroupChanged) {
-    for (const field in formGroup.controls) {
-      const control = fields?.find((x) => x.name == field);
-      if (!control) {
-        formGroup.removeControl(field);
-      }
-    }
-  }
-
-  return formGroup;
-}
-
-export function getColumnClass(value?: number): string | undefined {
-  if (!value) {
-    return undefined;
-  }
-
-  switch (value) {
-    case 1:
-      return 'col-12';
-    case 2:
-      return 'col-12 col-md-6';
-    case 3:
-      return 'col-12 col-md-4';
-    case 4:
-      return 'col-12 col-md-3';
-    case 6:
-      return 'col-12 col-md-2';
-  }
-
-  return 'col-12 col-md-1';
-}

package/src/lib/components/side-menu/side-menu.component.html

@@ -1,52 +0,0 @@
-<div class="v-side-menu" #sidemenu>
-  <div
-    [ngClass]="
-      (screenSizeService.isMobileBlock | async)
-        ? 'v-side-menu-container__mobile'
-        : 'v-side-menu-container'
-    "
-  >
-    <ng-container *ngIf="(screenSizeService.isMobileBlock | async) === false">
-      <div class="v-side-menu-header pb-3 text-center">
-        <div class="logo" [routerLink]="[logoRouterLink]">
-          <img [src]="logoUrl" alt="" />
-        </div>
-        <hr />
-      </div>
-    </ng-container>
-    <div
-      [ngClass]="{
-        'v-side-menu-body__mobile': screenSizeService.isMobileBlock | async,
-        'v-side-menu-body': (screenSizeService.isMobileBlock | async) === false
-      }"
-      class="text-center"
-    >
-      <p-tree
-        selectionMode="single"
-        [value]="items"
-        (onNodeExpand)="onSelectionChange($event)"
-        (onNodeCollapse)="onSelectionChange($event)"
-        (onNodeSelect)="onNodeSelect($event)"
-      >
-      </p-tree>
-    </div>
-    <div
-      class="text-center py-3 d-flex justify-content-end flex-column support"
-    >
-      <hr class="mx-4 divider" />
-      <v-button
-        class="support-button"
-        [label]="isMinimalized ? undefined : 'Support'"
-        severity="primary"
-        [icon]="icons.questionCircle"
-      ></v-button>
-    </div>
-  </div>
-  <div
-    *ngIf="(screenSizeService.isMobileBlock | async) === false"
-    class="close-button"
-    (click)="menuMinimalize(sidemenu)"
-  >
-    <i class="pi pi-chevron-left text-white close-icon"></i>
-  </div>
-</div>

package/src/lib/components/side-menu/side-menu.component.spec.ts

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

package/src/lib/components/side-menu/side-menu.component.ts

@@ -1,98 +0,0 @@
-import { AsyncPipe, NgClass, NgIf } from '@angular/common';
-import {
-  AfterContentInit,
-  ChangeDetectionStrategy,
-  Component,
-  ElementRef,
-  EventEmitter,
-  inject,
-  Input,
-  Output,
-  ViewChild,
-} from '@angular/core';
-import { Router, RouterModule } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
-import { MenuItem, ScreenSizeService, SideMenuCore, SideMenuService, UnsubscribeComponent } from '@verisoft/ui-core';
-import { AvatarModule } from 'primeng/avatar';
-import { TreeModule, TreeNodeSelectEvent } from 'primeng/tree';
-import { Icons } from '../../icons';
-import { ButtonComponent } from '../button';
-
-@Component({
-  selector: 'v-side-menu',
-  standalone: true,
-  imports: [
-    NgClass,
-    AsyncPipe,
-    NgIf,
-    TreeModule,
-    ButtonComponent,
-    TranslateModule,
-    AvatarModule,
-    RouterModule,
-  ],
-  templateUrl: './side-menu.component.html',
-  styleUrl: './side-menu.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class SideMenuComponent
-  extends UnsubscribeComponent
-  implements SideMenuCore, AfterContentInit
-{
-  @Input() items: MenuItem[] = [];
-  @Input() logoUrl = '';
-  @Input() userName!: string;
-  @Input() userRole!: any | any[] | undefined;
-  @Output() minimalized = new EventEmitter<boolean>();
-  @Output() itemSelected = new EventEmitter<MenuItem>();
-  
-  @ViewChild ('sidemenu', { static: true }) menu!: ElementRef<HTMLDivElement>;
-
-  menuService = inject(SideMenuService);
-  router = inject(Router);
-  icons = Icons;
-
-  protected screenSizeService = inject(ScreenSizeService);
-  protected logoRouterLink!: string;
-  protected isMinimalized = false;
-
-  ngAfterContentInit(): void {
-    if (this.menuService.menuMinimalized) {
-      this.setMenuMinimalized(this.menu);
-    }
-  }
-  
-  protected menuMinimalize(menu: HTMLDivElement): void {
-    const audit = document.getElementsByClassName('detail-audit');
-    if (audit.length > 0) {
-      audit.item(0)?.classList.toggle('menu-close__audit');
-    }
-    if (menu) {
-      menu.classList.toggle('menu-closed');
-      this.isMinimalized = menu.classList.contains('menu-closed');
-      this.menuService.saveMinimalizedState(this.isMinimalized);
-      this.minimalized.emit(this.isMinimalized);
-    }
-  }
-
-  onSelectionChange(event: any) {
-    const item = event.node;
-    if (item.label) {
-      this.menuService.saveExpandedState(item);
-    }
-  }
-
-  onNodeSelect(event: TreeNodeSelectEvent): void {
-    const item = event.node as MenuItem;
-    if (item.url) {
-      this.router.navigateByUrl(item.url);
-    }
-  }
-
-  private setMenuMinimalized(menu: ElementRef<HTMLDivElement>): void {
-    if(menu) {
-      menu.nativeElement.classList.add("menu-closed");
-      this.minimalized.emit(true);
-    }
-  }
-}

package/src/lib/components/side-menu/side-menu.module.ts

@@ -1,66 +0,0 @@
-import { NgModule, ModuleWithProviders } from '@angular/core';
-import {
-  MENU_TOKEN,
-  MenuItem,
-  SIDE_MENU_COMPONENT_TOKEN,
-  SIDE_MENU_STATE_TOKEN,
-  SideMenuModuleConfig,
-  SideMenuProviderService,
-  UnsubscribeComponent,
-} from '@verisoft/ui-core';
-import { SideMenuComponent } from './side-menu.component';
-
-@NgModule({
-  imports: [SideMenuComponent],
-  exports: [SideMenuComponent],
-  providers: [
-    SideMenuProviderService,
-    {
-      provide: SIDE_MENU_COMPONENT_TOKEN,
-      useExisting: SideMenuComponent,
-    },
-    {
-      provide: SIDE_MENU_STATE_TOKEN,
-      useValue: localStorage.getItem('SideMenuStateToken') ?? {
-        expanded: [],
-        minimalized: false,
-      },
-    },
-  ],
-})
-export class SideMenuModule extends UnsubscribeComponent {
-  constructor(private readonly service: SideMenuProviderService) {
-    super();
-  }
-
-  static forRoot(
-    config?: SideMenuModuleConfig
-  ): ModuleWithProviders<SideMenuModule> {
-    const moduleWithProvider: ModuleWithProviders<SideMenuModule> = {
-      ngModule: SideMenuModule,
-    };
-
-    if (config?.items) {
-      moduleWithProvider.providers = [
-        {
-          provide: MENU_TOKEN,
-          useValue: config.items,
-        },
-      ];
-    }
-
-    return moduleWithProvider;
-  }
-
-  static forChild(menu: MenuItem[]): ModuleWithProviders<SideMenuModule> {
-    return {
-      ngModule: SideMenuModule,
-      providers: [
-        {
-          provide: MENU_TOKEN,
-          useValue: menu,
-        },
-      ],
-    };
-  }
-}

package/src/lib/components/slider/slider.component.html

@@ -1,19 +0,0 @@
-<div class="v-slider">
-  <v-form-field
-    class="w-100"
-    [label]="label"
-    [tooltip]="tooltip"
-    [required]="isRequired()"
-    [testId]="testId"
-  >
-    <p-slider
-      class="w-100"
-      [formControl]="formControl"
-      [step]="step"
-      [range]="range"
-      [min]="min"
-      [max]="max"
-    />
-    <v-validation-message [ngControl]="ngControl"></v-validation-message>
-  </v-form-field>
-</div>

package/src/lib/components/slider/slider.component.spec.ts

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

package/src/lib/components/slider/slider.component.ts

@@ -1,58 +0,0 @@
-import { CommonModule } from '@angular/common';
-import {
-  ChangeDetectionStrategy,
-  Component,
-  forwardRef,
-  Input,
-  Optional,
-  Self,
-} from '@angular/core';
-import {
-  ControlValueAccessor,
-  NgControl,
-  ReactiveFormsModule,
-} from '@angular/forms';
-import { BaseFormInputComponent, BaseInputControls, SLIDER_COMPONENT_TOKEN, SliderCore } from '@verisoft/ui-core';
-import { SliderModule } from 'primeng/slider';
-import { ErrorComponent } from '../errors';
-import { FormFieldComponent } from '../form-field';
-
-@Component({
-  selector: 'v-slider',
-  standalone: true,
-  imports: [
-    CommonModule,
-    SliderModule,
-    ReactiveFormsModule,
-    FormFieldComponent,
-    ErrorComponent
-  ],
-  templateUrl: './slider.component.html',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: BaseInputControls,
-      useExisting: forwardRef(() => SliderComponent),
-    },
-    {
-      provide: SLIDER_COMPONENT_TOKEN,
-      useExisting: SliderComponent,
-    },
-  ],
-})
-export class SliderComponent
-  extends BaseFormInputComponent
-  implements ControlValueAccessor, SliderCore
-{
-  @Input() step = 1;
-
-  @Input() min = 0;
-
-  @Input() max = 100;
-
-  @Input() range = false;
-
-  constructor(@Optional() @Self() ngControl: NgControl) {
-    super(ngControl);
-  }
-}

package/src/lib/components/snackbar/services/snackbar.service.ts

@@ -1,45 +0,0 @@
-import { Injectable } from '@angular/core';
-import { MessageService } from 'primeng/api';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class SnackbarService {
-  constructor(readonly messageService: MessageService) {}
-
-  showSuccess(message: string, icon?: string) {
-    this.messageService.add({
-      severity: 'success',
-      summary: 'Success',
-      detail: message,
-      icon: icon,
-    });
-  }
-
-  showInfo(message: string, icon?: string) {
-    this.messageService.add({
-      severity: 'info',
-      summary: 'Info',
-      detail: message,
-      icon: icon,
-    });
-  }
-
-  showWarn(message: string, icon?: string) {
-    this.messageService.add({
-      severity: 'warn',
-      summary: 'Warn',
-      detail: message,
-      icon: icon,
-    });
-  }
-
-  showError(message: string, icon?: string) {
-    this.messageService.add({
-      severity: 'error',
-      summary: 'Error',
-      detail: message,
-      icon: icon,
-    });
-  }
-}

package/src/lib/components/snackbar/snackbar.component.html

@@ -1,3 +0,0 @@
-<div class="v-snackbar">
-    <p-toast />
-</div>

package/src/lib/components/snackbar/snackbar.component.spec.ts

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

package/src/lib/components/snackbar/snackbar.component.stories.ts

@@ -1,70 +0,0 @@
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { ActivatedRoute } from '@angular/router';
-import { moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';
-import { MessageService } from 'primeng/api';
-import { ToastModule } from 'primeng/toast';
-import { ButtonComponent } from '../button/button.component';
-import { SnackbarService } from './services/snackbar.service';
-import { SnackbarComponent } from './snackbar.component';
-
-const meta: Meta<SnackbarComponent> = {
-  component: SnackbarComponent,
-  title: 'SnackbarComponent',
-  decorators: [
-    moduleMetadata({
-      imports: [ButtonComponent, BrowserAnimationsModule, ToastModule],
-      providers: [
-        MessageService,
-        SnackbarService,
-        {
-          provide: ActivatedRoute,
-          useValue: {},
-        },
-      ],
-    }),
-  ],
-};
-
-export default meta;
-type Story = StoryObj<SnackbarComponent>;
-const messageService = new MessageService();
-const snackbarService = new SnackbarService(messageService);
-
-export const Primary: Story = {
-  render: () => {
-    return {
-      props: {
-        showSuccess: () => snackbarService.showSuccess('Snackbar works!'),
-        showInfo: () => snackbarService.showInfo('Snackbar works!'),
-        showWarn: () => snackbarService.showWarn('Snackbar works!'),
-        showError: () => snackbarService.showError('Snackbar works!'),
-      },
-      template: `
-      <v-snackbar class="mt-2" />
-        <div class="d-flex gap-3 mt-2">
-          <v-button
-            label="Show Success"
-            severity="success"
-            (click)='showSuccess()'
-          ></v-button>
-          <v-button
-            label="Show Info"
-            severity="info"
-            (click)='showInfo()'
-          ></v-button>
-          <v-button
-            label="Show Warn"
-            severity="warn"
-            (click)='showWarn()'
-          ></v-button>
-          <v-button
-            label="Show Error"
-            severity="danger"
-            (click)='showError()'
-          ></v-button>
-        </div>
-      `,
-    };
-  },
-  args: {},
-};