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

package/input/mis-input.component.scss

@@ -1,6 +1,4 @@
 @import "../styles/mis-color-constants.scss";
-@import '../styles/mis-fonts.scss';
-@import '../styles/mis-icons.scss';
 
 .input-container {
   position: relative;
@@ -17,7 +15,7 @@
     flex-direction: row;
     flex-wrap: nowrap;
     transition: all ease-in 60ms;
-    background-color: $text_white;
+    background-color: #ffffff;
     padding: 3px 16px; // DONE CHANGE
     gap: 16px;
     .mis-input {
@@ -38,7 +36,7 @@
       font-weight: normal;
       font-size: 16px;
       height: 24px;
-      color: $text_black;
+      color: #181f33;
       background-color: transparent;
       width: 100%;
       vertical-align: middle;
@@ -56,13 +54,13 @@
       font-weight: normal;
       font-size: 16px;
       line-height: 24px;
-      color: $text_muted;
+      color: #6a737d;
       z-index: -1;
       transition: all ease-in 150ms;
     }
 
     &:focus-within {
-      background-color: $grey_bg;
+      background-color: #f5f5f5;
     }
     &:focus-within {
       border: 1px solid $pmry_500;
@@ -71,7 +69,7 @@
     [mis-input-icon] {
       width: 18px;
       height: 18px;
-      color: $text_muted;
+      color: #6a737d;
       font-size: 24px;
       line-height: 18px;
     }
@@ -103,19 +101,19 @@
     }
     .input-wrapper {
       border-radius: 4px;
-      border: 1px solid $grey_seperators;
+      border: 1px solid #e0e0e0;
       padding: 0;
       // input:not(:disabled) {
       //   &:hover,
       //   &:focus {
-      //     background-color: $grey_bg;
+      //     background-color: #f5f5f5;
       //   }
       // }
       &:hover {
-        background-color: $grey_bg;
+        background-color: #f5f5f5;
       }
       &:focus-within {
-        border: 1px solid $pmry_500;
+        border: 1px solid #0937b2;
       }
       input:not(:placeholder-shown) + .mis-placeholder {
         color: transparent !important;
@@ -127,7 +125,7 @@
     }
     &.has-error {
       .input-wrapper {
-        border: 1px solid $sem_error !important;
+        border: 1px solid #b00020 !important;
       }
     }
   }
@@ -135,9 +133,9 @@
     .input-wrapper {
       padding-top: 24px;
       padding-bottom: 7px; // DONE CHANGE
-      border-bottom: 1px solid $grey_seperators;
+      border-bottom: 1px solid #e0e0e0;
       input:focus + .mis-placeholder {
-        color: $pmry_500 !important;
+        color: #0937b2 !important;
       }
       input:not(:placeholder-shown) + .mis-placeholder,
       input:focus + .mis-placeholder {
@@ -147,9 +145,9 @@
       }
       &:focus-within {
         border: none;
-        border-bottom: 1px solid $pmry_500;
+        border-bottom: 1px solid #0937b2;
         input::placeholder {
-          color: $text_muted;
+          color: #6a737d;
           opacity: 1;
           font-size: 16px;
         }
@@ -157,9 +155,9 @@
     }
     &.has-error {
       .input-wrapper {
-        border-bottom: 1px solid $sem_error !important;
+        border-bottom: 1px solid #b00020 !important;
         .mis-placeholder {
-          color: $sem_error !important;
+          color: #b00020 !important;
         }
       }
     }
@@ -173,10 +171,10 @@
     line-height: 24px;
     height: 24px;
     font-size: 12px;
-    color: $text_muted;
+    color: #6a737d;
     letter-spacing: 0.2px;
   }
   [mis-input-error] {
-    color: $sem_error;
+    color: #b00020;
   }
 }

package/input/mis-input.module.d.ts

@@ -1,10 +1,2 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./mis-input.component";
-import * as i2 from "./directives/input/input.directive";
-import * as i3 from "@angular/common";
-import * as i4 from "@angular/forms";
 export declare class MisInputModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<MisInputModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MisInputModule, [typeof i1.MisInputComponent, typeof i2.MisInputDirective], [typeof i3.CommonModule, typeof i4.FormsModule], [typeof i1.MisInputComponent, typeof i2.MisInputDirective]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<MisInputModule>;
 }

package/input/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "../bundles/mis-crystal-design-system-input.umd.js",
+  "module": "../fesm2015/mis-crystal-design-system-input.js",
+  "es2015": "../fesm2015/mis-crystal-design-system-input.js",
+  "esm2015": "../esm2015/input/mis-crystal-design-system-input.js",
+  "fesm2015": "../fesm2015/mis-crystal-design-system-input.js",
+  "typings": "mis-crystal-design-system-input.d.ts",
+  "metadata": "mis-crystal-design-system-input.metadata.json",
+  "sideEffects": false,
+  "name": "mis-crystal-design-system/input"
+}

package/loader/loader.component.d.ts

@@ -1,10 +1,7 @@
 import { OnInit } from "@angular/core";
-import * as i0 from "@angular/core";
 export declare class LoaderComponent implements OnInit {
     /** Controls loader size */
     mobileView: boolean;
     constructor();
     ngOnInit(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<LoaderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LoaderComponent, "mis-loader", never, { "mobileView": "mobileView"; }, {}, never, never, false>;
 }

package/loader/loader.module.d.ts

@@ -1,10 +1,4 @@
 import { ModuleWithProviders } from "@angular/core";
-import * as i0 from "@angular/core";
-import * as i1 from "./loader.component";
-import * as i2 from "@angular/common";
 export declare class LoaderModule {
     static forRoot(): ModuleWithProviders<LoaderModule>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<LoaderModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<LoaderModule, [typeof i1.LoaderComponent], [typeof i2.CommonModule], [typeof i1.LoaderComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<LoaderModule>;
 }

package/loader/mis-crystal-design-system-loader.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';

package/loader/mis-crystal-design-system-loader.metadata.json

@@ -0,0 +1 @@
+{"__symbolic":"module","version":4,"metadata":{"LoaderComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"mis-loader","template":"<div\n  id=\"spinner\"\n  [ngClass]=\"{\n    mobile: mobileView\n  }\"\n></div>\n","styles":["#spinner{-webkit-animation:frames 1s linear infinite;animation:frames 1s linear infinite;background:transparent;border-radius:100%;border:4px solid #e0e0e0;border-top-color:#6200ee;width:40px;height:40px;padding:0;position:absolute}@-webkit-keyframes frames{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes frames{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}.mobile{height:20px!important;width:20px!important;border:2px solid #e0e0e0!important;border-top-color:#6200ee!important}"]}]}],"members":{"mobileView":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"LoaderModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"LoaderComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":12}],"exports":[{"__symbolic":"reference","name":"LoaderComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"LoaderModule"},"providers":[]}}}}},"origins":{"LoaderComponent":"./loader.component","LoaderModule":"./loader.module"},"importAs":"mis-crystal-design-system/loader"}

package/loader/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "../bundles/mis-crystal-design-system-loader.umd.js",
+  "module": "../fesm2015/mis-crystal-design-system-loader.js",
+  "es2015": "../fesm2015/mis-crystal-design-system-loader.js",
+  "esm2015": "../esm2015/loader/mis-crystal-design-system-loader.js",
+  "fesm2015": "../fesm2015/mis-crystal-design-system-loader.js",
+  "typings": "mis-crystal-design-system-loader.d.ts",
+  "metadata": "mis-crystal-design-system-loader.metadata.json",
+  "sideEffects": false,
+  "name": "mis-crystal-design-system/loader"
+}

package/menu/menu-close.directive.d.ts

@@ -1,9 +1,6 @@
 import { MenuDirective } from "./menu.directive";
-import * as i0 from "@angular/core";
 export declare class MenuCloseDirective {
     menu: MenuDirective;
     constructor();
     closeMenu(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuCloseDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuCloseDirective, "[misMenuClose]", never, { "menu": "misMenuClose"; }, {}, never, never, false>;
 }

package/menu/menu.directive.d.ts

@@ -1,7 +1,6 @@
 /** @format */
 import { Overlay } from "@angular/cdk/overlay";
 import { ElementRef, TemplateRef, ViewContainerRef } from "@angular/core";
-import * as i0 from "@angular/core";
 export declare class MenuDirective {
     private overlay;
     private element;
@@ -16,6 +15,4 @@ export declare class MenuDirective {
     onClick(event: any): void;
     private menuShow;
     close(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuDirective, "[misMenu]", ["misMenu"], { "menu": "misMenu"; "positionX": "positionX"; "positionY": "positionY"; "offsetX": "offsetX"; "offsetY": "offsetY"; }, {}, never, never, false>;
 }

package/menu/menu.module.d.ts

@@ -1,11 +1,3 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./menu.directive";
-import * as i2 from "./menu-close.directive";
-import * as i3 from "@angular/common";
-import * as i4 from "@angular/cdk/overlay";
-import * as i5 from "@angular/cdk/portal";
+/** @format */
 export declare class MisMenuModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<MisMenuModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MisMenuModule, [typeof i1.MenuDirective, typeof i2.MenuCloseDirective], [typeof i3.CommonModule, typeof i4.OverlayModule, typeof i5.PortalModule], [typeof i1.MenuDirective, typeof i2.MenuCloseDirective]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<MisMenuModule>;
 }

package/menu/mis-crystal-design-system-menu.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';

package/menu/mis-crystal-design-system-menu.metadata.json

@@ -0,0 +1 @@
+{"__symbolic":"module","version":4,"metadata":{"MenuDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":7,"character":1},"arguments":[{"selector":"[misMenu]","exportAs":"misMenu"}]}],"members":{"menu":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3},"arguments":["misMenu"]}]}],"positionX":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"positionY":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"offsetX":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"offsetY":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay","line":19,"character":31},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":19,"character":57},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":19,"character":95}]}],"onClick":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":20,"character":3},"arguments":["click",["$event"]]}]}],"menuShow":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}]}},"MenuCloseDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":3,"character":1},"arguments":[{"selector":"[misMenuClose]"}]}],"members":{"menu":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":7,"character":3},"arguments":["misMenuClose"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"closeMenu":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":10,"character":3},"arguments":["click",[]]}]}]}},"MisMenuModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":9,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MenuDirective"},{"__symbolic":"reference","name":"MenuCloseDirective"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":11,"character":12},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":11,"character":26},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":11,"character":41}],"exports":[{"__symbolic":"reference","name":"MenuDirective"},{"__symbolic":"reference","name":"MenuCloseDirective"}]}]}],"members":{}}},"origins":{"MenuDirective":"./menu.directive","MenuCloseDirective":"./menu-close.directive","MisMenuModule":"./menu.module"},"importAs":"mis-crystal-design-system/menu"}

package/menu/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "../bundles/mis-crystal-design-system-menu.umd.js",
+  "module": "../fesm2015/mis-crystal-design-system-menu.js",
+  "es2015": "../fesm2015/mis-crystal-design-system-menu.js",
+  "esm2015": "../esm2015/menu/mis-crystal-design-system-menu.js",
+  "fesm2015": "../fesm2015/mis-crystal-design-system-menu.js",
+  "typings": "mis-crystal-design-system-menu.d.ts",
+  "metadata": "mis-crystal-design-system-menu.metadata.json",
+  "sideEffects": false,
+  "name": "mis-crystal-design-system/menu"
+}

package/mis-crystal-design-system.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';

package/mis-crystal-design-system.metadata.json

@@ -0,0 +1 @@
+{"__symbolic":"module","version":4,"exports":[{"from":"./public-api"}],"metadata":{},"origins":{},"importAs":"mis-crystal-design-system"}

package/modal/mis-crystal-design-system-modal.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+export { ModuleWrapperComponent as ɵa } from './module-wrapper/module-wrapper.component';

package/modal/mis-crystal-design-system-modal.metadata.json

@@ -0,0 +1 @@
+{"__symbolic":"module","version":4,"metadata":{"ModalService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":16,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay","line":22,"character":31},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":22,"character":58}]}],"show":[{"__symbolic":"method"}],"createInjector":[{"__symbolic":"method"}],"calculatePosition":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"ModalRef":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayRef","line":10,"character":30}]}],"close":[{"__symbolic":"method"}]}},"MODAL_DATA_VAR":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":34},"arguments":["MISModalDataInjectionToken"]},"ModalModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":7,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵa"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":12},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":9,"character":26},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":9,"character":41}],"entryComponents":[{"__symbolic":"reference","name":"ɵa"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"ModalModule"},"providers":[{"__symbolic":"reference","name":"ModalService"}]}},"forChild":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"ModalModule"},"providers":[{"__symbolic":"reference","name":"ModalService"}]}}}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"mis-module-wrapper","animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":10,"character":4},"arguments":["slideInOut",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":11,"character":6},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":12,"character":8},"arguments":[{"transform":"translateY(-30%)","opacity":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":13,"character":8},"arguments":["200ms ease-out",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":13,"character":34},"arguments":[{"transform":"translatey(0%)","opacity":1}]}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":15,"character":6},"arguments":[":leave",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":15,"character":28},"arguments":["200ms ease-out",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":15,"character":54},"arguments":[{"transform":"translatey(-30%)","opacity":0}]}]}]]}]]}],"template":"<div class=\"mis-modal-body\" #place @slideInOut>\n  <ng-template [cdkPortalOutlet]=\"modalPortal\"></ng-template>\n</div>\n","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}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"place":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":23,"character":3},"arguments":["place",{"static":false,"read":{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":23,"character":45}}]}]}],"bindComponent":[{"__symbolic":"method"}],"initComponent":[{"__symbolic":"method"}]}}},"origins":{"ModalService":"./modal.service","ModalRef":"./modal-ref","MODAL_DATA_VAR":"./modal-constants","ModalModule":"./modal.module","ɵa":"./module-wrapper/module-wrapper.component"},"importAs":"mis-crystal-design-system/modal"}

package/modal/modal.module.d.ts

@@ -1,13 +1,5 @@
 import { ModuleWithProviders } from "@angular/core";
-import * as i0 from "@angular/core";
-import * as i1 from "./module-wrapper/module-wrapper.component";
-import * as i2 from "@angular/common";
-import * as i3 from "@angular/cdk/overlay";
-import * as i4 from "@angular/cdk/portal";
 export declare class ModalModule {
     static forRoot(): ModuleWithProviders<ModalModule>;
     static forChild(): ModuleWithProviders<ModalModule>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ModalModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ModalModule, [typeof i1.ModuleWrapperComponent], [typeof i2.CommonModule, typeof i3.OverlayModule, typeof i4.PortalModule], never>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<ModalModule>;
 }

package/modal/modal.service.d.ts

@@ -1,7 +1,6 @@
 import { ComponentType, Overlay } from "@angular/cdk/overlay";
 import { Injector } from "@angular/core";
 import { ModalRef } from "./modal-ref";
-import * as i0 from "@angular/core";
 interface IModalOptions {
     width?: string;
     height?: string;
@@ -19,7 +18,5 @@ export declare class ModalService {
     show<T, D>(component: ComponentType<T>, data?: D, options?: IModalOptions): ModalRef;
     private createInjector;
     private calculatePosition;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ModalService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<ModalService>;
 }
 export {};

package/modal/module-wrapper/module-wrapper.component.d.ts

@@ -1,12 +1,9 @@
 import { ComponentPortal, PortalInjector } from "@angular/cdk/portal";
 import { ViewContainerRef } from "@angular/core";
-import * as i0 from "@angular/core";
 export declare class ModuleWrapperComponent {
     modalPortal: ComponentPortal<any>;
     constructor();
     place: ViewContainerRef;
     bindComponent(type: any, injector: PortalInjector): void;
     private initComponent;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ModuleWrapperComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ModuleWrapperComponent, "mis-module-wrapper", never, {}, {}, never, never, false>;
 }

package/modal/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "../bundles/mis-crystal-design-system-modal.umd.js",
+  "module": "../fesm2015/mis-crystal-design-system-modal.js",
+  "es2015": "../fesm2015/mis-crystal-design-system-modal.js",
+  "esm2015": "../esm2015/modal/mis-crystal-design-system-modal.js",
+  "fesm2015": "../fesm2015/mis-crystal-design-system-modal.js",
+  "typings": "mis-crystal-design-system-modal.d.ts",
+  "metadata": "mis-crystal-design-system-modal.metadata.json",
+  "sideEffects": false,
+  "name": "mis-crystal-design-system/modal"
+}

package/multi-select-dropdown/mis-crystal-design-system-multi-select-dropdown.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';

package/multi-select-dropdown/mis-crystal-design-system-multi-select-dropdown.metadata.json

@@ -0,0 +1 @@
+{"__symbolic":"module","version":4,"metadata":{"MultiSelectDropdownComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"mis-multi-select-dropdown","template":"<div\n  class=\"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\">{{ label }}</p>\n      <p *ngIf=\"showSelectedCount && localSelectedItems?.length > 0\" class=\"count\">\n        {{ localSelectedItems?.length }}\n      </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<ng-template #popupContainer>\n  <div\n    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\n        *ngIf=\"!isSearchInputFocused\"\n        class=\"search-icon\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          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        />\n      </svg>\n      <input\n        [ngModel]=\"searchInput\"\n        [ngStyle]=\"{\n          paddingLeft: isSearchInputFocused ? '12px' : '45px',\n          border: isSearchInputFocused ? '1px solid #0937B2' : '1px solid #e0e0e0',\n          paddingRight: isSearchInputFocused ? '45px' : '10px'\n        }\"\n        (ngModelChange)=\"searchInputOnChange($event)\"\n        [placeholder]=\"isSearchInputFocused ? '' : 'Search Keyword'\"\n        (focus)=\"searchInputFocused(true)\"\n        class=\"search-input\"\n      />\n      <svg\n        *ngIf=\"isSearchInputFocused\"\n        class=\"cancel-icon\"\n        (click)=\"searchInputCanceled($event)\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          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        />\n      </svg>\n    </div>\n    <div class=\"items\">\n      <div\n        class=\"item\"\n        tabindex=\"0\"\n        (keyup.enter)=\"toggleSelectedItems($event, item)\"\n        (click)=\"toggleSelectedItems($event, item)\"\n        *ngFor=\"let item of searchInput ? searchData : localData\"\n      >\n        <div class=\"checkbox-container-wrapper\">\n          <div class=\"checkbox-container\">\n            <mis-checkbox [checked]=\"item.checked\" tabindex=\"-1\"></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 && !hideApplyButton\" class=\"actions-container\">\n      <div style=\"width: calc(50% - 4px)\">\n        <mis-button [name]=\"'Reset'\" [type]=\"'Text'\" [width]=\"'100%'\" (click)=\"onReset()\"></mis-button>\n      </div>\n      <div style=\"width: calc(50% - 4px)\">\n        <mis-button [name]=\"'Apply'\" [type]=\"'Solid'\" [width]=\"'100%'\" (click)=\"applyFilters()\"></mis-button>\n      </div>\n    </div>\n  </div>\n</ng-template>\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:focus-visible,.container .dropdown:hover{background-color:#f5f7fc;outline:none}.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}.popup-container{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);display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container::-webkit-scrollbar{width:0;height:0}.popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.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}.popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container .items{padding:8px 0 8px 8px;overflow-y:scroll}.popup-container .items::-webkit-scrollbar{width:5px;height:0}.popup-container .items::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:10px}.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}.popup-container .items .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;padding:8px 12px;border-radius:6px;height:auto}.popup-container .items .item:focus-visible,.popup-container .items .item:hover{background-color:#f5f7fc;outline:none}.popup-container .items .item .checkbox-container-wrapper{display:flex;justify-content:flex-start;align-items:center;width:90%}.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}.popup-container .items .item .checkbox-container-wrapper .checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.popup-container .items .item .checkbox-container-wrapper .checkbox-container input:checked~.checkmark:after{display:block}.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}.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)}.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:.2;text-overflow:ellipsis;overflow:hidden}.popup-container .items .item .icon-container{width:10%;display:flex;justify-content:flex-end}.popup-container .items .item .icon-container .icon{width:20px;height:20px}.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}.popup-container .actions-container .cancel{cursor:pointer;padding:10px 32px;text-align:center;font-size:16px;line-height:24px;border-radius:8px}.popup-container .actions-container .cancel:hover{background:rgba(9,55,178,.04)}.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}"]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"dropdownListHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"dropdownListWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"dropdownListPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"enableSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"searchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"showSelectedCount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"noDataMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}}]}],"selectedItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"hideApplyButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":38,"character":3}}]}],"selectElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":40,"character":3},"arguments":["select",{"static":false}]}]}],"popupContainer":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":41,"character":3},"arguments":["popupContainer",{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":44,"character":28},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay","line":44,"character":57},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":44,"character":92},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":44,"character":126}]}],"ngOnInit":[{"__symbolic":"method"}],"handlerSetLocalSelectedItems":[{"__symbolic":"method"}],"searchInputFocused":[{"__symbolic":"method"}],"searchInputCanceled":[{"__symbolic":"method"}],"toggleDropdown":[{"__symbolic":"method"}],"openDropdown":[{"__symbolic":"method"}],"filterByValue":[{"__symbolic":"method"}],"searchInputOnChange":[{"__symbolic":"method"}],"formatValues":[{"__symbolic":"method"}],"toggleSelectedItems":[{"__symbolic":"method"}],"applyFilters":[{"__symbolic":"method"}],"onReset":[{"__symbolic":"method"}],"onCancel":[{"__symbolic":"method"}]}},"MultiSelectDropdownItem":{"__symbolic":"interface"},"MultiSelectDropdownModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MultiSelectDropdownComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":12},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":10,"character":26},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":10,"character":39},{"__symbolic":"reference","module":"mis-crystal-design-system/checkbox","name":"CheckboxModule","line":10,"character":54},{"__symbolic":"reference","module":"mis-crystal-design-system/button","name":"ButtonModule","line":10,"character":70}],"exports":[{"__symbolic":"reference","name":"MultiSelectDropdownComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"MultiSelectDropdownModule"},"providers":[]}}}}},"origins":{"MultiSelectDropdownComponent":"./multi-select-dropdown.component","MultiSelectDropdownItem":"./multi-select-dropdown.component","MultiSelectDropdownModule":"./multi-select-dropdown.module"},"importAs":"mis-crystal-design-system/multi-select-dropdown"}

package/multi-select-dropdown/multi-select-dropdown.component.d.ts

@@ -1,6 +1,5 @@
 import { ElementRef, EventEmitter, NgZone, OnInit, TemplateRef, ViewContainerRef } from "@angular/core";
 import { Overlay } from "@angular/cdk/overlay";
-import * as i0 from "@angular/core";
 export declare class MultiSelectDropdownComponent implements OnInit {
     private eRef;
     private overlay;
@@ -45,8 +44,6 @@ export declare class MultiSelectDropdownComponent implements OnInit {
     applyFilters(): void;
     onReset(): void;
     onCancel(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectDropdownComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectDropdownComponent, "mis-multi-select-dropdown", never, { "data": "data"; "label": "label"; "height": "height"; "width": "width"; "dropdownListHeight": "dropdownListHeight"; "dropdownListWidth": "dropdownListWidth"; "dropdownListPosition": "dropdownListPosition"; "enableSelectAll": "enableSelectAll"; "searchEnabled": "searchEnabled"; "showSelectedCount": "showSelectedCount"; "noDataMessage": "noDataMessage"; "options": "options"; "selectedItems": "selectedItems"; "hideApplyButton": "hideApplyButton"; }, { "onChange": "onChange"; }, never, never, false>;
 }
 export interface MultiSelectDropdownItem {
     label: string;

package/multi-select-dropdown/multi-select-dropdown.module.d.ts

@@ -1,14 +1,4 @@
 import { ModuleWithProviders } from "@angular/core";
-import * as i0 from "@angular/core";
-import * as i1 from "./multi-select-dropdown.component";
-import * as i2 from "@angular/common";
-import * as i3 from "@angular/forms";
-import * as i4 from "@angular/cdk/overlay";
-import * as i5 from "mis-crystal-design-system/checkbox";
-import * as i6 from "mis-crystal-design-system/button";
 export declare class MultiSelectDropdownModule {
     static forRoot(): ModuleWithProviders<MultiSelectDropdownModule>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectDropdownModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MultiSelectDropdownModule, [typeof i1.MultiSelectDropdownComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.OverlayModule, typeof i5.CheckboxModule, typeof i6.ButtonModule], [typeof i1.MultiSelectDropdownComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<MultiSelectDropdownModule>;
 }

package/multi-select-dropdown/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "../bundles/mis-crystal-design-system-multi-select-dropdown.umd.js",
+  "module": "../fesm2015/mis-crystal-design-system-multi-select-dropdown.js",
+  "es2015": "../fesm2015/mis-crystal-design-system-multi-select-dropdown.js",
+  "esm2015": "../esm2015/multi-select-dropdown/mis-crystal-design-system-multi-select-dropdown.js",
+  "fesm2015": "../fesm2015/mis-crystal-design-system-multi-select-dropdown.js",
+  "typings": "mis-crystal-design-system-multi-select-dropdown.d.ts",
+  "metadata": "mis-crystal-design-system-multi-select-dropdown.metadata.json",
+  "sideEffects": false,
+  "name": "mis-crystal-design-system/multi-select-dropdown"
+}

package/nested-multi-select-dropdown/mis-crystal-design-system-nested-multi-select-dropdown.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';

package/nested-multi-select-dropdown/mis-crystal-design-system-nested-multi-select-dropdown.metadata.json

@@ -0,0 +1 @@
+{"__symbolic":"module","version":4,"metadata":{"NestedMultiSelectDropdownComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"mis-nested-multi-select-dropdown","template":"<div\n  class=\"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\">{{ label }}</p>\n      <p *ngIf=\"showSelectedCount && selectedCount > 0\" class=\"count\">\n        {{ selectedCount }}\n      </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<ng-template #popupContainer>\n  <div\n    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\n        *ngIf=\"!isSearchInputFocused\"\n        class=\"search-icon\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          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        />\n      </svg>\n      <input\n        [ngModel]=\"searchInput\"\n        [ngStyle]=\"{\n          paddingLeft: isSearchInputFocused ? '12px' : '45px',\n          border: isSearchInputFocused ? '1px solid #0937B2' : '1px solid #e0e0e0',\n          paddingRight: isSearchInputFocused ? '45px' : '10px'\n        }\"\n        (ngModelChange)=\"searchInputOnChange($event)\"\n        [placeholder]=\"isSearchInputFocused ? '' : 'Search Keyword'\"\n        (focus)=\"searchInputFocused(true)\"\n        class=\"search-input\"\n      />\n      <svg\n        *ngIf=\"isSearchInputFocused\"\n        class=\"cancel-icon\"\n        (click)=\"searchInputCanceled($event)\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          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        />\n      </svg>\n    </div>\n    <div class=\"items\">\n      <div\n        tabindex=\"0\"\n        (keyup.enter)=\"toggleSelectedItems($event, item)\"\n        (click)=\"toggleSelectedItems($event, item)\"\n        *ngFor=\"let item of searchInput ? searchData : localData\"\n      >\n        <div class=\"item\">\n          <div class=\"checkbox-container-wrapper\">\n            <div class=\"checkbox-container\">\n              <mis-checkbox [checked]=\"item.checked\"></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 *ngIf=\"item?.children?.length > 0\" class=\"items sub\" style=\"padding-right: 0\">\n          <div\n            class=\"item\"\n            tabindex=\"0\"\n            (keyup.enter)=\"toggleSelectedItems($event, item, cItem)\"\n            (click)=\"toggleSelectedItems($event, item, cItem)\"\n            *ngFor=\"let cItem of item?.children\"\n          >\n            <div class=\"checkbox-container-wrapper\">\n              <div class=\"checkbox-container\">\n                <mis-checkbox [checked]=\"cItem.checked\"></mis-checkbox>\n              </div>\n              <p class=\"label\">\n                {{ cItem.label }}\n              </p>\n            </div>\n            <div class=\"icon-container\" *ngIf=\"cItem.icon\">\n              <img class=\"icon\" [src]=\"cItem.icon\" alt=\"no img\" />\n            </div>\n          </div>\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 [name]=\"'Reset'\" [type]=\"'Text'\" [width]=\"'100%'\" (click)=\"onReset()\"></mis-button>\n      </div>\n      <div style=\"width: calc(50% - 4px)\">\n        <mis-button [name]=\"'Apply'\" [type]=\"'Solid'\" [width]=\"'100%'\" (click)=\"applyFilters()\"></mis-button>\n      </div>\n    </div>\n  </div>\n</ng-template>\n","styles":["::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{background:#9aa7b4}.container{position:relative;display:flex;justify-content:center;align-items:center;height:32px;width:256px;flex-wrap:wrap;font-family:Lato,sans-serif}.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:focus-visible,.container .dropdown:hover{background-color:#f5f7fc;outline:none}.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}.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-x:hidden;display:flex;flex-direction:column;justify-content:space-between;z-index:100}.popup-container::-webkit-scrollbar{width:0;height:0}.popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.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}.popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container .items{padding:8px 0 8px 8px;overflow-y:scroll;height:100%}.popup-container .items::-webkit-scrollbar{width:5px;height:0}.popup-container .items::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:10px}.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}.popup-container .items .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;padding:8px 12px;border-radius:6px;height:auto}.popup-container .items .item:focus-visible,.popup-container .items .item:hover{background-color:#f5f7fc;outline:none}.popup-container .items .item .checkbox-container-wrapper{display:flex;justify-content:flex-start;align-items:center;width:90%}.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}.popup-container .items .item .checkbox-container-wrapper .checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.popup-container .items .item .checkbox-container-wrapper .checkbox-container input:checked~.checkmark:after{display:block}.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}.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)}.popup-container .items .item .checkbox-container-wrapper .label{margin:0 0 0 8px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33;text-overflow:ellipsis;overflow:hidden}.popup-container .items .item .icon-container{width:10%;display:flex;justify-content:flex-end}.popup-container .items .item .icon-container .icon{width:20px;height:20px}.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}.popup-container .actions-container .cancel{cursor:pointer;padding:10px 32px;text-align:center;font-size:16px;line-height:24px;border-radius:8px}.popup-container .actions-container .cancel:hover{background:rgba(9,55,178,.04)}.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}"]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"dropdownListHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"dropdownListWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"dropdownListPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"searchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"showSelectedCount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"noDataMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"selectedItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":3}}]}],"selectElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":49,"character":3},"arguments":["select",{"static":false}]}]}],"popupContainer":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":50,"character":3},"arguments":["popupContainer",{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":53,"character":28},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay","line":53,"character":57},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":53,"character":92}]}],"ngOnInit":[{"__symbolic":"method"}],"handlerSetLocalSelectedItems":[{"__symbolic":"method"}],"searchInputFocused":[{"__symbolic":"method"}],"searchInputCanceled":[{"__symbolic":"method"}],"toggleDropdown":[{"__symbolic":"method"}],"openDropdown":[{"__symbolic":"method"}],"filterByValue":[{"__symbolic":"method"}],"searchInputOnChange":[{"__symbolic":"method"}],"formatValues":[{"__symbolic":"method"}],"toggleSelectedItems":[{"__symbolic":"method"}],"applyFilters":[{"__symbolic":"method"}],"onReset":[{"__symbolic":"method"}],"onCancel":[{"__symbolic":"method"}]}},"NestedMultiSelectDropdownItem":{"__symbolic":"interface"},"NestedMultiSelectDropdownModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"NestedMultiSelectDropdownComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":12},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":10,"character":26},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":10,"character":39},{"__symbolic":"reference","module":"mis-crystal-design-system/checkbox","name":"CheckboxModule","line":10,"character":54},{"__symbolic":"reference","module":"mis-crystal-design-system/button","name":"ButtonModule","line":10,"character":70}],"exports":[{"__symbolic":"reference","name":"NestedMultiSelectDropdownComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"NestedMultiSelectDropdownModule"},"providers":[]}}}}},"origins":{"NestedMultiSelectDropdownComponent":"./nested-multi-select-dropdown.component","NestedMultiSelectDropdownItem":"./nested-multi-select-dropdown.component","NestedMultiSelectDropdownModule":"./nested-multi-select-dropdown.module"},"importAs":"mis-crystal-design-system/nested-multi-select-dropdown"}

package/nested-multi-select-dropdown/nested-multi-select-dropdown.component.d.ts

@@ -1,6 +1,5 @@
 import { Overlay } from "@angular/cdk/overlay";
 import { ElementRef, EventEmitter, OnInit, TemplateRef, ViewContainerRef } from "@angular/core";
-import * as i0 from "@angular/core";
 export declare class NestedMultiSelectDropdownComponent implements OnInit {
     private eRef;
     private overlay;
@@ -52,8 +51,6 @@ export declare class NestedMultiSelectDropdownComponent implements OnInit {
     applyFilters(): void;
     onReset(): void;
     onCancel(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<NestedMultiSelectDropdownComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NestedMultiSelectDropdownComponent, "mis-nested-multi-select-dropdown", never, { "data": "data"; "label": "label"; "height": "height"; "width": "width"; "dropdownListHeight": "dropdownListHeight"; "dropdownListWidth": "dropdownListWidth"; "dropdownListPosition": "dropdownListPosition"; "searchEnabled": "searchEnabled"; "showSelectedCount": "showSelectedCount"; "noDataMessage": "noDataMessage"; "selectedItems": "selectedItems"; }, { "onChange": "onChange"; }, never, never, false>;
 }
 export interface NestedMultiSelectDropdownItem {
     label: string;

package/nested-multi-select-dropdown/nested-multi-select-dropdown.module.d.ts

@@ -1,14 +1,4 @@
 import { ModuleWithProviders } from "@angular/core";
-import * as i0 from "@angular/core";
-import * as i1 from "./nested-multi-select-dropdown.component";
-import * as i2 from "@angular/common";
-import * as i3 from "@angular/forms";
-import * as i4 from "@angular/cdk/overlay";
-import * as i5 from "mis-crystal-design-system/checkbox";
-import * as i6 from "mis-crystal-design-system/button";
 export declare class NestedMultiSelectDropdownModule {
     static forRoot(): ModuleWithProviders<NestedMultiSelectDropdownModule>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<NestedMultiSelectDropdownModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<NestedMultiSelectDropdownModule, [typeof i1.NestedMultiSelectDropdownComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.OverlayModule, typeof i5.CheckboxModule, typeof i6.ButtonModule], [typeof i1.NestedMultiSelectDropdownComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<NestedMultiSelectDropdownModule>;
 }

package/nested-multi-select-dropdown/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "../bundles/mis-crystal-design-system-nested-multi-select-dropdown.umd.js",
+  "module": "../fesm2015/mis-crystal-design-system-nested-multi-select-dropdown.js",
+  "es2015": "../fesm2015/mis-crystal-design-system-nested-multi-select-dropdown.js",
+  "esm2015": "../esm2015/nested-multi-select-dropdown/mis-crystal-design-system-nested-multi-select-dropdown.js",
+  "fesm2015": "../fesm2015/mis-crystal-design-system-nested-multi-select-dropdown.js",
+  "typings": "mis-crystal-design-system-nested-multi-select-dropdown.d.ts",
+  "metadata": "mis-crystal-design-system-nested-multi-select-dropdown.metadata.json",
+  "sideEffects": false,
+  "name": "mis-crystal-design-system/nested-multi-select-dropdown"
+}