ecabs-components 0.0.2 → 0.0.3

package/lib/ecabs-loading/ecabs-loading.component.spec.ts

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

package/lib/ecabs-loading/ecabs-loading.component.ts

@@ -1,11 +0,0 @@
-import { Component, Input } from '@angular/core';
-
-@Component({
-  selector: 'ecabs-ecabs-loading',
-  templateUrl: './ecabs-loading.component.html',
-})
-export class EcabsLoadingComponent {
-  @Input() loading = false;
-  @Input() backgroundColor = 'white';
-  @Input() size: 'large' | 'medium' | 'tiny' = 'medium';
-}

package/lib/ecabs-loading/ecabs-loading.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { EcabsLoadingComponent } from './ecabs-loading.component';
-import { EcabsSpinnerComponent } from './spinner/spinner.component';
-
-@NgModule({
-  declarations: [EcabsLoadingComponent, EcabsSpinnerComponent],
-  imports: [CommonModule],
-  exports: [EcabsLoadingComponent, EcabsSpinnerComponent],
-})
-export class EcabsLoadingModule {}

package/lib/ecabs-loading/spinner/spinner.component.html

@@ -1,5 +0,0 @@
-<div class="loadingio-spinner-rolling {{ size }}">
-  <div class="ldio-inner">
-    <div></div>
-  </div>
-</div>

package/lib/ecabs-loading/spinner/spinner.component.scss

@@ -1,61 +0,0 @@
-:host {
-  line-height: 0;
-}
-@keyframes ldio-inner {
-  0% {
-    transform: translate(-50%, -50%) rotate(0deg);
-  }
-  100% {
-    transform: translate(-50%, -50%) rotate(360deg);
-  }
-}
-
-.loadingio-spinner-rolling {
-  width: 27px;
-  height: 27px;
-  display: inline-block;
-  overflow: hidden;
-  background: none;
-  .ldio-inner {
-    width: 100%;
-    height: 100%;
-    position: relative;
-    transform: translateZ(0) scale(1);
-    backface-visibility: hidden;
-    transform-origin: 0 0;
-    div {
-      position: absolute;
-      width: 9px;
-      height: 9px;
-      border: 4px solid #85a2b6;
-      border-top-color: transparent;
-      border-radius: 50%;
-      animation: ldio-inner 1s linear infinite;
-      top: 14px;
-      left: 14px;
-      box-sizing: content-box;
-    }
-  }
-  &.medium {
-    width: 40px;
-    height: 40px;
-    .ldio-inner div {
-      width: 20px;
-      height: 20px;
-      border-width: 6px;
-      top: 19px;
-      left: 19px;
-    }
-  }
-  &.large {
-    width: 60px;
-    height: 60px;
-    .ldio-inner div {
-      width: 35px;
-      height: 35px;
-      border-width: 9px;
-      top: 29px;
-      left: 29px;
-    }
-  }
-}

package/lib/ecabs-loading/spinner/spinner.component.spec.ts

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

package/lib/ecabs-loading/spinner/spinner.component.ts

@@ -1,11 +0,0 @@
-import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
-
-@Component({
-  selector: 'ecabs-loading-spinner',
-  templateUrl: './spinner.component.html',
-  styleUrls: ['./spinner.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class EcabsSpinnerComponent {
-  @Input() size: 'large' | 'medium' | 'tiny' = 'medium';
-}

package/lib/ecabs-select/ecabs-select.component.html

@@ -1,38 +0,0 @@
-<app-element-wrapper [data]="getData()">
-  <mat-form-field floatLabel="always" [ngClass]="{ disabled: useOnlyDisabledClass }">
-    <mat-select
-      [(ngModel)]="value"
-      (closed)="onTouch()"
-      appearance="outline"
-      [multiple]="multiple"
-      [disabled]="disabled"
-      [placeholder]="placeholder"
-      (selectionChange)="onSelectionChanged($event)"
-    >
-      <mat-select-trigger>
-        <span *ngIf="getAllSelectedChecked()">{{ 'All' }}</span>
-        <span *ngIf="!getAllSelectedChecked()"
-          >{{ val && multiple ? getLabel(val[0]) : getLabel(val) }}
-          <span *ngIf="multiple && value?.length > 1" class="additional-selection">
-            (+{{ useSelectAllOption && this.allSelected?.selected ? value?.length - 2 : value?.length - 1 }}
-            {{ (value?.length === 2 ? 'Other' : 'Others') }})
-          </span>
-        </span>
-      </mat-select-trigger>
-      <mat-option *ngIf="useSearchOption">
-        [formControl]="itemFilterCtrl"
-        <ngx-mat-select-search
-          [placeholderLabel]="searchFieldPlaceholder"
-          [noEntriesFoundLabel]="noEntriesFoundLabel"
-        ></ngx-mat-select-search>
-      </mat-option>
-      <mat-option *ngIf="useNoneOption">{{ 'None' }}</mat-option>
-      <mat-option #allSelected *ngIf="useSelectAllOption" (click)="toggleAllSelection()" [value]="selectAllValue">{{
-        'All'
-      }}</mat-option>
-      <mat-option *ngFor="let item of filteredItems$ | async" [value]="item.value" (click)="togglePerOne()">
-        {{ item.label }}
-      </mat-option>
-    </mat-select>
-  </mat-form-field>
-</app-element-wrapper>

package/lib/ecabs-select/ecabs-select.component.ts

@@ -1,246 +0,0 @@
-import {
-  AfterViewInit,
-  Component,
-  EventEmitter,
-  Injector,
-  Input,
-  OnChanges,
-  OnDestroy,
-  OnInit,
-  Output,
-  SimpleChanges,
-  ViewChild,
-} from '@angular/core';
-import {
-  UntypedFormControl,
-  NgControl,
-  NG_VALUE_ACCESSOR,
-} from '@angular/forms';
-import { MatOption } from '@angular/material/core';
-import { MatSelectSearchComponent } from 'ngx-mat-select-search';
-import {
-  combineLatest,
-  debounceTime,
-  map,
-  ReplaySubject,
-  Subscription,
-} from 'rxjs';
-import ElementBaseComponent from '../base/element-base';
-
-@Component({
-  selector: 'ecabs-select',
-  templateUrl: './ecabs-select.component.html',
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: EcabsSelectComponent,
-      multi: true,
-    },
-  ],
-})
-export class EcabsSelectComponent
-  extends ElementBaseComponent
-  implements OnInit, OnChanges, AfterViewInit, OnDestroy
-{
-  @Input() items!: { label: string; value: any }[];
-  @Input() multiple = false;
-  @Input() useNoneOption: boolean = false;
-  @Input() useOnlyDisabledClass = false;
-  @Input() searchFieldPlaceholder: string = 'Search';
-  @Input() useSearchOption = false;
-  @Input() useSelectAllOption = false;
-  @Input() setAllOptionAfterChosenAllItems = true;
-  @Input() selectAllValue: any = 0;
-  @Input() noEntriesFoundLabel = 'SELECT.NO_MATCHING_FOUND';
-  @Output() updateFilterItems: EventEmitter<string> =
-    new EventEmitter<string>();
-  @Output() selectionChange: EventEmitter<any> = new EventEmitter<any>();
-
-  @ViewChild('allSelected') allSelected!: MatOption;
-  @ViewChild(MatSelectSearchComponent)
-  matSelectSearchComponent!: MatSelectSearchComponent;
-
-  val!: any;
-  filteredItems$: ReplaySubject<{ label: string; value: any }[]> =
-    new ReplaySubject<{ label: string; value: any }[]>(1);
-  itemFilterCtrl = new UntypedFormControl();
-  isClearAll = false;
-  subscriptions = new Subscription();
-  get value(): any {
-    return this.val;
-  }
-
-  set value(val) {
-    if (this.val !== val) {
-      this.val = val;
-      this.onChange(val);
-      this.onTouch(val);
-    }
-  }
-
-  constructor(private injector: Injector) {
-    super();
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes['items'] && changes['items'].currentValue) {
-      this.filteredItems$.next(changes['items'].currentValue.slice());
-      this.filterItems();
-
-      if (
-        this.multiple &&
-        this.useSelectAllOption &&
-        this.allSelected?.selected
-      ) {
-        setTimeout(() => {
-          this.control.patchValue([
-            ...this.items.map((item) => item.value),
-            this.selectAllValue,
-          ]);
-        }, 100);
-      }
-    }
-  }
-
-  ngAfterViewInit(): void {
-    const ngControl: NgControl = this.injector.get(
-      NgControl,
-      null
-    ) as NgControl;
-
-    if (ngControl) {
-      this.control = ngControl.control as UntypedFormControl;
-    }
-
-    if (this.matSelectSearchComponent) {
-      this.matSelectSearchComponent._showNoEntriesFound$ = combineLatest([
-        this.itemFilterCtrl.valueChanges,
-        this.filteredItems$,
-      ]).pipe(
-        map(
-          ([value, items]) =>
-            this.matSelectSearchComponent.noEntriesFoundLabel &&
-            value &&
-            items.length === 0
-        )
-      );
-    }
-  }
-
-  ngOnInit(): void {
-    this.subscriptions.add(
-      this.itemFilterCtrl.valueChanges
-        .pipe(debounceTime(200))
-        .subscribe((value:any) => {
-          this.filterItems();
-          this.updateFilterItems.emit(value);
-
-          if (this.isClearAll) {
-            this.control.patchValue([]);
-            this.isClearAll = false;
-          }
-        })
-    );
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onChange: any = () => {};
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onTouch: any = () => {};
-
-  toggleAllSelection(): void {
-    if (this.allSelected.selected) {
-      this.control.patchValue([
-        ...this.items.map((item) => item.value),
-        this.selectAllValue,
-      ]);
-    } else {
-      this.control.patchValue([]);
-      this.isClearAll = true;
-    }
-  }
-
-  togglePerOne(): void {
-    if (this.allSelected) {
-      if (this.allSelected.selected) {
-        this.allSelected.deselect();
-      }
-      if (
-        this.setAllOptionAfterChosenAllItems &&
-        this.control.value.length === this.items.length
-      ) {
-        this.allSelected.select();
-      }
-    }
-    this.isClearAll = false;
-  }
-
-  getAllSelectedChecked(): boolean {
-    return this.allSelected !== undefined && this.allSelected.selected;
-  }
-
-  getLabel(val: any): string {
-    if (
-      this.useSelectAllOption &&
-      this.allSelected?.selected &&
-      this.items &&
-      this.items.length > 0
-    ) {
-      return this.items[0].label;
-    }
-
-    if (val !== undefined && this.items && this.items.length > 0) {
-      // eslint-disable-next-line @typescript-eslint/no-shadow
-      const item = this.items.find((item) => item.value === val);
-
-      return item ? item.label : '';
-    }
-
-    return '';
-  }
-
-  writeValue(value: any): void {
-    this.value = value;
-  }
-
-  registerOnChange(fn: any): void {
-    this.onChange = fn;
-  }
-
-  registerOnTouched(fn: any): void {
-    this.onTouch = fn;
-  }
-
-  ngOnDestroy(): void {
-    this.subscriptions.unsubscribe();
-  }
-
-  onSelectionChanged($event: any): void {
-    this.selectionChange.emit($event);
-  }
-
-  private filterItems(): void {
-    if (!this.items) {
-      return;
-    }
-
-    // get the search keyword
-    let search: string = this.itemFilterCtrl.value;
-
-    if (!search || search === '') {
-      this.filteredItems$.next(this.items.slice());
-
-      return;
-    }
-
-    search = search.toLowerCase();
-
-    this.filteredItems$.next(
-      this.items && this.items.length > 0
-        ? this.items.filter((item) =>
-            item.label.toLowerCase().includes(search.toLowerCase())
-          )
-        : []
-    );
-  }
-}

package/lib/ecabs-select/ecabs-select.module.ts

@@ -1,34 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ElementWrapperModule } from '../base/element-wrapper/element-wrapper.module';
-import { FormsModule } from '@angular/forms';
-import { EcabsSelectComponent } from './ecabs-select.component';
-import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
-import {
-  MAT_SELECT_SCROLL_STRATEGY,
-  MatSelectModule,
-} from '@angular/material/select';
-import { BlockScrollStrategy, Overlay } from '@angular/cdk/overlay';
-
-@NgModule({
-  declarations: [EcabsSelectComponent],
-  imports: [
-    CommonModule,
-    ElementWrapperModule,
-    MatSelectModule,
-    FormsModule,
-    NgxMatSelectSearchModule,
-  ],
-  exports: [EcabsSelectComponent],
-  providers: [
-    {
-      provide: MAT_SELECT_SCROLL_STRATEGY,
-      useFactory: scrollFactory,
-      deps: [Overlay],
-    },
-  ],
-})
-export class EcabsSelectModule {}
-export function scrollFactory(overlay: Overlay): () => BlockScrollStrategy {
-  return () => overlay.scrollStrategies.block();
-}

package/lib/ecabs-textarea/ecabs-textarea.component.html

@@ -1,13 +0,0 @@
-<app-element-wrapper [data]="getData()">
-  <textarea
-    class="form-field__textarea"
-    [id]="name"
-    [(ngModel)]="value"
-    [placeholder]="placeholder"
-    (blur)="onTouch()"
-    [disabled]="disabled"
-    [maxlength]="maxLength"
-    [rows]="rows"
-  >
-  </textarea>
-</app-element-wrapper>

package/lib/ecabs-textarea/ecabs-textarea.component.ts

@@ -1,61 +0,0 @@
-import { AfterViewInit, Component, Injector, Input } from '@angular/core';
-import { ControlValueAccessor, UntypedFormControl, NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';
-import ElementBaseComponent from '../base/element-base';
-
-@Component({
-  selector: 'ecabs-textarea',
-  templateUrl: './ecabs-textarea.component.html',
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: EcabsTextareaComponent,
-      multi: true,
-    },
-  ],
-})
-export class EcabsTextareaComponent extends ElementBaseComponent implements ControlValueAccessor, AfterViewInit {
-  @Input()
-  rows!: number;
-
-  val!: string;
-
-  get value(): string {
-    return this.val;
-  }
-
-  set value(val) {
-    if (val !== undefined && this.val !== val) {
-      this.val = val;
-      this.onChange(val);
-      this.onTouch(val);
-    }
-  }
-
-  constructor(private injector: Injector) {
-    super();
-  }
-
-  ngAfterViewInit(): void {
-    const ngControl: NgControl = this.injector.get(NgControl, null) as NgControl;
-    if (ngControl) {
-      this.control = ngControl.control as UntypedFormControl;
-    }
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onChange: any = (): void => {};
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onTouch: any = (): void => {};
-
-  writeValue(value: any): void {
-    this.value = value;
-  }
-
-  registerOnChange(fn: any): void {
-    this.onChange = fn;
-  }
-
-  registerOnTouched(fn: any): void {
-    this.onTouch = fn;
-  }
-}

package/lib/ecabs-textarea/ecabs-textarea.module.ts

@@ -1,12 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { EcabsTextareaComponent } from './ecabs-textarea.component';
-import { ElementWrapperModule } from '../base/element-wrapper/element-wrapper.module';
-import { FormsModule } from '@angular/forms';
-
-@NgModule({
-  declarations: [EcabsTextareaComponent],
-  imports: [CommonModule, ElementWrapperModule, FormsModule],
-  exports: [EcabsTextareaComponent],
-})
-export class EcabsTextAreaModule {}

package/lib/services/ecabs-components.service.ts

@@ -1,33 +0,0 @@
-import { Injectable } from '@angular/core';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class EcabsComponentsService {
-  config: EcabsComponentsConfig = {
-    errorMessages: [
-      { type: 'required', message: '[label] is required' },
-      { type: 'minlength', message: '[label] should be atleast [requiredLength] character' },
-      { type: 'maxLength', message: '[label] should be maximum [requiredLength] character' },
-      { type: 'min', message: '[label] should be minmum [min]' },
-      { type: 'max', message: '[label] should be maximum [max]' },
-      { type: 'minValue', message: '[label] should be minmum [requiredMin]' },
-      { type: 'maxValue', message: '[label] should be maximum [requiredMax]' },
-    ],
-  };
-  constructor() {}
-  setConfig(c: EcabsComponentsConfig) {
-    this.config.errorMessages = c.errorMessages;
-  }
-  getConfig(): EcabsComponentsConfig {
-    return this.config;
-  }
-}
-
-export interface EcabsComponentsConfig {
-  errorMessages: ErrorMessage[];
-}
-export interface ErrorMessage {
-  type: string;
-  message: string;
-}

package/public-api.ts

@@ -1,11 +0,0 @@
-export * from './lib/ecabs-buttons/ecabs-buttons.module';
-export * from './lib/ecabs-buttons/ecabs-buttons.component';
-export * from './lib/ecabs-loading/ecabs-loading.module';
-export * from './lib/ecabs-loading/ecabs-loading.component';
-export * from './lib/ecabs-loading/spinner/spinner.component';
-export * from './lib/ecabs-input/ecabs-input.component';
-export * from './lib/ecabs-input/ecabs-input.module';
-export * from './lib/ecabs-select/ecabs-select.module';
-export * from './lib/ecabs-select/ecabs-select.component';
-export * from './lib/ecabs-textarea/ecabs-textarea.component';
-export * from './lib/ecabs-textarea/ecabs-textarea.module';

package/test.ts

@@ -1,27 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js';
-import 'zone.js/testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: {
-  context(path: string, deep?: boolean, filter?: RegExp): {
-    <T>(id: string): T;
-    keys(): string[];
-  };
-};
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting(),
-);
-
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().forEach(context);