npm - mis-crystal-design-system - Versions diffs - 4.0.44 → 4.0.46-test-1 - Mend

mis-crystal-design-system 4.0.44 → 4.0.46-test-1

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

Files changed (26) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"mis-crystal-design-system-timerangepicker.js","sources":["../../../projects/mis-components/timerangepicker/timerangepicker.component.ts","../../../projects/mis-components/timerangepicker/timerangepicker.module.ts","../../../projects/mis-components/timerangepicker/mis-crystal-design-system-timerangepicker.ts"],"sourcesContent":["import { Component, Input, ChangeDetectorRef, Output, EventEmitter } from \"@angular/core\";\nimport * as moment from \"moment-timezone\";\nimport { ITimeRange, ITime, TDirection } from \"./timerange.namespace\";\n\n@Component({\n selector: \"mis-timerangepicker\",\n templateUrl: \"./timerangepicker.component.html\",\n styleUrls: [\"./timerangepicker.component.scss\"]\n})\nexport class TimeRangePickerComponent {\n @Input() inputWidth: string = \"100px\";\n @Input() dropdownWidth?: string;\n @Input() height: string = \"46px\";\n @Input() timezone: string = \"Asia/Kolkata\";\n @Input() startDateEpoch: number = moment().tz(this.timezone).valueOf();\n @Input() endDateEpoch: number = moment().tz(this.timezone).valueOf();\n @Input() givenStartTime: number;\n @Input() givenEndTime: number;\n @Input() clockFormat: number = 12;\n @Input() interval: number = 15;\n @Input() showTooltip: boolean = true;\n @Input() direction: TDirection = 'row';\n @Input() gap: string = '1rem';\n\n @Output() timeRangeEmitter = new EventEmitter<ITimeRange>();\n\n startDate!: string;\n endDate!: string;\n currDate!: string;\n timeFormat!: string;\n firstIntervalForStartPicker: number = moment().valueOf();\n firstIntervalForEndPicker: number = moment().valueOf();\n startTime!: ITime;\n endTime!: ITime;\n rangeValidity: boolean = true;\n triggerChange: boolean = true;\n\n constructor(private cdr: ChangeDetectorRef) {}\n\n ngOnInit() {}\n\n ngOnChanges() {\n this.timeFormat = this.clockFormat === 12 ? \"hh:mm a\" : \"HH:mm\";\n moment.tz.setDefault(this.timezone);\n this.startDate = moment(this.startDateEpoch).format(\"DD-MM-YYYY\");\n this.endDate = moment(this.endDateEpoch).format(\"DD-MM-YYYY\");\n this.currDate = moment().format(\"DD-MM-YYYY\");\n this.setFirstIntervals();\n }\n\n // calculate the first interval of the picker\n setFirstIntervals(): void {\n const minutes = moment().minutes();\n const offset = this.interval - (minutes % this.interval);\n\n // start date, 22 MAY === current date, 22 MAY\n if( this.startDate === this.currDate ){\n const currentTime = moment(this.startDateEpoch).valueOf();\n\n // start date, 22 MAY === current date, 22 MAY === end date, 22 MAY\n if(this.startDate === this.endDate){\n\n // current time is in last interval\n if( currentTime >= moment(this.startDateEpoch).endOf(\"d\").subtract(this.interval,\"m\").valueOf()){\n this.firstIntervalForStartPicker = currentTime;\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).endOf(\"d\").valueOf();\n }\n // current time isn't in last interval\n else {\n this.firstIntervalForStartPicker = moment().add(offset, \"m\").valueOf();\n this.firstIntervalForEndPicker = moment().add(offset, \"m\").add(this.interval, \"m\").valueOf();\n }\n } \n // start date, 22 MAY === current date, 22 MAY !== end date, 30 MAY\n else {\n // current time is in last interval\n if( currentTime >= moment(this.startDateEpoch).endOf(\"d\").subtract(this.interval,\"m\").valueOf()){\n this.firstIntervalForStartPicker = currentTime;\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).endOf(\"d\").valueOf();\n }\n // current time isn't in last interval\n else {\n this.firstIntervalForStartPicker = moment().add(offset, \"m\").valueOf();\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).valueOf();\n }\n }\n }\n // start date, 30 MAY !== current date, 22 MAY\n else {\n // start date === end Date\n if( this.startDate === this.endDate){\n this.firstIntervalForStartPicker = moment(this.startDateEpoch).startOf(\"d\").valueOf();\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).add(this.interval, \"m\").valueOf();\n } \n // start date !== end date\n else {\n this.firstIntervalForStartPicker = moment(this.startDateEpoch).startOf(\"d\").valueOf();\n this.firstIntervalForEndPicker = moment(this.startDateEpoch).startOf(\"d\").valueOf();\n }\n\n }\n\n if(this.givenStartTime)\n this.firstIntervalForStartPicker = this.givenStartTime;\n \n if(this.givenEndTime)\n this.firstIntervalForEndPicker = this.givenEndTime;\n \n this.startTime = {\n valid: true,\n time: moment(this.firstIntervalForStartPicker).format(this.timeFormat),\n epoch: moment(this.firstIntervalForStartPicker).valueOf()\n };\n\n this.endTime = {\n valid: true,\n time: moment(this.firstIntervalForEndPicker).format(this.timeFormat),\n epoch: moment(this.firstIntervalForEndPicker).valueOf()\n };\n }\n\n emitTimeRange(data: ITimeRange): void {\n this.timeRangeEmitter.emit(data);\n }\n\n //handlers catch the emitted values and run validation\n startPickerHandler(time: ITime): void {\n this.startTime = time;\n this.rangeValidity = true;\n // if the start time changes and the start date is the same as the end date\n // and the start time >= end time\n // update the first interval of end picker according to the time set in start picker\n if (this.startDate === this.endDate) {\n let minutes = moment(this.startTime.time, this.timeFormat).minutes();\n let offset = this.interval - (minutes % this.interval);\n this.firstIntervalForEndPicker = moment(`${this.startDate} ${this.startTime.time}`, `'DD-MM-YYYY' ${this.timeFormat}`)\n .add(offset, \"m\")\n .valueOf();\n\n // if the first interval == 12:00am, set it as 11:59pm\n const intervalAsString = moment(this.firstIntervalForEndPicker).format(this.timeFormat);\n const endOfDayAsString = moment(moment(`${this.startDate}`, `DD-MM-YYYY ${this.timeFormat}`).endOf(\"d\").add(1, \"m\")).format(this.timeFormat);\n if (intervalAsString === endOfDayAsString) {\n this.firstIntervalForEndPicker = moment(`${this.startDate} ${this.startTime.time}`, `'DD-MM-YYYY' ${this.timeFormat}`).endOf(\"d\").valueOf();\n }\n\n } else {\n const validity =\n this.checkTimeValidity(this.startTime.time.trim(), this.startDateEpoch) &&\n this.checkTimeValidity(this.endTime.time.trim(), this.endDateEpoch);\n\n this.rangeValidation(validity);\n this.emitTimeRange({\n valid: validity && this.rangeValidity,\n startTime: this.startTime.time,\n endTime: this.endTime.time,\n startEpoch: moment(`${this.startDate} ${this.startTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf(),\n endEpoch: moment(`${this.endDate} ${this.endTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf()\n });\n }\n\n this.triggerChange = !this.triggerChange;\n }\n\n endPickerHandler(time: ITime): void {\n this.endTime = time;\n\n const validity =\n this.checkTimeValidity(this.startTime.time.trim(), this.startDateEpoch) && this.checkTimeValidity(this.endTime.time.trim(), this.endDateEpoch);\n\n this.rangeValidation(validity);\n this.emitTimeRange({\n valid: validity && this.rangeValidity,\n startTime: this.startTime.time,\n endTime: this.endTime.time,\n startEpoch: moment(`${this.startDate} ${this.startTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf(),\n endEpoch: moment(`${this.endDate} ${this.endTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf()\n });\n }\n\n checkTimeValidity(time: string, date: number): boolean {\n const RE12 = /^(([0][1-9]\|1[0-2]):([0-5][0-9])( )?(am\|pm\|AM\|PM))$/i;\n const RE24 = /^([01][0-9]\|2[0-3]):[0-5][0-9]$/;\n const RE = this.clockFormat === 12 ? RE12 : RE24;\n\n const timeMoment = moment(`${moment(date).format(\"DD-MM-YYYY\")} ${time}`, `'DD-MM-YYYY' ${this.timeFormat}`);\n let flag: boolean = false;\n\n // if the first interval is set to the start of the day\n // then we don't check its validity against the current time\n if ((this.givenStartTime && this.givenEndTime) \|\| (this.startDate !== this.endDate && this.startDate !== this.currDate)) {\n flag = time.match(RE) ? true : false;\n } else {\n flag = time.match(RE) && timeMoment.diff(moment(), \"m\") >= 0 ? true : false;\n }\n\n return flag;\n }\n\n // validates end picker's input according to the start picker's input\n rangeValidation(validity: boolean) {\n if (validity && this.startDate === this.endDate) {\n const startMoment = moment(this.startTime.time, this.timeFormat);\n const endMoment = moment(this.endTime.time, this.timeFormat);\n this.rangeValidity = endMoment.diff(startMoment, \"m\") >= 1 ? true : false;\n this.cdr.detectChanges();\n }\n }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { TimeRangePickerComponent } from \"./timerangepicker.component\";\nimport { TimePickerModule } from \"mis-crystal-design-system/timepicker\";\n\n@NgModule({\n declarations: [TimeRangePickerComponent],\n imports: [CommonModule, FormsModule, TimePickerModule],\n exports: [TimeRangePickerComponent]\n})\nexport class TimeRangePickerModule {\n static forRoot(): ModuleWithProviders<TimeRangePickerModule> {\n return { ngModule: TimeRangePickerModule, providers: [] };\n }\n}","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["moment.tz"],"mappings":";;;;;;;MASa,wBAAwB;IA4BnC,YAAoB,GAAsB;QAAtB,QAAG,GAAH,GAAG,CAAmB;QA3BjC,eAAU,GAAW,OAAO,CAAC;QAE7B,WAAM,GAAW,MAAM,CAAC;QACxB,aAAQ,GAAW,cAAc,CAAC;QAClC,mBAAc,GAAW,MAAM,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,EAAE,CAAC;QAC9D,iBAAY,GAAW,MAAM,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,EAAE,CAAC;QAG5D,gBAAW,GAAW,EAAE,CAAC;QACzB,aAAQ,GAAW,EAAE,CAAC;QACtB,gBAAW,GAAY,IAAI,CAAC;QAC5B,cAAS,GAAe,KAAK,CAAC;QAC9B,QAAG,GAAW,MAAM,CAAC;QAEpB,qBAAgB,GAAG,IAAI,YAAY,EAAc,CAAC;QAM5D,gCAA2B,GAAW,MAAM,EAAE,CAAC,OAAO,EAAE,CAAC;QACzD,8BAAyB,GAAW,MAAM,EAAE,CAAC,OAAO,EAAE,CAAC;QAGvD,kBAAa,GAAY,IAAI,CAAC;QAC9B,kBAAa,GAAY,IAAI,CAAC;KAEgB;IAE9C,QAAQ,MAAK;IAEb,WAAW;QACT,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,KAAK,EAAE,GAAG,SAAS,GAAG,OAAO,CAAC;QAChEA,EAAS,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACpC,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;QAClE,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;QAC9D,IAAI,CAAC,QAAQ,GAAG,MAAM,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;QAC9C,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;;IAGD,iBAAiB;QACf,MAAM,OAAO,GAAG,MAAM,EAAE,CAAC,OAAO,EAAE,CAAC;QACnC,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,IAAI,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;;QAGzD,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,QAAQ,EAAE;YACpC,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,EAAE,CAAC;;YAG1D,IAAG,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,OAAO,EAAC;;gBAGjC,IAAI,WAAW,IAAI,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAC;oBAC9F,IAAI,CAAC,2BAA2B,GAAG,WAAW,CAAC;oBAC/C,IAAI,CAAC,yBAAyB,GAAI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;iBAClF;;qBAEI;oBACH,IAAI,CAAC,2BAA2B,GAAG,MAAM,EAAE,CAAC,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;oBACvE,IAAI,CAAC,yBAAyB,GAAI,MAAM,EAAE,CAAC,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;iBAC/F;aACF;;iBAEI;;gBAEH,IAAI,WAAW,IAAI,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAC;oBAC9F,IAAI,CAAC,2BAA2B,GAAG,WAAW,CAAC;oBAC/C,IAAI,CAAC,yBAAyB,GAAI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;iBAClF;;qBAEI;oBACH,IAAI,CAAC,2BAA2B,GAAG,MAAM,EAAE,CAAC,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;oBACvE,IAAI,CAAC,yBAAyB,GAAI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,EAAE,CAAC;iBACvE;aACF;SACF;;aAEI;;YAEH,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,OAAO,EAAC;gBAClC,IAAI,CAAC,2BAA2B,GAAG,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;gBACtF,IAAI,CAAC,yBAAyB,GAAI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;aAC/F;;iBAEI;gBACH,IAAI,CAAC,2BAA2B,GAAG,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;gBACtF,IAAI,CAAC,yBAAyB,GAAI,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;aACtF;SAEF;QAED,IAAG,IAAI,CAAC,cAAc;YACpB,IAAI,CAAC,2BAA2B,GAAG,IAAI,CAAC,cAAc,CAAC;QAEzD,IAAG,IAAI,CAAC,YAAY;YAClB,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC,YAAY,CAAC;QAErD,IAAI,CAAC,SAAS,GAAG;YACf,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC;YACtE,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC,OAAO,EAAE;SAC1D,CAAC;QAEF,IAAI,CAAC,OAAO,GAAG;YACb,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC;YACpE,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,OAAO,EAAE;SACxD,CAAC;KACH;IAED,aAAa,CAAC,IAAgB;QAC5B,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAClC;;IAGD,kBAAkB,CAAC,IAAW;QAC5B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;;;;QAI1B,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,OAAO,EAAE;YACnC,IAAI,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,EAAE,CAAC;YACrE,IAAI,MAAM,GAAG,IAAI,CAAC,QAAQ,IAAI,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;YACvD,IAAI,CAAC,yBAAyB,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,EAAE,gBAAgB,IAAI,CAAC,UAAU,EAAE,CAAC;iBACnH,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC;iBAChB,OAAO,EAAE,CAAC;;YAGb,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YACxF,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,EAAE,EAAE,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAC7I,IAAI,gBAAgB,KAAK,gBAAgB,EAAE;gBACzC,IAAI,CAAC,yBAAyB,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,EAAE,gBAAgB,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;aAC7I;SAEF;aAAM;YACH,MAAM,QAAQ,GACd,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC;gBACvE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;YAEpE,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;YAC/B,IAAI,CAAC,aAAa,CAAC;gBACjB,KAAK,EAAE,QAAQ,IAAI,IAAI,CAAC,aAAa;gBACrC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI;gBAC9B,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI;gBAC1B,UAAU,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,EAAE,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,OAAO,EAAE;gBACzG,QAAQ,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,OAAO,EAAE;aACpG,CAAC,CAAC;SACN;QAED,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC;KAC1C;IAED,gBAAgB,CAAC,IAAW;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QAEpB,MAAM,QAAQ,GACZ,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAEjJ,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;QAC/B,IAAI,CAAC,aAAa,CAAC;YACjB,KAAK,EAAE,QAAQ,IAAI,IAAI,CAAC,aAAa;YACrC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI;YAC9B,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI;YAC1B,UAAU,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,EAAE,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,OAAO,EAAE;YACzG,QAAQ,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,OAAO,EAAE;SACpG,CAAC,CAAC;KACJ;IAED,iBAAiB,CAAC,IAAY,EAAE,IAAY;QAC1C,MAAM,IAAI,GAAG,sDAAsD,CAAC;QACpE,MAAM,IAAI,GAAG,iCAAiC,CAAC;QAC/C,MAAM,EAAE,GAAG,IAAI,CAAC,WAAW,KAAK,EAAE,GAAG,IAAI,GAAG,IAAI,CAAC;QAEjD,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,IAAI,EAAE,EAAE,gBAAgB,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;QAC7G,IAAI,IAAI,GAAY,KAAK,CAAC;;;QAI1B,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,YAAY,MAAM,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,QAAQ,CAAC,EAAE;YACvH,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC;SACtC;aAAM;YACL,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,UAAU,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,GAAG,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC;SAC7E;QAED,OAAO,IAAI,CAAC;KACb;;IAGD,eAAe,CAAC,QAAiB;QAC/B,IAAI,QAAQ,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,OAAO,EAAE;YAC/C,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;YACjE,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;YAC7D,IAAI,CAAC,aAAa,GAAG,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,GAAG,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC;YAC1E,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;SAC1B;KACF;;;YA3MF,SAAS,SAAC;gBACT,QAAQ,EAAE,qBAAqB;gBAC/B,wlCAA+C;;aAEhD;;;YAR0B,iBAAiB;;;yBAUzC,KAAK;4BACL,KAAK;qBACL,KAAK;uBACL,KAAK;6BACL,KAAK;2BACL,KAAK;6BACL,KAAK;2BACL,KAAK;0BACL,KAAK;uBACL,KAAK;0BACL,KAAK;wBACL,KAAK;kBACL,KAAK;+BAEL,MAAM;;;MCbI,qBAAqB;IAChC,OAAO,OAAO;QACZ,OAAO,EAAE,QAAQ,EAAE,qBAAqB,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC;KAC3D;;;YARF,QAAQ,SAAC;gBACR,YAAY,EAAE,CAAC,wBAAwB,CAAC;gBACxC,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,gBAAgB,CAAC;gBACtD,OAAO,EAAE,CAAC,wBAAwB,CAAC;aACpC;;;ACVD;;;;;;"}
1	+ {"version":3,"file":"mis-crystal-design-system-timerangepicker.js","sources":["../../../projects/mis-components/timerangepicker/timerangepicker.component.ts","../../../projects/mis-components/timerangepicker/timerangepicker.module.ts","../../../projects/mis-components/timerangepicker/mis-crystal-design-system-timerangepicker.ts"],"sourcesContent":["import { Component, Input, ChangeDetectorRef, Output, EventEmitter } from \"@angular/core\";\nimport * as moment from \"moment-timezone\";\nimport { ITimeRange, ITime, TDirection } from \"./timerange.namespace\";\n\n@Component({\n selector: \"mis-timerangepicker\",\n templateUrl: \"./timerangepicker.component.html\",\n styleUrls: [\"./timerangepicker.component.scss\"]\n})\nexport class TimeRangePickerComponent {\n @Input() inputWidth: string = \"100px\";\n @Input() dropdownWidth?: string;\n @Input() height: string = \"46px\";\n @Input() timezone: string = \"Asia/Kolkata\";\n @Input() startDateEpoch: number = moment().tz(this.timezone).valueOf();\n @Input() endDateEpoch: number = moment().tz(this.timezone).valueOf();\n @Input() givenStartTime: number;\n @Input() givenEndTime: number;\n @Input() clockFormat: number = 12;\n @Input() interval: number = 15;\n @Input() showTooltip: boolean = true;\n @Input() direction: TDirection = 'row';\n @Input() gap: string = '1rem';\n\n @Output() timeRangeEmitter = new EventEmitter<ITimeRange>();\n\n startDate!: string;\n endDate!: string;\n currDate!: string;\n timeFormat!: string;\n firstIntervalForStartPicker: number = moment().valueOf();\n firstIntervalForEndPicker: number = moment().valueOf();\n startTime!: ITime;\n endTime!: ITime;\n rangeValidity: boolean = true;\n triggerChange: boolean = true;\n\n constructor(private cdr: ChangeDetectorRef) {}\n\n ngOnInit() {}\n\n ngOnChanges() {\n this.timeFormat = this.clockFormat === 12 ? \"hh:mm a\" : \"HH:mm\";\n moment.tz.setDefault(this.timezone);\n this.startDate = moment(this.startDateEpoch).format(\"DD-MM-YYYY\");\n this.endDate = moment(this.endDateEpoch).format(\"DD-MM-YYYY\");\n this.currDate = moment().format(\"DD-MM-YYYY\");\n this.setFirstIntervals();\n }\n\n // calculate the first interval of the picker\n setFirstIntervals(): void {\n const minutes = moment().minutes();\n const offset = this.interval - (minutes % this.interval);\n\n // start date, 22 MAY === current date, 22 MAY\n if( this.startDate === this.currDate ){\n console.log(\"start date epoch:\",this.startDateEpoch);\n const currentTime = moment().valueOf();\n\n // start date, 22 MAY === current date, 22 MAY === end date, 22 MAY\n if(this.startDate === this.endDate){\n console.log(\"Current time:\",currentTime);\n console.log(\"end-interval:\",moment(this.startDateEpoch).endOf(\"d\").subtract(this.interval,\"m\").valueOf());\n // current time is in last interval\n if( currentTime >= moment(this.startDateEpoch).endOf(\"d\").subtract(this.interval,\"m\").valueOf()){\n this.firstIntervalForStartPicker = currentTime;\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).endOf(\"d\").valueOf();\n console.log(\"firstIntervalForStartPicker\",this.firstIntervalForStartPicker);\n console.log(\"firstIntervalForEndPicker\",this.firstIntervalForEndPicker);\n }\n // current time isn't in last interval\n else {\n this.firstIntervalForStartPicker = moment().add(offset, \"m\").valueOf();\n this.firstIntervalForEndPicker = moment().add(offset, \"m\").add(this.interval, \"m\").valueOf();\n }\n } \n // start date, 22 MAY === current date, 22 MAY !== end date, 30 MAY\n else {\n // current time is in last interval\n if( currentTime >= moment(this.startDateEpoch).endOf(\"d\").subtract(this.interval,\"m\").valueOf()){\n this.firstIntervalForStartPicker = currentTime;\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).endOf(\"d\").valueOf();\n }\n // current time isn't in last interval\n else {\n this.firstIntervalForStartPicker = moment().add(offset, \"m\").valueOf();\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).valueOf();\n }\n }\n }\n // start date, 30 MAY !== current date, 22 MAY\n else {\n // start date === end Date\n if( this.startDate === this.endDate){\n this.firstIntervalForStartPicker = moment(this.startDateEpoch).startOf(\"d\").valueOf();\n this.firstIntervalForEndPicker = moment(this.endDateEpoch).add(this.interval, \"m\").valueOf();\n } \n // start date !== end date\n else {\n this.firstIntervalForStartPicker = moment(this.startDateEpoch).startOf(\"d\").valueOf();\n this.firstIntervalForEndPicker = moment(this.startDateEpoch).startOf(\"d\").valueOf();\n }\n\n }\n\n if(this.givenStartTime)\n this.firstIntervalForStartPicker = this.givenStartTime;\n \n if(this.givenEndTime)\n this.firstIntervalForEndPicker = this.givenEndTime;\n \n this.startTime = {\n valid: true,\n time: moment(this.firstIntervalForStartPicker).format(this.timeFormat),\n epoch: moment(this.firstIntervalForStartPicker).valueOf()\n };\n\n this.endTime = {\n valid: true,\n time: moment(this.firstIntervalForEndPicker).format(this.timeFormat),\n epoch: moment(this.firstIntervalForEndPicker).valueOf()\n };\n }\n\n emitTimeRange(data: ITimeRange): void {\n this.timeRangeEmitter.emit(data);\n }\n\n //handlers catch the emitted values and run validation\n startPickerHandler(time: ITime): void {\n this.startTime = time;\n this.rangeValidity = true;\n // if the start time changes and the start date is the same as the end date\n // and the start time >= end time\n // update the first interval of end picker according to the time set in start picker\n if (this.startDate === this.endDate) {\n let minutes = moment(this.startTime.time, this.timeFormat).minutes();\n let offset = this.interval - (minutes % this.interval);\n this.firstIntervalForEndPicker = moment(`${this.startDate} ${this.startTime.time}`, `'DD-MM-YYYY' ${this.timeFormat}`)\n .add(offset, \"m\")\n .valueOf();\n\n // if the first interval == 12:00am, set it as 11:59pm\n const intervalAsString = moment(this.firstIntervalForEndPicker).format(this.timeFormat);\n const endOfDayAsString = moment(moment(`${this.startDate}`, `DD-MM-YYYY ${this.timeFormat}`).endOf(\"d\").add(1, \"m\")).format(this.timeFormat);\n if (intervalAsString === endOfDayAsString) {\n this.firstIntervalForEndPicker = moment(`${this.startDate} ${this.startTime.time}`, `'DD-MM-YYYY' ${this.timeFormat}`).endOf(\"d\").valueOf();\n }\n\n } else {\n const validity =\n this.checkTimeValidity(this.startTime.time.trim(), this.startDateEpoch) &&\n this.checkTimeValidity(this.endTime.time.trim(), this.endDateEpoch);\n\n this.rangeValidation(validity);\n this.emitTimeRange({\n valid: validity && this.rangeValidity,\n startTime: this.startTime.time,\n endTime: this.endTime.time,\n startEpoch: moment(`${this.startDate} ${this.startTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf(),\n endEpoch: moment(`${this.endDate} ${this.endTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf()\n });\n }\n\n this.triggerChange = !this.triggerChange;\n }\n\n endPickerHandler(time: ITime): void {\n this.endTime = time;\n\n const validity =\n this.checkTimeValidity(this.startTime.time.trim(), this.startDateEpoch) && this.checkTimeValidity(this.endTime.time.trim(), this.endDateEpoch);\n\n this.rangeValidation(validity);\n this.emitTimeRange({\n valid: validity && this.rangeValidity,\n startTime: this.startTime.time,\n endTime: this.endTime.time,\n startEpoch: moment(`${this.startDate} ${this.startTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf(),\n endEpoch: moment(`${this.endDate} ${this.endTime.time}`, `DD-MM-YYYY ${this.timeFormat}`).valueOf()\n });\n }\n\n checkTimeValidity(time: string, date: number): boolean {\n const RE12 = /^(([0][1-9]\|1[0-2]):([0-5][0-9])( )?(am\|pm\|AM\|PM))$/i;\n const RE24 = /^([01][0-9]\|2[0-3]):[0-5][0-9]$/;\n const RE = this.clockFormat === 12 ? RE12 : RE24;\n\n const timeMoment = moment(`${moment(date).format(\"DD-MM-YYYY\")} ${time}`, `'DD-MM-YYYY' ${this.timeFormat}`);\n let flag: boolean = false;\n\n // if the first interval is set to the start of the day\n // then we don't check its validity against the current time\n if ((this.givenStartTime && this.givenEndTime) \|\| (this.startDate !== this.endDate && this.startDate !== this.currDate)) {\n flag = time.match(RE) ? true : false;\n } else {\n flag = time.match(RE) && timeMoment.diff(moment(), \"m\") >= 0 ? true : false;\n }\n\n return flag;\n }\n\n // validates end picker's input according to the start picker's input\n rangeValidation(validity: boolean) {\n if (validity && this.startDate === this.endDate) {\n const startMoment = moment(this.startTime.time, this.timeFormat);\n const endMoment = moment(this.endTime.time, this.timeFormat);\n this.rangeValidity = endMoment.diff(startMoment, \"m\") >= 1 ? true : false;\n this.cdr.detectChanges();\n }\n }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { TimeRangePickerComponent } from \"./timerangepicker.component\";\nimport { TimePickerModule } from \"mis-crystal-design-system/timepicker\";\n\n@NgModule({\n declarations: [TimeRangePickerComponent],\n imports: [CommonModule, FormsModule, TimePickerModule],\n exports: [TimeRangePickerComponent]\n})\nexport class TimeRangePickerModule {\n static forRoot(): ModuleWithProviders<TimeRangePickerModule> {\n return { ngModule: TimeRangePickerModule, providers: [] };\n }\n}","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["moment.tz"],"mappings":"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"}

package/input/mis-crystal-design-system-input.metadata.json CHANGED Viewed

	@@ -1 +1 @@
1	- {"__symbolic":"module","version":4,"metadata":{"MisInputDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":5,"character":1},"arguments":[{"selector":"input[misInput]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Self","line":10,"character":38}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":10,"character":46}}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":10,"character":25},{"__symbolic":"reference","module":"@angular/forms","name":"NgControl","line":10,"character":73}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"MisInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"mis-input","template":"<div\n [class]=\"'input-container ' + size\"\n [ngClass]=\"{\n rounded: type === 'rounded',\n floating: type === 'floating',\n 'has-error': !inputValidity \|\| hasError,\n 'no-hint': noHints,\n 'mis-disabled': inputCtrl?.disabled\n }\"\n>\n <div class=\"input-wrapper\">\n <ng-content select=\"[mis-input-icon]\"></ng-content>\n <div class=\"mis-input\">\n <ng-content select=\"input\"></ng-content>\n <span class=\"mis-placeholder\">{{ placeholder }}</span>\n </div>\n <ng-content select=\"[mis-input-act]\"></ng-content>\n </div>\n <ng-content select=\"[mis-input-hint]\"></ng-content>\n <ng-content select=\"[mis-input-error]\"></ng-content>\n</div>\n","styles":[":root{--pmry-200:#99baf7;--pmry-100:#cbddfb;--pmry-500:#0937b2;--pmry-400:#3c68d0;--pmry-600:#062a99;--pmry-700:#041f80;--pmry-300:#638fe7;--pmry-800:#021567;--pmry-900:#010f55;--sec-d-purple:#40447f;--sec-maroon:#6b034e;--sec-mud-red:#b23600;--sec-orange:#ed711c;--sec-purple:#815fd5;--sec-teal:#10adae;--sec-yellow:#d4900c;--sec-green:#547f40;--sec-bright-green:#27d22e;--sec-dark-teal:#035f6b;--sec-chocolate:#7c2f33;--sec-rube-pink:#c13d6d;--sec-cerulean:#0087b2;--sem-error:#b00020;--sem-info:#0091ff;--sem-warning:#ff9d00;--sem-success:#38af49;--grey-bg-1:#fafafa;--grey-bg:#f5f5f5;--grey-seperators:#e0e0e0;--grey-disabled:#c8cdd3;--grey-hover:#f5f7fc;--grey-pressed:#e6ebf7;--grey-row:#f5f7fc;--dec-light-yellow:#f4e7c3;--dec-light-purple:#dacff9;--dec-light-green:#e4f5e9;--dec-light-green2:#f1fff3;--dec-light-pink:#fae1ea;--dec-:#f4cbc1;--dec-lt-orange:#faefed;--dec-light-blue:#cfecf9;--dec-row-selection:#f1fdf8;--dec-row-selection2:#f2fbff;--dec-row-lines:#d3e1e9;--text-white:#fff;--text-disabled:#929dab;--text-muted:#6a737d;--text-black:#181f33;--MR-solid-blue2:#c8d5f6;--MR-solid-purple:#c9c3fb;--MR-solid-orange:#eeac9f;--MR-solid-green:#acdada;--MR-solid-brown:#e8c8af;--MR-solid-yellow:#ffefc7;--MR-solid-blue:#bbe6ff;--MR-solid-pink:#ffc6f2;--tr-hover:#f0f3fa;--tr-pressed:#dae1f3}.input-container{position:relative;padding-bottom:24px}.input-container.mis-disabled .input-wrapper{pointer-events:none!important}.input-container .input-wrapper{box-sizing:border-box;display:flex;align-items:center;flex-direction:row;flex-wrap:nowrap;transition:all 60ms ease-in;background-color:#fff;padding:3px 16px;gap:16px}.input-container .input-wrapper .mis-input{flex:1 1 auto;z-index:0;position:relative;display:flex;align-items:center}.input-container .input-wrapper input{flex:1 1 auto;border:none;outline:none;height:100%;padding:0;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;height:24px;color:#181f33;background-color:transparent;width:100%;vertical-align:middle}.input-container .input-wrapper input::-moz-placeholder{-moz-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input:-ms-input-placeholder{-ms-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input::placeholder{transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper .mis-placeholder{position:absolute;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;line-height:24px;color:#6a737d;z-index:-1;transition:all .15s ease-in}.input-container .input-wrapper:focus-within{background-color:#f5f5f5}.input-container .input-wrapper:focus-within{border:1px solid #0937b2}.input-container .input-wrapper [mis-input-act],.input-container .input-wrapper [mis-input-icon]{width:18px;height:18px;color:#6a737d;font-size:24px;line-height:18px}.input-container .input-wrapper [mis-input-act]{cursor:pointer}.input-container.no-hint{padding-bottom:0}.input-container.rounded input{box-sizing:initial}.input-container.rounded.sm input{padding:3px 16px}.input-container.rounded.md input{padding:9px 16px}.input-container.rounded.lg input{padding:15px 16px}.input-container.rounded .input-wrapper{border-radius:4px;border:1px solid #e0e0e0;padding:0}.input-container.rounded .input-wrapper:hover{background-color:#f5f5f5}.input-container.rounded .input-wrapper:focus-within{border:1px solid #0937b2}.input-container.rounded .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper .mis-placeholder{margin-left:16px;transition-duration:50ms}.input-container.rounded.has-error .input-wrapper{border:1px solid #b00020!important}.input-container.floating .input-wrapper{padding-top:24px;padding-bottom:7px;border-bottom:1px solid #e0e0e0}.input-container.floating .input-wrapper input:focus+.mis-placeholder{color:#0937b2!important}.input-container.floating .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:focus+.mis-placeholder,.input-container.floating .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper:focus-within{border:none;border-bottom:1px solid #0937b2}.input-container.floating .input-wrapper:focus-within input::-moz-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input:-ms-input-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input::placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating.has-error .input-wrapper{border-bottom:1px solid #b00020!important}.input-container.floating.has-error .input-wrapper .mis-placeholder{color:#b00020!important}.input-container [mis-input-error],.input-container [mis-input-hint]{position:absolute;left:0;right:0;bottom:0;line-height:24px;height:24px;font-size:12px;color:#6a737d;letter-spacing:.2px}.input-container [mis-input-error]{color:#b00020}"]}]}],"members":{"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"noHints":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"hasError":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"formInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":16,"character":3},"arguments":[{"__symbolic":"reference","name":"MisInputDirective"}]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"MisInputModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MisInputComponent"},{"__symbolic":"reference","name":"MisInputDirective"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":8,"character":26}],"exports":[{"__symbolic":"reference","name":"MisInputComponent"},{"__symbolic":"reference","name":"MisInputDirective"}]}]}],"members":{}}},"origins":{"MisInputDirective":"./directives/input/input.directive","MisInputComponent":"./mis-input.component","MisInputModule":"./mis-input.module"},"importAs":"mis-crystal-design-system/input"}
1	+ {"__symbolic":"module","version":4,"metadata":{"MisInputDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":5,"character":1},"arguments":[{"selector":"input[misInput]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Self","line":10,"character":38}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":10,"character":46}}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":10,"character":25},{"__symbolic":"reference","module":"@angular/forms","name":"NgControl","line":10,"character":73}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"MisInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"mis-input","template":"<div\n [class]=\"'input-container ' + size\"\n [ngClass]=\"{\n rounded: type === 'rounded',\n floating: type === 'floating',\n 'has-error': !inputValidity \|\| hasError,\n 'no-hint': noHints,\n 'mis-disabled': inputCtrl?.disabled\n }\"\n>\n <div class=\"input-wrapper\">\n <ng-content select=\"[mis-input-icon]\"></ng-content>\n <div class=\"mis-input\">\n <ng-content select=\"input\"></ng-content>\n <span class=\"mis-placeholder\">{{ placeholder }}<span ngIf=\"isMandatory\" style=\"color: red;\"></span></span>\n </div>\n <ng-content select=\"[mis-input-act]\"></ng-content>\n </div>\n <ng-content select=\"[mis-input-hint]\"></ng-content>\n <ng-content select=\"[mis-input-error]\"></ng-content>\n</div>\n","styles":[":root{--pmry-200:#99baf7;--pmry-100:#cbddfb;--pmry-500:#0937b2;--pmry-400:#3c68d0;--pmry-600:#062a99;--pmry-700:#041f80;--pmry-300:#638fe7;--pmry-800:#021567;--pmry-900:#010f55;--sec-d-purple:#40447f;--sec-maroon:#6b034e;--sec-mud-red:#b23600;--sec-orange:#ed711c;--sec-purple:#815fd5;--sec-teal:#10adae;--sec-yellow:#d4900c;--sec-green:#547f40;--sec-bright-green:#27d22e;--sec-dark-teal:#035f6b;--sec-chocolate:#7c2f33;--sec-rube-pink:#c13d6d;--sec-cerulean:#0087b2;--sem-error:#b00020;--sem-info:#0091ff;--sem-warning:#ff9d00;--sem-success:#38af49;--grey-bg-1:#fafafa;--grey-bg:#f5f5f5;--grey-seperators:#e0e0e0;--grey-disabled:#c8cdd3;--grey-hover:#f5f7fc;--grey-pressed:#e6ebf7;--grey-row:#f5f7fc;--dec-light-yellow:#f4e7c3;--dec-light-purple:#dacff9;--dec-light-green:#e4f5e9;--dec-light-green2:#f1fff3;--dec-light-pink:#fae1ea;--dec-:#f4cbc1;--dec-lt-orange:#faefed;--dec-light-blue:#cfecf9;--dec-row-selection:#f1fdf8;--dec-row-selection2:#f2fbff;--dec-row-lines:#d3e1e9;--text-white:#fff;--text-disabled:#929dab;--text-muted:#6a737d;--text-black:#181f33;--MR-solid-blue2:#c8d5f6;--MR-solid-purple:#c9c3fb;--MR-solid-orange:#eeac9f;--MR-solid-green:#acdada;--MR-solid-brown:#e8c8af;--MR-solid-yellow:#ffefc7;--MR-solid-blue:#bbe6ff;--MR-solid-pink:#ffc6f2;--tr-hover:#f0f3fa;--tr-pressed:#dae1f3}.input-container{position:relative;padding-bottom:24px}.input-container.mis-disabled .input-wrapper{pointer-events:none!important}.input-container .input-wrapper{box-sizing:border-box;display:flex;align-items:center;flex-direction:row;flex-wrap:nowrap;transition:all 60ms ease-in;background-color:#fff;padding:3px 16px;gap:16px}.input-container .input-wrapper .mis-input{flex:1 1 auto;z-index:0;position:relative;display:flex;align-items:center}.input-container .input-wrapper input{flex:1 1 auto;border:none;outline:none;height:100%;padding:0;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;height:24px;color:#181f33;background-color:transparent;width:100%;vertical-align:middle}.input-container .input-wrapper input::-moz-placeholder{-moz-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input:-ms-input-placeholder{-ms-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input::placeholder{transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper .mis-placeholder{position:absolute;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;line-height:24px;color:#6a737d;z-index:-1;transition:all .15s ease-in}.input-container .input-wrapper:focus-within{background-color:#f5f5f5}.input-container .input-wrapper:focus-within{border:1px solid #0937b2}.input-container .input-wrapper [mis-input-act],.input-container .input-wrapper [mis-input-icon]{width:18px;height:18px;color:#6a737d;font-size:24px;line-height:18px}.input-container .input-wrapper [mis-input-act]{cursor:pointer}.input-container.no-hint{padding-bottom:0}.input-container.rounded input{box-sizing:initial}.input-container.rounded.sm input{padding:3px 16px}.input-container.rounded.md input{padding:9px 16px}.input-container.rounded.lg input{padding:15px 16px}.input-container.rounded .input-wrapper{border-radius:4px;border:1px solid #e0e0e0;padding:0}.input-container.rounded .input-wrapper:hover{background-color:#f5f5f5}.input-container.rounded .input-wrapper:focus-within{border:1px solid #0937b2}.input-container.rounded .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper .mis-placeholder{margin-left:16px;transition-duration:50ms}.input-container.rounded.has-error .input-wrapper{border:1px solid #b00020!important}.input-container.floating .input-wrapper{padding-top:24px;padding-bottom:7px;border-bottom:1px solid #e0e0e0}.input-container.floating .input-wrapper input:focus+.mis-placeholder{color:#0937b2!important}.input-container.floating .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:focus+.mis-placeholder,.input-container.floating .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper:focus-within{border:none;border-bottom:1px solid #0937b2}.input-container.floating .input-wrapper:focus-within input::-moz-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input:-ms-input-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input::placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating.has-error .input-wrapper{border-bottom:1px solid #b00020!important}.input-container.floating.has-error .input-wrapper .mis-placeholder{color:#b00020!important}.input-container [mis-input-error],.input-container [mis-input-hint]{position:absolute;left:0;right:0;bottom:0;line-height:24px;height:24px;font-size:12px;color:#6a737d;letter-spacing:.2px}.input-container [mis-input-error]{color:#b00020}"]}]}],"members":{"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"noHints":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"hasError":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"isMandatory":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"formInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":17,"character":3},"arguments":[{"__symbolic":"reference","name":"MisInputDirective"}]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"MisInputModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"MisInputComponent"},{"__symbolic":"reference","name":"MisInputDirective"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":8,"character":26}],"exports":[{"__symbolic":"reference","name":"MisInputComponent"},{"__symbolic":"reference","name":"MisInputDirective"}]}]}],"members":{}}},"origins":{"MisInputDirective":"./directives/input/input.directive","MisInputComponent":"./mis-input.component","MisInputModule":"./mis-input.module"},"importAs":"mis-crystal-design-system/input"}

package/input/mis-input.component.d.ts CHANGED Viewed

@@ -8,6 +8,7 @@ export declare class MisInputComponent implements OnInit, OnDestroy {
     placeholder: string;
     noHints: boolean;
     hasError: boolean;
+    isMandatory: boolean;
     set formInput(input: MisInputDirective);
     inputCtrl: AbstractControl;
     inputSubscription: Subscription | undefined;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "mis-crystal-design-system",
-  "version": "4.0.44",
+  "version": "4.0.46-test-1",
   "peerDependencies": {
     "@angular/common": "*",
     "@angular/core": "*",

package/phone-input/mis-crystal-design-system-phone-input.metadata.json CHANGED Viewed

	@@ -1 +1 @@
1	- {"__symbolic":"module","version":4,"metadata":{"PhoneInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"mis-phone-input","template":"<div class=\"main-container-phone\">\n <mis-dropdown [height]=\"dropdownHeight\" [dropdownListWidth]=\"dropdownListWidth\"[dropdownListHeight]=\"dropdownListHeight\" [width]=\"dropdownWidth\" [data]=\"dropdownData\" [selectedItem]=\"dropdownSelectedItem\" [label]=\"label\" [searchEnabled]=\"searchEnabled\" [multiLine]=\"false\" (onChange)=\"handleDropdownSelection($event)\" [searchLabel]=\"searchLabel\"></mis-dropdown>\n <div class=\"details-field\">\n <div class=\"input-box\">\n <input\n [ngStyle]=\"{'height': inputHeight }\"\n class=\"black-text\"\n [placeholder]=\"inputPlaceholder\"\n [formControl]=\"inputFormControl\" \n [type]=\"inputType\"\n />\n </div>\n </div>\n</div>\n","styles":[".main-container-phone{display:flex;border:1px solid #e0e0e0;border-radius:6px}.details-field label{display:inline-block;min-width:224px;margin-right:24px}.details-field .input-box{width:100%}.details-field .input-box input{width:100%;height:32px}input{padding:10px 16px;border:none;outline:none;width:100%;height:auto;border-radius:6px}.black-text,input{color:#181f33;line-height:24px;font-size:16px}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.main-container-phone ::ng-deep .item{padding:8px!important}.main-container-phone ::ng-deep .dropdown{border:unset!important}"]}]}],"members":{"dropdownHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":3}}]}],"dropdownWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"inputHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"dropdownData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"dropdownSelectedItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"inputPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"inputFormControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"onDropdownSelection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":20,"character":3}}]}],"dropdownListWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"dropdownListHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"searchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"inputType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"searchLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"handleDropdownSelection":[{"__symbolic":"method"}]}},"PhoneInputModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"PhoneInputComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":12,"character":12},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":12,"character":25},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":12,"character":46},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":12,"character":59},{"__symbolic":"reference","module":"@angular/cdk-experimental/scrolling","name":"ScrollingModule","line":12,"character":74},{"__symbolic":"reference","module":"mis-crystal-design-system/dropdown","name":"DropdownModule","line":12,"character":91}],"exports":[{"__symbolic":"reference","name":"PhoneInputComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"PhoneInputModule"},"providers":[]}}}}},"origins":{"PhoneInputComponent":"./phone-input.component","PhoneInputModule":"./phone-input.module"},"importAs":"mis-crystal-design-system/phone-input"}
1	+ {"__symbolic":"module","version":4,"metadata":{"PhoneInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"mis-phone-input","template":"<div class=\"main-container-phone\">\n <mis-dropdown [height]=\"dropdownHeight\" [dropdownListWidth]=\"dropdownListWidth\"[dropdownListHeight]=\"dropdownListHeight\" [width]=\"dropdownWidth\" [data]=\"dropdownData\" [selectedItem]=\"dropdownSelectedItem\" [label]=\"label\" [searchEnabled]=\"searchEnabled\" [multiLine]=\"false\" (onChange)=\"handleDropdownSelection($event)\" [searchLabel]=\"searchLabel\"></mis-dropdown>\n <div class=\"details-field\">\n <div class=\"input-box\">\n <input\n [ngStyle]=\"{'height': inputHeight }\"\n class=\"black-text\" \n [placeholder]=\"inputPlaceholder\"\n [formControl]=\"inputFormControl\" \n [type]=\"inputType\"\n />\n </div>\n </div>\n</div>\n","styles":[".main-container-phone{display:flex;border:1px solid #e0e0e0;border-radius:6px}.details-field label{display:inline-block;min-width:224px;margin-right:24px}.details-field .input-box{width:100%}.details-field .input-box input{width:100%;height:32px}input{padding:10px 16px;border:none;outline:none;width:100%;height:auto;border-radius:6px}.black-text,input{color:#181f33;line-height:24px;font-size:16px}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.main-container-phone ::ng-deep .item{padding:8px!important}.main-container-phone ::ng-deep .dropdown{border:unset!important}"]}]}],"members":{"dropdownHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"dropdownWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"inputHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"dropdownData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"dropdownSelectedItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"defaultCountryCode":[{"__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":17,"character":3}}]}],"inputPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"inputFormControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"onDropdownSelection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":20,"character":3}}]}],"onInvalidPhoneNumber":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":21,"character":3}}]}],"dropdownListWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"dropdownListHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"searchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"inputType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"searchLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"phoneValidator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"handleDropdownSelection":[{"__symbolic":"method"}],"loadCountryCodes":[{"__symbolic":"method"}],"validatePhoneNumber":[{"__symbolic":"method"}]}},"PhoneInputModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"PhoneInputComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":12,"character":12},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":12,"character":25},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":12,"character":46},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule","line":12,"character":59},{"__symbolic":"reference","module":"@angular/cdk-experimental/scrolling","name":"ScrollingModule","line":12,"character":74},{"__symbolic":"reference","module":"mis-crystal-design-system/dropdown","name":"DropdownModule","line":12,"character":91}],"exports":[{"__symbolic":"reference","name":"PhoneInputComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"PhoneInputModule"},"providers":[]}}}}},"origins":{"PhoneInputComponent":"./phone-input.component","PhoneInputModule":"./phone-input.module"},"importAs":"mis-crystal-design-system/phone-input"}

package/phone-input/phone-input.component.d.ts CHANGED Viewed

@@ -1,22 +1,31 @@
 import { EventEmitter, OnInit } from "@angular/core";
 import { FormControl } from "@angular/forms";
+import { CountryCode } from 'libphonenumber-js';
 import { DropdownItem } from "mis-crystal-design-system/dropdown";
 export declare class PhoneInputComponent implements OnInit {
     dropdownHeight?: string;
     dropdownWidth?: string;
-    inputHeight?: string;
+    inputHeight?: any;
     dropdownData: DropdownItem[];
     dropdownSelectedItem: DropdownItem;
+    defaultCountryCode?: string;
     label: string;
     inputPlaceholder: string;
     inputFormControl: FormControl;
     onDropdownSelection: EventEmitter<any>;
-    dropdownListWidth: any;
-    dropdownListHeight: any;
+    onInvalidPhoneNumber: EventEmitter<string>;
+    dropdownListWidth: string;
+    dropdownListHeight: string;
     searchEnabled: boolean;
     inputType: string;
     searchLabel: string;
+    phoneValidator?: boolean;
+    countryCodes: DropdownItem[];
+    countryCode: CountryCode | undefined;
+    selectedCountryName: string;
     constructor();
     ngOnInit(): void;
     handleDropdownSelection(item: DropdownItem): void;
+    loadCountryCodes(): void;
+    validatePhoneNumber(phoneNumber: string, countryCode: string): void;
 }