mis-crystal-design-system 2.0.1 → 2.2.0

package/fesm2015/mis-crystal-design-system-modal.js

@@ -0,0 +1,151 @@
+import { OverlayConfig, Overlay, OverlayModule } from '@angular/cdk/overlay';
+import { ComponentPortal, PortalInjector, PortalModule } from '@angular/cdk/portal';
+import { InjectionToken, Component, ViewChild, ViewContainerRef, ɵɵdefineInjectable, ɵɵinject, INJECTOR, Injectable, Injector, NgModule } from '@angular/core';
+import { Subject } from 'rxjs';
+import { trigger, transition, style, animate } from '@angular/animations';
+import { CommonModule } from '@angular/common';
+
+/** @format */
+const MODAL_DATA_VAR = new InjectionToken("MISModalDataInjectionToken");
+
+/** @format */
+class ModalRef {
+    constructor(overlay) {
+        this.overlay = overlay;
+        this.afterClosed$ = new Subject();
+        this.afterClosed = this.afterClosed$.asObservable();
+    }
+    close(data) {
+        this.overlay.detach();
+        this.overlay.dispose();
+        this.afterClosed$.next(data);
+        this.afterClosed$.complete();
+    }
+}
+
+class ModuleWrapperComponent {
+    constructor() { }
+    bindComponent(type, injector) {
+        this.initComponent(type, injector);
+    }
+    initComponent(type, injector) {
+        this.modalPortal = new ComponentPortal(type, this.place, injector);
+    }
+}
+ModuleWrapperComponent.decorators = [
+    { type: Component, args: [{
+                selector: "mis-module-wrapper",
+                template: "<div class=\"mis-modal-body\" #place @slideInOut>\n  <ng-template [cdkPortalOutlet]=\"modalPortal\"></ng-template>\n</div>\n",
+                animations: [
+                    trigger("slideInOut", [
+                        transition(":enter", [
+                            style({ transform: "translateY(-30%)", opacity: 0 }),
+                            animate("200ms ease-out", style({ transform: "translatey(0%)", opacity: 1 })),
+                        ]),
+                        transition(":leave", [animate("200ms ease-out", style({ transform: "translatey(-30%)", opacity: 0 }))]),
+                    ]),
+                ],
+                styles: [".mis-modal-body{display:block;width:100%;height:100%;background-color:transparent;border-radius:12px;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);overflow:hidden}"]
+            },] }
+];
+ModuleWrapperComponent.ctorParameters = () => [];
+ModuleWrapperComponent.propDecorators = {
+    place: [{ type: ViewChild, args: ["place", { static: false, read: ViewContainerRef },] }]
+};
+
+class ModalService {
+    constructor(overlay, injector) {
+        this.overlay = overlay;
+        this.injector = injector;
+    }
+    show(component, data, options) {
+        const positionStrategy = this.calculatePosition(options);
+        const { width, height } = options || {};
+        const config = new OverlayConfig({
+            hasBackdrop: true,
+            positionStrategy,
+            scrollStrategy: this.overlay.scrollStrategies.noop(),
+            width: width,
+            height,
+            panelClass: "mis-modal",
+            backdropClass: "mis-modal-overlay",
+        });
+        const overlayRef = this.overlay.create(config);
+        const modalRef = new ModalRef(overlayRef);
+        const injector = this.createInjector(modalRef, this.injector, data);
+        const portal = new ComponentPortal(ModuleWrapperComponent, null);
+        this.componentInstance = overlayRef.attach(portal);
+        if (options === null || options === void 0 ? void 0 : options.closeOnBackdropClick) {
+            overlayRef.backdropClick().subscribe(() => modalRef.close());
+        }
+        this.componentInstance.instance.bindComponent(component, injector);
+        return modalRef;
+    }
+    createInjector(ref, inj, data) {
+        const injectorTokens = new WeakMap();
+        injectorTokens.set(ModalRef, ref);
+        injectorTokens.set(MODAL_DATA_VAR, data);
+        return new PortalInjector(inj, injectorTokens);
+    }
+    calculatePosition(options) {
+        const position = this.overlay.position().global().centerHorizontally().centerVertically();
+        if (options && screen.width > 600) {
+            if (options.top) {
+                position.top(options.top);
+            }
+            if (options.left) {
+                position.left(options.left);
+            }
+            if (options.right) {
+                position.right(options.right);
+            }
+            if (options.bottom) {
+                position.bottom(options.bottom);
+            }
+        }
+        return position;
+    }
+}
+ModalService.ɵprov = ɵɵdefineInjectable({ factory: function ModalService_Factory() { return new ModalService(ɵɵinject(Overlay), ɵɵinject(INJECTOR)); }, token: ModalService, providedIn: "root" });
+ModalService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: "root",
+            },] }
+];
+ModalService.ctorParameters = () => [
+    { type: Overlay },
+    { type: Injector }
+];
+
+class ModalModule {
+    static forRoot() {
+        return {
+            ngModule: ModalModule,
+            providers: [ModalService],
+        };
+    }
+    static forChild() {
+        return {
+            ngModule: ModalModule,
+            providers: [ModalService],
+        };
+    }
+}
+ModalModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [ModuleWrapperComponent],
+                imports: [
+                    CommonModule,
+                    OverlayModule,
+                    PortalModule
+                ],
+                entryComponents: [ModuleWrapperComponent]
+            },] }
+];
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MODAL_DATA_VAR, ModalModule, ModalRef, ModalService, ModuleWrapperComponent as ɵa };
+//# sourceMappingURL=mis-crystal-design-system-modal.js.map

package/fesm2015/mis-crystal-design-system-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mis-crystal-design-system-modal.js","sources":["../../../projects/mis-components/modal/modal-constants.ts","../../../projects/mis-components/modal/modal-ref.ts","../../../projects/mis-components/modal/module-wrapper/module-wrapper.component.ts","../../../projects/mis-components/modal/modal.service.ts","../../../projects/mis-components/modal/modal.module.ts","../../../projects/mis-components/modal/mis-crystal-design-system-modal.ts"],"sourcesContent":["/** @format */\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const MODAL_DATA_VAR = new InjectionToken<any>(\"MISModalDataInjectionToken\");\n","/** @format */\n\nimport { OverlayRef } from \"@angular/cdk/overlay\";\nimport { Injectable } from \"@angular/core\";\nimport { Subject } from \"rxjs\";\n\nexport class ModalRef {\n  private afterClosed$ = new Subject<unknown>();\n  afterClosed = this.afterClosed$.asObservable();\n\n  constructor(public overlay: OverlayRef) {}\n\n  close(data?: unknown): void {\n    this.overlay.detach();\n    this.overlay.dispose();\n    this.afterClosed$.next(data);\n    this.afterClosed$.complete();\n  }\n}\n","import { trigger, transition, style, animate } from \"@angular/animations\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { Component, Injector, OnInit, ViewChild, ViewContainerRef } from \"@angular/core\";\nimport { ModalRef } from \"../modal-ref\";\n\n@Component({\n  selector: \"mis-module-wrapper\",\n  templateUrl: \"./module-wrapper.component.html\",\n  styleUrls: [\"./module-wrapper.component.scss\"],\n  animations: [\n    trigger(\"slideInOut\", [\n      transition(\":enter\", [\n        style({ transform: \"translateY(-30%)\", opacity: 0 }),\n        animate(\"200ms ease-out\", style({ transform: \"translatey(0%)\", opacity: 1 })),\n      ]),\n      transition(\":leave\", [animate(\"200ms ease-out\", style({ transform: \"translatey(-30%)\", opacity: 0 }))]),\n    ]),\n  ],\n})\nexport class ModuleWrapperComponent {\n  modalPortal: ComponentPortal<any>;\n  constructor() {}\n\n  @ViewChild(\"place\", { static: false, read: ViewContainerRef }) place: ViewContainerRef;\n\n  bindComponent(type: any, injector: PortalInjector) {\n    this.initComponent(type, injector);\n  }\n\n  private initComponent(type: any, injector: PortalInjector) {\n    this.modalPortal = new ComponentPortal(type, this.place, injector);\n  }\n}\n","import { ComponentType, Overlay, OverlayConfig } from \"@angular/cdk/overlay\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable, Injector } from \"@angular/core\";\nimport { MODAL_DATA_VAR } from \"./modal-constants\";\nimport { ModalRef } from \"./modal-ref\";\nimport { ModuleWrapperComponent } from \"./module-wrapper/module-wrapper.component\";\n\ninterface IModalOptions {\n  width?: string;\n  height?: string;\n  top?: string;\n  right?: string;\n  bottom?: string;\n  left?: string;\n  closeOnBackdropClick?: boolean;\n}\n@Injectable({\n  providedIn: \"root\",\n})\nexport class ModalService {\n  private componentInstance: ComponentRef<ModuleWrapperComponent>;\n\n  constructor(private overlay: Overlay, private injector: Injector) {}\n\n  show<T, D>(component: ComponentType<T>, data?: D, options?: IModalOptions): ModalRef {\n    const positionStrategy = this.calculatePosition(options);\n    const { width, height } = options || {};\n    const config = new OverlayConfig({\n      hasBackdrop: true,\n      positionStrategy,\n      scrollStrategy: this.overlay.scrollStrategies.noop(),\n      width: width,\n      height,\n      panelClass: \"mis-modal\",\n      backdropClass: \"mis-modal-overlay\",\n    });\n    const overlayRef = this.overlay.create(config);\n    const modalRef = new ModalRef(overlayRef);\n    const injector = this.createInjector(modalRef, this.injector, data);\n    const portal = new ComponentPortal(ModuleWrapperComponent, null);\n    this.componentInstance = overlayRef.attach(portal);\n    if (options?.closeOnBackdropClick) {\n      overlayRef.backdropClick().subscribe(() => modalRef.close());\n    }\n    this.componentInstance.instance.bindComponent(component, injector);\n    return modalRef;\n  }\n  private createInjector<D>(ref: ModalRef, inj: Injector, data?: D): PortalInjector {\n    const injectorTokens = new WeakMap();\n    injectorTokens.set(ModalRef, ref);\n    injectorTokens.set(MODAL_DATA_VAR, data);\n    return new PortalInjector(inj, injectorTokens);\n  }\n\n  private calculatePosition(options: IModalOptions) {\n    const position = this.overlay.position().global().centerHorizontally().centerVertically();\n    if (options && screen.width > 600) {\n      if (options.top) {\n        position.top(options.top);\n      }\n      if (options.left) {\n        position.left(options.left);\n      }\n      if (options.right) {\n        position.right(options.right);\n      }\n      if (options.bottom) {\n        position.bottom(options.bottom);\n      }\n    }\n    return position;\n  }\n}\n","import { ModuleWithProviders, NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { ModuleWrapperComponent } from './module-wrapper/module-wrapper.component';\nimport { ModalService } from './modal.service';\n\n\n\n@NgModule({\n  declarations: [ModuleWrapperComponent],\n  imports: [\n    CommonModule,\n    OverlayModule, \n    PortalModule\n  ],\n  entryComponents: [ModuleWrapperComponent]\n})\nexport class ModalModule { \n  static forRoot(): ModuleWithProviders<ModalModule> {\n    return {\n      ngModule: ModalModule,\n      providers: [ModalService],\n    };\n  }\n\n  static forChild(): ModuleWithProviders<ModalModule> {\n    return {\n      ngModule: ModalModule,\n      providers: [ModalService],\n    };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n\nexport {ModuleWrapperComponent as ɵa} from './module-wrapper/module-wrapper.component';"],"names":[],"mappings":"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"}

package/fesm2015/mis-crystal-design-system-multi-select-dropdown.js

@@ -0,0 +1,192 @@
+import { __rest } from 'tslib';
+import { EventEmitter, Component, ElementRef, Input, Output, HostListener, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { CheckboxModule } from 'mis-crystal-design-system/checkbox';
+import { ButtonModule } from 'mis-crystal-design-system/button';
+
+class MultiSelectDropdownComponent {
+    constructor(eRef) {
+        this.eRef = eRef;
+        this.searchInput = '';
+        this.isOpen = false;
+        this.localSelectedItems = [];
+        this.localData = [];
+        this.searchData = [];
+        this.label = 'Select';
+        this.height = '';
+        this.width = '';
+        this.dropdownListHeight = '';
+        this.dropdownListWidth = '';
+        this.dropdownListPosition = 'Left';
+        this.searchEnabled = true;
+        this.showSelectedCount = false;
+        this.noDataMessage = 'No Data';
+        this.onChange = new EventEmitter();
+        this.isSearchInputFocused = false;
+    }
+    set data(values) {
+        this.localData = values.map(item => {
+            return Object.assign(Object.assign({}, item), { checked: false });
+        });
+    }
+    set selectedItems(values) {
+        this.handlerSetLocalSelectedItems(values);
+    }
+    clickout(event) {
+        const isClickedOutside = !this.eRef.nativeElement.contains(event.target);
+        if (isClickedOutside) {
+            this.onCancel();
+        }
+    }
+    ngOnInit() { }
+    handlerSetLocalSelectedItems(values) {
+        this.localSelectedItems = values;
+        this.localData = this.localData.map(item => {
+            if (values.some(base => base.value === item.value)) {
+                return Object.assign(Object.assign({}, item), { checked: true });
+            }
+            else {
+                return Object.assign(Object.assign({}, item), { checked: false });
+            }
+        });
+    }
+    searchInputFocused(isFocused) {
+        this.isSearchInputFocused = isFocused;
+    }
+    searchInputCanceled(event) {
+        event.stopPropagation();
+        this.searchInput = '';
+        this.isSearchInputFocused = false;
+    }
+    toggleDropdown() {
+        this.isOpen = !this.isOpen;
+        if (this.isOpen) {
+            this.handlerSetLocalSelectedItems(this.localSelectedItems);
+            this.localData = this.formatValues(this.localData);
+        }
+    }
+    filterByValue(array, string) {
+        return array.filter(o => o.label.toLowerCase().includes(string.toLowerCase()));
+    }
+    searchInputOnChange(newValue) {
+        this.searchInput = newValue;
+        if (newValue) {
+            this.searchData = this.filterByValue(this.localData, newValue);
+        }
+        else {
+            this.searchData = [];
+            this.searchInput = '';
+        }
+    }
+    formatValues(array) {
+        const checkedValues = array
+            .filter(a => a.checked)
+            .sort((a, b) => a.label > b.label ? 1 : b.label > a.label ? -1 : 0);
+        const unCheckedValues = array
+            .filter(a => !a.checked)
+            .sort((a, b) => a.label > b.label ? 1 : b.label > a.label ? -1 : 0);
+        return [...checkedValues, ...unCheckedValues];
+    }
+    toggleSelectedItems(event, item) {
+        event.stopPropagation();
+        if (item.checked) {
+            this.localData = [
+                ...this.localData.map(a => {
+                    if (a.value === item.value) {
+                        return Object.assign(Object.assign({}, a), { checked: false });
+                    }
+                    return a;
+                })
+            ];
+        }
+        else {
+            this.localData = [
+                ...this.localData.map(a => {
+                    if (a.value === item.value) {
+                        return Object.assign(Object.assign({}, a), { checked: true });
+                    }
+                    return a;
+                })
+            ];
+        }
+        if (this.searchEnabled) {
+            this.searchInputOnChange(this.searchInput);
+        }
+    }
+    applyFilters() {
+        this.onChange.emit(this.localData
+            .filter(a => {
+            return a.checked;
+        })
+            .map(item => {
+            const { checked } = item, data = __rest(item, ["checked"]);
+            return data;
+        }));
+        this.onCancel();
+    }
+    onReset() {
+        this.isSearchInputFocused = false;
+        this.onChange.emit([]);
+        this.isOpen = false;
+        this.searchInput = '';
+    }
+    onCancel() {
+        this.isSearchInputFocused = false;
+        this.localData = this.localData.map(a => {
+            if (this.localSelectedItems.some(b => b.value === a.value && String(b.checked) !== String(a.checked))) {
+                return a;
+            }
+            else {
+                return Object.assign(Object.assign({}, a), { checked: false });
+            }
+        });
+        this.isOpen = false;
+        this.searchInput = '';
+    }
+}
+MultiSelectDropdownComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'mis-multi-select-dropdown',
+                template: "<div class=\"container\" [ngStyle]=\"{\n        'height': height.length > 0? height: '',\n        'width': width.length > 0? width: ''\n     }\"\n>\n    <div class=\"dropdown\" (click)=\"toggleDropdown()\" [ngStyle]=\"{'background': isOpen ? '#E6EBF7': ''}\">\n        <div class=\"label\">\n            <p class=\"text\">{{ label }}</p>\n            <p *ngIf=\"showSelectedCount && localSelectedItems?.length > 0\" class=\"count\">\n                {{ localSelectedItems?.length }}\n            </p>\n        </div>\n        <svg class=\"handle\" [ngStyle]=\"{ transform: isOpen ? 'rotate(180deg)': 'rotate(0deg)' }\" width=\"20\" height=\"20\"\n             viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                  d=\"M13.825 7.15845L10 10.9751L6.175 7.15845L5 8.33345L10 13.3334L15 8.33345L13.825 7.15845Z\" fill=\"#181F33\" />\n        </svg>\n    </div>\n    <div style=\"flex-basis: 0;\"></div>\n    <div style=\"width: 100%; position: relative;\">\n        <div *ngIf=\"isOpen\" class=\"popup-container\"\n             [ngStyle]=\"{\n                'height': dropdownListHeight,\n                'width': dropdownListWidth\n             }\"\n             [ngClass]=\"{\n                'position-left': dropdownListPosition === 'Left',\n                'position-right': dropdownListPosition === 'Right'\n             }\"\n        >\n            <div *ngIf=\"searchEnabled\" class=\"search-container\">\n                <svg *ngIf=\"!isSearchInputFocused\" class=\"search-icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\n                     xmlns=\"http://www.w3.org/2000/svg\">\n                    <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                          d=\"M4.21508 11.1456C4.21508 7.3179 7.33722 4.21165 11.1926 4.21165C15.048 4.21165 18.1702 7.3179 18.1702 11.1456C18.1702 12.6931 17.6599 14.1226 16.7972 15.2767L15.3685 16.7013C14.2044 17.5668 12.759 18.0796 11.1926 18.0796C7.33722 18.0796 4.21508 14.9734 4.21508 11.1456ZM15.9421 17.7835C14.6021 18.7329 12.9627 19.2913 11.1926 19.2913C6.66977 19.2913 3 15.6461 3 11.1456C3 6.64512 6.66977 3 11.1926 3C15.7155 3 19.3852 6.64512 19.3852 11.1456C19.3852 12.9371 18.8037 14.5931 17.8184 15.9375L19.8361 17.4048C20.6705 17.912 21.7554 18.6543 20.2454 20.215C18.7353 21.7756 18.0099 20.6663 17.4991 19.8364L15.9421 17.7835Z\"\n                          fill=\"#6A737D\" />\n                </svg>\n                <input\n                        [ngModel]=\"searchInput\"\n                        [ngStyle]=\"{ paddingLeft: isSearchInputFocused ? '12px' : '45px', border:isSearchInputFocused? '1px solid #0937B2':'1px solid #e0e0e0', paddingRight: isSearchInputFocused ? '45px' : '10px' }\"\n                        (ngModelChange)=\"searchInputOnChange($event)\"\n                        [placeholder]=\"isSearchInputFocused ? '' : 'Search Keyword'\"\n                        (focus)=\"searchInputFocused(true)\"\n                        class=\"search-input\"\n                />\n                <svg *ngIf=\"isSearchInputFocused\" class=\"cancel-icon\" (click)=\"searchInputCanceled($event)\" width=\"24\" height=\"24\"\n                     viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                          d=\"M8.87446 7.32144C8.44588 6.89285 7.751 6.89285 7.32242 7.32144C6.89383 7.75002 6.89383 8.4449 7.32242 8.87349L10.4488 11.9999L7.32357 15.1252C6.89498 15.5538 6.89498 16.2486 7.32357 16.6772C7.75215 17.1058 8.44703 17.1058 8.87561 16.6772L12.0009 13.552L15.1261 16.6772C15.5547 17.1058 16.2496 17.1058 16.6781 16.6772C17.1067 16.2486 17.1067 15.5537 16.6781 15.1251L13.5529 11.9999L16.6793 8.87354C17.1079 8.44496 17.1079 7.75008 16.6793 7.3215C16.2507 6.89291 15.5558 6.89291 15.1273 7.3215L12.0009 10.4479L8.87446 7.32144Z\"\n                          fill=\"#6A737D\" />\n                </svg>\n            </div>\n            <div class=\"items\">\n                <div class=\"item\" (click)=\"toggleSelectedItems($event, item)\" *ngFor=\"let item of searchInput ? searchData : localData\">\n                    <div class=\"checkbox-container-wrapper\">\n                        <div class=\"checkbox-container\">\n                            <mis-checkbox\n                                [checked]=\"item.checked\"\n                            ></mis-checkbox>\n                        </div>\n                        <p class=\"label\">\n                            {{ item.label }}\n                        </p>\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=\"(searchInput ? searchData : localData).length === 0\">\n                    {{ searchInput === '' ? noDataMessage : 'No results' }}\n                </div>\n            </div>\n            <div *ngIf=\"localData.length !== 0\" class=\"actions-container\">\n                <div style=\"width: calc(50% - 4px)\">\n                    <mis-button\n                            [name]=\"'Reset'\"\n                            [type]=\"'Text'\"\n                            [width]=\"'100%'\"\n                            (click)=\"onReset()\"\n                    ></mis-button>\n                </div>\n                <div style=\"width: calc(50% - 4px)\">\n                    <mis-button\n                            [name]=\"'Apply'\"\n                            [type]=\"'Solid'\"\n                            [width]=\"'100%'\"\n                            (click)=\"applyFilters()\"\n                    ></mis-button>\n                </div>\n            </div>\n        </div>\n    </div>\n\n</div>\n",
+                styles: [".container{position:relative;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;height:32px;width:256px;font-family:Lato,sans-serif!important}.container .dropdown{height:inherit;border:1px solid #e0e0e0;border-radius:6px;background-color:#fff;cursor:pointer;display:flex;justify-content:space-between;align-items:center;width:100%;padding:0 12px;overflow:hidden}.container .dropdown:hover{background-color:#f5f7fc}.container .dropdown .label{display:flex;justify-content:flex-start;align-items:center;width:calc(100% - 32px)}.container .dropdown .label,.container .dropdown .label .text{font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.container .dropdown .label .text{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.container .dropdown .label .count{background-color:#e0e0e0;border-radius:50%;padding:2px 7px;margin:0 0 0 8px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;text-align:center;letter-spacing:.2px;color:#181f33}.container .dropdown .handle{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.container .popup-container{position:absolute;top:4px;width:100%;max-height:340px;padding-bottom:0;border:1px solid #e0e0e0;border-radius:8px;background-color:#fff;box-shadow:0 12px 24px 0 rgba(0,0,0,.12);overflow:scroll;overflow-x:hidden;display:flex;flex-direction:column;justify-content:space-between;z-index:100}.container .popup-container::-webkit-scrollbar{width:0;height:0}.container .popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.container .popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.container .popup-container .search-container .search-input{height:40px;width:100%;padding:12px;border:1px solid #e0e0e0;box-sizing:border-box;border-radius:8px;outline:none;caret-color:#0937b2;font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:#181f33}.container .popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.container .popup-container .items{padding:8px 0 8px 8px;overflow-y:scroll;height:100%}.container .popup-container .items::-webkit-scrollbar{width:5px;height:0}.container .popup-container .items::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:10px}.container .popup-container .items .noData{display:flex;justify-content:center;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.container .popup-container .items .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;padding:8px 12px;border-radius:6px;height:auto}.container .popup-container .items .item:hover{background-color:#f5f7fc}.container .popup-container .items .item .checkbox-container-wrapper{display:flex;justify-content:flex-start;align-items:center;width:90%}.container .popup-container .items .item .checkbox-container-wrapper .checkbox-container{display:block;position:relative;cursor:pointer;font-size:22px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.container .popup-container .items .item .checkbox-container-wrapper .checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.container .popup-container .items .item .checkbox-container-wrapper .checkbox-container input:checked~.checkmark:after{display:block}.container .popup-container .items .item .checkbox-container-wrapper .checkbox-container .checkmark{position:absolute;top:-8px;left:0;height:15px;width:15px;border-radius:4px;background-color:#0079f1;border:1px solid #6a737d}.container .popup-container .items .item .checkbox-container-wrapper .checkbox-container .checkmark:after{content:\"\";position:absolute;display:none;left:5px;top:2px;width:3px;height:6px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}.container .popup-container .items .item .checkbox-container-wrapper .label{margin:0 0 0 8px;line-height:20px;font-size:14px;font-style:normal;font-weight:400;letter-spacing:.200000003px}.container .popup-container .items .item .icon-container{width:10%;display:flex;justify-content:flex-end}.container .popup-container .items .item .icon-container .icon{width:20px;height:20px}.container .popup-container .actions-container{display:flex;justify-content:space-between;bottom:0;align-items:center;position:-webkit-sticky;position:sticky;padding:16px;background-color:#fff;border-top:1px solid #e0e0e0}.container .popup-container .actions-container .cancel{cursor:pointer;padding:10px 32px;text-align:center;font-size:16px;line-height:24px;border-radius:8px}.container .popup-container .actions-container .cancel:hover{background:rgba(9,55,178,.04)}.container .popup-container .actions-container .apply{cursor:pointer;padding:10px 32px;text-align:center;color:#fff;font-size:16px;line-height:24px;background:#0937b2;border-radius:8px}.position-left{right:0}.position-right{left:0}"]
+            },] }
+];
+MultiSelectDropdownComponent.ctorParameters = () => [
+    { type: ElementRef }
+];
+MultiSelectDropdownComponent.propDecorators = {
+    data: [{ type: Input }],
+    label: [{ type: Input }],
+    height: [{ type: Input }],
+    width: [{ type: Input }],
+    dropdownListHeight: [{ type: Input }],
+    dropdownListWidth: [{ type: Input }],
+    dropdownListPosition: [{ type: Input }],
+    searchEnabled: [{ type: Input }],
+    showSelectedCount: [{ type: Input }],
+    noDataMessage: [{ type: Input }],
+    selectedItems: [{ type: Input }],
+    onChange: [{ type: Output }],
+    clickout: [{ type: HostListener, args: ['document:click', ['$event'],] }]
+};
+
+class MultiSelectDropdownModule {
+    static forRoot() {
+        return { ngModule: MultiSelectDropdownModule, providers: [] };
+    }
+}
+MultiSelectDropdownModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [MultiSelectDropdownComponent],
+                imports: [CommonModule, FormsModule, CheckboxModule, ButtonModule],
+                exports: [MultiSelectDropdownComponent]
+            },] }
+];
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MultiSelectDropdownComponent, MultiSelectDropdownModule };
+//# sourceMappingURL=mis-crystal-design-system-multi-select-dropdown.js.map

package/fesm2015/mis-crystal-design-system-multi-select-dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mis-crystal-design-system-multi-select-dropdown.js","sources":["../../../projects/mis-components/multi-select-dropdown/multi-select-dropdown.component.ts","../../../projects/mis-components/multi-select-dropdown/multi-select-dropdown.module.ts","../../../projects/mis-components/multi-select-dropdown/mis-crystal-design-system-multi-select-dropdown.ts"],"sourcesContent":["import {\n    Component,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    Input,\n    OnInit,\n    Output\n} from '@angular/core';\n\n@Component({\n    selector: 'mis-multi-select-dropdown',\n    templateUrl: './multi-select-dropdown.component.html',\n    styleUrls: ['./multi-select-dropdown.component.scss']\n})\nexport class MultiSelectDropdownComponent implements OnInit {\n\n    searchInput: string = '';\n    isOpen = false;\n    localSelectedItems: MultiSelectDropdownItem[] = [];\n    localData: MultiSelectDropdownItem[] = [];\n    searchData: MultiSelectDropdownItem[] = [];\n\n    @Input() set data(values: MultiSelectDropdownItem[]) {\n        this.localData = values.map(item => {\n            return {...item, checked: false};\n        });\n    }\n    @Input() label: string = 'Select';\n    @Input() height: string = ''\n    @Input() width: string = ''\n\n    @Input() dropdownListHeight: string = ''\n    @Input() dropdownListWidth: string = ''\n    @Input() dropdownListPosition: 'Left' | 'Right' = 'Left'\n\n    @Input() searchEnabled: boolean = true;\n    @Input() showSelectedCount: boolean = false;\n    @Input() noDataMessage: string = 'No Data';\n    @Input() set selectedItems(values: MultiSelectDropdownItem[]) {\n        this.handlerSetLocalSelectedItems(values);\n    }\n\n    @Output() onChange: EventEmitter<any> = new EventEmitter();\n\n    @HostListener('document:click', ['$event'])\n    clickout(event) {\n        const isClickedOutside = !this.eRef.nativeElement.contains(event.target);\n        if (isClickedOutside) {\n            this.onCancel();\n        }\n    }\n    constructor(private eRef: ElementRef) {}\n    ngOnInit() {}\n\n    handlerSetLocalSelectedItems(values) {\n        this.localSelectedItems = values;\n        this.localData = this.localData.map(item => {\n            if (values.some(base => base.value === item.value)) {\n                return { ...item, checked: true };\n            } else {\n                return { ...item, checked: false };\n            }\n        });\n    }\n    isSearchInputFocused: boolean = false;\n    searchInputFocused(isFocused: boolean) {\n        this.isSearchInputFocused = isFocused;\n    }\n    searchInputCanceled(event) {\n        event.stopPropagation();\n        this.searchInput = '';\n        this.isSearchInputFocused = false;\n    }\n    toggleDropdown() {\n        this.isOpen = !this.isOpen;\n        if (this.isOpen) {\n            this.handlerSetLocalSelectedItems(this.localSelectedItems);\n            this.localData = this.formatValues(this.localData);\n        }\n    }\n    filterByValue(array: MultiSelectDropdownItem[], string: string) {\n        return array.filter(o =>\n            o.label.toLowerCase().includes(string.toLowerCase())\n        );\n    }\n    searchInputOnChange(newValue) {\n        this.searchInput = newValue;\n        if (newValue) {\n            this.searchData = this.filterByValue(this.localData, newValue);\n        } else {\n            this.searchData = [];\n            this.searchInput = '';\n        }\n    }\n    formatValues(array: MultiSelectDropdownItem[]) {\n        const checkedValues = array\n            .filter(a => a.checked)\n            .sort((a: MultiSelectDropdownItem, b: MultiSelectDropdownItem) =>\n                a.label > b.label ? 1 : b.label > a.label ? -1 : 0\n            );\n        const unCheckedValues = array\n            .filter(a => !a.checked)\n            .sort((a: MultiSelectDropdownItem, b: MultiSelectDropdownItem) =>\n                a.label > b.label ? 1 : b.label > a.label ? -1 : 0\n            );\n        return [...checkedValues, ...unCheckedValues];\n    }\n    toggleSelectedItems(event, item: MultiSelectDropdownItem) {\n        event.stopPropagation();\n        if (item.checked) {\n            this.localData = [\n                ...this.localData.map(a => {\n                    if (a.value === item.value) {\n                        return {\n                            ...a,\n                            checked: false\n                        };\n                    }\n                    return a;\n                })\n            ];\n        } else {\n            this.localData = [\n                ...this.localData.map(a => {\n                    if (a.value === item.value) {\n                        return {\n                            ...a,\n                            checked: true\n                        };\n                    }\n                    return a;\n                })\n            ];\n        }\n        if (this.searchEnabled) {\n            this.searchInputOnChange(this.searchInput);\n        }\n    }\n    applyFilters() {\n        this.onChange.emit(\n            this.localData\n                .filter(a => {\n                    return a.checked;\n                })\n                .map(item => {\n                    const { checked, ...data } = item;\n                    return data;\n                })\n        );\n        this.onCancel();\n    }\n    onReset(){\n        this.isSearchInputFocused = false;\n        this.onChange.emit([])\n        this.isOpen = false;\n        this.searchInput = '';\n    }\n    onCancel() {\n        this.isSearchInputFocused = false;\n        this.localData = this.localData.map(a => {\n            if (\n                this.localSelectedItems.some(\n                    b => b.value === a.value && String(b.checked) !== String(a.checked)\n                )\n            ) {\n                return a;\n            } else {\n                return {\n                    ...a,\n                    checked: false\n                };\n            }\n        });\n        this.isOpen = false;\n        this.searchInput = '';\n    }\n}\nexport interface MultiSelectDropdownItem {\n    label: string;\n    value: string;\n    checked?: boolean;\n    icon?: string;\n}\n","import { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { NgModule, ModuleWithProviders } from '@angular/core';\nimport { MultiSelectDropdownComponent } from './multi-select-dropdown.component';\nimport { CheckboxModule } from 'mis-crystal-design-system/checkbox';\nimport { ButtonModule } from 'mis-crystal-design-system/button';\n\n@NgModule({\n    declarations: [MultiSelectDropdownComponent],\n    imports: [CommonModule, FormsModule, CheckboxModule, ButtonModule],\n    exports: [MultiSelectDropdownComponent]\n})\nexport class MultiSelectDropdownModule {\n    static forRoot(): ModuleWithProviders<MultiSelectDropdownModule> {\n        return { ngModule: MultiSelectDropdownModule, providers: [] };\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}