@verisoft/ui-core 18.6.0 → 18.7.0

package/{lib/components/multiselect/mutiselect.model.d.ts → src/lib/components/multiselect/mutiselect.model.ts}

@@ -1,9 +1,13 @@
-import { InjectionToken } from '@angular/core';
-import { DataSourceComponentModel } from '../../common';
-import { BaseFormCore } from '../base-form';
-export declare const MULTISELECT_COMPONENT_TOKEN: InjectionToken<MultiselectCore<any>>;
-export interface MultiselectCore<T> extends DataSourceComponentModel<T>, BaseFormCore {
-    dropdownIcon?: string;
-    floatLabel?: string;
-    editable: boolean;
-}
+import { InjectionToken } from '@angular/core';
+import { DataSourceComponentModel } from '../../common';
+import { BaseFormCore } from '../base-form';
+
+export const MULTISELECT_COMPONENT_TOKEN = new InjectionToken<MultiselectCore<any>>(
+    'MultiselectComponentToken'
+);
+
+export interface MultiselectCore<T> extends DataSourceComponentModel<T>, BaseFormCore {
+    dropdownIcon?: string;
+    floatLabel?: string;
+    editable: boolean;
+}

package/src/lib/components/number-input/index.ts

@@ -0,0 +1 @@
+export * from './number-input.model';

package/{lib/components/number-input/number-input.model.d.ts → src/lib/components/number-input/number-input.model.ts}

@@ -1,10 +1,14 @@
-import { InjectionToken } from '@angular/core';
-import { BaseFormCore } from '../base-form';
-export declare const NUMBER_INPUT_COMPONENT_TOKEN: InjectionToken<NumberInputCore>;
-export interface NumberInputCore extends BaseFormCore {
-    mode: string;
-    currency: string;
-    min: number;
-    max: number;
-    step: number;
-}
+import { InjectionToken } from '@angular/core';
+import { BaseFormCore } from '../base-form';
+
+export const NUMBER_INPUT_COMPONENT_TOKEN = new InjectionToken<NumberInputCore>(
+    'NumberInputComponentToken'
+);
+
+export interface NumberInputCore extends BaseFormCore {
+    mode: string;
+    currency: string;
+    min: number;
+    max: number;
+    step: number;
+}

package/{lib/components/page-header/index.d.ts → src/lib/components/page-header/index.ts}

@@ -1,3 +1,3 @@
-export * from './page-header.model';
-export * from './page-header.service';
-export * from './page-headercore.component';
+export * from './page-header.model';
+export * from './page-header.service';
+export * from './page-headercore.component';

package/{lib/components/page-header/page-header.model.d.ts → src/lib/components/page-header/page-header.model.ts}

@@ -1,7 +1,11 @@
-import { InjectionToken } from '@angular/core';
-export declare const PAGE_HEADER_COMPONENT_TOKEN: InjectionToken<PageHeaderCore>;
-export interface PageHeaderCore {
-    title: string;
-    subtitle: string | undefined;
-    showBackButton: boolean | undefined;
-}
+import { InjectionToken } from '@angular/core';
+
+export const PAGE_HEADER_COMPONENT_TOKEN = new InjectionToken<PageHeaderCore>(
+    'PageHeaderComponentToken'
+);
+
+export interface PageHeaderCore {
+    title: string;
+    subtitle: string | undefined;
+    showBackButton: boolean | undefined;
+}

package/src/lib/components/page-header/page-header.service.ts

@@ -0,0 +1,9 @@
+import { EventEmitter, Injectable, Output } from '@angular/core';
+import { PageHeaderCore } from './page-header.model';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class PageHeaderService {
+  @Output() pageHeader = new EventEmitter<PageHeaderCore>();
+}

package/src/lib/components/page-header/page-headercore.component.ts

@@ -0,0 +1,40 @@
+import { ChangeDetectorRef, Directive, Input, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { takeUntil } from 'rxjs';
+import { FieldSize, FieldSizeType } from '../../common';
+import { UnsubscribeComponent } from '../unsubscribe.component';
+import { PageHeaderService } from './page-header.service';
+
+@Directive({})
+export class PageHeaderCoreComponent
+  extends UnsubscribeComponent
+  implements OnInit
+{
+  @Input() title!: string;
+  @Input() subtitle: string | undefined;
+  @Input() showBackButton!: boolean;
+  @Input() size: FieldSizeType = FieldSize.small;
+
+constructor(
+    readonly router: Router,
+    readonly cdr: ChangeDetectorRef,
+    readonly headerService: PageHeaderService
+  ) {
+    super();
+  }
+
+  ngOnInit(): void {
+    this.headerService.pageHeader
+      .pipe(takeUntil(this.destroyed$))
+      .subscribe((x: any) => {
+        this.title = x.title;
+        this.subtitle = x.subtitle;
+        this.showBackButton = x.showBackButton ?? false;
+        this.cdr.detectChanges();
+      });
+  }
+
+  protected locationBack() {
+    history.back();
+  }
+}

package/src/lib/components/password/index.ts

@@ -0,0 +1 @@
+export * from './password.model';

package/{lib/components/password/password.model.d.ts → src/lib/components/password/password.model.ts}

@@ -1,19 +1,25 @@
-import { InjectionToken } from '@angular/core';
-import { BaseFormCore } from '../base-form';
-export declare const PASSWORD_COMPONENT_TOKEN: InjectionToken<PasswordCore>;
-export declare enum PasswordStrength {
-    None = 0,
-    Low = 1,
-    Medium = 2,
-    High = 3,
-    Superb = 4
-}
-export interface PasswordCore extends BaseFormCore {
-    toggleMask: boolean;
-    feedback: boolean;
-}
-export interface PasswordValidationItem {
-    severity: 'success' | 'error';
-    validationLabel: string;
-    validationFn: (x: string) => boolean;
-}
+import { InjectionToken } from '@angular/core';
+import { BaseFormCore } from '../base-form';
+
+export const PASSWORD_COMPONENT_TOKEN = new InjectionToken<PasswordCore>(
+    'PasswordComponentToken'
+);
+
+export enum PasswordStrength {
+    None = 0,
+    Low = 1,
+    Medium = 2,
+    High = 3,
+    Superb = 4
+}
+
+export interface PasswordCore extends BaseFormCore {
+    toggleMask: boolean;
+    feedback: boolean;
+}
+
+export interface PasswordValidationItem {
+    severity: 'success' | 'error';
+    validationLabel: string;
+    validationFn: (x: string) => boolean;
+}

package/src/lib/components/radiobutton/index.ts

@@ -0,0 +1 @@
+export * from './radiobutton.model';

package/{lib/components/radiobutton/radiobutton.model.d.ts → src/lib/components/radiobutton/radiobutton.model.ts}

@@ -1,11 +1,16 @@
-import { InjectionToken } from '@angular/core';
-import { BaseFormCore } from '../base-form';
-export declare const RADIOBUTTON_COMPONENT_TOKEN: InjectionToken<RadiobuttonCore<any>>;
-export interface RadioButtonItem<T> {
-    id: string;
-    value: T;
-}
-export interface RadiobuttonCore<T> extends BaseFormCore {
-    radioGroupName: string;
-    items: RadioButtonItem<T>[];
-}
+import { InjectionToken } from '@angular/core';
+import { BaseFormCore } from '../base-form';
+
+export const RADIOBUTTON_COMPONENT_TOKEN = new InjectionToken<RadiobuttonCore<any>>(
+    'RadiobuttonComponentToken'
+);
+
+export interface RadioButtonItem<T> {
+    id: string;
+    value: T; 
+}
+
+export interface RadiobuttonCore<T> extends BaseFormCore {
+    radioGroupName: string;
+    items: RadioButtonItem<T>[];
+}

package/src/lib/components/section/index.ts

@@ -0,0 +1 @@
+export * from './section.model';

package/{lib/components/section/section.model.d.ts → src/lib/components/section/section.model.ts}

@@ -1,7 +1,11 @@
-import { InjectionToken } from '@angular/core';
-export declare const SECTION_COMPONENT_TOKEN: InjectionToken<SectionCore>;
-export interface SectionCore {
-    title: string;
-    showContent: boolean;
-    backgroundColor: string;
-}
+import { InjectionToken } from '@angular/core';
+
+export const SECTION_COMPONENT_TOKEN = new InjectionToken<SectionCore>(
+    'SectionComponentToken'
+);
+
+export interface SectionCore {
+    title: string;
+    showContent: boolean;
+    backgroundColor: string;
+}

package/src/lib/components/side-menu/directives/side-menu-service.directive.ts

@@ -0,0 +1,31 @@
+import { AfterViewInit, ChangeDetectorRef, Directive, inject } from "@angular/core";
+import { takeUntil } from "rxjs";
+import { UnsubscribeComponent } from "../../unsubscribe.component";
+import { SideMenuService } from "../services/side-menu.service";
+import { SIDE_MENU_COMPONENT_TOKEN } from "../side-menu.model";
+
+@Directive({
+    // eslint-disable-next-line @angular-eslint/directive-selector
+    selector: 'v-side-menu[useMenuService]',
+    exportAs: 'useMenuService',
+    standalone: true,
+})
+export class MenuServiceDirective
+    extends UnsubscribeComponent
+    implements AfterViewInit
+{
+    private readonly menuService = inject(SideMenuService);
+    private readonly cdr = inject(ChangeDetectorRef);
+    private readonly sideMenu = inject(SIDE_MENU_COMPONENT_TOKEN);
+
+    ngAfterViewInit() {
+        this.menuService.menuItems$.pipe(takeUntil(this.destroyed$)).subscribe((items) => {
+
+            if (this.sideMenu) {
+                this.sideMenu.items = items;
+            }
+        });
+
+        this.cdr.detectChanges();
+    }
+}

package/{lib/components/side-menu/index.d.ts → src/lib/components/side-menu/index.ts}

@@ -1,4 +1,4 @@
-export * from './side-menu.model';
-export * from './services/side-menu-provider.service';
-export * from './services/side-menu.service';
-export * from './directives/side-menu-service.directive';
+export * from './side-menu.model';
+export * from './services/side-menu-provider.service';
+export * from './services/side-menu.service';
+export * from './directives/side-menu-service.directive';

package/src/lib/components/side-menu/services/side-menu-provider.service.ts

@@ -0,0 +1,13 @@
+import { Injectable, Optional, Inject } from '@angular/core';
+import { MENU_TOKEN, MenuItem } from '../side-menu.model';
+import { SideMenuService } from './side-menu.service';
+
+@Injectable()
+export class SideMenuProviderService {
+  constructor(
+    @Optional() @Inject(MENU_TOKEN) readonly menu: MenuItem[] = [],
+    readonly menuService: SideMenuService
+  ) {
+    menuService.setMenu(menu);
+  }
+}

package/src/lib/components/side-menu/services/side-menu.service.ts

@@ -0,0 +1,62 @@
+import { inject, Injectable } from '@angular/core';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { MenuItem, SIDE_MENU_STATE_TOKEN } from '../side-menu.model';
+
+@Injectable({ providedIn: 'root' })
+export class SideMenuService {
+  private _menuItems = new BehaviorSubject<MenuItem[]>([]);
+  private stateToken = inject(SIDE_MENU_STATE_TOKEN);
+
+  menuItems$: Observable<MenuItem[]> = this._menuItems.asObservable();
+  menuMinimalized = false;
+
+  setMenu(items: MenuItem[]): void {
+    this.resetSidemenuState(items);
+    this._menuItems.next(items);
+  }
+
+  saveMinimalizedState(minimalized: boolean): void {
+    this.stateToken.minimalized = minimalized;
+    localStorage.setItem('SideMenuStateToken', JSON.stringify(this.stateToken));
+  }
+
+  saveExpandedState(item: MenuItem): void {
+    const expanded = this.stateToken.expanded?.find(
+      (i: string) => i === item.label
+    );
+
+    if (!expanded) {
+      this.stateToken.expanded?.push(item.label!);
+      localStorage.setItem(
+        'SideMenuStateToken',
+        JSON.stringify(this.stateToken)
+      );
+      return;
+    }
+
+    this.stateToken.expanded = this.stateToken.expanded?.filter(
+      (i: string) => i !== item.label
+    );
+
+    localStorage.setItem('SideMenuStateToken', JSON.stringify(this.stateToken));
+  }
+
+  private resetSidemenuState(items: MenuItem[]) {
+    if (typeof this.stateToken === 'string') {
+      this.stateToken = JSON.parse(this.stateToken);
+    }
+
+    this.menuMinimalized = this.stateToken.minimalized;
+    const localStorageValue = this.stateToken.expanded;
+
+    if (!localStorageValue) return;
+    if (items) {
+      for (let index = 0; index < items.length; index++) {
+        const element = items[index];
+        element.expanded = !!localStorageValue.find(
+          (i: string) => i === element.label
+        );
+      }
+    }
+  }
+}

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

@@ -0,0 +1,67 @@
+import { InjectionToken } from '@angular/core';
+import { Observable } from 'rxjs';
+
+export const MENU_TOKEN = new InjectionToken<MenuItem[]>(
+  'MENU'
+);
+
+export const LOGO_ROUTER_ROUTE = new InjectionToken<string>(
+  'LOGO_ROUTER_ROUTE'
+);
+
+export const SIDE_MENU_COMPONENT_TOKEN = new InjectionToken<SideMenuCore>(
+  'SideMenuComponentToken'
+);
+
+export const SIDE_MENU_STATE_TOKEN = new InjectionToken<SideMenuState>(
+  'SideMenuStateToken'
+);
+
+export interface SideMenuState {
+  expanded: string[];
+  minimalized: boolean;
+}
+
+export interface MenuItem {
+  id?: string;
+  label?: string | undefined;
+  icon?: string;
+  expanded?: boolean;
+  data?: MenuItemData;
+  tooltip?: string;
+  url?: string;
+  visible?: boolean | Observable<boolean>;
+  type?: string;
+  children?: MenuItem[];
+  routerLink?: any;
+  class?: string;
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  command?: Function;
+}
+
+type ExtendableType = {
+  [key: string]:
+    | string
+    | number
+    | boolean
+    | string[]
+    | number[]
+    | boolean[]
+    | undefined;
+};
+
+export interface MenuItemData extends ExtendableType {
+  roles?: string[];
+  permissions?: string[];
+}
+
+export interface SideMenuModuleConfig {
+  items?: MenuItem[];
+}
+
+export interface SideMenuCore {
+  items: MenuItem[];
+  logoUrl: string;
+  userName: string;
+  userRole: any | any[] | undefined;
+}

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

@@ -0,0 +1 @@
+export * from './slider.model';

package/{lib/components/slider/slider.model.d.ts → src/lib/components/slider/slider.model.ts}

@@ -1,9 +1,13 @@
-import { InjectionToken } from '@angular/core';
-import { BaseFormCore } from '../base-form';
-export declare const SLIDER_COMPONENT_TOKEN: InjectionToken<SliderCore>;
-export interface SliderCore extends BaseFormCore {
-    step: number;
-    min: number;
-    max: number;
-    range: boolean;
-}
+import { InjectionToken } from '@angular/core';
+import { BaseFormCore } from '../base-form';
+
+export const SLIDER_COMPONENT_TOKEN = new InjectionToken<SliderCore>(
+    'SliderComponentToken'
+);
+
+export interface SliderCore extends BaseFormCore {
+    step: number;
+    min: number;
+    max: number;
+    range: boolean;
+}

package/src/lib/components/snackbar/index.ts

@@ -0,0 +1 @@
+export * from './snackbar.model';

package/src/lib/components/snackbar/snackbar.model.ts

@@ -0,0 +1,7 @@
+import { InjectionToken } from '@angular/core';
+
+export const SNACKBAR_COMPONENT_TOKEN = new InjectionToken<SnackbarCore>(
+    'SnackbarComponentToken'
+);
+
+export type SnackbarCore = object

package/src/lib/components/stepper/index.ts

@@ -0,0 +1 @@
+export * from './stepper.model';

package/{lib/components/stepper/stepper.model.d.ts → src/lib/components/stepper/stepper.model.ts}

@@ -1,19 +1,24 @@
-import { EventEmitter, InjectionToken, TemplateRef } from "@angular/core";
-import { FieldSizeType, LayoutTypeType } from "../../common";
-export declare const STEPPER_COMPONENT_TOKEN: InjectionToken<StepperCore>;
-export interface StepperItem {
-    header: string;
-    template?: TemplateRef<any>;
-    annotation?: string;
-    prefix?: string;
-}
-export interface StepperCore {
-    items: StepperItem[];
-    layout: LayoutTypeType;
-    activeIndexChange: EventEmitter<number>;
-    size: FieldSizeType | undefined;
-    icon: string;
-    prefix: string;
-    annotation: string;
-    label: string;
-}
+import { EventEmitter, InjectionToken, TemplateRef } from "@angular/core";
+import { FieldSizeType, LayoutTypeType } from "../../common";
+
+export const STEPPER_COMPONENT_TOKEN = new InjectionToken<StepperCore>(
+    'StepperComponentToken'
+);
+
+export interface StepperItem {
+    header: string;
+    template?: TemplateRef<any>;
+    annotation?: string;
+    prefix?: string;
+}
+
+export interface StepperCore {
+    items: StepperItem[]
+    layout: LayoutTypeType
+    activeIndexChange: EventEmitter<number>
+    size: FieldSizeType | undefined;
+    icon: string;
+    prefix: string;
+    annotation: string;
+    label: string;
+}

package/src/lib/components/switch/index.ts

@@ -0,0 +1 @@
+export * from './switch.model'

package/src/lib/components/switch/switch.model.ts

@@ -0,0 +1,8 @@
+import { InjectionToken } from "@angular/core";
+import { BaseFormCore } from "../base-form";
+
+export const SWITCH_COMPONENT_TOKEN = new InjectionToken<SwitchCore>(
+    'SwitchComponentToken'
+);
+
+export type SwitchCore = BaseFormCore

package/src/lib/components/tab-view/index.ts

@@ -0,0 +1 @@
+export * from './tab-view.model'

package/{lib/components/tab-view/tab-view.model.d.ts → src/lib/components/tab-view/tab-view.model.ts}

@@ -1,17 +1,22 @@
-import { EventEmitter, InjectionToken, TemplateRef } from "@angular/core";
-export declare const TAB_VIEW_COMPONENT_TOKEN: InjectionToken<TabViewCore>;
-export interface TabViewItemCore {
-    title: string;
-    url?: string;
-    icon?: string;
-    disabled?: boolean;
-    content?: string;
-    contentTemplate?: TemplateRef<unknown>;
-}
-export interface TabViewCore {
-    items: TabViewItemCore[];
-    useRouting: boolean;
-    activeIndex: number;
-    activeIndexChange: EventEmitter<number>;
-    url?: string;
-}
+import { EventEmitter, InjectionToken, TemplateRef } from "@angular/core";
+
+export const TAB_VIEW_COMPONENT_TOKEN = new InjectionToken<TabViewCore>(
+    'TabVIewComponentToken'
+);
+
+export interface TabViewItemCore {
+    title: string;
+    url?: string;
+    icon?: string;
+    disabled?: boolean;
+    content?: string;
+    contentTemplate?: TemplateRef<unknown>; 
+}
+
+export interface TabViewCore {
+    items: TabViewItemCore[];
+    useRouting: boolean;
+    activeIndex: number;
+    activeIndexChange: EventEmitter<number>;
+    url?: string;
+}

package/src/lib/components/table/column-configuration.ts

@@ -0,0 +1,38 @@
+import { ColumnDefinition } from "./table.models";
+
+export class ColumnConfiguration<TEntity> {
+    private column: Partial<ColumnDefinition<TEntity>> = {};
+  
+    constructor(private id: string | keyof TEntity) {
+      this.column.id = id as string;
+    }
+  
+    headerName(headerName: string | ((columnId: string, index?: number) => string)): this {
+      this.column.headerName = headerName;
+      return this;
+    }
+  
+    sortable(sortable: boolean): this {
+      this.column.sortable = sortable;
+      return this;
+    }
+  
+    columnClass(columnClass: string): this {
+      this.column.columnClass = columnClass;
+      return this;
+    }
+  
+    valueFunction(value: (row: TEntity, index?: number) => string): this {
+      this.column.value = value;
+      return this;
+    }
+  
+    type(type: string): this {
+      this.column.type = type;
+      return this;
+    }
+  
+    build(): ColumnDefinition<TEntity> {
+      return this.column as ColumnDefinition<TEntity>;
+    }
+  }

package/{lib/components/table/index.d.ts → src/lib/components/table/index.ts}

@@ -1,4 +1,4 @@
-export * from './table.models';
-export * from './table-column.directive';
-export * from './table-builder';
-export * from './column-configuration';
+export * from './table.models';
+export * from './table-column.directive';
+export * from './table-builder';
+export * from './column-configuration';