npm - mis-crystal-design-system - Versions diffs - 2.9.6 → 2.9.7-v14-1 - Mend

mis-crystal-design-system 2.9.6 → 2.9.7-v14-1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (640) hide show

package/fesm2015/mis-crystal-design-system-action-list.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"mis-crystal-design-system-action-list.mjs","sources":["../../../projects/mis-components/action-list/action-list.component.ts","../../../projects/mis-components/action-list/action-list.component.html","../../../projects/mis-components/action-list/action-list.module.ts","../../../projects/mis-components/action-list/mis-crystal-design-system-action-list.ts"],"sourcesContent":["import { ConnectionPositionPair, Overlay, OverlayConfig, OverlayRef } from \"@angular/cdk/overlay\";\nimport { TemplatePortal } from \"@angular/cdk/portal\";\nimport { Component, ElementRef, EventEmitter, Input, OnInit, Output, TemplateRef, ViewChild, ViewContainerRef } from \"@angular/core\";\n\n@Component({\n selector: \"mis-action-list\",\n templateUrl: \"./action-list.component.html\",\n styleUrls: [\"./action-list.component.scss\"]\n})\nexport class ActionListComponent implements OnInit {\n isOpen = false;\n\n subItems: ActionItem[] = [];\n\n @Input() data: ActionItems[] = [];\n @Input() height: string = \"\";\n @Input() width: string = \"\";\n @Input() label: string = \"Select\";\n\n @Input() dropdownListHeight: string = \"\";\n @Input() dropdownListWidth: string = \"\";\n @Input() dropdownListPosition: \"Left\" | \"Right\" = \"Left\";\n\n @Input() searchEnabled: boolean = true;\n @Input() noDataMessage: string = \"No Data\";\n selectedItems: ActionItem[] = [];\n\n @Output() onChange: EventEmitter<any> = new EventEmitter();\n\n @ViewChild(\"select\", { static: false }) selectElement: ElementRef;\n @ViewChild(\"popupContainer\", { static: false }) popupContainer: TemplateRef<Element>;\n @ViewChild(\"subPopupContainer\", { static: false }) subPopupContainer: TemplateRef<Element>;\n private overlayRef: OverlayRef;\n private subOverlayRef: OverlayRef;\n\n constructor(private eRef: ElementRef, private overlay: Overlay, private viewContainerRef: ViewContainerRef) {}\n ngOnInit() {\n this.selectedItems = [];\n this.data.forEach(q =>\n q.children.forEach(w => {\n if (w.checked) this.selectedItems.push(w);\n })\n );\n this.label = this.selectedItems[0]?.label || this.label;\n }\n\n filterByValue(array: ActionItem[], string: string) {\n return array.filter(o => o.label.toLowerCase().includes(string.toLowerCase()));\n }\n toggleDropdown() {\n this.isOpen = !this.isOpen;\n if (this.isOpen) this.openDropdown(this.popupContainer, this.selectElement.nativeElement, false);\n else this.onCancel();\n }\n private openDropdown(template: TemplateRef<Element>, origin: HTMLElement, openRight: boolean): void {\n const positionsBottom = [\n new ConnectionPositionPair({ originX: \"start\", originY: \"bottom\" }, { overlayX: \"start\", overlayY: \"top\" }, 0, 4),\n new ConnectionPositionPair({ originX: \"end\", originY: \"bottom\" }, { overlayX: \"end\", overlayY: \"top\" }, 0, 4)\n ];\n const positionsTop = [\n new ConnectionPositionPair({ originX: \"start\", originY: \"top\" }, { overlayX: \"start\", overlayY: \"bottom\" }, 0, -4),\n new ConnectionPositionPair({ originX: \"end\", originY: \"top\" }, { overlayX: \"end\", overlayY: \"bottom\" }, 0, -4)\n ];\n const positions = [\n ...(this.dropdownListPosition === \"Right\" ? positionsBottom.reverse() : positionsBottom),\n ...(this.dropdownListPosition === \"Right\" ? positionsTop.reverse() : positionsTop)\n ];\n const positionStrategy = this.overlay\n .position()\n .flexibleConnectedTo(origin)\n .withPositions(\n openRight ? [new ConnectionPositionPair({ originX: \"end\", originY: \"top\" }, { overlayX: \"start\", overlayY: \"top\" }, 8)] : positions\n )\n .withPush(true);\n const configs = new OverlayConfig({\n hasBackdrop: !openRight,\n backdropClass: \"cdk-overlay-transparent-backdrop\",\n scrollStrategy: this.overlay.scrollStrategies.reposition(),\n positionStrategy,\n width: origin.clientWidth || 140\n });\n if (openRight) {\n this.subOverlayRef = this.overlay.create(configs);\n if (this.dropdownListWidth) this.subOverlayRef.updateSize({ width: this.dropdownListWidth });\n if (this.dropdownListHeight) this.subOverlayRef.updateSize({ height: this.dropdownListHeight });\n this.subOverlayRef.attach(new TemplatePortal(template, this.viewContainerRef));\n this.subOverlayRef.backdropClick().subscribe(() => {\n this.onCancel();\n });\n return;\n }\n this.overlayRef = this.overlay.create(configs);\n if (this.dropdownListWidth) this.overlayRef.updateSize({ width: this.dropdownListWidth });\n if (this.dropdownListHeight) this.overlayRef.updateSize({ height: this.dropdownListHeight });\n this.overlayRef.attach(new TemplatePortal(template, this.viewContainerRef));\n this.overlayRef.backdropClick().subscribe(() => {\n this.onCancel();\n });\n }\n selectItem(item: ActionItem) {\n if (this.data.some(q => q.children.some(w => w.value === item.value && w.checked))) {\n if (item.type === \"MULTIPLE\") this.selectedItems = this.selectedItems.filter(q => q.value !== item.value);\n this.data = this.data.map(q => ({\n ...q,\n children: q?.children?.map(e => ({\n ...e,\n checked: e.checked && e.value !== item.value\n }))\n }));\n } else {\n this.data = this.data.map(q => ({\n ...q,\n children: q?.children?.map(e => ({\n ...e,\n checked: (e.type === \"MULTIPLE\" && (e.checked || e.value === item.value)) || (e.type === \"SINGLE\" && e.value === item.value)\n }))\n }));\n if (item.type === \"MULTIPLE\") this.selectedItems.push({ ...item, checked: true });\n }\n this.label =\n item.type === \"MULTIPLE\" ? (this.selectedItems.length > 0 ? this.selectedItems[0]?.label : \"Select\") : item.checked ? \"Select\" : item.label;\n this.subItems = this.data.find(q => q.children?.some(w => w.value === item.value))?.children || [];\n this.onChange.emit(this.data);\n if (item.type === \"SINGLE\") this.toggleDropdown();\n }\n onHover(item: ActionItem, isHovered, element?: any) {\n if (isHovered) {\n this.subItems.length > 0 && this.subOverlayRef?.detach();\n this.subItems = this.data.find(q => q?.children?.some(w => w?.parentValue === item?.value))?.children || [];\n this.subItems.length > 0 && this.openDropdown(this.subPopupContainer, element?.nativeElement || element, true);\n } else {\n this.subItems = [];\n this.subOverlayRef?.detach();\n }\n }\n onCancel() {\n this.isOpen = false;\n this.overlayRef?.detach();\n this.subOverlayRef?.detach();\n }\n}\n\nexport interface ActionItems {\n label: ActionItemLabel | string;\n value: string;\n icon?: string;\n disabled?: boolean;\n children?: ActionItem[];\n}\n\nexport interface ActionItemLabel {\n primaryText ?: string;\n secondaryText ?: string;\n}\n\nexport interface ActionItem {\n type: \"SINGLE\" | \"MULTIPLE\";\n label: string;\n value: string;\n parentValue: string;\n icon?: string;\n checked: boolean;\n disabled?: boolean;\n}\n","<div\n class=\"main-container\"\n [ngStyle]=\"{\n height: height.length > 0 ? height : '',\n width: width.length > 0 ? width : ''\n }\"\n>\n <div\n class=\"dropdown\"\n #select\n tabindex=\"0\"\n (keyup.enter)=\"toggleDropdown()\"\n (click)=\"toggleDropdown()\"\n [ngStyle]=\"{ background: isOpen ? '#E6EBF7' : '' }\"\n >\n <div class=\"label\">\n <p class=\"text\">\n {{ label }}\n </p>\n <p *ngIf=\"selectedItems?.length > 1\" class=\"count\">+{{ selectedItems?.length - 1 }}</p>\n </div>\n <svg\n class=\"handle\"\n [ngStyle]=\"{ transform: isOpen ? 'rotate(180deg)' : 'rotate(0deg)' }\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13.825 7.15845L10 10.9751L6.175 7.15845L5 8.33345L10 13.3334L15 8.33345L13.825 7.15845Z\"\n fill=\"#181F33\"\n />\n </svg>\n </div>\n</div>\n\n<ng-template #popupContainer>\n <div\n class=\"popup-container\"\n [ngStyle]=\"{\n height: dropdownListHeight,\n width: dropdownListWidth\n }\"\n >\n <div class=\"items\">\n <div\n #singleItem\n class=\"item\"\n tabindex=\"0\"\n [ngClass]=\"{ 'item-disabled': item?.disabled }\"\n (mouseenter)=\"onHover(item, true, singleItem)\"\n *ngFor=\"let item of data\"\n >\n <div class=\"label\" [ngStyle]=\"{ width: item?.icon ? '90%' : '100%' }\">\n <span>{{ item?.label }}</span>\n </div>\n <div class=\"icon-container\" *ngIf=\"item?.icon\">\n <img class=\"icon\" [src]=\"item.icon\" alt=\"no img\" />\n </div>\n </div>\n <div class=\"noData\" *ngIf=\"data.length === 0\">\n {{ noDataMessage || \"No results\" }}\n </div>\n </div>\n </div>\n</ng-template>\n\n<ng-template #subPopupContainer>\n <div\n class=\"popup-container\"\n [ngStyle]=\"{\n height: dropdownListHeight,\n width: dropdownListWidth\n }\"\n >\n <div class=\"items\">\n <div\n class=\"item\"\n tabindex=\"0\"\n [ngClass]=\"{ 'item-disabled': item.disabled }\"\n (click)=\"!item.disabled && selectItem(item)\"\n *ngFor=\"let item of subItems\"\n >\n <div class=\"checkbox-container\" *ngIf=\"item.type === 'MULTIPLE'\">\n <mis-checkbox [disabled]=\"item.disabled\" [checked]=\"item.checked\"></mis-checkbox>\n </div>\n <div class=\"label\" [ngStyle]=\"{ width: item.icon ? '90%' : '100%' }\">\n <span>{{ item.label }}</span>\n </div>\n <div class=\"icon-container\" *ngIf=\"item.icon || item.checked\">\n <img *ngIf=\"!item.checked\" class=\"icon\" [src]=\"item.icon\" alt=\"no img\" />\n <ng-container *ngIf=\"item.type === 'SINGLE' && item.checked\">\n <ng-container *ngTemplateOutlet=\"tickIcon\"></ng-container>\n </ng-container>\n </div>\n </div>\n <div class=\"noData\" *ngIf=\"data.length === 0\">\n {{ noDataMessage || \"No results\" }}\n </div>\n </div>\n </div>\n</ng-template>\n<ng-template #tickIcon>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.47697 14.8237L3.49922 10.5519C3.2776 10.3169 3.2776 9.93437 3.49922 9.69684L4.30273 8.84298C4.52434 8.60795 4.88462 8.60795 5.10623 8.84298L7.87929 11.8334L14.0607 5.17627C14.2823 4.94124 14.6426 4.94124 14.8642 5.17627L15.6677 6.03138C15.8894 6.26641 15.8894 6.65021 15.6677 6.88399L8.28048 14.8237C8.05886 15.0588 7.69859 15.0588 7.47697 14.8237Z\"\n fill=\"#181F33\"\n />\n </svg>\n</ng-template>\n","import { CommonModule } from \"@angular/common\";\nimport { FormsModule } from \"@angular/forms\";\nimport { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { ActionListComponent } from \"./action-list.component\";\nimport { CheckboxModule } from \"mis-crystal-design-system/checkbox\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\n\n@NgModule({\n declarations: [ActionListComponent],\n imports: [CommonModule, FormsModule, OverlayModule, CheckboxModule],\n exports: [ActionListComponent]\n})\nexport class ActionListModule {\n static forRoot(): ModuleWithProviders<ActionListModule> {\n return { ngModule: ActionListModule, providers: [] };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/{mis-crystal-design-system-analytics.js → mis-crystal-design-system-analytics.mjs} RENAMED Viewed

@@ -1,5 +1,6 @@
 import { DOCUMENT } from '@angular/common';
-import { ɵɵdefineInjectable, ɵɵinject, Injectable, Inject, NgModule } from '@angular/core';
+import * as i0 from '@angular/core';
+import { Injectable, Inject, NgModule } from '@angular/core';
 class AnalyticsService {
     constructor(document) {
@@ -49,15 +50,19 @@ class AnalyticsService {
         gtag === null || gtag === void 0 ? void 0 : gtag("set", { user_id: identifier });
     }
 }
-AnalyticsService.ɵprov = ɵɵdefineInjectable({ factory: function AnalyticsService_Factory() { return new AnalyticsService(ɵɵinject(DOCUMENT)); }, token: AnalyticsService, providedIn: "root" });
-AnalyticsService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: "root"
-            },] }
-];
-AnalyticsService.ctorParameters = () => [
-    { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
-];
+AnalyticsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AnalyticsService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+AnalyticsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AnalyticsService, providedIn: "root" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AnalyticsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: "root"
+                }]
+        }], ctorParameters: function () {
+        return [{ type: undefined, decorators: [{
+                        type: Inject,
+                        args: [DOCUMENT]
+                    }] }];
+    } });
 class AnalyticsModule {
     static forRoot() {
@@ -67,13 +72,16 @@ class AnalyticsModule {
         };
     }
 }
-AnalyticsModule.decorators = [
-    { type: NgModule }
-];
+AnalyticsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AnalyticsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AnalyticsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: AnalyticsModule });
+AnalyticsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AnalyticsModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AnalyticsModule, decorators: [{
+            type: NgModule
+        }] });
 /**
  * Generated bundle index. Do not edit.
  */
 export { AnalyticsModule, AnalyticsService };
-//# sourceMappingURL=mis-crystal-design-system-analytics.js.map
+//# sourceMappingURL=mis-crystal-design-system-analytics.mjs.map

package/fesm2015/mis-crystal-design-system-analytics.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"mis-crystal-design-system-analytics.mjs","sources":["../../../projects/mis-components/analytics/analytics.service.ts","../../../projects/mis-components/analytics/analytics.module.ts","../../../projects/mis-components/analytics/mis-crystal-design-system-analytics.ts"],"sourcesContent":["import { DOCUMENT } from \"@angular/common\";\nimport { Inject, Injectable, Renderer2 } from \"@angular/core\";\ndeclare const gtag: Function;\n\n@Injectable({\n providedIn: \"root\"\n})\nexport class AnalyticsService {\n private scriptLoaded = false;\n private pendingEvents: Array<Array<string>> = [];\n\n constructor(@Inject(DOCUMENT) private document: any) {}\n\n insertScript(measurementId: string, renderer: Renderer2): void {\n const loadScript = renderer.createElement(\"script\");\n loadScript.setAttribute(\"async\", true);\n loadScript.setAttribute(\"src\", `https://www.googletagmanager.com/gtag/js?id=${measurementId}`);\n\n const initScript = renderer.createElement(\"script\");\n initScript.innerText = `window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}gtag(\\'js\\', new Date());gtag(\\'config\\', \\'${measurementId}\\');`;\n renderer.appendChild(this.document.head, loadScript);\n renderer.appendChild(this.document.head, initScript);\n this.handlePendingEvents(loadScript);\n }\n\n private handlePendingEvents(script: HTMLScriptElement): void {\n script.addEventListener(\"load\", () => {\n this.scriptLoaded = true;\n for (const eventDetails of this.pendingEvents) {\n if (eventDetails[0] === \"event\") {\n this.send(eventDetails[1], eventDetails[2], eventDetails[3], eventDetails[4]);\n } else if (eventDetails[0] === \"set\") {\n this.setIdentity(eventDetails[1]);\n }\n }\n });\n }\n\n send(eventAction: string, event_category: string, event_label?: string, event_value?: string, force = false): void {\n if (!this.scriptLoaded && !force) {\n this.pendingEvents.push([\"event\", eventAction, event_category, event_label, event_value]);\n return;\n }\n gtag?.(\"event\", eventAction, {\n event_category,\n event_label,\n event_value\n });\n }\n\n setIdentity(identifier: string): void {\n if (!this.scriptLoaded) {\n this.pendingEvents.push([\"set\", identifier]);\n return;\n }\n gtag?.(\"set\", { user_id: identifier });\n }\n}\n","import { ModuleWithProviders, NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { AnalyticsService } from \"./analytics.service\";\n\n@NgModule()\nexport class AnalyticsModule {\n static forRoot(): ModuleWithProviders<AnalyticsModule> {\n return {\n ngModule: AnalyticsModule,\n providers: [AnalyticsService]\n };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/mis-crystal-design-system-async-search-dropdown.mjs ADDED Viewed

@@ -0,0 +1,272 @@
+import * as i1 from '@angular/cdk/overlay';
+import { ConnectionPositionPair, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
+import { TemplatePortal } from '@angular/cdk/portal';
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, Input, ViewChild, ContentChild, Output, NgModule } from '@angular/core';
+import * as i3 from '@angular/forms';
+import { UntypedFormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { tap, debounceTime, distinctUntilChanged } from 'rxjs/operators';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i4 from 'mis-crystal-design-system/loader';
+import { LoaderModule } from 'mis-crystal-design-system/loader';
+class AsyncDropdownComponent {
+    constructor(overlay, viewContainerRef, _ngZone) {
+        this.overlay = overlay;
+        this.viewContainerRef = viewContainerRef;
+        this._ngZone = _ngZone;
+        this.size = 'md';
+        this.placeholder = "Select"; // placeholder for input
+        this.debounceTime = 400; // wait time till which API call is paused
+        this.minInputLength = 2; // min length after which API call is made
+        this.multi = false; // maintain a list or emit value
+        // tslint:disable-next-line
+        this.onSelect = new EventEmitter(true); // emit selected values
+        this.searchInput = new UntypedFormControl();
+        this.data = [];
+        this.opened = false;
+        this.loading = false;
+        this.error = false;
+        // tslint:disable-next-line
+        this.selections = new Map();
+        this.searchQueryChange = new EventEmitter();
+        this.clear = new EventEmitter(false);
+        this.itemSelected = new EventEmitter();
+        this.itemRemoved = new EventEmitter();
+        this.handleControlChanges = (values) => {
+            values.forEach(el => {
+                this.selectData(el, true);
+            });
+            // tslint:disable-next-line
+        };
+    }
+    ngOnInit() {
+        var _a, _b;
+        if (this.multi && !this.uniqueKey) {
+            throw new Error("[uniqueKey] required in multi mode.");
+        }
+        if (this.disabled) {
+            this.searchInput.disable();
+        }
+        this.searchSubscription = this.searchInput.valueChanges
+            .pipe(
+        // filter(val => val && val.length >= this.minInputLength),
+        tap((val) => this.searchQueryChange.emit(val)), debounceTime(this.debounceTime), distinctUntilChanged())
+            .subscribe(res => {
+            this._ngZone.run(() => {
+                var _a;
+                if ((res === null || res === void 0 ? void 0 : res.length) < this.minInputLength || !(res === null || res === void 0 ? void 0 : res.length)) {
+                    this.closeDropdown();
+                    return;
+                }
+                else if ((res === null || res === void 0 ? void 0 : res.length) > this.minInputLength && this.httpStream) {
+                    this.loading = true;
+                    this.error = false;
+                    if (!((_a = this.overlayRef) === null || _a === void 0 ? void 0 : _a.hasAttached()))
+                        this.openDropdown(this.dd, this.origin.nativeElement);
+                    this.httpStream(res).subscribe(list => {
+                        var _a;
+                        this.loading = false;
+                        this.data = list;
+                        if (!((_a = this.overlayRef) === null || _a === void 0 ? void 0 : _a.hasAttached()) && list.length > 0) {
+                            this.openDropdown(this.dd, this.origin.nativeElement);
+                        }
+                    }, error => {
+                        this.loading = false;
+                        this.error = true;
+                    });
+                }
+            });
+        });
+        if ((_a = this.control) === null || _a === void 0 ? void 0 : _a.value) {
+            this.handleControlChanges(this.control.value);
+        }
+        this.controlSubscription = (_b = this.control) === null || _b === void 0 ? void 0 : _b.valueChanges.subscribe(this.handleControlChanges);
+    }
+    ngOnChanges(changes) {
+        var _a;
+        if (changes && ((_a = changes === null || changes === void 0 ? void 0 : changes.searchValue) === null || _a === void 0 ? void 0 : _a.currentValue)) {
+            this.searchInput.patchValue(changes.searchValue.currentValue);
+        }
+        if (changes && changes.disabled) {
+            this.searchInput.enable();
+            if (this.disabled) {
+                this.searchInput.disable();
+            }
+        }
+    }
+    ngOnDestroy() {
+        var _a;
+        (_a = this.searchSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+    }
+    openDropdown(template, origin) {
+        const positionStrategy = this.overlay
+            .position()
+            .flexibleConnectedTo(origin)
+            .withPositions([
+            new ConnectionPositionPair({ originX: "start", originY: "bottom" }, { overlayX: "start", overlayY: "top" }),
+            new ConnectionPositionPair({ originX: "start", originY: "top" }, { overlayX: "start", overlayY: "bottom" })
+        ])
+            .withPush(true);
+        const configs = new OverlayConfig({
+            hasBackdrop: true,
+            backdropClass: "cdk-overlay-transparent-backdrop",
+            scrollStrategy: this.overlay.scrollStrategies.reposition(),
+            positionStrategy,
+            width: origin.clientWidth
+        });
+        this.overlayRef = this.overlay.create(configs);
+        this.overlayRef.attach(new TemplatePortal(template, this.viewContainerRef));
+        this.overlayRef.backdropClick().subscribe(res => {
+            this.closeDropdown();
+        });
+    }
+    /**
+     * closes the dropdown
+     */
+    closeDropdown() {
+        var _a;
+        this.opened = false;
+        (_a = this.overlayRef) === null || _a === void 0 ? void 0 : _a.detach();
+        this.data = [];
+    }
+    /**
+     *
+     * @param item item to select
+     * if item property disabled is set to true, selection will be disabled
+     * @param effectedFromOutside set to true if calling from parent component, if true will focus on search input
+     */
+    selectData(item, effectedFromOutside = true) {
+        if (item.disabled) {
+            return;
+        }
+        this.itemSelected.emit(item);
+        if (!this.multi) {
+            this.searchInput.patchValue(item[this.displayKey], { emitEvent: false });
+            this.setControlValue(item);
+        }
+        else {
+            if (!this.selections.has(item[this.uniqueKey])) {
+                this.selections.set(item[this.uniqueKey], item);
+            }
+            this.setControlValue(this.selectedItems);
+            if (!effectedFromOutside) {
+                setTimeout(() => {
+                    this.input.nativeElement.focus();
+                    this.input.nativeElement.scrollIntoView();
+                }, 10);
+            }
+            this.searchInput.patchValue("");
+            this.data = [];
+        }
+        this.closeDropdown();
+    }
+    /**
+     *
+     * @param item remove item from selected list
+     */
+    removeItem(item) {
+        this.itemRemoved.emit(item);
+        this.selections.delete(item[this.uniqueKey]);
+        this.setControlValue(this.selectedItems);
+        // tslint:disable-next-line
+        this.input["nativeElement"].focus();
+    }
+    setControlValue(value) {
+        var _a;
+        this.onSelect.emit(value);
+        (_a = this.control) === null || _a === void 0 ? void 0 : _a.patchValue(value, { emitEvent: false });
+    }
+    /**
+     * @returns list of selected items
+     */
+    get selectedItems() {
+        return Array.from(this.selections.values());
+    }
+    removeInputValue() {
+        this.searchInput.reset();
+        this.data = [];
+        this.clear.emit(true);
+    }
+}
+AsyncDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AsyncDropdownComponent, deps: [{ token: i1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+AsyncDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: AsyncDropdownComponent, selector: "mis-async-search-dropdown", inputs: { height: "height", size: "size", httpStream: "httpStream", displayKey: "displayKey", secondaryDisplayKey: "secondaryDisplayKey", placeholder: "placeholder", debounceTime: "debounceTime", minInputLength: "minInputLength", multi: "multi", uniqueKey: "uniqueKey", control: "control", disabled: "disabled", readonly: "readonly", searchValue: "searchValue" }, outputs: { onSelect: "onSelect", searchQueryChange: "searchQueryChange", clear: "clear", itemSelected: "itemSelected", itemRemoved: "itemRemoved" }, queries: [{ propertyName: "customItem", first: true, predicate: ["misCustomItem"], descendants: true }, { propertyName: "customLoader", first: true, predicate: ["asyncCustomLoader"], descendants: true }], viewQueries: [{ propertyName: "origin", first: true, predicate: ["ddBtn"], descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "dd", first: true, predicate: ["dd"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dd-wrapper\" [ngClass]=\"{ opened: opened, disabled: disabled, readonly: readonly }\" #ddBtn>\n  <div class=\"selected-list\" *ngIf=\"multi && selections.size > 0\">\n    <div class=\"chip\" [ngClass]=\"{'chip-md': size === 'md', 'chip-sm': size === 'sm'}\" *ngFor=\"let item of selectedItems\">\n      <span [ngClass]=\"{'h6': size === 'md', 'h8-b': size === 'sm'}\" style=\"margin-right: 4px;\">{{item[displayKey]}}</span>\n      <span style=\"cursor: pointer;\" (click)=\"removeItem(item)\" [ngStyle]=\"{'font-size': size === 'sm' ? '12px': '14px'}\" class=\"ic-navigation-cancel-24\"></span>\n    </div>\n  </div>\n  <div class=\"search-input\">\n    <span class=\"ic-action-search-24\"></span>\n    <input [ngClass]=\"{'ip-md': size === 'md', 'ip-sm': size === 'sm'}\" tabindex=\"0\" type=\"text\" class=\"black-text h6\" #input [placeholder]=\"placeholder\" [formControl]=\"searchInput\" />\n    <div class=\"ic-navigation-cancel-24 croos-icon\" *ngIf=\"searchInput?.value?.length\" (click)=\"removeInputValue()\"></div>\n  </div>\n</div>\n\n<ng-template #dd>\n  <div class=\"dd-list\" [ngStyle]=\"{'max-height':height}\"  [ngClass]=\"{'dd-list-pd':data.length === 0}\" >\n    <ng-container *ngIf=\"loading\">\n      <ng-container\n        *ngIf=\"customLoader; else defaultLoader\"\n        [ngTemplateOutlet]=\"customLoader\"\n      ></ng-container>\n      <ng-template #defaultLoader>\n        <div class=\"status-container\" *ngIf=\"loading && !customLoader\">\n          <mis-loader [mobileView]=\"true\"></mis-loader>\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-container *ngIf=\"error\">\n      <div class=\"status-container\">\n        <p>Unknown error has occurred, <br> Please try again later.</p>\n      </div>\n    </ng-container>\n    <div *ngIf=\"!loading && !error && data.length > 0\">\n      <ng-container *ngFor=\"let item of data\">\n        <div (click)=\"selectData(item, false)\">\n          <ng-container\n            *ngIf=\"customItem; else standardItem\"\n            [ngTemplateOutlet]=\"customItem\"\n            [ngTemplateOutletContext]=\"{ $implicit: item }\"\n          ></ng-container>\n          <ng-template #standardItem>\n            <div class=\"item\">\n              <div class=\"value\">\n                <div class=\"primary\">\n                  {{ item[displayKey] }}\n                </div>\n                <div class=\"secondary\">\n                  {{ item[secondaryDisplayKey] }}\n                </div>\n              </div>\n            </div>\n          </ng-template>\n        </div>\n      </ng-container>\n    </div>\n    <div *ngIf=\"!loading && !error && data.length === 0 && searchInput.value\">\n      <div class=\"data-not-found\">No Data Available</div>\n  </div>\n  </div>\n</ng-template>\n", styles: [".dd-wrapper{background:#ffffff;border:1px solid #e0e0e0;box-sizing:border-box;border-radius:4px;display:block;cursor:pointer;outline:none}.dd-wrapper.opened,.dd-wrapper:hover{background:#f5f5f5}.dd-wrapper .selected-list{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:4px;padding:8px 16px}.dd-wrapper:focus-within{border-color:#0937b2;background:#f5f5f5}.dd-wrapper.disabled,.dd-wrapper.readonly{pointer-events:none}.search-input{position:relative;border-radius:8px}.search-input input{box-sizing:border-box;outline:none;padding-left:40px;padding-right:24px;background-color:transparent;color:#181f33;border-radius:inherit;border:1px solid transparent;width:100%}.search-input span{position:absolute;top:50%;transform:translateY(-50%);font-size:24px;line-height:24px;height:24px;left:8px;padding-top:2px}.search-input .croos-icon{position:absolute;top:50%;transform:translateY(-50%);font-size:16px;width:24px;line-height:16px;height:16px;right:0}.dd-list{padding:8px 0;max-height:200px;background:#ffffff;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:8px;min-width:100%;overflow-y:auto}.dd-list::-webkit-scrollbar{width:8px;border-radius:4px}.dd-list::-webkit-scrollbar-track{background:#ffffff;border-radius:4px}.dd-list::-webkit-scrollbar-thumb{background:#929dab;border-radius:4px}.dd-list::-webkit-scrollbar-thumb:hover{background:#929dab}.dd-list .item{padding:8px 16px;cursor:pointer}.dd-list .item .disabled{color:#6a737d!important;pointer-events:none}.dd-list .item .value{display:flex;justify-content:space-between;align-items:center}.dd-list .item .value .primary,.dd-list .item .value .secondary{font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.dd-list .item .reason{font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#6a737d}.dd-list .item:hover:not(.disabled){background:#f5f7fc}.dd-list .data-not-found{display:flex;justify-content:center;align-items:center;font-size:16px;padding:8px}.dd-list-pd{padding:unset}.chip{display:inline-flex;align-items:center;background:#e0e0e0;cursor:default}.chip span{color:#181f33}.chip-md{border-radius:16px;padding:4px 12px}.chip-sm{border-radius:6px;padding:4px 8px;text-transform:uppercase}.ip-md{padding-top:8px;padding-bottom:8px}.ip-sm{padding-top:3px;padding-bottom:3px}.status-container{display:flex;justify-content:center;align-items:center;height:128px}.status-container p{text-align:center}::ng-deep #spinner{position:relative!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.LoaderComponent, selector: "mis-loader", inputs: ["mobileView"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AsyncDropdownComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "mis-async-search-dropdown", template: "<div class=\"dd-wrapper\" [ngClass]=\"{ opened: opened, disabled: disabled, readonly: readonly }\" #ddBtn>\n  <div class=\"selected-list\" *ngIf=\"multi && selections.size > 0\">\n    <div class=\"chip\" [ngClass]=\"{'chip-md': size === 'md', 'chip-sm': size === 'sm'}\" *ngFor=\"let item of selectedItems\">\n      <span [ngClass]=\"{'h6': size === 'md', 'h8-b': size === 'sm'}\" style=\"margin-right: 4px;\">{{item[displayKey]}}</span>\n      <span style=\"cursor: pointer;\" (click)=\"removeItem(item)\" [ngStyle]=\"{'font-size': size === 'sm' ? '12px': '14px'}\" class=\"ic-navigation-cancel-24\"></span>\n    </div>\n  </div>\n  <div class=\"search-input\">\n    <span class=\"ic-action-search-24\"></span>\n    <input [ngClass]=\"{'ip-md': size === 'md', 'ip-sm': size === 'sm'}\" tabindex=\"0\" type=\"text\" class=\"black-text h6\" #input [placeholder]=\"placeholder\" [formControl]=\"searchInput\" />\n    <div class=\"ic-navigation-cancel-24 croos-icon\" *ngIf=\"searchInput?.value?.length\" (click)=\"removeInputValue()\"></div>\n  </div>\n</div>\n\n<ng-template #dd>\n  <div class=\"dd-list\" [ngStyle]=\"{'max-height':height}\"  [ngClass]=\"{'dd-list-pd':data.length === 0}\" >\n    <ng-container *ngIf=\"loading\">\n      <ng-container\n        *ngIf=\"customLoader; else defaultLoader\"\n        [ngTemplateOutlet]=\"customLoader\"\n      ></ng-container>\n      <ng-template #defaultLoader>\n        <div class=\"status-container\" *ngIf=\"loading && !customLoader\">\n          <mis-loader [mobileView]=\"true\"></mis-loader>\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-container *ngIf=\"error\">\n      <div class=\"status-container\">\n        <p>Unknown error has occurred, <br> Please try again later.</p>\n      </div>\n    </ng-container>\n    <div *ngIf=\"!loading && !error && data.length > 0\">\n      <ng-container *ngFor=\"let item of data\">\n        <div (click)=\"selectData(item, false)\">\n          <ng-container\n            *ngIf=\"customItem; else standardItem\"\n            [ngTemplateOutlet]=\"customItem\"\n            [ngTemplateOutletContext]=\"{ $implicit: item }\"\n          ></ng-container>\n          <ng-template #standardItem>\n            <div class=\"item\">\n              <div class=\"value\">\n                <div class=\"primary\">\n                  {{ item[displayKey] }}\n                </div>\n                <div class=\"secondary\">\n                  {{ item[secondaryDisplayKey] }}\n                </div>\n              </div>\n            </div>\n          </ng-template>\n        </div>\n      </ng-container>\n    </div>\n    <div *ngIf=\"!loading && !error && data.length === 0 && searchInput.value\">\n      <div class=\"data-not-found\">No Data Available</div>\n  </div>\n  </div>\n</ng-template>\n", styles: [".dd-wrapper{background:#ffffff;border:1px solid #e0e0e0;box-sizing:border-box;border-radius:4px;display:block;cursor:pointer;outline:none}.dd-wrapper.opened,.dd-wrapper:hover{background:#f5f5f5}.dd-wrapper .selected-list{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:4px;padding:8px 16px}.dd-wrapper:focus-within{border-color:#0937b2;background:#f5f5f5}.dd-wrapper.disabled,.dd-wrapper.readonly{pointer-events:none}.search-input{position:relative;border-radius:8px}.search-input input{box-sizing:border-box;outline:none;padding-left:40px;padding-right:24px;background-color:transparent;color:#181f33;border-radius:inherit;border:1px solid transparent;width:100%}.search-input span{position:absolute;top:50%;transform:translateY(-50%);font-size:24px;line-height:24px;height:24px;left:8px;padding-top:2px}.search-input .croos-icon{position:absolute;top:50%;transform:translateY(-50%);font-size:16px;width:24px;line-height:16px;height:16px;right:0}.dd-list{padding:8px 0;max-height:200px;background:#ffffff;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:8px;min-width:100%;overflow-y:auto}.dd-list::-webkit-scrollbar{width:8px;border-radius:4px}.dd-list::-webkit-scrollbar-track{background:#ffffff;border-radius:4px}.dd-list::-webkit-scrollbar-thumb{background:#929dab;border-radius:4px}.dd-list::-webkit-scrollbar-thumb:hover{background:#929dab}.dd-list .item{padding:8px 16px;cursor:pointer}.dd-list .item .disabled{color:#6a737d!important;pointer-events:none}.dd-list .item .value{display:flex;justify-content:space-between;align-items:center}.dd-list .item .value .primary,.dd-list .item .value .secondary{font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.dd-list .item .reason{font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#6a737d}.dd-list .item:hover:not(.disabled){background:#f5f7fc}.dd-list .data-not-found{display:flex;justify-content:center;align-items:center;font-size:16px;padding:8px}.dd-list-pd{padding:unset}.chip{display:inline-flex;align-items:center;background:#e0e0e0;cursor:default}.chip span{color:#181f33}.chip-md{border-radius:16px;padding:4px 12px}.chip-sm{border-radius:6px;padding:4px 8px;text-transform:uppercase}.ip-md{padding-top:8px;padding-bottom:8px}.ip-sm{padding-top:3px;padding-bottom:3px}.status-container{display:flex;justify-content:center;align-items:center;height:128px}.status-container p{text-align:center}::ng-deep #spinner{position:relative!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.NgZone }]; }, propDecorators: { height: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], httpStream: [{
+                type: Input
+            }], displayKey: [{
+                type: Input
+            }], secondaryDisplayKey: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], debounceTime: [{
+                type: Input
+            }], minInputLength: [{
+                type: Input
+            }], multi: [{
+                type: Input
+            }], uniqueKey: [{
+                type: Input
+            }], control: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], origin: [{
+                type: ViewChild,
+                args: ["ddBtn", { static: false }]
+            }], input: [{
+                type: ViewChild,
+                args: ["input", { static: false }]
+            }], dd: [{
+                type: ViewChild,
+                args: ["dd", { static: false }]
+            }], customItem: [{
+                type: ContentChild,
+                args: ["misCustomItem", { static: false }]
+            }], customLoader: [{
+                type: ContentChild,
+                args: ["asyncCustomLoader", { static: false }]
+            }], onSelect: [{
+                type: Output
+            }], searchValue: [{
+                type: Input
+            }], searchQueryChange: [{
+                type: Output
+            }], clear: [{
+                type: Output
+            }], itemSelected: [{
+                type: Output
+            }], itemRemoved: [{
+                type: Output
+            }] } });
+class AsyncDropdownModule {
+}
+AsyncDropdownModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AsyncDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AsyncDropdownModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: AsyncDropdownModule, declarations: [AsyncDropdownComponent], imports: [CommonModule, OverlayModule, ReactiveFormsModule, FormsModule, LoaderModule], exports: [AsyncDropdownComponent] });
+AsyncDropdownModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AsyncDropdownModule, imports: [CommonModule, OverlayModule, ReactiveFormsModule, FormsModule, LoaderModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AsyncDropdownModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AsyncDropdownComponent],
+                    imports: [CommonModule, OverlayModule, ReactiveFormsModule, FormsModule, LoaderModule],
+                    exports: [AsyncDropdownComponent]
+                }]
+        }] });
+/**
+ * Generated bundle index. Do not edit.
+ */
+export { AsyncDropdownComponent, AsyncDropdownModule };
+//# sourceMappingURL=mis-crystal-design-system-async-search-dropdown.mjs.map

package/fesm2015/mis-crystal-design-system-async-search-dropdown.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"mis-crystal-design-system-async-search-dropdown.mjs","sources":["../../../projects/mis-components/async-search-dropdown/async-dropdown.component.ts","../../../projects/mis-components/async-search-dropdown/async-dropdown.component.html","../../../projects/mis-components/async-search-dropdown/async-dropdown.module.ts","../../../projects/mis-components/async-search-dropdown/mis-crystal-design-system-async-search-dropdown.ts"],"sourcesContent":["import { ConnectionPositionPair, Overlay, OverlayConfig, OverlayRef } from \"@angular/cdk/overlay\";\nimport { TemplatePortal } from \"@angular/cdk/portal\";\nimport {\n AfterViewInit,\n Component,\n ContentChild,\n ElementRef,\n EventEmitter,\n HostListener,\n Input,\n NgZone,\n OnChanges,\n OnDestroy,\n OnInit,\n Output,\n SimpleChanges,\n TemplateRef,\n ViewChild,\n ViewContainerRef\n} from \"@angular/core\";\nimport { AbstractControl, UntypedFormControl } from \"@angular/forms\";\nimport { Observable, Subscription } from \"rxjs\";\nimport { debounceTime, distinctUntilChanged, filter, tap } from \"rxjs/operators\";\n\n// tslint:disable-next-line\ntype IListData = any;\n\n@Component({\n selector: \"mis-async-search-dropdown\",\n templateUrl: \"./async-dropdown.component.html\",\n styleUrls: [\"./async-dropdown.component.scss\"]\n})\nexport class AsyncDropdownComponent implements OnInit, OnChanges, OnDestroy {\n constructor(private overlay: Overlay, private viewContainerRef: ViewContainerRef, private _ngZone: NgZone) { }\n @Input() height;\n @Input() size: 'md' | 'sm' = 'md'\n @Input() httpStream!: (searchKey: string) => Observable<IListData>; // function that returns an httpobservable\n @Input() displayKey!: string; // string to show value in list\n @Input() secondaryDisplayKey!: string; // string to display secondary value\n @Input() placeholder = \"Select\"; // placeholder for input\n @Input() debounceTime = 400; // wait time till which API call is paused\n @Input() minInputLength = 2; // min length after which API call is made\n @Input() multi = false; // maintain a list or emit value\n @Input() uniqueKey: string; // for identifying unique values\n @Input() control: AbstractControl | null; // form control for reactive forms\n @Input() disabled: boolean; // disable actions on component\n @Input() readonly: boolean; // make component readonly\n @ViewChild(\"ddBtn\", { static: false }) origin: ElementRef;\n @ViewChild(\"input\", { static: false }) input: ElementRef;\n @ViewChild(\"dd\", { static: false }) dd: TemplateRef<Element>;\n @ContentChild(\"misCustomItem\", { static: false })\n customItem: TemplateRef<Element>;\n @ContentChild(\"asyncCustomLoader\", { static: false})\n customLoader: TemplateRef<Element>;\n // tslint:disable-next-line\n @Output() onSelect: EventEmitter<IListData | IListData[]> = new EventEmitter(true); // emit selected values\n searchInput: UntypedFormControl = new UntypedFormControl();\n data: IListData[] = [];\n opened = false;\n loading: boolean = false;\n error: boolean = false;\n // tslint:disable-next-line\n selections: Map<string, any> = new Map();\n private searchSubscription: Subscription;\n private overlayRef: OverlayRef;\n controlSubscription: Subscription | undefined;\n @Input() searchValue;\n @Output() searchQueryChange = new EventEmitter<string>()\n @Output() clear: EventEmitter<boolean> = new EventEmitter(false);\n @Output() itemSelected = new EventEmitter<IListData>()\n @Output() itemRemoved = new EventEmitter<IListData>()\n ngOnInit(): void {\n if (this.multi && !this.uniqueKey) {\n throw new Error(\"[uniqueKey] required in multi mode.\");\n }\n if (this.disabled) {\n this.searchInput.disable();\n }\n this.searchSubscription = this.searchInput.valueChanges\n .pipe(\n // filter(val => val && val.length >= this.minInputLength),\n tap((val) => this.searchQueryChange.emit(val)),\n debounceTime(this.debounceTime),\n distinctUntilChanged()\n )\n .subscribe(res => {\n this._ngZone.run(() => {\n if (res?.length < this.minInputLength || !res?.length) {\n this.closeDropdown();\n return;\n } else if (res?.length > this.minInputLength && this.httpStream) {\n this.loading = true;\n this.error = false;\n if(!this.overlayRef?.hasAttached())\n this.openDropdown(this.dd, this.origin.nativeElement);\n this.httpStream(res).subscribe(list => {\n this.loading = false;\n this.data = list;\n if (!this.overlayRef?.hasAttached() && list.length > 0) {\n this.openDropdown(this.dd, this.origin.nativeElement);\n }\n }, error => {\n this.loading = false;\n this.error = true;\n });\n }\n })\n });\n if (this.control?.value) {\n this.handleControlChanges(this.control.value);\n }\n this.controlSubscription = this.control?.valueChanges.subscribe(this.handleControlChanges);\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes && changes?.searchValue?.currentValue) {\n this.searchInput.patchValue(changes.searchValue.currentValue);\n }\n if (changes && changes.disabled) {\n this.searchInput.enable();\n if (this.disabled) {\n this.searchInput.disable();\n }\n }\n }\n\n ngOnDestroy(): void {\n this.searchSubscription?.unsubscribe();\n }\n\n private handleControlChanges = (values: IListData[]) => {\n values.forEach(el => {\n this.selectData(el, true);\n });\n // tslint:disable-next-line\n };\n\n private openDropdown(template: TemplateRef<Element>, origin: HTMLElement): void {\n const positionStrategy = this.overlay\n .position()\n .flexibleConnectedTo(origin)\n .withPositions([\n new ConnectionPositionPair({ originX: \"start\", originY: \"bottom\" }, { overlayX: \"start\", overlayY: \"top\" }),\n new ConnectionPositionPair({ originX: \"start\", originY: \"top\" }, { overlayX: \"start\", overlayY: \"bottom\" })\n ])\n .withPush(true);\n\n const configs = new OverlayConfig({\n hasBackdrop: true,\n backdropClass: \"cdk-overlay-transparent-backdrop\",\n scrollStrategy: this.overlay.scrollStrategies.reposition(),\n positionStrategy,\n width: origin.clientWidth\n });\n this.overlayRef = this.overlay.create(configs);\n this.overlayRef.attach(new TemplatePortal(template, this.viewContainerRef));\n this.overlayRef.backdropClick().subscribe(res => {\n this.closeDropdown();\n });\n }\n\n /**\n * closes the dropdown\n */\n closeDropdown(): void {\n this.opened = false;\n this.overlayRef?.detach();\n this.data = [];\n }\n\n /**\n *\n * @param item item to select\n * if item property disabled is set to true, selection will be disabled\n * @param effectedFromOutside set to true if calling from parent component, if true will focus on search input\n */\n selectData(item: IListData, effectedFromOutside = true): void {\n if (item.disabled) {\n return;\n }\n this.itemSelected.emit(item)\n if (!this.multi) {\n this.searchInput.patchValue(item[this.displayKey], { emitEvent: false });\n this.setControlValue(item);\n } else {\n if (!this.selections.has(item[this.uniqueKey])) {\n this.selections.set(item[this.uniqueKey], item);\n }\n this.setControlValue(this.selectedItems);\n if (!effectedFromOutside) {\n setTimeout(() => {\n this.input.nativeElement.focus();\n this.input.nativeElement.scrollIntoView();\n }, 10);\n }\n this.searchInput.patchValue(\"\");\n this.data = [];\n }\n this.closeDropdown();\n }\n\n /**\n *\n * @param item remove item from selected list\n */\n removeItem(item: IListData): void {\n this.itemRemoved.emit(item)\n this.selections.delete(item[this.uniqueKey]);\n this.setControlValue(this.selectedItems);\n // tslint:disable-next-line\n this.input[\"nativeElement\"].focus();\n }\n\n private setControlValue(value: IListData): void {\n this.onSelect.emit(value);\n this.control?.patchValue(value, { emitEvent: false });\n }\n\n /**\n * @returns list of selected items\n */\n get selectedItems(): Array<IListData> {\n return Array.from(this.selections.values());\n }\n\n removeInputValue() {\n this.searchInput.reset();\n this.data = [];\n this.clear.emit(true);\n }\n}\n","<div class=\"dd-wrapper\" [ngClass]=\"{ opened: opened, disabled: disabled, readonly: readonly }\" #ddBtn>\n <div class=\"selected-list\" *ngIf=\"multi && selections.size > 0\">\n <div class=\"chip\" [ngClass]=\"{'chip-md': size === 'md', 'chip-sm': size === 'sm'}\" *ngFor=\"let item of selectedItems\">\n <span [ngClass]=\"{'h6': size === 'md', 'h8-b': size === 'sm'}\" style=\"margin-right: 4px;\">{{item[displayKey]}}</span>\n <span style=\"cursor: pointer;\" (click)=\"removeItem(item)\" [ngStyle]=\"{'font-size': size === 'sm' ? '12px': '14px'}\" class=\"ic-navigation-cancel-24\"></span>\n </div>\n </div>\n <div class=\"search-input\">\n <span class=\"ic-action-search-24\"></span>\n <input [ngClass]=\"{'ip-md': size === 'md', 'ip-sm': size === 'sm'}\" tabindex=\"0\" type=\"text\" class=\"black-text h6\" #input [placeholder]=\"placeholder\" [formControl]=\"searchInput\" />\n <div class=\"ic-navigation-cancel-24 croos-icon\" *ngIf=\"searchInput?.value?.length\" (click)=\"removeInputValue()\"></div>\n </div>\n</div>\n\n<ng-template #dd>\n <div class=\"dd-list\" [ngStyle]=\"{'max-height':height}\" [ngClass]=\"{'dd-list-pd':data.length === 0}\" >\n <ng-container *ngIf=\"loading\">\n <ng-container\n *ngIf=\"customLoader; else defaultLoader\"\n [ngTemplateOutlet]=\"customLoader\"\n ></ng-container>\n <ng-template #defaultLoader>\n <div class=\"status-container\" *ngIf=\"loading && !customLoader\">\n <mis-loader [mobileView]=\"true\"></mis-loader>\n </div>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"error\">\n <div class=\"status-container\">\n <p>Unknown error has occurred, <br> Please try again later.</p>\n </div>\n </ng-container>\n <div *ngIf=\"!loading && !error && data.length > 0\">\n <ng-container *ngFor=\"let item of data\">\n <div (click)=\"selectData(item, false)\">\n <ng-container\n *ngIf=\"customItem; else standardItem\"\n [ngTemplateOutlet]=\"customItem\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-container>\n <ng-template #standardItem>\n <div class=\"item\">\n <div class=\"value\">\n <div class=\"primary\">\n {{ item[displayKey] }}\n </div>\n <div class=\"secondary\">\n {{ item[secondaryDisplayKey] }}\n </div>\n </div>\n </div>\n </ng-template>\n </div>\n </ng-container>\n </div>\n <div *ngIf=\"!loading && !error && data.length === 0 && searchInput.value\">\n <div class=\"data-not-found\">No Data Available</div>\n </div>\n </div>\n</ng-template>\n","import { OverlayModule } from \"@angular/cdk/overlay\";\nimport { CommonModule } from \"@angular/common\";\nimport { NgModule } from \"@angular/core\";\nimport { FormsModule, ReactiveFormsModule } from \"@angular/forms\";\nimport { LoaderModule } from \"mis-crystal-design-system/loader\";\nimport { AsyncDropdownComponent } from \"./async-dropdown.component\";\n\n@NgModule({\n declarations: [AsyncDropdownComponent],\n imports: [CommonModule, OverlayModule, ReactiveFormsModule, FormsModule, LoaderModule],\n exports: [AsyncDropdownComponent]\n})\nexport class AsyncDropdownModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/mis-crystal-design-system-button.mjs ADDED Viewed

@@ -0,0 +1,134 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, Input, Output, Directive, HostBinding, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+class ButtonComponent {
+    constructor() {
+        this.name = "Enabled";
+        this.type = "Solid";
+        this.size = "Medium";
+        this.width = "";
+        this.showIcon = false;
+        this.iconUrl = "";
+        this.iconPosition = "Left";
+        this.disabled = false;
+        this.disableLeftBorderRadius = false;
+        this.disableRightBorderRadius = false;
+        /** Emits event when button is clicked */
+        this.click = new EventEmitter();
+    }
+    ngOnInit() { }
+    onClick(event) {
+        this.click.emit(event);
+    }
+}
+ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ButtonComponent, selector: "mis-button", inputs: { name: "name", type: "type", size: "size", width: "width", showIcon: "showIcon", iconUrl: "iconUrl", iconPosition: "iconPosition", disabled: "disabled", disableLeftBorderRadius: "disableLeftBorderRadius", disableRightBorderRadius: "disableRightBorderRadius" }, outputs: { click: "click" }, ngImport: i0, template: "<button\n  (click)=\"onClick($event)\"\n  [disabled]=\"disabled\"\n  [ngClass]=\"{\n    solid: type === 'Solid',\n    outline: type === 'Outline',\n    text: type === 'Text',\n    large: size === 'Large',\n    medium: size === 'Medium',\n    small: size === 'Small',\n    'large-mobile': size === 'Large-M',\n    'small-mobile': size === 'Small-M'\n  }\"\n  [ngStyle]=\"{\n    'border-top-left-radius': disableLeftBorderRadius ? '0px' : '',\n    'border-bottom-left-radius': disableLeftBorderRadius ? '0px' : '',\n    'border-top-right-radius': disableRightBorderRadius ? '0px' : '',\n    'border-bottom-right-radius': disableRightBorderRadius ? '0px' : '',\n    width: width\n  }\"\n>\n  <span id=\"left-icon\" *ngIf=\"showIcon && iconPosition === 'Left'\">\n    <img [src]=\"iconUrl\" alt=\"\" />\n  </span>\n  {{ name }}\n  <span id=\"right-icon\" *ngIf=\"showIcon && iconPosition === 'Right'\">\n    <img [src]=\"iconUrl\" alt=\"\" />\n  </span>\n</button>\n", styles: ["button{font-family:Lato,sans-serif!important;border:none;padding:0;margin:0;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#181f33;background-color:#fff}.solid{color:#fff;background:#0937b2}.solid:hover:enabled{background:#062a99}.solid:active:enabled{background:#041f80}.solid:disabled{color:#929dab;background:#f5f5f5}.outline{border:1px solid #0937b2;color:#0937b2;background:#ffffff}.outline:hover:enabled{background:#f0f3fa}.outline:active:enabled{background:#dae1f3}.outline:disabled{color:#929dab;border:1px solid #929dab}.text{color:#181f33;background:#ffffff}.text:hover:enabled{background:#f0f3fa}.text:active:enabled{background:#dae1f3}.text:disabled{color:#929dab}.large{height:56px;padding:16px;border-radius:10px;font-style:normal;font-weight:700;font-size:16px;line-height:24px;letter-spacing:.5px}.medium{height:44px;padding:10px 16px;border-radius:8px;font-style:normal;font-weight:400;font-size:16px;line-height:24px;letter-spacing:.2px}.small{height:32px;padding:6px 16px;border-radius:6px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.25px}.large-mobile{height:44px;padding:12px;border-radius:8px;font-style:normal;font-weight:700;font-size:14px;line-height:20px;letter-spacing:.1px}.small-mobile{height:32px;padding:6px 12px;border-radius:8px;font-style:normal;font-weight:700;font-size:14px;line-height:20px;letter-spacing:.1px}span{display:flex;justify-content:center;align-items:center}#left-icon{margin-right:8px}#right-icon{margin-left:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "mis-button", template: "<button\n  (click)=\"onClick($event)\"\n  [disabled]=\"disabled\"\n  [ngClass]=\"{\n    solid: type === 'Solid',\n    outline: type === 'Outline',\n    text: type === 'Text',\n    large: size === 'Large',\n    medium: size === 'Medium',\n    small: size === 'Small',\n    'large-mobile': size === 'Large-M',\n    'small-mobile': size === 'Small-M'\n  }\"\n  [ngStyle]=\"{\n    'border-top-left-radius': disableLeftBorderRadius ? '0px' : '',\n    'border-bottom-left-radius': disableLeftBorderRadius ? '0px' : '',\n    'border-top-right-radius': disableRightBorderRadius ? '0px' : '',\n    'border-bottom-right-radius': disableRightBorderRadius ? '0px' : '',\n    width: width\n  }\"\n>\n  <span id=\"left-icon\" *ngIf=\"showIcon && iconPosition === 'Left'\">\n    <img [src]=\"iconUrl\" alt=\"\" />\n  </span>\n  {{ name }}\n  <span id=\"right-icon\" *ngIf=\"showIcon && iconPosition === 'Right'\">\n    <img [src]=\"iconUrl\" alt=\"\" />\n  </span>\n</button>\n", styles: ["button{font-family:Lato,sans-serif!important;border:none;padding:0;margin:0;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#181f33;background-color:#fff}.solid{color:#fff;background:#0937b2}.solid:hover:enabled{background:#062a99}.solid:active:enabled{background:#041f80}.solid:disabled{color:#929dab;background:#f5f5f5}.outline{border:1px solid #0937b2;color:#0937b2;background:#ffffff}.outline:hover:enabled{background:#f0f3fa}.outline:active:enabled{background:#dae1f3}.outline:disabled{color:#929dab;border:1px solid #929dab}.text{color:#181f33;background:#ffffff}.text:hover:enabled{background:#f0f3fa}.text:active:enabled{background:#dae1f3}.text:disabled{color:#929dab}.large{height:56px;padding:16px;border-radius:10px;font-style:normal;font-weight:700;font-size:16px;line-height:24px;letter-spacing:.5px}.medium{height:44px;padding:10px 16px;border-radius:8px;font-style:normal;font-weight:400;font-size:16px;line-height:24px;letter-spacing:.2px}.small{height:32px;padding:6px 16px;border-radius:6px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.25px}.large-mobile{height:44px;padding:12px;border-radius:8px;font-style:normal;font-weight:700;font-size:14px;line-height:20px;letter-spacing:.1px}.small-mobile{height:32px;padding:6px 12px;border-radius:8px;font-style:normal;font-weight:700;font-size:14px;line-height:20px;letter-spacing:.1px}span{display:flex;justify-content:center;align-items:center}#left-icon{margin-right:8px}#right-icon{margin-left:8px}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { name: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], showIcon: [{
+                type: Input
+            }], iconUrl: [{
+                type: Input
+            }], iconPosition: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], disableLeftBorderRadius: [{
+                type: Input
+            }], disableRightBorderRadius: [{
+                type: Input
+            }], click: [{
+                type: Output
+            }] } });
+class ButtonDirective {
+    constructor(el, renderer) {
+        this.el = el;
+        this.renderer = renderer;
+        this.type = "none";
+        this.size = "md";
+        this.elementClass = "mis-btn";
+    }
+    ngAfterViewInit() {
+        this.bindTypeClass();
+        this.bindSizeClass();
+    }
+    bindTypeClass() {
+        let className = "";
+        switch (this.type) {
+            case "primary":
+                className = "mis-primary";
+                break;
+            case "outline":
+                className = "mis-outline";
+                break;
+            default:
+                className = "mis-none";
+        }
+        this.renderer.addClass(this.el.nativeElement, className);
+    }
+    bindSizeClass() {
+        let className = "";
+        switch (this.size) {
+            case "lg":
+                className = "mis-btn-lg";
+                break;
+            case "sm":
+                className = "mis-btn-sm";
+                break;
+            default:
+                className = "mis-btn-md";
+        }
+        this.renderer.addClass(this.el.nativeElement, className);
+    }
+}
+ButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ButtonDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+ButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.12", type: ButtonDirective, selector: "[mis-button]", inputs: { type: "type", size: "size" }, host: { properties: { "class": "this.elementClass" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ButtonDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[mis-button]"
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { type: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], elementClass: [{
+                type: HostBinding,
+                args: ["class"]
+            }] } });
+class ButtonModule {
+    static forRoot() {
+        return { ngModule: ButtonModule, providers: [] };
+    }
+}
+ButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: ButtonModule, declarations: [ButtonComponent, ButtonDirective], imports: [CommonModule], exports: [ButtonComponent, ButtonDirective] });
+ButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ButtonModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ButtonModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [ButtonComponent, ButtonDirective],
+                    imports: [CommonModule],
+                    exports: [ButtonComponent, ButtonDirective]
+                }]
+        }] });
+/**
+ * Generated bundle index. Do not edit.
+ */
+export { ButtonComponent, ButtonDirective, ButtonModule };
+//# sourceMappingURL=mis-crystal-design-system-button.mjs.map