npm - mis-crystal-design-system - Versions diffs - 2.3.17 → 2.3.18 - Mend

mis-crystal-design-system 2.3.17 → 2.3.18

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

Files changed (493) hide show

package/fesm2015/mis-crystal-design-system-datepicker_v2.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { InjectionToken, Component, Inject, EventEmitter, Injector, Directive, Self, Optional, ElementRef, ViewContainerRef, Input, Output, HostListener, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { parseZone, tz } from 'moment-timezone';
+import { parseZone } from 'moment-timezone';
 import { ToastService, ToastModule } from 'mis-crystal-design-system/toast';
 import { OverlayConfig, ConnectionPositionPair, Overlay } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
@@ -71,7 +71,7 @@ class TzDpContainerComponent {
         this.data = data;
         if ((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.dpConfig) === null || _b === void 0 ? void 0 : _b.timezone) {
             this.parseZoneInstance = (...args) => {
-                return tz(args[0], args[1], this.data.dpConfig.timezone);
+                return parseZone(...args).tz(this.data.dpConfig.timezone);
             };
         }
         this.currentMonthNumber = this.parseZoneInstance().month();
@@ -106,7 +106,7 @@ class TzDpContainerComponent {
         }
         const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
         if (maxDate.isValid()) {
-            this.isNextMonthDisabled = maxDate.isSameOrBefore(currentInstance, "month");
+            this.isNextMonthDisabled = maxDate.isBefore(currentInstance, "month");
         }
     }
     navigateMonth(direction) {
@@ -127,24 +127,24 @@ class TzDpContainerComponent {
         var _a;
         let dates = [];
         const daysInMonth = parseZone().year(currentYearNumber).month(month).daysInMonth();
-        for (let currentDate = 1; currentDate <= daysInMonth; currentDate++) {
-            const date = this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate);
+        for (let startDate = 1; startDate <= daysInMonth; startDate++) {
+            const date = parseZone().year(currentYearNumber).month(month).date(startDate);
             const dateString = date.format(this.data.dpConfig.format);
             let isDisabledDay = this.data.datesDisabled.some((d) => d === dateString);
-            const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);
+            const minDate = parseZone(this.data.dpConfig.minDate, this.data.dpConfig.format);
             if (!isDisabledDay && minDate.isValid()) {
                 isDisabledDay = minDate.isAfter(date, "day");
             }
-            const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
+            const maxDate = parseZone(this.data.dpConfig.maxDate, this.data.dpConfig.format);
             if (!isDisabledDay && maxDate.isValid()) {
                 isDisabledDay = maxDate.isBefore(date, "day");
             }
             dates.push({
-                date: currentDate,
+                date: startDate,
                 weekDay: date.day(),
-                isCurrentDay: this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate).format(this.data.dpConfig.format) ===
-                    this.parseZoneInstance().format(this.data.dpConfig.format),
-                isSelectedDay: !isDisabledDay && date.format(this.data.dpConfig.format) === this.data.date,
+                isCurrentDay: this.parseZoneInstance({ year: currentYearNumber, month, date: startDate }).format(this.data.dpConfig.format) ===
+                    parseZone().format(this.data.dpConfig.format),
+                isSelectedDay: date.format(this.data.dpConfig.format) === this.data.date,
                 toastMessage: ((_a = this.data.messages.find((q) => date.format(this.data.dpConfig.format) === q.date)) === null || _a === void 0 ? void 0 : _a.message) || "",
                 isDisabledDay,
             });

package/fesm2015/mis-crystal-design-system-datepicker_v2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mis-crystal-design-system-datepicker_v2.js","sources":["../../../projects/mis-components/datepicker_v2/datepicker-constants.ts","../../../projects/mis-components/datepicker_v2/utils/index.ts","../../../projects/mis-components/datepicker_v2/tz-dp-container/tz-dp-container.component.ts","../../../projects/mis-components/datepicker_v2/tz-datepicker.directive.ts","../../../projects/mis-components/datepicker_v2/datepicker.module.ts","../../../projects/mis-components/datepicker_v2/mis-crystal-design-system-datepicker_v2.ts"],"sourcesContent":["/** @format /\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const CONTAINER_DATA = new InjectionToken<{}>('CONTAINER_DATA');\nexport const DATE_FORMAT = \"DD-MM-YYYY\";","import { ICurrentMonth } from \"../models/dp-config.model\";\n\nexport const getMonth = (index: number): ICurrentMonth => {\n let month;\n switch (index) {\n case 0:\n month = 'January'\n break;\n case 1:\n month = 'February'\n break;\n case 2:\n month = 'March'\n break;\n case 3:\n month = 'April'\n break;\n case 4:\n month = 'May'\n break;\n case 5:\n month = 'June'\n break;\n case 6:\n month = 'July'\n break;\n case 7:\n month = 'August'\n break;\n case 8:\n month = 'September'\n break;\n case 9:\n month = 'October'\n break;\n case 10:\n month = 'November'\n break;\n case 11:\n month = 'December'\n break;\n default:\n break;\n }\n return month;\n}","import { Component, Inject, OnInit } from \"@angular/core\";\nimport { CONTAINER_DATA, DATE_FORMAT } from \"../datepicker-constants\";\nimport { ICurrentMonth, ICurrentMonthDates, IDatePickerData, IWeekDay } from \"../models/dp-config.model\";\nimport { parseZone, Moment, tz } from \"moment-timezone\";\nimport { getMonth } from \"../utils\";\nimport { ToastService } from \"mis-crystal-design-system/toast\";\n\n@Component({\n selector: \"mis-tz-dp\",\n templateUrl: \"./tz-dp-container.component.html\",\n styleUrls: [\"./tz-dp-container.component.scss\"],\n})\nexport class TzDpContainerComponent implements OnInit {\n data: IDatePickerData;\n private parseZoneInstance = (...args) => {\n return parseZone(...args);\n };\n private rawWeekDays: string[] = [\"SUN\", \"MON\", \"TUE\", \"WED\", \"THU\", \"FRI\", \"SAT\"];\n weekDays: IWeekDay[] = [];\n currentMonthNumber: number;\n currentMonth: ICurrentMonth;\n currentYearNumber: number;\n currentMonthDates: ICurrentMonthDates[] = [];\n isPreviousMonthDisabled: boolean = false;\n isNextMonthDisabled: boolean = false;\n\n constructor(@Inject(CONTAINER_DATA) data: IDatePickerData, private toast: ToastService) {\n this.data = data;\n if (this.data?.dpConfig?.timezone) {\n this.parseZoneInstance = (...args) => {\n return tz(args[0], args[1], this.data.dpConfig.timezone);\n };\n }\n this.currentMonthNumber = this.parseZoneInstance().month();\n this.currentMonth = getMonth(this.currentMonthNumber);\n this.currentYearNumber = this.parseZoneInstance().year();\n this.weekDays = this.rawWeekDays.map((day, index) => ({\n label: `${day[0]}${day.slice(1).toLowerCase()}`,\n isCurrentDay: this.parseZoneInstance().day() === index,\n }));\n if (!this.data?.dpConfig?.format) {\n this.data.dpConfig = {\n ...this.data.dpConfig,\n format: DATE_FORMAT,\n };\n }\n }\n\n ngOnInit(): void {\n this.currentDateInstance();\n this.calculateMinMaxDays();\n }\n\n private currentDateInstance(): void {\n const selectedDate = parseZone(this.data.date, this.data.dpConfig.format);\n if (selectedDate.isValid()) {\n this.currentYearNumber = selectedDate.year();\n this.currentMonthNumber = selectedDate.month();\n this.currentMonth = getMonth(this.currentMonthNumber);\n }\n this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);\n }\n\n private calculateMinMaxDays() {\n const currentInstance = this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber);\n const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);\n if (minDate.isValid()) {\n this.isPreviousMonthDisabled = minDate.isSameOrAfter(currentInstance, \"month\");\n }\n const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);\n if (maxDate.isValid()) {\n this.isNextMonthDisabled = maxDate.isSameOrBefore(currentInstance, \"month\");\n }\n }\n\n navigateMonth(direction: \"NEXT\" \| \"PREVIOUS\"): void {\n let thisMonth: Moment = parseZone().year(this.currentYearNumber).month(this.currentMonthNumber);\n if (direction === \"NEXT\") {\n thisMonth = thisMonth.add(1, \"month\");\n } else if (direction === \"PREVIOUS\") {\n thisMonth = thisMonth.subtract(1, \"month\");\n }\n this.currentMonthNumber = thisMonth.month();\n this.currentMonth = getMonth(this.currentMonthNumber);\n this.currentYearNumber = thisMonth.year();\n this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);\n this.calculateMinMaxDays();\n }\n\n private generateDates(month: number, currentYearNumber: number): ICurrentMonthDates[] {\n let dates: ICurrentMonthDates[] = [];\n const daysInMonth = parseZone().year(currentYearNumber).month(month).daysInMonth();\n for (let currentDate = 1; currentDate <= daysInMonth; currentDate++) {\n const date = this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate);\n const dateString = date.format(this.data.dpConfig.format);\n let isDisabledDay = this.data.datesDisabled.some((d) => d === dateString);\n const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);\n if (!isDisabledDay && minDate.isValid()) {\n isDisabledDay = minDate.isAfter(date, \"day\");\n }\n const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);\n if (!isDisabledDay && maxDate.isValid()) {\n isDisabledDay = maxDate.isBefore(date, \"day\");\n }\n dates.push({\n date: currentDate,\n weekDay: date.day(),\n isCurrentDay:\n this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate).format(this.data.dpConfig.format) ===\n this.parseZoneInstance().format(this.data.dpConfig.format),\n isSelectedDay: !isDisabledDay && date.format(this.data.dpConfig.format) === this.data.date,\n toastMessage: this.data.messages.find((q) => date.format(this.data.dpConfig.format) === q.date)?.message \|\| \"\",\n isDisabledDay,\n });\n }\n for (let i = dates[0].weekDay; i > 0; i--) {\n dates.unshift({ date: 0, weekDay: i - 1 });\n }\n return dates;\n }\n\n selectDay(day: ICurrentMonthDates) {\n if (day.date <= 0) return;\n if (!day.isDisabledDay) {\n this.data.dateChange(\n parseZone().year(this.currentYearNumber).month(this.currentMonthNumber).date(day.date).format(this.data.dpConfig.format)\n );\n }\n if (day.toastMessage) {\n this.toast.displayMsg(day.toastMessage, 4000);\n }\n }\n}\n","import { ConnectionPositionPair, Overlay, OverlayConfig, OverlayRef, PositionStrategy } from \"@angular/cdk/overlay\";\nimport { ComponentPortal } from \"@angular/cdk/portal\";\nimport { Directive, ElementRef, EventEmitter, HostListener, Injector, Input, Optional, Output, Self, ViewContainerRef } from \"@angular/core\";\nimport { NgControl } from \"@angular/forms\";\nimport { take } from \"rxjs/operators\";\nimport { CONTAINER_DATA, DATE_FORMAT } from \"./datepicker-constants\";\nimport { IDatePickerConfig, IDatePickerToastText } from \"./models/dp-config.model\";\nimport { TzDpContainerComponent } from './tz-dp-container/tz-dp-container.component';\n\n@Directive({\n selector: \"input[misTzDp]\",\n})\nexport class TzDatepickerDirective {\n @Input() dpConfig: Partial<IDatePickerConfig> = {\n format: DATE_FORMAT,\n minDate: \"\",\n maxDate: \"\"\n };\n // dd-mm-yyyy 01-12-2022\n @Input() set selectedDate(date: string) {\n this.date = date;\n }\n @Input() set datesDisabled(dates: string[]) {\n this.dpDisabledDates = dates;\n }\n @Input() dateMessages: IDatePickerToastText[] = [];\n @Input() positionX: \"start\" \| \"center\" \| \"end\" = \"center\";\n @Input() positionY: \"top\" \| \"center\" \| \"bottom\" = \"bottom\";\n @Input() offsetX:number = 0;\n @Input() offsetY:number = 0;\n private overlayRef: OverlayRef;\n @Output() dateChange = new EventEmitter<string>(true);\n private isOpen = false;\n date: string;\n\n private dpDisabledDates: string[] = [];\n\n constructor(@Self() @Optional() private control: NgControl, private element: ElementRef, private overlay: Overlay, private viewContainerRef: ViewContainerRef) { }\n\n @HostListener(\"click\")\n toggleDatePicker() {\n if (this.isOpen) {\n this.close();\n } else {\n this.open();\n }\n }\n\n private open() {\n this.isOpen = true;\n const positionStrategy = this.overlay\n .position()\n .flexibleConnectedTo(this.element)\n .withPositions(this.genPositionPairs())\n .withPush(true);\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.reposition(),\n backdropClass: \"cdk-overlay-transparent-backdrop\",\n });\n this.overlayRef = this.overlay.create(config);\n const tempRef = new ComponentPortal(TzDpContainerComponent, this.viewContainerRef, Injector.create({\n providers: [\n { provide: CONTAINER_DATA, useValue: { messages: this.dateMessages, date: this.control?.control.value \|\| this.date, dpConfig: this.dpConfig, datesDisabled: this.dpDisabledDates, dateChange: this.applyDate.bind(this) } },\n ]\n }));\n this.overlayRef.attach(tempRef);\n this.overlayRef\n .backdropClick()\n .pipe(take(1))\n .subscribe(() => {\n this.close();\n });\n }\n\n applyDate(date: string) {\n this.dateChange.emit(date);\n this.control?.control.patchValue(date);\n this.date = date;\n this.close();\n }\n\n private close() {\n this.isOpen = false;\n this.overlayRef.detach();\n this.overlayRef.dispose();\n }\n\n private genPositionPairs():ConnectionPositionPair[] {\n return [\n new ConnectionPositionPair(\n { originX: this.positionX, originY: this.positionY },\n { overlayX: this.positionX, overlayY: this.positionY === \"bottom\" ? \"top\" : \"bottom\" },\n this.offsetX,\n this.offsetY\n ),\n new ConnectionPositionPair({ originX: \"center\", originY: \"bottom\" }, { overlayX: \"center\", overlayY: \"top\" }),\n new ConnectionPositionPair({ originX: \"center\", originY: \"top\" }, { overlayX: \"center\", overlayY: \"bottom\" }),\n new ConnectionPositionPair({ originX: \"start\", originY: \"bottom\" }, { overlayX: \"start\", overlayY: \"top\" }),\n new ConnectionPositionPair({ originX: \"start\", originY: \"top\" }, { overlayX: \"start\", overlayY: \"bottom\" }),\n new ConnectionPositionPair({ originX: \"end\", originY: \"bottom\" }, { overlayX: \"end\", overlayY: \"top\" }),\n new ConnectionPositionPair({ originX: \"end\", originY: \"top\" }, { overlayX: \"end\", overlayY: \"bottom\" }),\n ];\n }\n}\n","import { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { TzDpContainerComponent } from \"./tz-dp-container/tz-dp-container.component\";\nimport { TzDatepickerDirective } from \"./tz-datepicker.directive\";\nimport { ToastModule } from 'mis-crystal-design-system/toast';\n@NgModule({\n declarations: [TzDpContainerComponent, TzDatepickerDirective],\n imports: [CommonModule, ToastModule.forRoot()],\n exports: [TzDpContainerComponent, TzDatepickerDirective],\n entryComponents: [TzDpContainerComponent]\n})\nexport class DatepickerModuleV2 {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n\nexport {CONTAINER_DATA as ɵc} from './datepicker-constants';\nexport {IDatePickerData as ɵa} from './models/dp-config.model';\nexport {TzDpContainerComponent as ɵb} from './tz-dp-container/tz-dp-container.component';"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"mis-crystal-design-system-datepicker_v2.js","sources":["../../../projects/mis-components/datepicker_v2/datepicker-constants.ts","../../../projects/mis-components/datepicker_v2/utils/index.ts","../../../projects/mis-components/datepicker_v2/tz-dp-container/tz-dp-container.component.ts","../../../projects/mis-components/datepicker_v2/tz-datepicker.directive.ts","../../../projects/mis-components/datepicker_v2/datepicker.module.ts","../../../projects/mis-components/datepicker_v2/mis-crystal-design-system-datepicker_v2.ts"],"sourcesContent":["/** @format /\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const CONTAINER_DATA = new InjectionToken<{}>('CONTAINER_DATA');\nexport const DATE_FORMAT = \"DD-MM-YYYY\";","import { ICurrentMonth } from \"../models/dp-config.model\";\n\nexport const getMonth = (index: number): ICurrentMonth => {\n let month;\n switch (index) {\n case 0:\n month = 'January'\n break;\n case 1:\n month = 'February'\n break;\n case 2:\n month = 'March'\n break;\n case 3:\n month = 'April'\n break;\n case 4:\n month = 'May'\n break;\n case 5:\n month = 'June'\n break;\n case 6:\n month = 'July'\n break;\n case 7:\n month = 'August'\n break;\n case 8:\n month = 'September'\n break;\n case 9:\n month = 'October'\n break;\n case 10:\n month = 'November'\n break;\n case 11:\n month = 'December'\n break;\n default:\n break;\n }\n return month;\n}","import { Component, Inject, OnInit } from \"@angular/core\";\nimport { CONTAINER_DATA, DATE_FORMAT } from \"../datepicker-constants\";\nimport { ICurrentMonth, ICurrentMonthDates, IDatePickerData, IWeekDay } from \"../models/dp-config.model\";\nimport { parseZone, Moment, tz } from \"moment-timezone\";\nimport { getMonth } from \"../utils\";\nimport { ToastService } from \"mis-crystal-design-system/toast\";\n\n@Component({\n selector: \"mis-tz-dp\",\n templateUrl: \"./tz-dp-container.component.html\",\n styleUrls: [\"./tz-dp-container.component.scss\"],\n})\nexport class TzDpContainerComponent implements OnInit {\n data: IDatePickerData;\n private parseZoneInstance = (...args) => {\n return parseZone(...args);\n };\n private rawWeekDays: string[] = [\"SUN\", \"MON\", \"TUE\", \"WED\", \"THU\", \"FRI\", \"SAT\"];\n weekDays: IWeekDay[] = [];\n currentMonthNumber: number;\n currentMonth: ICurrentMonth;\n currentYearNumber: number;\n currentMonthDates: ICurrentMonthDates[] = [];\n isPreviousMonthDisabled: boolean = false;\n isNextMonthDisabled: boolean = false;\n\n constructor(@Inject(CONTAINER_DATA) data: IDatePickerData, private toast: ToastService) {\n this.data = data;\n if (this.data?.dpConfig?.timezone) {\n this.parseZoneInstance = (...args) => {\n return parseZone(...args).tz(this.data.dpConfig.timezone);\n };\n }\n this.currentMonthNumber = this.parseZoneInstance().month();\n this.currentMonth = getMonth(this.currentMonthNumber);\n this.currentYearNumber = this.parseZoneInstance().year();\n this.weekDays = this.rawWeekDays.map((day, index) => ({\n label: `${day[0]}${day.slice(1).toLowerCase()}`,\n isCurrentDay: this.parseZoneInstance().day() === index,\n }));\n if (!this.data?.dpConfig?.format) {\n this.data.dpConfig = {\n ...this.data.dpConfig,\n format: DATE_FORMAT,\n };\n }\n }\n\n ngOnInit(): void {\n this.currentDateInstance();\n this.calculateMinMaxDays();\n }\n\n private currentDateInstance(): void {\n const selectedDate = parseZone(this.data.date, this.data.dpConfig.format);\n if (selectedDate.isValid()) {\n this.currentYearNumber = selectedDate.year();\n this.currentMonthNumber = selectedDate.month();\n this.currentMonth = getMonth(this.currentMonthNumber);\n }\n this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);\n }\n\n private calculateMinMaxDays() {\n const currentInstance = this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber);\n const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);\n if (minDate.isValid()) {\n this.isPreviousMonthDisabled = minDate.isSameOrAfter(currentInstance, \"month\");\n }\n const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);\n if (maxDate.isValid()) {\n this.isNextMonthDisabled = maxDate.isBefore(currentInstance, \"month\");\n }\n }\n\n navigateMonth(direction: \"NEXT\" \| \"PREVIOUS\"): void {\n let thisMonth: Moment = parseZone().year(this.currentYearNumber).month(this.currentMonthNumber);\n if (direction === \"NEXT\") {\n thisMonth = thisMonth.add(1, \"month\");\n } else if (direction === \"PREVIOUS\") {\n thisMonth = thisMonth.subtract(1, \"month\");\n }\n this.currentMonthNumber = thisMonth.month();\n this.currentMonth = getMonth(this.currentMonthNumber);\n this.currentYearNumber = thisMonth.year();\n this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);\n this.calculateMinMaxDays();\n }\n\n private generateDates(month: number, currentYearNumber: number): ICurrentMonthDates[] {\n let dates: ICurrentMonthDates[] = [];\n const daysInMonth = parseZone().year(currentYearNumber).month(month).daysInMonth();\n for (let startDate = 1; startDate <= daysInMonth; startDate++) {\n const date = parseZone().year(currentYearNumber).month(month).date(startDate);\n const dateString = date.format(this.data.dpConfig.format);\n let isDisabledDay = this.data.datesDisabled.some((d) => d === dateString);\n const minDate = parseZone(this.data.dpConfig.minDate, this.data.dpConfig.format);\n if (!isDisabledDay && minDate.isValid()) {\n isDisabledDay = minDate.isAfter(date, \"day\");\n }\n const maxDate = parseZone(this.data.dpConfig.maxDate, this.data.dpConfig.format);\n if (!isDisabledDay && maxDate.isValid()) {\n isDisabledDay = maxDate.isBefore(date, \"day\");\n }\n dates.push({\n date: startDate,\n weekDay: date.day(),\n isCurrentDay:\n this.parseZoneInstance({ year: currentYearNumber, month, date: startDate }).format(this.data.dpConfig.format) ===\n parseZone().format(this.data.dpConfig.format),\n isSelectedDay: date.format(this.data.dpConfig.format) === this.data.date,\n toastMessage: this.data.messages.find((q) => date.format(this.data.dpConfig.format) === q.date)?.message \|\| \"\",\n isDisabledDay,\n });\n }\n for (let i = dates[0].weekDay; i > 0; i--) {\n dates.unshift({ date: 0, weekDay: i - 1 });\n }\n return dates;\n }\n\n selectDay(day: ICurrentMonthDates) {\n if (day.date <= 0) return;\n if (!day.isDisabledDay) {\n this.data.dateChange(\n parseZone().year(this.currentYearNumber).month(this.currentMonthNumber).date(day.date).format(this.data.dpConfig.format)\n );\n }\n if (day.toastMessage) {\n this.toast.displayMsg(day.toastMessage, 4000);\n }\n }\n}\n","import { ConnectionPositionPair, Overlay, OverlayConfig, OverlayRef, PositionStrategy } from \"@angular/cdk/overlay\";\nimport { ComponentPortal } from \"@angular/cdk/portal\";\nimport { Directive, ElementRef, EventEmitter, HostListener, Injector, Input, Optional, Output, Self, ViewContainerRef } from \"@angular/core\";\nimport { NgControl } from \"@angular/forms\";\nimport { take } from \"rxjs/operators\";\nimport { CONTAINER_DATA, DATE_FORMAT } from \"./datepicker-constants\";\nimport { IDatePickerConfig, IDatePickerToastText } from \"./models/dp-config.model\";\nimport { TzDpContainerComponent } from './tz-dp-container/tz-dp-container.component';\n\n@Directive({\n selector: \"input[misTzDp]\",\n})\nexport class TzDatepickerDirective {\n @Input() dpConfig: Partial<IDatePickerConfig> = {\n format: DATE_FORMAT,\n minDate: \"\",\n maxDate: \"\"\n };\n // dd-mm-yyyy 01-12-2022\n @Input() set selectedDate(date: string) {\n this.date = date;\n }\n @Input() set datesDisabled(dates: string[]) {\n this.dpDisabledDates = dates;\n }\n @Input() dateMessages: IDatePickerToastText[] = [];\n @Input() positionX: \"start\" \| \"center\" \| \"end\" = \"center\";\n @Input() positionY: \"top\" \| \"center\" \| \"bottom\" = \"bottom\";\n @Input() offsetX:number = 0;\n @Input() offsetY:number = 0;\n private overlayRef: OverlayRef;\n @Output() dateChange = new EventEmitter<string>(true);\n private isOpen = false;\n date: string;\n\n private dpDisabledDates: string[] = [];\n\n constructor(@Self() @Optional() private control: NgControl, private element: ElementRef, private overlay: Overlay, private viewContainerRef: ViewContainerRef) { }\n\n @HostListener(\"click\")\n toggleDatePicker() {\n if (this.isOpen) {\n this.close();\n } else {\n this.open();\n }\n }\n\n private open() {\n this.isOpen = true;\n const positionStrategy = this.overlay\n .position()\n .flexibleConnectedTo(this.element)\n .withPositions(this.genPositionPairs())\n .withPush(true);\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.reposition(),\n backdropClass: \"cdk-overlay-transparent-backdrop\",\n });\n this.overlayRef = this.overlay.create(config);\n const tempRef = new ComponentPortal(TzDpContainerComponent, this.viewContainerRef, Injector.create({\n providers: [\n { provide: CONTAINER_DATA, useValue: { messages: this.dateMessages, date: this.control?.control.value \|\| this.date, dpConfig: this.dpConfig, datesDisabled: this.dpDisabledDates, dateChange: this.applyDate.bind(this) } },\n ]\n }));\n this.overlayRef.attach(tempRef);\n this.overlayRef\n .backdropClick()\n .pipe(take(1))\n .subscribe(() => {\n this.close();\n });\n }\n\n applyDate(date: string) {\n this.dateChange.emit(date);\n this.control?.control.patchValue(date);\n this.date = date;\n this.close();\n }\n\n private close() {\n this.isOpen = false;\n this.overlayRef.detach();\n this.overlayRef.dispose();\n }\n\n private genPositionPairs():ConnectionPositionPair[] {\n return [\n new ConnectionPositionPair(\n { originX: this.positionX, originY: this.positionY },\n { overlayX: this.positionX, overlayY: this.positionY === \"bottom\" ? \"top\" : \"bottom\" },\n this.offsetX,\n this.offsetY\n ),\n new ConnectionPositionPair({ originX: \"center\", originY: \"bottom\" }, { overlayX: \"center\", overlayY: \"top\" }),\n new ConnectionPositionPair({ originX: \"center\", originY: \"top\" }, { overlayX: \"center\", overlayY: \"bottom\" }),\n new ConnectionPositionPair({ originX: \"start\", originY: \"bottom\" }, { overlayX: \"start\", overlayY: \"top\" }),\n new ConnectionPositionPair({ originX: \"start\", originY: \"top\" }, { overlayX: \"start\", overlayY: \"bottom\" }),\n new ConnectionPositionPair({ originX: \"end\", originY: \"bottom\" }, { overlayX: \"end\", overlayY: \"top\" }),\n new ConnectionPositionPair({ originX: \"end\", originY: \"top\" }, { overlayX: \"end\", overlayY: \"bottom\" }),\n ];\n }\n}\n","import { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { TzDpContainerComponent } from \"./tz-dp-container/tz-dp-container.component\";\nimport { TzDatepickerDirective } from \"./tz-datepicker.directive\";\nimport { ToastModule } from 'mis-crystal-design-system/toast';\n@NgModule({\n declarations: [TzDpContainerComponent, TzDatepickerDirective],\n imports: [CommonModule, ToastModule.forRoot()],\n exports: [TzDpContainerComponent, TzDatepickerDirective],\n entryComponents: [TzDpContainerComponent]\n})\nexport class DatepickerModuleV2 {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n\nexport {CONTAINER_DATA as ɵc} from './datepicker-constants';\nexport {IDatePickerData as ɵa} from './models/dp-config.model';\nexport {TzDpContainerComponent as ɵb} from './tz-dp-container/tz-dp-container.component';"],"names":[],"mappings":"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"}

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

@@ -8,26 +8,31 @@ import { ButtonModule } from 'mis-crystal-design-system/button';
 class MultiSelectDropdownComponent {
     constructor(eRef) {
         this.eRef = eRef;
-        this.searchInput = '';
+        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.SELECT_ALL_ENUM = "SELECT_ALL_ENABLED";
+        this.label = "Select";
+        this.height = "";
+        this.width = "";
+        this.dropdownListHeight = "";
+        this.dropdownListWidth = "";
+        this.dropdownListPosition = "Left";
+        this.enableSelectAll = false;
         this.searchEnabled = true;
         this.showSelectedCount = false;
-        this.noDataMessage = 'No Data';
+        this.noDataMessage = "No Data";
+        this.options = {
+            sortLabels: true,
+        };
         this.hideApplyButton = false;
         this.onChange = new EventEmitter();
         this.isSearchInputFocused = false;
     }
     set data(values) {
-        this.localData = values.map(item => {
+        this.localData = values.map((item) => {
             return Object.assign(Object.assign({}, item), { checked: false });
         });
     }
@@ -43,8 +48,8 @@ class MultiSelectDropdownComponent {
     ngOnInit() { }
     handlerSetLocalSelectedItems(values) {
         this.localSelectedItems = values;
-        this.localData = this.localData.map(item => {
-            if (values.some(base => base.value === item.value)) {
+        this.localData = this.localData.map((item) => {
+            if (values.some((base) => base.value === item.value)) {
                 return Object.assign(Object.assign({}, item), { checked: true });
             }
             else {
@@ -57,7 +62,7 @@ class MultiSelectDropdownComponent {
     }
     searchInputCanceled(event) {
         event.stopPropagation();
-        this.searchInput = '';
+        this.searchInput = "";
         this.isSearchInputFocused = false;
     }
     toggleDropdown() {
@@ -68,7 +73,7 @@ class MultiSelectDropdownComponent {
         }
     }
     filterByValue(array, string) {
-        return array.filter(o => o.label.toLowerCase().includes(string.toLowerCase()));
+        return array.filter((o) => o.label.toLowerCase().includes(string.toLowerCase()));
     }
     searchInputOnChange(newValue) {
         this.searchInput = newValue;
@@ -77,39 +82,69 @@ class MultiSelectDropdownComponent {
         }
         else {
             this.searchData = [];
-            this.searchInput = '';
+            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];
+        let sortedArray = array;
+        if (this.options.sortLabels) {
+            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);
+            sortedArray = [...checkedValues, ...unCheckedValues].filter((t) => t.value !== this.SELECT_ALL_ENUM);
+        }
+        if (!sortedArray.some((option) => option.value === this.SELECT_ALL_ENUM) &&
+            this.enableSelectAll &&
+            sortedArray.length > 0) {
+            sortedArray.unshift({
+                label: "Select all",
+                value: this.SELECT_ALL_ENUM,
+                checked: sortedArray.every((y) => y.checked),
+            });
+        }
+        return sortedArray;
     }
     toggleSelectedItems(event, item) {
         event.stopPropagation();
+        if (this.enableSelectAll && item.value === this.SELECT_ALL_ENUM) {
+            this.localData = this.localData.map((t) => (Object.assign(Object.assign({}, t), { checked: !item.checked })));
+            return;
+        }
         if (item.checked) {
             this.localData = [
-                ...this.localData.map(a => {
-                    if (a.value === item.value) {
+                ...this.localData.map((a) => {
+                    if (a.value === item.value || a.value === this.SELECT_ALL_ENUM) {
                         return Object.assign(Object.assign({}, a), { checked: false });
                     }
                     return a;
-                })
+                }),
             ];
         }
         else {
             this.localData = [
-                ...this.localData.map(a => {
+                ...this.localData.map((a) => {
                     if (a.value === item.value) {
                         return Object.assign(Object.assign({}, a), { checked: true });
                     }
                     return a;
-                })
+                }),
             ];
+            if (this.enableSelectAll &&
+                this.localData
+                    .filter((r) => r.value !== this.SELECT_ALL_ENUM)
+                    .every((t) => t.checked)) {
+                this.localData = [
+                    ...this.localData.map((a) => {
+                        if (a.value === this.SELECT_ALL_ENUM) {
+                            return Object.assign(Object.assign({}, a), { checked: true });
+                        }
+                        return a;
+                    }),
+                ];
+            }
         }
         if (this.searchEnabled) {
             this.searchInputOnChange(this.searchInput);
@@ -120,10 +155,10 @@ class MultiSelectDropdownComponent {
     }
     applyFilters() {
         this.onChange.emit(this.localData
-            .filter(a => {
-            return a.checked;
+            .filter((a) => {
+            return a.checked && a.value !== this.SELECT_ALL_ENUM;
         })
-            .map(item => {
+            .map((item) => {
             const { checked } = item, data = __rest(item, ["checked"]);
             return data;
         }));
@@ -135,12 +170,12 @@ class MultiSelectDropdownComponent {
         this.isSearchInputFocused = false;
         this.onChange.emit([]);
         this.isOpen = false;
-        this.searchInput = '';
+        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))) {
+        this.localData = this.localData.map((a) => {
+            if (this.localSelectedItems.some((b) => b.value === a.value && String(b.checked) !== String(a.checked))) {
                 return a;
             }
             else {
@@ -148,12 +183,12 @@ class MultiSelectDropdownComponent {
             }
         });
         this.isOpen = false;
-        this.searchInput = '';
+        this.searchInput = "";
     }
 }
 MultiSelectDropdownComponent.decorators = [
     { type: Component, args: [{
-                selector: 'mis-multi-select-dropdown',
+                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 && !hideApplyButton\" 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}"]
             },] }
@@ -169,13 +204,15 @@ MultiSelectDropdownComponent.propDecorators = {
     dropdownListHeight: [{ type: Input }],
     dropdownListWidth: [{ type: Input }],
     dropdownListPosition: [{ type: Input }],
+    enableSelectAll: [{ type: Input }],
     searchEnabled: [{ type: Input }],
     showSelectedCount: [{ type: Input }],
     noDataMessage: [{ type: Input }],
+    options: [{ type: Input }],
     selectedItems: [{ type: Input }],
     hideApplyButton: [{ type: Input }],
     onChange: [{ type: Output }],
-    clickout: [{ type: HostListener, args: ['document:click', ['$event'],] }]
+    clickout: [{ type: HostListener, args: ["document:click", ["$event"],] }]
 };
 class MultiSelectDropdownModule {

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

	@@ -1 +1 @@
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 @Input() hideApplyButton: boolean = false;\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 if (this.hideApplyButton) {\n this.applyFilters();\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 \n if (!this.hideApplyButton) {\n this.onCancel();\n }\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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"}
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 searchInput: string = \"\";\n isOpen = false;\n localSelectedItems: MultiSelectDropdownItem[] = [];\n localData: MultiSelectDropdownItem[] = [];\n searchData: MultiSelectDropdownItem[] = [];\n SELECT_ALL_ENUM = \"SELECT_ALL_ENABLED\";\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 @Input() dropdownListHeight: string = \"\";\n @Input() dropdownListWidth: string = \"\";\n @Input() dropdownListPosition: \"Left\" \| \"Right\" = \"Left\";\n @Input() enableSelectAll: boolean = false;\n @Input() searchEnabled: boolean = true;\n @Input() showSelectedCount: boolean = false;\n @Input() noDataMessage: string = \"No Data\";\n @Input() options: OPTIONS = {\n sortLabels: true,\n };\n @Input() set selectedItems(values: MultiSelectDropdownItem[]) {\n this.handlerSetLocalSelectedItems(values);\n }\n @Input() hideApplyButton: boolean = false;\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 let sortedArray = array;\n if (this.options.sortLabels) {\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 sortedArray = [...checkedValues, ...unCheckedValues].filter(\n (t) => t.value !== this.SELECT_ALL_ENUM\n );\n }\n if (\n !sortedArray.some((option) => option.value === this.SELECT_ALL_ENUM) &&\n this.enableSelectAll &&\n sortedArray.length > 0\n ) {\n sortedArray.unshift({\n label: \"Select all\",\n value: this.SELECT_ALL_ENUM,\n checked: sortedArray.every((y) => y.checked),\n });\n }\n return sortedArray;\n }\n toggleSelectedItems(event, item: MultiSelectDropdownItem) {\n event.stopPropagation();\n if (this.enableSelectAll && item.value === this.SELECT_ALL_ENUM) {\n this.localData = this.localData.map((t) => ({\n ...t,\n checked: !item.checked,\n }));\n return;\n }\n if (item.checked) {\n this.localData = [\n ...this.localData.map((a) => {\n if (a.value === item.value \|\| a.value === this.SELECT_ALL_ENUM) {\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 if (\n this.enableSelectAll &&\n this.localData\n .filter((r) => r.value !== this.SELECT_ALL_ENUM)\n .every((t) => t.checked)\n ) {\n this.localData = [\n ...this.localData.map((a) => {\n if (a.value === this.SELECT_ALL_ENUM) {\n return {\n ...a,\n checked: true,\n };\n }\n return a;\n }),\n ];\n }\n }\n if (this.searchEnabled) {\n this.searchInputOnChange(this.searchInput);\n }\n if (this.hideApplyButton) {\n this.applyFilters();\n }\n }\n applyFilters() {\n this.onChange.emit(\n this.localData\n .filter((a) => {\n return a.checked && a.value !== this.SELECT_ALL_ENUM;\n })\n .map((item) => {\n const { checked, ...data } = item;\n return data;\n })\n );\n\n if (!this.hideApplyButton) {\n this.onCancel();\n }\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\nexport interface OPTIONS {\n sortLabels: boolean;\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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"}

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

	@@ -1 +1 @@
1	- {"__symbolic":"module","version":4,"metadata":{"MultiSelectDropdownComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"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 && !hideApplyButton\" 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}"]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":5}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":5}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":5}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":5}}]}],"dropdownListHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":5}}]}],"dropdownListWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":5}}]}],"dropdownListPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":5}}]}],"searchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":5}}]}],"showSelectedCount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":5}}]}],"noDataMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":5}}]}],"selectedItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":5}}]}],"hideApplyButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":5}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":44,"character":5}}]}],"clickout":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":46,"character":5},"arguments":["document:click",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":53,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"handlerSetLocalSelectedItems":[{"__symbolic":"method"}],"searchInputFocused":[{"__symbolic":"method"}],"searchInputCanceled":[{"__symbolic":"method"}],"toggleDropdown":[{"__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":7,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MultiSelectDropdownComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":14},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":9,"character":28},{"__symbolic":"reference","module":"mis-crystal-design-system/checkbox","name":"CheckboxModule","line":9,"character":41},{"__symbolic":"reference","module":"mis-crystal-design-system/button","name":"ButtonModule","line":9,"character":57}],"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"}
1	+ {"__symbolic":"module","version":4,"metadata":{"MultiSelectDropdownComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"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 && !hideApplyButton\" 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}"]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"dropdownListHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"dropdownListWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}}]}],"dropdownListPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"enableSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"searchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"showSelectedCount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"noDataMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"selectedItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"hideApplyButton":[{"__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":45,"character":3}}]}],"clickout":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":47,"character":3},"arguments":["document:click",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":54,"character":28}]}],"ngOnInit":[{"__symbolic":"method"}],"handlerSetLocalSelectedItems":[{"__symbolic":"method"}],"searchInputFocused":[{"__symbolic":"method"}],"searchInputCanceled":[{"__symbolic":"method"}],"toggleDropdown":[{"__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":7,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MultiSelectDropdownComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":14},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":9,"character":28},{"__symbolic":"reference","module":"mis-crystal-design-system/checkbox","name":"CheckboxModule","line":9,"character":41},{"__symbolic":"reference","module":"mis-crystal-design-system/button","name":"ButtonModule","line":9,"character":57}],"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 CHANGED Viewed

@@ -1,4 +1,4 @@
-import { ElementRef, EventEmitter, OnInit } from '@angular/core';
+import { ElementRef, EventEmitter, OnInit } from "@angular/core";
 export declare class MultiSelectDropdownComponent implements OnInit {
     private eRef;
     searchInput: string;
@@ -6,16 +6,19 @@ export declare class MultiSelectDropdownComponent implements OnInit {
     localSelectedItems: MultiSelectDropdownItem[];
     localData: MultiSelectDropdownItem[];
     searchData: MultiSelectDropdownItem[];
+    SELECT_ALL_ENUM: string;
     set data(values: MultiSelectDropdownItem[]);
     label: string;
     height: string;
     width: string;
     dropdownListHeight: string;
     dropdownListWidth: string;
-    dropdownListPosition: 'Left' | 'Right';
+    dropdownListPosition: "Left" | "Right";
+    enableSelectAll: boolean;
     searchEnabled: boolean;
     showSelectedCount: boolean;
     noDataMessage: string;
+    options: OPTIONS;
     set selectedItems(values: MultiSelectDropdownItem[]);
     hideApplyButton: boolean;
     onChange: EventEmitter<any>;
@@ -41,3 +44,6 @@ export interface MultiSelectDropdownItem {
     checked?: boolean;
     icon?: string;
 }
+export interface OPTIONS {
+    sortLabels: boolean;
+}