verben-authentication-ui 1.0.12 → 1.0.13

package/src/lib/components/otp-input/otp-input.component.ts

@@ -1,88 +0,0 @@
-import { Component, EventEmitter, Input, Output, OnInit } from '@angular/core';
-import { FormBuilder, FormArray, FormControl, FormGroup } from '@angular/forms';
-
-@Component({
-  selector: 'verben-otp-input',
-  templateUrl: './otp-input.component.html',
-  styleUrl: './otp-input.component.css'
-})
-export class OtpInputComponent implements OnInit {
-  @Input() length: number = 6;
-  @Input() otpClass: string = '';
-  @Output() otpChange = new EventEmitter<string>();
-
-  otpForm!: FormGroup;
-
-  constructor(private fb: FormBuilder) {}
-
-  ngOnInit() {
-    this.otpForm = this.fb.group({
-      otpArray: this.fb.array(Array(this.length).fill('').map(() => new FormControl('')))
-    });
-
-    this.otpArray.valueChanges.subscribe(() => {
-      this.emitOtp();
-    });
-  }
-
-  get otpArray(): FormArray {
-    return this.otpForm.get('otpArray') as FormArray;
-  }
-
-  handleInput(event: any, index: number) {
-    let value = event.target.value;
-
-    // /\d/.test(value)
-    if (value.length > 0) {
-      value = value.toUpperCase();
-      this.otpArray.at(index).setValue(value);
-
-      if (index < this.length - 1) {
-        this.focusNextInput(index);
-      }
-    } else {
-      this.otpArray.at(index).setValue(''); 
-    }
-  }
-
-  handleKeydown(event: KeyboardEvent, index: number) {
-    if (event.key === 'Backspace') {
-      const currentValue = this.otpArray.at(index).value;
-  
-      if (currentValue) {
-        this.otpArray.at(index).setValue('');
-      } else if (index > 0) {
-        this.focusPreviousInput(index);
-      }
-    }
-  }
-
-  handlePaste(event: ClipboardEvent) {
-    event.preventDefault();
-    const pastedData = (event.clipboardData?.getData('text') || '').toUpperCase();
-    const validData = pastedData.slice(0, this.length);
-
-    validData.split('').forEach((char, index) => {
-      this.otpArray.at(index).setValue(char);
-    });
-
-    const nextIndex = validData.length < this.length ? validData.length : this.length - 1;
-    this.focusNextInput(nextIndex - 1);
-  }
-
-
-  private focusNextInput(index: number) {
-    const nextInput = document.getElementById(`otp-input-${index + 1}`);
-    nextInput?.focus();
-  }
-
-  private focusPreviousInput(index: number) {
-    const prevInput = document.getElementById(`otp-input-${index - 1}`);
-    prevInput?.focus();
-  }
-
-  private emitOtp() {
-    const otp = this.otpArray.value.join('');
-    this.otpChange.emit(otp);
-  }
-}

package/src/lib/components/otp-input/otp-input.module.ts

@@ -1,15 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { RouterLink } from '@angular/router';
-import {  VerbenaInputModule } from 'verben-ng-ui';
-import { OAuthModule } from '../o-auth/o-auth.module';
-import { ButtonModule } from '../button/button.module';
-import { OtpInputComponent } from './otp-input.component';
-
-@NgModule({
-  declarations: [OtpInputComponent],
-  imports: [CommonModule, FormsModule,VerbenaInputModule, RouterLink,ButtonModule,OAuthModule,ReactiveFormsModule],
-  exports: [OtpInputComponent]
-})
-export class OtpInputModule {}

package/src/lib/components/reset-password/ResetPasswordData.ts

@@ -1,5 +0,0 @@
-export interface ResetPasswordData {
-  OldPassword?: string;
-  Password: string;
-  ConfirmPassword: string;
-}

package/src/lib/components/reset-password/reset-password.component.css

@@ -1,29 +0,0 @@
-@import '../../../styles.css';
-
-.reset-password-container {
-  gap: 25px;
-  padding: 50px;
-  border: 1px solid rgba(102, 102, 102, 0.5);
-  box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
-  border-radius: 24px;
-}
-
-.reset-password-title {
-  font-size: 30px;
-  font-weight: bold;
-}
-
-.reset-password-subtitle {
-  font-size: 14px;
-  font-weight: 500;
-  color: rgba(102, 102, 102, 1);
-}
-
-.form-field {
-  gap: 5px;
-}
-
-.form-field-caption {
-  color: rgba(102, 102, 102, 1);
-  /* font-weight: 600; */
-}

package/src/lib/components/reset-password/reset-password.component.html

@@ -1,24 +0,0 @@
-<div [formGroup]="this.resetPasswordForm" class="reset-password-container flex flex-col">
-  <div class="reset-password-header flex flex-col">
-    <div class="reset-password-title">{{title}}</div>
-    <div class="reset-password-subtitle">{{subTitle}}</div>
-  </div>
-  <div *ngIf="showOldPassword" class="form-field flex flex-col">
-    <div class="form-field-caption">Old Password</div>
-    <verbena-input bgColor="white" borderRadius="12px" formControlName="OldPassword" [passwordToggle]="true"
-      type="password"></verbena-input>
-  </div>
-  <div class="form-field flex flex-col">
-    <div class="form-field-caption">New Password</div>
-    <verbena-input bgColor="white" borderRadius="12px" formControlName="Password" [passwordToggle]="true"
-      type="password"></verbena-input>
-  </div>
-  <div class="form-field flex flex-col">
-    <div class="form-field-caption">Confirm Password</div>
-    <verbena-input bgColor="white" borderRadius="12px" formControlName="ConfirmPassword" [passwordToggle]="true"
-      type="password"></verbena-input>
-  </div>
-  <verbena-button fontWeight="700" (click)="submit()" [text]="buttonCaption" width="100%" [textColor]="buttonTextColor"
-    [bgColor]="buttonBackgroundColor" borderRadius="25px" [disable]="!this.checkForm()"></verbena-button>
-
-</div>

package/src/lib/components/reset-password/reset-password.component.spec.ts

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

package/src/lib/components/reset-password/reset-password.component.ts

@@ -1,108 +0,0 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import {
-  AbstractControl,
-  FormBuilder,
-  FormControl,
-  FormGroup,
-  ValidationErrors,
-  Validators,
-} from '@angular/forms';
-import { ResetPasswordData } from './ResetPasswordData';
-import { HttpWebRequestService } from '../../services/http-web-request.service';
-import { ErrorResponse } from '../../models/ErrorResponse';
-import { ResponseKeyValue } from '../../models/ResponseKeyValue';
-import { PasswordRequestParam } from '../../models/PasswordRequestParam';
-import { UtilService } from '../../services/util.service';
-import CryptoJS from 'crypto-js';
-@Component({
-  selector: 'verben-reset-password',
-  templateUrl: './reset-password.component.html',
-  styleUrl: './reset-password.component.css',
-})
-
-export class ResetPasswordComponent {
-  @Input() title: string = 'Reset Password';
-  @Input() subTitle: string = 'Create a New Password';
-  @Input() buttonCaption: string = 'Submit';
-  @Input() buttonTextColor?: string;
-  @Input() buttonBackgroundColor?: string;
-  @Input() showOldPassword: boolean = false;
-  @Input() token?: string;
-
-  @Output() onSubmit: EventEmitter<ResetPasswordData> = new EventEmitter();
-  @Output() onSubmitEnd: EventEmitter<ResponseKeyValue | ErrorResponse> =
-    new EventEmitter();
-
-  resetPasswordForm: FormGroup;
-
-  constructor(
-    private fb: FormBuilder,
-    private server: HttpWebRequestService,
-    private utilService: UtilService
-  ) {
-    this.resetPasswordForm = this.fb.group({
-      OldPassword: new FormControl<string | null>(
-        null,
-        this.oldPasswordValidator.bind(this)
-      ),
-      Password: new FormControl<string | null>(null, Validators.required),
-      ConfirmPassword: new FormControl<string | null>(null, [
-        Validators.required,
-        this.confirmPasswordValidator.bind(this),
-      ]),
-    });
-  }
-
-  checkForm(): boolean {
-    return this.resetPasswordForm.valid;
-  }
-
-  oldPasswordValidator(control: AbstractControl): ValidationErrors | null {
-    if (this.showOldPassword && control.value == null) {
-      return { customValidation: true };
-    }
-    return null;
-  }
-  confirmPasswordValidator(control: AbstractControl): ValidationErrors | null {
-    if (
-      this.resetPasswordForm &&
-      this.resetPasswordForm.controls['Password'] &&
-      this.resetPasswordForm.controls['Password'].value !== control.value
-    ) {
-      return { customValidation: true };
-    }
-    return null;
-  }
-
-  async submit() {
-    if (!this.checkForm()) {
-      return;
-    }
-    var data: ResetPasswordData = {
-      OldPassword: this.showOldPassword
-        ? String(CryptoJS.MD5(this.resetPasswordForm.controls['OldPassword'].value))
-        : undefined,
-      Password: String(CryptoJS.MD5(this.resetPasswordForm.controls['Password'].value)),
-      ConfirmPassword: String(CryptoJS.MD5(this.resetPasswordForm.controls['ConfirmPassword'].value)),
-    };
-    this.onSubmit.emit(data);
-    var passwordRequest: PasswordRequestParam = {
-      NewPassword: data.Password,
-      OldPassword: data.OldPassword,
-      Token: this.token,
-    };
-    this.utilService.sendBI(true);
-    const res = await this.server.post(
-      `User/CompleteChangePasswordRequest`,
-      passwordRequest
-    );
-    this.utilService.sendBI(false);
-    if (res instanceof ErrorResponse) {
-      this.onSubmitEnd.emit(res);
-    } else {
-      var result = res as ResponseKeyValue;
-      this.onSubmitEnd.emit(result);
-    }
-  }
-}
-

package/src/lib/components/reset-password/reset-password.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-import { ResetPasswordComponent } from './reset-password.component';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { VerbenaButtonModule, VerbenaInputModule } from 'verben-ng-ui';
-import { CommonModule } from '@angular/common';
-
-@NgModule({
-  declarations: [ResetPasswordComponent],
-  imports: [
-    FormsModule,
-    ReactiveFormsModule,
-    VerbenaInputModule,
-    VerbenaButtonModule,
-    CommonModule,
-  ],
-  exports: [ResetPasswordComponent],
-})
-export class ResetPasswordModule {}

package/src/lib/components/role-control/ChildrenType.ts

@@ -1,4 +0,0 @@
-export enum ChildrenType {
-  Permission = 'Permission',
-  Action = 'Action',
-}

package/src/lib/components/role-control/UIActions.ts

@@ -1,5 +0,0 @@
-export enum UIActions {
-  Save = 'Save',
-  Edit = 'Edit',
-  Delete = 'Delete',
-}

package/src/lib/components/role-control/UIs.ts

@@ -1,38 +0,0 @@
-export enum UIs {
-  ProductDistribution = 'ProductDistribution',
-  Terminals = 'Terminals',
-  Meters = 'Meters',
-  ProductInbound = 'ProductInbound',
-  TerminalDocumentation = 'TerminalDocumentation',
-  Laboratories = 'Laboratories',
-  Surveyors = 'Surveyors',
-  Products = 'Products',
-  Stocks = 'Stocks',
-  Tanks = 'Tanks',
-  Customers = 'Customers',
-  ProductAllocation = 'ProductAllocation',
-  ReleaseManagement = 'ReleaseManagement',
-  ProductPricing = 'ProductPricing',
-  Purchases = 'Purchases',
-  Agents = 'Agents',
-  Banks = 'Banks',
-  Vendors = 'Vendors',
-  Vessels = 'Vessels',
-  ExpenseList = 'ExpenseList',
-  ProcurementDocumentation = 'ProcurementDocumentation',
-  Journal = 'Journal',
-  JournalTemplate = 'JournalTemplate',
-  RecurringJournal = 'RecurringJournal',
-  InterCompanyJournal = 'InterCompanyJournal',
-  InterCompanyJournalTemplate = 'InterCompanyJournalTemplate',
-  UserManagement = 'UserManagement',
-  AccessRequest = 'AccessRequest',
-  RolesAndPermissions = 'RolesAndPermissions',
-  AuditTrail = 'AuditTrail',
-  LogViewer = 'LogViewer',
-  MessageHistory = 'MessageHistory',
-  MessageConfig = 'MessageConfig',
-  MessageList = 'MessageList',
-  Config = 'Config',
-  Reports = 'Reports',
-}

package/src/lib/components/role-control/base-table-style.ts

@@ -1,52 +0,0 @@
-export const baseStyle: any = {
-  width: '100%',
-  fontFamily: '"Fraunces", serif',
-  fontSize: '125%',
-  whiteSpace: 'nowrap',
-  margin: '0',
-  border: '1px solid #D4A007',
-  borderRadius: '16px',
-  borderCollapse: 'separate',
-  borderSpacing: '0',
-  // tableLayout: 'fixed',
-  overflow: 'hidden',
-  rows: {
-    even: {
-      backgroundColor: '#FDFDFD',
-    },
-    odd: {
-      backgroundColor: '#F1F4FB',
-    },
-    height: '68px',
-  },
-  cells: {
-    padding: '0.5rem 1rem',
-  },
-  header: {
-    // stickyTop: true,
-    // zIndex: 2,
-    backgroundColor: '#EFF2FB',
-    fontWeight: 'bold',
-    textAlign: 'left',
-    padding: '12px 16px',
-    height: '30px',
-  },
-  footer: {
-    // stickyBottom: true,
-    // zIndex: 2,
-    padding: '3px',
-  },
-  //   body: {
-  //     background: '#fff',
-  //     padding: '4px 5px',
-  //     textAlign: 'center',
-  //   },
-  // firstColumn: {
-  //   stickyLeft: true,
-  //   zIndex: 1,
-  // },
-  lastColumn: {
-    // stickyRight: true,
-    // zIndex: 1,
-  },
-};

package/src/lib/components/role-control/role-control.component.css

@@ -1,87 +0,0 @@
-.view-links {
-  font-size: 14px !important;
-  color: #0000ff;
-  font-weight: 600;
-  cursor: pointer;
-}
-
-.view-links:hover {
-  text-decoration: underline;
-  text-underline-offset: 3px;
-}
-
-.context-banner {
-  background-color: rgba(212, 160, 7, 0.45);
-}
-
-.card-min-height {
-  gap: 10px;
-}
-
-::ng-deep .childrenPadding {
-  max-height: 300px;
-  overflow-y: auto;
-}
-
-/* ::ng-deep .toolbar {
-  margin-bottom: 15px;
-} */
-
-/* ::ng-deep .master-only-container {
-  margin: 0 !important;
-  padding: 0 !important;
-}
-
-::ng-deep .master-detail-container {
-  margin: 0 !important;
-  padding: 0 !important;
-} */
-.pop-up-content {
-  border-radius: 4px;
-  background-color: white;
-  border: 1px solid rgba(212, 161, 7, 0.5);
-}
-
-.pop-up-value {
-  padding: 10px 20px;
-}
-
-.pop-up-content > div:nth-child(1) {
-  border-bottom: 4px solid #ffe681;
-}
-
-.width-max {
-  min-width: max-content;
-}
-
-.search-section {
-  flex: 1 1 0;
-  border: 1px solid transparent;
-  padding: 5px 10px;
-  border-radius: 24px;
-  gap: 3px;
-  background-color: rgba(217, 217, 217, 0.25);
-  align-items: center;
-}
-
-.search-section.focused {
-  border-color: #3b82f6;
-  outline: none;
-}
-
-.search-icon > svg {
-  color: #64748b;
-  width: 0.8rem;
-  height: 0.8rem;
-}
-
-.search-input-container {
-  flex: 1 1 0;
-}
-
-.search-input {
-  width: 100%;
-  border: none;
-  outline: none;
-  background-color: transparent;
-}