@verisoft/ui-primeng 20.1.1 → 20.1.3

package/src/lib/components/shared-components/action-button-group/action-button-group.component.ts

@@ -1,111 +0,0 @@
-import {
-  AfterContentInit,
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  ContentChildren,
-  Input,
-  QueryList,
-} from '@angular/core';
-import {
-  ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-  ActionButton,
-  ActionButtonGroupCore,
-  IconPositionType,
-  MenuItem,
-  queryListChanged,
-  ScreenSizeService,
-  UnsubscribeComponent,
-} from '@verisoft/ui-core';
-import {
-  combineLatestWith,
-  takeUntil,
-} from 'rxjs';
-import { Icons } from '../../../icons';
-import { DropdownButtonComponent } from '../../dropdown-button';
-import { ActionButtonComponent } from './components/action-button/action-button.component';
-
-@Component({
-  selector: 'v-action-button-group',
-  imports: [ActionButtonComponent, DropdownButtonComponent],
-  templateUrl: './action-button-group.component.html',
-  styleUrl: './action-button-group.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-      useExisting: ActionButtonGroupComponent,
-    },
-  ]
-})
-export class ActionButtonGroupComponent
-  extends UnsubscribeComponent
-  implements AfterContentInit, ActionButtonGroupCore {
-  @ContentChildren(ActionButtonComponent)
-  actions!: QueryList<ActionButtonComponent>;
-
-  @Input() maxItems = 3;
-
-  @Input() maxItemsMobile = 0;
-
-  @Input() items: ActionButton[] = [];
-
-  @Input() menuIconPos: IconPositionType = 'right';
-
-  @Input() menuIcon = Icons.action;
-
-  @Input() label?: string;
-
-  @Input() icon?: string;
-
-  icons = Icons;
-  allItems: ActionButton[] = [];
-  visibleActions: ActionButton[] = [];
-  menuItems: MenuItem[] = [];
-
-  constructor(
-    private readonly changeDetectorRef: ChangeDetectorRef,
-    readonly screenSizeService: ScreenSizeService
-  ) {
-    super();
-  }
-
-  ngAfterContentInit(): void {
-    this.subscribeItemChange();
-  }
-
-  fireClick(item: ActionButton, event: MouseEvent) {
-    event.stopPropagation();
-    item.click.emit();
-  }
-
-  private subscribeItemChange(): void {
-    const screenResize$ = this.screenSizeService.isMobileBlock;
-
-    const actions$ = queryListChanged(this.actions);
-
-    screenResize$
-      .pipe(takeUntil(this.destroyed$), combineLatestWith(actions$))
-      .subscribe(([isMobile, actions]) => {
-        this.computeItems(actions, isMobile);
-      });
-  }
-
-  private computeItems(actions: ActionButton[], isMobile: boolean) {
-    const allItems = [...(this.items ?? []), ...actions];
-    const maxItems = isMobile ? this.maxItemsMobile : this.maxItems;
-    this.visibleActions = allItems.slice(0, maxItems);
-    this.menuItems = allItems.slice(maxItems).map(this.convertToMenuItem);
-    this.changeDetectorRef.detectChanges();
-  }
-
-  private convertToMenuItem(item: ActionButton): MenuItem {
-    return {
-      label: item.label,
-      icon: item.icon,
-      command: () => {
-        item.click.emit();
-      },
-    };
-  }
-}

package/src/lib/components/shared-components/action-button-group/components/action-button/action-button.component.html

@@ -1,10 +0,0 @@
-<v-button
-  [label]="label"
-  [disabled]="disabled"
-  [icon]="icon"
-  [outlined]="outlined"
-  tooltipPosition="bottom"
-  [size]="size"
-  [severity]="severity"
-  (click)="handleClick($event)"
-/>

package/src/lib/components/shared-components/action-button-group/components/action-button/action-button.component.spec.ts

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

package/src/lib/components/shared-components/action-button-group/components/action-button/action-button.component.ts

@@ -1,69 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  EventEmitter,
-  inject,
-  Input,
-  OnChanges,
-  Output,
-  SimpleChanges,
-} from '@angular/core';
-import {
-  ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-  ActionButton,
-  ActionButtonGroupCore,
-  ControlSeverityType,
-  FieldSizeType,
-} from '@verisoft/ui-core';
-import { Observable, Subject } from 'rxjs';
-import { Icons } from '../../../../../icons';
-import { ButtonComponent } from '../../../../button';
-
-@Component({
-    selector: 'v-action-button',
-    imports: [ButtonComponent],
-    templateUrl: './action-button.component.html',
-    styleUrl: './action-button.component.scss',
-    changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class ActionButtonComponent implements ActionButton, OnChanges {
-  @Input() disabled = false;
-  @Input() toolTip?: string;
-  @Input() id?: string;
-  @Input() icon?: string;
-  @Input() outlined = false;
-  @Input() raised = false;
-  @Input() severity?: ControlSeverityType;
-  @Input() label?: string;
-  @Input() size?: FieldSizeType;
-  // eslint-disable-next-line @angular-eslint/no-output-native
-  @Output() click = new EventEmitter<MouseEvent>();
-
-  icons = Icons
-
-  private propertyChangeSubject = new Subject();
-
-  propertyChanged: Observable<unknown> =
-    this.propertyChangeSubject.asObservable();
-
-  buttonGroup: ActionButtonGroupCore | null = inject<ActionButtonGroupCore>(
-    ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-    {
-      optional: true,
-    }
-  );
-
-  ngOnChanges(changes: SimpleChanges): void {
-    const isValueChange = Object.keys(changes).some(
-      (x) => !changes[x].firstChange
-    );
-    if (isValueChange) {
-      this.propertyChangeSubject.next(null);
-    }
-  }
-
-  handleClick(event: MouseEvent) {
-    event.stopPropagation();
-    this.click.emit(event);
-  }
-}

package/src/lib/components/shared-components/action-button-group/index.ts

@@ -1,2 +0,0 @@
-export * from './action-button-group.component';
-export * from './components/action-button/action-button.component';

package/src/lib/components/shared-components/dynamic-component/dynamic-component-factory.service.ts

@@ -1,142 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import {
-  Injectable,
-  ViewContainerRef,
-  Type,
-  ComponentFactoryResolver,
-  Injector,
-  ComponentRef,
-  ComponentFactory,
-  OnChanges,
-  SimpleChanges,
-  SimpleChange,
-  EventEmitter,
-  OnDestroy,
-} from '@angular/core';
-import { ExtendedComponent } from '@verisoft/ui-core';
-import { Subscription } from 'rxjs';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class DynamicComponentFactoryService implements OnDestroy {
-  constructor(private componentFactoryResolver: ComponentFactoryResolver) { }
-
-  ngOnDestroy(): void {
-    this.unsubscribeComponentEvents(this);
-  }
-
-  async createDynamicComponent<TComponent>(
-    componentType: Type<TComponent>,
-    viewContainerRef: ViewContainerRef,
-    inputs: ExtendedComponent<TComponent>,
-    injector: Injector | undefined = undefined
-  ) {
-    const componentFactory =
-      this.componentFactoryResolver.resolveComponentFactory(componentType);
-    viewContainerRef.clear();
-    const component = viewContainerRef.createComponent(
-      componentFactory,
-      undefined,
-      injector
-    );
-    this.setComponentDataInt(componentFactory, component, inputs);
-    this.fireComponentEvents(component.instance, inputs);
-    return component;
-  }
-
-  setComponentData<TComponent>(
-    component: ComponentRef<TComponent>,
-    inputs: Partial<TComponent>
-  ) {
-    const factory = this.componentFactoryResolver.resolveComponentFactory(
-      component.componentType
-    );
-
-    this.setComponentDataInt(factory, component, inputs);
-  }
-
-  private unsubscribeComponentEvents<TComponent>(instance: TComponent) {
-    const subscriptionStoreKey = '__outputSubscriptions__';
-    const subscriptions = (instance as any)[subscriptionStoreKey] as Map<string, Subscription>;
-
-    if (subscriptions) {
-      subscriptions.forEach((sub) => sub.unsubscribe());
-      subscriptions.clear();
-    }
-  }
-
-  private fireComponentEvents<TComponent>(
-    instance: TComponent,
-    inputs: ExtendedComponent<TComponent>
-  ) {
-    if (!instance || typeof instance !== 'object') return;
-
-    this.fireInputComponentEvents(instance, inputs);
-    this.fireOutputComponentEvents(instance, inputs);
-  }
-
-  private setComponentDataInt<TComponent>(
-    factory: ComponentFactory<TComponent>,
-    component: ComponentRef<TComponent>,
-    inputs: Partial<TComponent>
-  ) {
-    if (inputs) {
-      const propertyNames = factory.inputs.map((x) => x.propName);
-      const inputsHash = new Set(propertyNames);
-      Object.keys(inputs)
-        .filter((x) => inputsHash.has(x))
-        .forEach((x) => {
-          (<{ [key: string]: unknown }>component.instance)[x] = (<
-            { [key: string]: unknown }
-            >inputs)[x];
-        });
-    }
-  }
-
-  private fireInputComponentEvents<TComponent>(
-    instance: TComponent,
-    inputs: ExtendedComponent<TComponent>
-  ) {
-    const onChangeComponent = instance as unknown as OnChanges;
-    if (onChangeComponent.ngOnChanges && inputs) {
-      const changeEventArgs = Object.keys(inputs).reduce((changes: SimpleChanges, key: string) => {
-        const inputValue = (inputs as { [key: string]: unknown })[key];
-        changes[key] = new SimpleChange(undefined, inputValue, true);
-        return changes;
-      }, {} as SimpleChanges);
-
-      onChangeComponent.ngOnChanges(changeEventArgs);
-    }
-  }
-
-  private fireOutputComponentEvents<TComponent>(
-    instance: TComponent & object,
-    inputs: ExtendedComponent<TComponent>
-  ) {
-    const outputs = Object.keys(inputs).filter((key) => {
-      const emitter = (instance as Record<string, any>)[key];
-      return emitter instanceof EventEmitter;
-    });
-
-    const subscriptionStoreKey = '__outputSubscriptions__';
-    if (!(subscriptionStoreKey in instance)) {
-      (instance as any)[subscriptionStoreKey] = new Map<string, Subscription>();
-    }
-    const subscriptions = (instance as any)[subscriptionStoreKey] as Map<string, Subscription>;
-
-    for (const outputKey of outputs) {
-      const eventEmitter = (instance as Record<string, any>)[outputKey] as EventEmitter<any>;
-      const callback = inputs[outputKey] as (value: any) => void;
-
-      if (eventEmitter && typeof callback === 'function') {
-        if (subscriptions.has(outputKey)) {
-          subscriptions.get(outputKey)!.unsubscribe();
-        }
-
-        const subscription = eventEmitter.subscribe((value: any) => callback(value));
-        subscriptions.set(outputKey, subscription);
-      }
-    }
-  }
-}

package/src/lib/components/shared-components/dynamic-component/dynamic-component.component.ts

@@ -1,56 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  inject,
-  Injector,
-  Input,
-  OnChanges,
-  Type,
-  ViewChild,
-  ViewContainerRef,
-} from '@angular/core';
-import { ExtendedComponent } from '@verisoft/ui-core';
-import { DynamicComponentFactoryService } from './dynamic-component-factory.service';
-
-@Component({
-  selector: 'v-dynamic-component',
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  template: `<ng-container #dynamicContainer></ng-container>`,
-})
-export class DynamicComponent<TComponent> implements AfterViewInit, OnChanges {
-  @Input() componentType!: Type<TComponent>;
-
-  @Input() data!: ExtendedComponent<TComponent>;
-
-  @ViewChild('dynamicContainer', { read: ViewContainerRef, static: true })
-  container!: ViewContainerRef;
-
-  private factoryServices = inject(DynamicComponentFactoryService);
-
-  private changeDetectorRef = inject(ChangeDetectorRef);
-
-  private injector = inject(Injector);
-
-  ngOnChanges(): void {
-    this.createComponent();
-  }
-
-  ngAfterViewInit(): void {
-    this.createComponent();
-    this.changeDetectorRef.detectChanges();
-  }
-
-  private createComponent() {
-    if (this.container) {
-      this.factoryServices.createDynamicComponent(
-        this.componentType,
-        this.container,
-        this.data,
-        this.injector
-      );
-    }
-  }
-}

package/src/lib/components/shared-components/dynamic-component/index.ts

@@ -1,2 +0,0 @@
-export * from './dynamic-component-factory.service';
-export * from './dynamic-component.component';

package/src/lib/components/shared-components/generic-field/generic-field.component.html

@@ -1,98 +0,0 @@
-@if (!type || type === fieldTypes.text) {
-<v-textfield
-  [label]="label"
-  [floatLabel]="floatLabel === true"
-  [size]="size"
-  [formControl]="formControl"
-/>
-} @else if (type === fieldTypes.dropdown && !datasource) {
-<v-dropdown
-  [label]="!floatLabel ? label : ''"
-  [floatLabel]="floatLabel ? label : ''"
-  [testId]="testId"
-  [options]="options"
-  [optionLabel]="optionLabel"
-  [optionValue]="optionValue ?? optionLabel"
-  [loading]="loading"
-  [forceMinWidth]="true"
-  [formControl]="formControl"
-  [showFilter]="showFilter ?? false"
-  [localSearch]="localSearch ?? false"
-  (changeEvent)="changed.emit($event)"
-  (clearEvent)="cleared.emit($event)"
-  (lazyLoadEvent)="lazyLoad.emit($any($event))"
-  (showEvent)="showed.emit($event)"
-/> 
-} @else if (type === fieldTypes.dropdown && datasource) {
-  <v-dropdown
-    useDatasource
-    [forceMinWidth]="true"
-    [datasource]="datasource"
-    [optionLabel]="optionLabel"
-    [optionValue]="optionValue ?? optionLabel"
-    [label]="!floatLabel ? label : ''"
-    [floatLabel]="floatLabel ? label : ''"
-    [testId]="testId"
-    [loading]="loading"
-    [formControl]="formControl"
-    [showFilter]="showFilter ?? false"
-    [filterField]="filterField ?? 'fulltext'"
-    [localSearch]="localSearch ?? false"
-    (changeEvent)="changed.emit($event)"
-    (clearEvent)="cleared.emit($event)"
-    (lazyLoadEvent)="lazyLoad.emit($any($event))"
-    (showEvent)="showed.emit($event)"
-  />
-} @else if (type === fieldTypes.multiselect && !datasource) {
-<v-multiselect
-  [label]="!floatLabel ? label : ''"
-  [floatLabel]="floatLabel ? label : ''"
-  [testId]="testId"
-  [options]="options"
-  [optionLabel]="optionLabel"
-  [optionValue]="optionValue ?? optionLabel"
-  [loading]="loading"
-  [formControl]="formControl"
-  (changeEvent)="changed.emit($event)"
-  (clearEvent)="cleared.emit($event)"
-  (lazyLoadEvent)="lazyLoad.emit($any($event))"
-  (showEvent)="showed.emit($event)"
-/>
-} @else if (type === fieldTypes.multiselect && datasource) {
-<v-multiselect
-  useDatasource
-  [datasource]="datasource"
-  [optionLabel]="optionLabel"
-  [optionValue]="optionValue ?? optionLabel"
-  [label]="!floatLabel ? label : ''"
-  [floatLabel]="floatLabel ? label : ''"
-  [testId]="testId"
-  [loading]="loading"
-  [formControl]="formControl"
-  (changeEvent)="changed.emit($event)"
-  (clearEvent)="cleared.emit($event)"
-  (lazyLoadEvent)="lazyLoad.emit($any($event))"
-  (showEvent)="showed.emit($event)"
-/>
-} @else if (type === fieldTypes.checkbox) {
-<v-checkbox
-  [label]="label"
-  [testId]="testId"
-  [formControl]="formControl"
-  [indeterminate]="true"
-/>
-} @else if (type === fieldTypes.simplecheckbox) {
-<v-checkbox
-  [label]="label"
-  [testId]="testId"
-  [formControl]="formControl"
-/>
-} @else if (type === fieldTypes.calendar) {
-<v-calendar
-  [label]="!floatLabel ? label : ''"
-  [floatLabel]="floatLabel ? label : ''"
-  [testId]="testId"
-  [formControl]="formControl"
-  [icon]="icons.calendar"
-/>
-}

package/src/lib/components/shared-components/generic-field/generic-field.component.spec.ts

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

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

@@ -1,90 +0,0 @@
-
-import {
-  ChangeDetectionStrategy,
-  Component,
-  EventEmitter,
-  Input,
-  Output,
-} from '@angular/core';
-import { ReactiveFormsModule } from '@angular/forms';
-import {
-  DatasourceType,
-  FilterEvent,
-  LazyLoadEvent,
-} from '@verisoft/core';
-import {
-  BaseFormInputComponent,
-  DatasourceDirective,
-  FieldSize,
-  FieldSizeType,
-  GENERIC_FIELD_COMPONENT_TOKEN,
-  GenericFieldCore,
-  GenericFieldType,
-  GenericFieldTypeType,
-} from '@verisoft/ui-core';
-import { Icons } from '../../../icons';
-import { CalendarComponent } from '../../calendar';
-import { CheckboxComponent } from '../../checkbox';
-import { DropdownComponent } from '../../dropdown';
-import { MultiselectComponent } from '../../multiselect';
-import { TextfieldComponent } from '../../textfield';
-
-@Component({
-    selector: 'v-generic-field',
-    imports: [
-    DropdownComponent,
-    CalendarComponent,
-    MultiselectComponent,
-    TextfieldComponent,
-    ReactiveFormsModule,
-    CheckboxComponent,
-    DatasourceDirective
-],
-    providers: [
-        {
-            provide: GENERIC_FIELD_COMPONENT_TOKEN,
-            useExisting: GenericFieldComponent,
-        },
-    ],
-    templateUrl: './generic-field.component.html',
-    changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class GenericFieldComponent<T>
-  extends BaseFormInputComponent
-  implements GenericFieldCore<T>
-{
-  @Input() type?: GenericFieldTypeType = GenericFieldType.text;
-
-  @Input() floatLabel?: boolean;
-
-  @Input() optionLabel: string | undefined;
-
-  @Input() optionValue: string | undefined;
-
-  @Input() options: T[] | undefined;
-
-  @Input() size?: FieldSizeType = FieldSize.medium;
-
-  @Input() loading = false;
-
-  @Input() lazy = false;
-
-  @Input() filter = true;
-
-  @Input() datasource?: DatasourceType<T>
-
-  @Input() filterField?: string;
-
-  @Input() showFilter?: boolean;
-
-  @Input() localSearch?: boolean;
-
-  @Output() changed = new EventEmitter<any>();
-  @Output() showed = new EventEmitter<any>();
-  @Output() cleared = new EventEmitter<any>();
-  @Output() lazyLoad = new EventEmitter<LazyLoadEvent>();
-  @Output() filtered = new EventEmitter<FilterEvent>();
-
-  fieldTypes = GenericFieldType;
-  icons = Icons;
-}

package/src/lib/components/shared-components/generic-field/index.ts

@@ -1 +0,0 @@
-export * from './generic-field.component';

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

@@ -1,46 +0,0 @@
-@if (formGroupComputed) {
-  <div
-    class="v-generic-form"
-    [ngClass]="showAsRow ? 'd-flex flex-row' : 'row'"
-    [formGroup]="formGroupComputed"
-  >
-    @for(field of fields; track field) { @if (columnClass) {
-    <div class="v-generic-form__column {{ columnClass }}">
-      <v-generic-field
-        [type]="field.type"
-        [label]="field.label ?? 'NOT SET' | translate"
-        [floatLabel]="field.floatLabel"
-        [testId]="field.testId"
-        [options]="field.options"
-        [optionLabel]="field.optionLabel"
-        [optionValue]="field.optionValue ?? field.optionLabel"
-        [options]="field.options"
-        [size]="field.size"
-        [formControlName]="field.name"
-        [datasource]="field.datasource"
-        [showFilter]="field.showFilter"
-        [filterField]="field.filterField"
-        [localSearch]="field.localSearch"
-      ></v-generic-field>
-    </div>
-    } @else {
-    <v-generic-field
-      class="me-4"
-      [type]="field.type"
-      [label]="field.label ?? 'NOT SET' | translate"
-      [floatLabel]="field.floatLabel"
-      [testId]="field.testId"
-      [options]="field.options"
-      [optionLabel]="field.optionLabel"
-      [optionValue]="field.optionValue ?? field.optionLabel"
-      [options]="field.options"
-      [size]="field.size"
-      [formControlName]="field.name"
-      [datasource]="field.datasource"
-      [showFilter]="field.showFilter"
-      [filterField]="field.filterField"
-      [localSearch]="field.localSearch"
-    ></v-generic-field>
-    } }
-  </div>
-  }