@piserve-tech/drop-down 1.2.110 → 1.2.112

package/src/lib/dropdown.component.ts

@@ -1,226 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  EventEmitter,
-  HostListener,
-  Input,
-  OnInit,
-  Output,
-  SimpleChanges,
-  ViewChild,
-  ViewEncapsulation,
-} from "@angular/core";
-import { DropdownItem } from "./dropdown.model";
-import { v4 as uuidv4 } from 'uuid';
-
-@Component({
-  selector: "lib-dropdown",
-  templateUrl: "./dropdown.component.html",
-  styleUrls: ["./dropdown.component.scss"],
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class DropdownComponent implements OnInit {
-  @Input() multiple!: boolean;
-  @Input() selectedItems: any[] = [];
-  @Input() placeholder: String = "";
-  @Input() showCreateNew!: boolean;
-  @Input() selectedValues: string = "";
-  @Input() customButtons: {
-    label: string;
-    icon: string;
-    color: string;
-    action: () => void;
-  }[] = [];
-  @Input() showBorder: boolean = true;
-  @Input() disable: boolean = false;
-  @Output() buttonClick: EventEmitter<Event> = new EventEmitter<Event>();
-  @Output() selectedItemsChange: EventEmitter<any[]> = new EventEmitter<
-    any[]
-  >();
-  @Output() onDropdownScroll: EventEmitter<Event> = new EventEmitter<Event>();
-  @Output() onCreateNew: EventEmitter<Event> = new EventEmitter<Event>();
-  @Output() onSearch: EventEmitter<string> = new EventEmitter<string>();
-  //subLabel
-  @Input() showSubLabel: boolean = false;
-  dropdownId = uuidv4();
-  dropdownOpened: boolean = false;
-  selectedItem: any;
-  selectedItemName: string = "";
-  selectedItemImage: string = "";
-  originalItems: DropdownItem[] = [];
-  searchTerm: string = "";
-  initialized: boolean = false;
-  searchText: string = "";
-  _filteredItems: DropdownItem[] = [];
-
-  private _items: DropdownItem[] = [];
-
-  @Input()
-  set items(value: DropdownItem[]) {
-    this._items = value || [];
-    this.originalItems = this._items.slice();
-    this._filteredItems = this._items.slice(); // use a separate variable for rendering
-    this.cdr.markForCheck();
-  }
-  get items(): DropdownItem[] {
-    return this._items;
-  }
-
-  constructor(private cdr: ChangeDetectorRef) {}
-
-  ngOnInit(): void {}
-
-
-
-  ngOnChanges(changes: SimpleChanges) {
-    if (changes["selectedItems"]) {
-      const item = changes["selectedItems"]["currentValue"];
-      this.selectedItems = item;
-      this.selectedItemName = this.selectedItems[0]?.label;
-      this.selectedItemImage = this.selectedItems[0]?.image;
-    }
-    if (changes["items"]) {
-      this.initialize();
-      this.originalItems = this.items.slice();
-      this.cdr.markForCheck();
-    }
-    if (changes["selectedValues"]) {
-      this.selectedItemName = this.selectedValues;
-    }
-  }
-
-  initialize() {
-    setTimeout(() => {
-      if (this.selectedItems && this.selectedItems.length > 0) {
-        if (!this.multiple) {
-          this.searchText = "";
-          this.selectedItemName = this.selectedItems[0]?.label;
-          this.selectedItemImage = this.selectedItems[0]?.image;
-        }
-      }
-    }, 1000);
-    const uniqueItems = this.items.filter(
-      (selected, index, self) =>
-        index === self.findIndex((t) => t.value === selected.value)
-    );
-
-    this.items = uniqueItems;
-  }
-
-  openDropdown() {
-    this.dropdownOpened = !this.dropdownOpened;
-     const inputId = `searchInput-${this.dropdownId}`;
-    const inputEl = document.getElementById(inputId);
-     setTimeout(() => {
-      inputEl?.focus();
-    }, 0);
-    
-  }
-
-  @ViewChild("dropdownItems") dropdownitems!: ElementRef<any>;
-  dropdownScroll(event: any): void {
-    if (this.onDropdownScroll.observed) {
-      this.onDropdownScroll.emit(event);
-      this.cdr.markForCheck();
-    }
-  }
-
-  selectItem(item: any) {
-    if (this.multiple) {
-      if (!this.selectedItems.includes(item)) {
-        this.selectedItems.push(item);
-        this.selectedItemsChange.emit(this.selectedItems);
-      } else {
-        this.selectedItems = this.selectedItems.filter(
-          (selected: any) => selected !== item
-        );
-        this.selectedItemsChange.emit(this.selectedItems);
-      }
-    } else {
-      this.searchText = "";
-      this.selectedItems[0] = item;
-      this.selectedItemName = this.selectedItems[0]?.label;
-      this.selectedItemImage = this.selectedItems[0]?.image;
-      this.dropdownOpened = false;
-      this.selectedItemsChange.emit(this.selectedItems);
-    }
-  }
-
-  unselectItem(item: any): void {
-    this.selectedItems = this.selectedItems.filter(
-      (selected: any) => selected !== item
-    );
-    this.selectedItemsChange.emit(this.selectedItems);
-  }
-
-  unselectAll() {
-    this.selectedItems = [];
-    this.selectedItemName = "";
-    this.selectedItemImage = "";
-    this.selectedItemsChange.emit(this.selectedItems);
-    this.cdr.markForCheck();
-  }
-
-  @ViewChild("dropdown") dropdown!: ElementRef;
-  @HostListener("document:click", ["$event"])
-  onDocumentClick(event: Event): void {
-    const isClickInsideDropdown = this.dropdown.nativeElement.contains(
-      event.target
-    );
-
-    if (!isClickInsideDropdown) {
-      this.dropdownOpened = false;
-    }
-  }
-
-  createNew() {
-    this.onCreateNew.emit();
-    this.dropdownOpened = false;
-  }
-
-  search(event: any): void {
-    const keyCode = event.keyCode;
-    this.dropdownOpened = true;
-    this.searchTerm = event.target.value.toLowerCase();
-    if (!this.onSearch.observed) {
-      if (this.searchTerm.trim() === "") {
-        if (!this.multiple) {
-          this.unselectAll();
-        }
-        this._filteredItems = this.originalItems.slice();
-      } else {
-        const lowerCaseSearchTerm = this.searchTerm.toLowerCase();
-        this._filteredItems = this.originalItems.filter(
-          (item) =>
-            item.label.toLowerCase().includes(lowerCaseSearchTerm) ||
-            (item.value &&
-              item.value.toLowerCase().includes(lowerCaseSearchTerm))
-        );
-      }
-    } else {
-      this.onSearch.emit(this.searchTerm);
-    }
-  }
-
-  handleButtonClick(action: () => void): void {
-    action();
-    this.buttonClick.emit();
-  }
-
-  highlightMatch(text: string): string {
-    const search = this.searchText?.trim() || this.searchTerm?.trim();
-    if (!search || !text) return text;
-
-    const index = text.toLowerCase().indexOf(search.toLowerCase());
-    if (index === -1) return text;
-
-    const before = text.substring(0, index);
-    const match = text.substring(index, index + search.length);
-    const after = text.substring(index + search.length);
-
-    return `${before}<span class="highlight-text">${match}</span>${after}`;
-  }
-}

package/src/lib/dropdown.module.ts

@@ -1,20 +0,0 @@
-import { NgModule } from '@angular/core';
-import { DropdownComponent } from './dropdown.component';
-import { FormsModule } from '@angular/forms';
-import { CommonModule } from '@angular/common';
-
-
-
-@NgModule({
-  declarations: [
-    DropdownComponent
-  ],
-  imports: [
-    FormsModule,
-    CommonModule,
-  ],
-  exports: [
-    DropdownComponent
-  ]
-})
-export class DropdownModule { }

package/src/lib/dropdown.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { DropdownService } from './dropdown.service';
-
-describe('DropdownService', () => {
-  let service: DropdownService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(DropdownService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

package/src/lib/dropdown.service.ts

@@ -1,9 +0,0 @@
-import { Injectable } from '@angular/core';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class DropdownService {
-
-  constructor() { }
-}

package/tsconfig.lib.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/lib",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": []
-  },
-  "exclude": [
-    "**/*.spec.ts"
-  ]
-}

package/tsconfig.lib.prod.json

@@ -1,10 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "./tsconfig.lib.json",
-  "compilerOptions": {
-    "declarationMap": false
-  },
-  "angularCompilerOptions": {
-    "compilationMode": "partial"
-  }
-}

package/tsconfig.spec.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine"
-    ]
-  },
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
-}