@sd-angular/core 0.0.953 → 0.0.957

package/fesm2015/sd-angular-core-badge.js

@@ -1,30 +1,51 @@
-import { Component, Input, NgModule } from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MatIconModule } from '@angular/material/icon';
+import { MatTooltipModule } from '@angular/material/tooltip';
 
 class SdBadge {
     constructor() {
-        this.icon = "fiber_manual_record";
+        this.color = 'unknown';
+        this.type = 'circle';
+        this.icon = 'fiber_manual_record';
+        this.sdClick = new EventEmitter();
+        this.onClick = (event) => {
+            this.sdClick.observers.length;
+            this.sdClick.emit(event);
+        };
     }
+    set _color(color) {
+        if (!color || !['normal', 'info', 'success', 'warning', 'danger'].includes(color)) {
+            this.color = 'unknown';
+        }
+        else {
+            this.color = color;
+        }
+    }
+    ;
 }
 SdBadge.decorators = [
     { type: Component, args: [{
-                selector: "sd-badge",
-                template: "<div\r\n  class=\"c-badge-circle d-flex align-items-center\"\r\n  [class]=\"{\r\n    'c-unknown': !color,\r\n    'c-secondary': color === 'normal',\r\n    'c-info': color === 'info',\r\n    'c-success': color === 'success',\r\n    'c-danger': color === 'danger',\r\n    'c-warning': color === 'warning'\r\n  }\"\r\n>\r\n  <span\r\n    class=\"c-material-icon mr-4\"\r\n    [ngClass]=\"{\r\n      'material-icons-outlined': !color,\r\n      'material-icons-round': color,\r\n      'c-badge-icon': icon === 'fiber_manual_record'\r\n    }\"\r\n  >\r\n    {{ icon }}\r\n  </span>\r\n  {{ title }}\r\n</div>\r\n",
-                styles: ["::ng-deep .c-badge-circle .c-material-icon{font-size:16px;height:16px;width:16px}::ng-deep .c-badge-circle .c-material-icon.c-badge-icon{font-size:12px;height:12px;width:12px}::ng-deep .c-badge-circle.c-unknown{color:#212121}::ng-deep .c-badge-circle.c-unknown .c-material-icon{color:rgba(0,0,0,.5)}::ng-deep .c-badge-circle.c-secondary{color:#212121}::ng-deep .c-badge-circle.c-secondary .c-material-icon{color:rgba(0,0,0,.5)}::ng-deep .c-badge-circle.c-info{color:#2962ff}::ng-deep .c-badge-circle.c-success{color:#4caf50}::ng-deep .c-badge-circle.c-danger{color:#f82c13}::ng-deep .c-badge-circle.c-warning{color:#ff9600}"]
+                selector: 'sd-badge',
+                template: "<div *ngIf=\"type === 'round'\" class=\"c-badge\" matTooltipPosition=\"above\" [matTooltip]=\"tooltip\"\r\n  [class]=\"{'c-secondary': color === 'normal', 'c-info': color === 'info', 'c-success': color === 'success', 'c-danger': color === 'danger', 'c-warning': color === 'warning'}\"\r\n  [class.pointer]=\"!!sdClick.observers?.length\"\r\n  (click)=\"onClick($event)\">\r\n  {{ title }}\r\n</div>\r\n<div *ngIf=\"type === 'circle'\" class=\"c-badge-circle d-flex align-items-center\" matTooltipPosition=\"above\"\r\n  [matTooltip]=\"tooltip\"\r\n  [class]=\"{'c-unknown': color === 'unknown', 'c-secondary': color === 'normal', 'c-info': color === 'info', 'c-success': color === 'success', 'c-danger': color === 'danger', 'c-warning': color === 'warning'}\"\r\n  [class.pointer]=\"!!sdClick.observers?.length\"\r\n  (click)=\"onClick($event)\">\r\n  <span class=\"c-material-icon mr-4\" [class]=\"{\r\n    'material-icons-outlined': color === 'unknown',\r\n    'material-icons-round': color !== 'unknown',\r\n    'c-badge-icon': icon === 'fiber_manual_record'\r\n  }\">\r\n    {{ icon }}\r\n  </span>\r\n  {{ title }}\r\n</div>",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [".c-badge{border-radius:20px;display:inline-block;margin-bottom:4px;min-width:150px;overflow-wrap:break-word;padding:2px 12px;text-align:center}.c-badge.c-primary{background:#e7e9ff;color:#2962ff}.c-badge.c-secondary{background:#e9e9e9;color:#212121}.c-badge.c-info{background:#e7e9ff;color:#2962ff}.c-badge.c-warning{background:#ffeacc;color:#ff9600}.c-badge.c-success{background:#dbefdc;color:#4caf50}.c-badge.c-danger{background:#fed5d0;color:#f82c13}.c-badge-circle{min-width:150px}.c-badge-circle .c-material-icon{font-size:16px;height:16px;width:16px}.c-badge-circle .c-material-icon.c-badge-icon{font-size:12px;height:12px;width:12px}.c-badge-circle.c-unknown{color:#212121}.c-badge-circle.c-unknown .c-material-icon{color:rgba(0,0,0,.5)}.c-badge-circle.c-secondary{color:#212121}.c-badge-circle.c-secondary .c-material-icon{color:rgba(0,0,0,.5)}.c-badge-circle.c-info{color:#2962ff}.c-badge-circle.c-success{color:#4caf50}.c-badge-circle.c-danger{color:#f82c13}.c-badge-circle.c-warning{color:#ff9600}"]
             },] }
 ];
 SdBadge.propDecorators = {
-    color: [{ type: Input }],
+    type: [{ type: Input }],
+    _color: [{ type: Input, args: ['color',] }],
     title: [{ type: Input }],
-    icon: [{ type: Input }]
+    tooltip: [{ type: Input }],
+    icon: [{ type: Input }],
+    sdClick: [{ type: Output }]
 };
 
 class SdBadgeModule {
 }
 SdBadgeModule.decorators = [
     { type: NgModule, args: [{
-                imports: [CommonModule, MatIconModule],
+                imports: [CommonModule, MatIconModule, MatTooltipModule],
                 declarations: [SdBadge],
                 exports: [SdBadge],
             },] }

package/fesm2015/sd-angular-core-badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-badge.js","sources":["../../../../projects/sd-core/badge/src/lib/badge.component.ts","../../../../projects/sd-core/badge/src/lib/badge.module.ts","../../../../projects/sd-core/badge/src/public-api.ts","../../../../projects/sd-core/badge/sd-angular-core-badge.ts"],"sourcesContent":["import { Component, Input } from \"@angular/core\";\r\n\r\nexport type SdBadgeColor = \"normal\" | \"info\" | \"success\" | \"warning\" | \"danger\";\r\n\r\n@Component({\r\n  selector: \"sd-badge\",\r\n  templateUrl: \"./badge.component.html\",\r\n  styleUrls: [\"./badge.component.scss\"],\r\n})\r\nexport class SdBadge {\r\n  @Input() color: SdBadgeColor;\r\n\r\n  @Input() title: string;\r\n\r\n  @Input() icon: string = \"fiber_manual_record\";\r\n}\r\n","import { NgModule } from \"@angular/core\";\r\nimport { CommonModule } from \"@angular/common\";\r\nimport { MatIconModule } from \"@angular/material/icon\";\r\n\r\nimport { SdBadge } from \"./badge.component\";\r\n\r\n@NgModule({\r\n  imports: [CommonModule, MatIconModule],\r\n  declarations: [SdBadge],\r\n  exports: [SdBadge],\r\n})\r\nexport class SdBadgeModule {}\r\n","/*\r\n * Public API Surface of superdev-angular-core\r\n */\r\n\r\nexport { SdBadgeModule } from \"./lib/badge.module\";\r\nexport * from \"./lib/badge.component\";\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MASa,OAAO;IALpB;QAUW,SAAI,GAAW,qBAAqB,CAAC;KAC/C;;;YAXA,SAAS,SAAC;gBACT,QAAQ,EAAE,UAAU;gBACpB,0mBAAqC;;aAEtC;;;oBAEE,KAAK;oBAEL,KAAK;mBAEL,KAAK;;;MCHK,aAAa;;;YALzB,QAAQ,SAAC;gBACR,OAAO,EAAE,CAAC,YAAY,EAAE,aAAa,CAAC;gBACtC,YAAY,EAAE,CAAC,OAAO,CAAC;gBACvB,OAAO,EAAE,CAAC,OAAO,CAAC;aACnB;;;ACVD;;;;ACAA;;;;;;"}
+{"version":3,"file":"sd-angular-core-badge.js","sources":["../../../../projects/sd-core/badge/src/lib/badge.component.ts","../../../../projects/sd-core/badge/src/lib/badge.module.ts","../../../../projects/sd-core/badge/src/public-api.ts","../../../../projects/sd-core/badge/sd-angular-core-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\r\n\r\nexport type SdBadgeColor = 'normal' | 'info' | 'success' | 'warning' | 'danger';\r\n\r\n@Component({\r\n  selector: 'sd-badge',\r\n  templateUrl: './badge.component.html',\r\n  styleUrls: ['./badge.component.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class SdBadge {\r\n  color: SdBadgeColor | 'unknown' = 'unknown';\r\n  @Input() type: 'circle' | 'round' = 'circle';\r\n  @Input('color') set _color(color: SdBadgeColor){\r\n    if(!color || !['normal', 'info', 'success', 'warning', 'danger'].includes(color)) {\r\n      this.color = 'unknown';\r\n    } else {\r\n      this.color = color;\r\n    }\r\n  };\r\n  @Input() title: string;\r\n  @Input() tooltip: string;\r\n\r\n  @Input() icon: string = 'fiber_manual_record';\r\n  @Output() sdClick = new EventEmitter();\r\n  onClick = (event: Event) => {\r\n    this.sdClick.observers.length\r\n    this.sdClick.emit(event);\r\n  }\r\n}\r\n","import { NgModule } from \"@angular/core\";\r\nimport { CommonModule } from \"@angular/common\";\r\nimport { MatIconModule } from \"@angular/material/icon\";\r\n\r\nimport { SdBadge } from \"./badge.component\";\r\nimport { MatTooltipModule } from \"@angular/material/tooltip\";\r\n\r\n@NgModule({\r\n  imports: [CommonModule, MatIconModule, MatTooltipModule],\r\n  declarations: [SdBadge],\r\n  exports: [SdBadge],\r\n})\r\nexport class SdBadgeModule {}\r\n","/*\r\n * Public API Surface of superdev-angular-core\r\n */\r\n\r\nexport { SdBadgeModule } from \"./lib/badge.module\";\r\nexport * from \"./lib/badge.component\";\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAUa,OAAO;IANpB;QAOE,UAAK,GAA6B,SAAS,CAAC;QACnC,SAAI,GAAuB,QAAQ,CAAC;QAWpC,SAAI,GAAW,qBAAqB,CAAC;QACpC,YAAO,GAAG,IAAI,YAAY,EAAE,CAAC;QACvC,YAAO,GAAG,CAAC,KAAY;YACrB,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAA;YAC7B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAC1B,CAAA;KACF;IAhBC,IAAoB,MAAM,CAAC,KAAmB;QAC5C,IAAG,CAAC,KAAK,IAAI,CAAC,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;YAChF,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;SACxB;aAAM;YACL,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;SACpB;KACF;;;;YAfF,SAAS,SAAC;gBACT,QAAQ,EAAE,UAAU;gBACpB,qnCAAqC;gBAErC,eAAe,EAAE,uBAAuB,CAAC,MAAM;;aAChD;;;mBAGE,KAAK;qBACL,KAAK,SAAC,OAAO;oBAOb,KAAK;sBACL,KAAK;mBAEL,KAAK;sBACL,MAAM;;;MCZI,aAAa;;;YALzB,QAAQ,SAAC;gBACR,OAAO,EAAE,CAAC,YAAY,EAAE,aAAa,EAAE,gBAAgB,CAAC;gBACxD,YAAY,EAAE,CAAC,OAAO,CAAC;gBACvB,OAAO,EAAE,CAAC,OAAO,CAAC;aACnB;;;ACXD;;;;ACAA;;;;;;"}

package/fesm2015/sd-angular-core-date-range.js

@@ -15,7 +15,7 @@ import { debounceTime } from 'rxjs/operators';
 import { MatIconModule } from '@angular/material/icon';
 import { SdTranslateModule } from '@sd-angular/core/translate';
 
-var _from, _to, _form, _c1, _c2, _subscription, _onChanges;
+var _from, _to, _name, _form, _c1, _c2, _subscription, _onChanges;
 const CUSTOM_DATE_FORMATS = {
     parse: {
         dateInput: 'DD/MM/YYYY'
@@ -36,9 +36,11 @@ class SdDateRange {
         _from.set(this, null);
         _to.set(this, null);
         this.isMobileOrTablet = false;
+        _name.set(this, v4());
         _form.set(this, void 0);
-        this.disabled = false;
+        this.formControl = new FormControl();
         this.required = false;
+        this.disableErrorMessage = false;
         this.sdChange = new EventEmitter();
         this.fromChange = new EventEmitter();
         this.toChange = new EventEmitter();
@@ -56,6 +58,12 @@ class SdDateRange {
             this.control2.setValue(to, {
                 emitEvent: false
             });
+            this.formControl.setValue({
+                from: from,
+                to: to
+            }, {
+                emitEvent: false
+            });
         });
         this.onStartChange = (event) => {
             var _a;
@@ -92,17 +100,25 @@ class SdDateRange {
             this.control2.setValue(null, {
                 emitEvent: false
             });
+            this.formControl.setValue({
+                from: null,
+                to: null
+            }, {
+                emitEvent: false
+            });
             __classPrivateFieldSet(this, _from, null);
             __classPrivateFieldSet(this, _to, null);
             this.fromChange.emit(null);
             this.toChange.emit(null);
-            this.sdChange.emit({
-                from: null,
-                to: null
-            });
+            this.sdChange.emit(this.formControl.value);
         };
         this.isMobileOrTablet = !this.detectorService.isDesktop();
     }
+    set name(val) {
+        if (val) {
+            __classPrivateFieldSet(this, _name, val);
+        }
+    }
     set form(val) {
         if (val) {
             if (val instanceof NgForm) {
@@ -113,6 +129,20 @@ class SdDateRange {
             }
         }
     }
+    // @Input() disabled = false;
+    set disabled(val) {
+        val = (val === '') || val;
+        if (val) {
+            this.formControl.disable();
+        }
+        else {
+            this.formControl.enable();
+        }
+    }
+    set _disableErrorMessage(val) {
+        this.disableErrorMessage = (val === '') || val;
+        val = (val === '') || val;
+    }
     set _min(val) {
         if (Date.isDate(val)) {
             this.min = new Date(val);
@@ -148,15 +178,17 @@ class SdDateRange {
         }
     }
     ngOnDestroy() {
-        var _a, _b;
+        var _a, _b, _c;
         (_a = __classPrivateFieldGet(this, _form)) === null || _a === void 0 ? void 0 : _a.removeControl(__classPrivateFieldGet(this, _c1));
         (_b = __classPrivateFieldGet(this, _form)) === null || _b === void 0 ? void 0 : _b.removeControl(__classPrivateFieldGet(this, _c2));
+        (_c = __classPrivateFieldGet(this, _form)) === null || _c === void 0 ? void 0 : _c.removeControl(__classPrivateFieldGet(this, _name));
         __classPrivateFieldGet(this, _subscription).unsubscribe();
     }
     ngOnInit() {
-        var _a, _b;
+        var _a, _b, _c;
         (_a = __classPrivateFieldGet(this, _form)) === null || _a === void 0 ? void 0 : _a.addControl(__classPrivateFieldGet(this, _c1), this.control1);
         (_b = __classPrivateFieldGet(this, _form)) === null || _b === void 0 ? void 0 : _b.addControl(__classPrivateFieldGet(this, _c2), this.control2);
+        (_c = __classPrivateFieldGet(this, _form)) === null || _c === void 0 ? void 0 : _c.addControl(__classPrivateFieldGet(this, _name), this.formControl);
     }
     ngAfterViewInit() {
         __classPrivateFieldGet(this, _subscription).add(merge(this.control1.valueChanges, this.control2.valueChanges).pipe(debounceTime(500)).subscribe(() => {
@@ -181,24 +213,26 @@ class SdDateRange {
         __classPrivateFieldGet(this, _onChanges).call(this);
     }
 }
-_from = new WeakMap(), _to = new WeakMap(), _form = new WeakMap(), _c1 = new WeakMap(), _c2 = new WeakMap(), _subscription = new WeakMap(), _onChanges = new WeakMap();
+_from = new WeakMap(), _to = new WeakMap(), _name = new WeakMap(), _form = new WeakMap(), _c1 = new WeakMap(), _c2 = new WeakMap(), _subscription = new WeakMap(), _onChanges = new WeakMap();
 SdDateRange.decorators = [
     { type: Component, args: [{
                 selector: 'sd-date-range',
-                template: "<mat-form-field class=\"sd-md\" [ngClass]=\"{'sd-sm': size === 'sm'}\" appearance=\"outline\">\r\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n  <mat-date-range-input [max]=\"max\" [min]=\"min\" [rangePicker]=\"picker\" [disabled]=\"disabled\">\r\n    <input [id]=\"id1\" autocomplete=\"off\" autocorrect=\"off\" matStartDate [formControl]=\"control1\"\r\n      (dateInput)=\"onStartChange($event)\" [placeholder]=\"'Start' | sdTranslate\">\r\n    <input [id]=\"id2\" [autocomplete]=\"id2\" autocorrect=\"off\" matEndDate [formControl]=\"control2\" (dateInput)=\"onEndChange($event)\" [placeholder]=\"'End' | sdTranslate\">\r\n  </mat-date-range-input>\r\n  <mat-icon *ngIf=\"control1?.value || control2?.value\" class=\"pointer sd-suffix-icon\" (click)=\"clear()\" matSuffix>cancel\r\n  </mat-icon>\r\n  <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!disabled && picker.open()\" matSuffix>today\r\n  </mat-icon>\r\n  <mat-date-range-picker [touchUi]=\"isMobileOrTablet\" #picker></mat-date-range-picker>\r\n</mat-form-field>",
+                template: "<mat-form-field class=\"sd-md\" [ngClass]=\"{'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage}\" appearance=\"outline\">\r\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n  <mat-date-range-input [max]=\"max\" [min]=\"min\" [rangePicker]=\"picker\" [disabled]=\"formControl.disabled\">\r\n    <input [id]=\"id1\" autocomplete=\"off\" autocorrect=\"off\" matStartDate [formControl]=\"control1\"\r\n      (dateInput)=\"onStartChange($event)\" [placeholder]=\"formControl.disabled ? '' : ('Start' | sdTranslate)\">\r\n    <input [id]=\"id2\" [autocomplete]=\"id2\" autocorrect=\"off\" matEndDate [formControl]=\"control2\"\r\n      (dateInput)=\"onEndChange($event)\" [placeholder]=\"formControl.disabled ? '' : ('End' | sdTranslate)\">\r\n  </mat-date-range-input>\r\n  <mat-icon *ngIf=\"control1?.value || control2?.value\" class=\"pointer sd-suffix-icon\" (click)=\"clear()\" matSuffix>cancel\r\n  </mat-icon>\r\n  <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!formControl.disabled && picker.open()\" matSuffix>today\r\n  </mat-icon>\r\n  <mat-date-range-picker [touchUi]=\"isMobileOrTablet\" #picker></mat-date-range-picker>\r\n</mat-form-field>",
                 providers: [{ provide: MAT_DATE_FORMATS, useValue: ɵ0 }],
-                styles: [":host{display:block;padding-top:5px}:host ::ng-deep .mat-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline{background:#f6f6f6;color:#e9e9e9}:host ::ng-deep .mat-form-field input.mat-end-date:disabled,:host ::ng-deep .mat-form-field input.mat-start-date:disabled{color:#4d4d4d!important}:host ::ng-deep .mat-form-field .mat-placeholder-required{color:#f82c13}"]
+                styles: [":host{display:block;padding-top:5px}:host ::ng-deep .mat-form-field.no-padding-wrapper .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .mat-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline{background:#f6f6f6;color:#e9e9e9}:host ::ng-deep .mat-form-field input.mat-end-date:disabled,:host ::ng-deep .mat-form-field input.mat-start-date:disabled{color:#4d4d4d!important}:host ::ng-deep .mat-form-field .mat-placeholder-required{color:#f82c13}"]
             },] }
 ];
 SdDateRange.ctorParameters = () => [
     { type: DeviceDetectorService }
 ];
 SdDateRange.propDecorators = {
+    name: [{ type: Input }],
     size: [{ type: Input }],
     form: [{ type: Input }],
     disabled: [{ type: Input }],
     required: [{ type: Input }],
     label: [{ type: Input }],
+    _disableErrorMessage: [{ type: Input, args: ['disableErrorMessage',] }],
     _min: [{ type: Input, args: ['min',] }],
     _max: [{ type: Input, args: ['max',] }],
     from: [{ type: Input }],

package/fesm2015/sd-angular-core-date-range.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-date-range.js","sources":["../../../../projects/sd-core/date-range/src/lib/date-range.component.ts","../../../../projects/sd-core/date-range/src/lib/date-range.module.ts","../../../../projects/sd-core/date-range/sd-angular-core-date-range.ts"],"sourcesContent":["import {\r\n  Component,\r\n  Input,\r\n  EventEmitter,\r\n  Output,\r\n  OnDestroy,\r\n  AfterViewInit,\r\n  OnInit\r\n} from '@angular/core';\r\n\r\nimport { FormControl, FormGroup, NgForm } from '@angular/forms';\r\nimport { MatDatepickerInputEvent, } from '@angular/material/datepicker';\r\nimport { MAT_DATE_FORMATS } from '@angular/material/core';\r\nimport { DeviceDetectorService } from 'ngx-device-detector';\r\nimport moment, { Moment } from 'moment';\r\nimport * as uuid from 'uuid';\r\nimport { merge, Subscription } from 'rxjs';\r\nimport { debounceTime } from 'rxjs/operators';\r\nimport '@sd-angular/core/typing';\r\n\r\nconst CUSTOM_DATE_FORMATS = {\r\n  parse: {\r\n    dateInput: 'DD/MM/YYYY'\r\n  },\r\n  display: {\r\n    dateInput: 'DD/MM/YYYY',\r\n    monthYearLabel: 'MMM YYYY',\r\n    dateA11yLabel: 'LL',\r\n    monthYearA11yLabel: 'MMMM YYYY'\r\n  }\r\n};\r\n\r\n@Component({\r\n  selector: 'sd-date-range',\r\n  templateUrl: './date-range.component.html',\r\n  styleUrls: ['./date-range.component.scss'],\r\n  providers: [{ provide: MAT_DATE_FORMATS, useValue: CUSTOM_DATE_FORMATS }],\r\n})\r\nexport class SdDateRange implements OnDestroy, OnInit, AfterViewInit {\r\n  id1 = `I${uuid.v4()}`;\r\n  id2 = `I${uuid.v4()}`;\r\n  #from: any = null;\r\n  #to: any = null;\r\n  isMobileOrTablet = false;\r\n  @Input() size: 'sm' | 'lg';\r\n  #form: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n  @Input() disabled = false;\r\n  @Input() required = false;\r\n  @Input() label: string;\r\n  min: Date;\r\n  @Input('min') set _min(val: string) {\r\n    if (Date.isDate(val)) {\r\n      this.min = new Date(val);\r\n    } else {\r\n      this.min = null;\r\n    }\r\n  }\r\n  max: Date;\r\n  @Input('max') set _max(val: string) {\r\n    if (Date.isDate(val)) {\r\n      this.max = new Date(val);\r\n    } else {\r\n      this.max = null;\r\n    }\r\n  }\r\n  @Input() set from(val: any) {\r\n    if (!Date.isDate(val)) {\r\n      val = null;\r\n    }\r\n    if (this.#from !== val) {\r\n      this.#from = val;\r\n      this.#onChanges();\r\n    }\r\n  }\r\n  @Input() set to(val: any) {\r\n    if (!Date.isDate(val)) {\r\n      val = null;\r\n    }\r\n    if (this.#to !== val) {\r\n      this.#to = val;\r\n      this.#onChanges();\r\n    }\r\n  }\r\n  @Output() sdChange = new EventEmitter<{ from: Date, to: Date }>();\r\n  @Output() fromChange = new EventEmitter();\r\n  @Output() toChange = new EventEmitter();\r\n\r\n  control1 = new FormControl();\r\n  #c1 = uuid.v4();\r\n  control2 = new FormControl();\r\n  #c2 = uuid.v4();\r\n  #subscription = new Subscription();\r\n  constructor(\r\n    private detectorService: DeviceDetectorService) {\r\n    this.isMobileOrTablet = !this.detectorService.isDesktop();\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#c1);\r\n    this.#form?.removeControl(this.#c2);\r\n    this.#subscription.unsubscribe();\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#form?.addControl(this.#c1, this.control1);\r\n    this.#form?.addControl(this.#c2, this.control2);\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n    this.#subscription.add(merge(this.control1.valueChanges, this.control2.valueChanges).pipe(debounceTime(500)).subscribe(() => {\r\n      const from = this.control1.value?.toDate() || null;\r\n      const to = this.control2.value?.toDate() || null;\r\n      if (this.#from !== from || this.#to !== to) {\r\n        if (from && to) {\r\n          this.sdChange.emit({\r\n            from,\r\n            to\r\n          });\r\n        } else if (!from && !to) {\r\n          this.sdChange.emit({\r\n            from: null,\r\n            to: null\r\n          });\r\n        }\r\n      }\r\n    }));\r\n    this.#onChanges();\r\n  }\r\n\r\n  #onChanges = () => {\r\n    const from = Date.isDate(this.#from) ? moment(Date.toFormat(this.#from, 'MM/dd/yyyy HH:mm:ss'), 'MM/DD/YYYY HH:mm:ss') :  null;\r\n    const to = Date.isDate(this.#to) ? moment(Date.toFormat(this.#to, 'MM/dd/yyyy HH:mm:ss'), 'MM/DD/YYYY HH:mm:ss') :  null;\r\n    this.control1.setValue(from, {\r\n      emitEvent: false\r\n    });\r\n    this.control2.setValue(to, {\r\n      emitEvent: false\r\n    });\r\n  }\r\n\r\n  onStartChange = (event: MatDatepickerInputEvent<Moment>) => {\r\n    const value = event.value?.toDate() || null;\r\n    if (value) {\r\n      if (new Date(this.#from) !== value) {\r\n        this.#from = value;\r\n        this.fromChange.emit(value);\r\n      }\r\n    } else {\r\n      this.#from = null;\r\n      this.fromChange.emit(null);\r\n    }\r\n  }\r\n\r\n  onEndChange = (event: MatDatepickerInputEvent<Moment>) => {\r\n    const value = event.value?.toDate() || null;\r\n    if (value) {\r\n      if (new Date(this.#to) !== value) {\r\n        this.#to = value;\r\n        this.toChange.emit(value);\r\n      }\r\n    } else {\r\n      this.#to = null;\r\n      this.toChange.emit(null);\r\n    }\r\n  }\r\n\r\n  clear = () => {\r\n    this.control1.setValue(null, {\r\n      emitEvent: false\r\n    });\r\n    this.control2.setValue(null, {\r\n      emitEvent: false\r\n    });\r\n    this.#from = null;\r\n    this.#to = null;\r\n    this.fromChange.emit(null);\r\n    this.toChange.emit(null);\r\n    this.sdChange.emit({\r\n      from: null,\r\n      to: null\r\n    });\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatDatepickerModule } from '@angular/material/datepicker';\r\nimport { MatMomentDateModule } from '@angular/material-moment-adapter';\r\nimport { SdDateRange } from './date-range.component';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport '@sd-angular/core/typing';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    MatFormFieldModule,\r\n    MatIconModule,\r\n    MatDatepickerModule,\r\n    MatMomentDateModule,\r\n    SdTranslateModule\r\n  ],\r\n  declarations: [\r\n    SdDateRange\r\n  ],\r\n  exports: [\r\n    SdDateRange\r\n  ],\r\n  providers: [\r\n  ]\r\n})\r\nexport class SdDateRangeModule {\r\n\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}
+{"version":3,"file":"sd-angular-core-date-range.js","sources":["../../../../projects/sd-core/date-range/src/lib/date-range.component.ts","../../../../projects/sd-core/date-range/src/lib/date-range.module.ts","../../../../projects/sd-core/date-range/sd-angular-core-date-range.ts"],"sourcesContent":["import {\r\n  Component,\r\n  Input,\r\n  EventEmitter,\r\n  Output,\r\n  OnDestroy,\r\n  AfterViewInit,\r\n  OnInit\r\n} from '@angular/core';\r\n\r\nimport { FormControl, FormGroup, NgForm } from '@angular/forms';\r\nimport { MatDatepickerInputEvent, } from '@angular/material/datepicker';\r\nimport { MAT_DATE_FORMATS } from '@angular/material/core';\r\nimport { DeviceDetectorService } from 'ngx-device-detector';\r\nimport moment, { Moment } from 'moment';\r\nimport * as uuid from 'uuid';\r\nimport { merge, Subscription } from 'rxjs';\r\nimport { debounceTime } from 'rxjs/operators';\r\nimport '@sd-angular/core/typing';\r\n\r\nconst CUSTOM_DATE_FORMATS = {\r\n  parse: {\r\n    dateInput: 'DD/MM/YYYY'\r\n  },\r\n  display: {\r\n    dateInput: 'DD/MM/YYYY',\r\n    monthYearLabel: 'MMM YYYY',\r\n    dateA11yLabel: 'LL',\r\n    monthYearA11yLabel: 'MMMM YYYY'\r\n  }\r\n};\r\n\r\n@Component({\r\n  selector: 'sd-date-range',\r\n  templateUrl: './date-range.component.html',\r\n  styleUrls: ['./date-range.component.scss'],\r\n  providers: [{ provide: MAT_DATE_FORMATS, useValue: CUSTOM_DATE_FORMATS }],\r\n})\r\nexport class SdDateRange implements OnDestroy, OnInit, AfterViewInit {\r\n  id1 = `I${uuid.v4()}`;\r\n  id2 = `I${uuid.v4()}`;\r\n  #from: any = null;\r\n  #to: any = null;\r\n  isMobileOrTablet = false;\r\n  #name = uuid.v4();\r\n  @Input() set name(val: string) {\r\n    if (val) {\r\n      this.#name = val;\r\n    }\r\n  }\r\n  @Input() size: 'sm' | 'lg';\r\n  #form: FormGroup;\r\n  formControl = new FormControl();\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n  // @Input() disabled = false;\r\n  @Input() set disabled(val: boolean | '') {\r\n    val = (val === '') || val;\r\n    if (val) {\r\n      this.formControl.disable();\r\n    } else {\r\n      this.formControl.enable();\r\n    }\r\n  }\r\n  @Input() required = false;\r\n  @Input() label: string;\r\n  disableErrorMessage = false;\r\n  @Input('disableErrorMessage') set _disableErrorMessage(val: boolean | '') {\r\n    this.disableErrorMessage = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  min: Date;\r\n  @Input('min') set _min(val: string) {\r\n    if (Date.isDate(val)) {\r\n      this.min = new Date(val);\r\n    } else {\r\n      this.min = null;\r\n    }\r\n  }\r\n  max: Date;\r\n  @Input('max') set _max(val: string) {\r\n    if (Date.isDate(val)) {\r\n      this.max = new Date(val);\r\n    } else {\r\n      this.max = null;\r\n    }\r\n  }\r\n  @Input() set from(val: any) {\r\n    if (!Date.isDate(val)) {\r\n      val = null;\r\n    }\r\n    if (this.#from !== val) {\r\n      this.#from = val;\r\n      this.#onChanges();\r\n    }\r\n  }\r\n  @Input() set to(val: any) {\r\n    if (!Date.isDate(val)) {\r\n      val = null;\r\n    }\r\n    if (this.#to !== val) {\r\n      this.#to = val;\r\n      this.#onChanges();\r\n    }\r\n  }\r\n  @Output() sdChange = new EventEmitter<{ from: Date, to: Date }>();\r\n  @Output() fromChange = new EventEmitter();\r\n  @Output() toChange = new EventEmitter();\r\n\r\n  control1 = new FormControl();\r\n  #c1 = uuid.v4();\r\n  control2 = new FormControl();\r\n  #c2 = uuid.v4();\r\n  #subscription = new Subscription();\r\n  constructor(\r\n    private detectorService: DeviceDetectorService) {\r\n    this.isMobileOrTablet = !this.detectorService.isDesktop();\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#c1);\r\n    this.#form?.removeControl(this.#c2);\r\n    this.#form?.removeControl(this.#name);\r\n    this.#subscription.unsubscribe();\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#form?.addControl(this.#c1, this.control1);\r\n    this.#form?.addControl(this.#c2, this.control2);\r\n    this.#form?.addControl(this.#name, this.formControl);\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n    this.#subscription.add(merge(this.control1.valueChanges, this.control2.valueChanges).pipe(debounceTime(500)).subscribe(() => {\r\n      const from = this.control1.value?.toDate() || null;\r\n      const to = this.control2.value?.toDate() || null;\r\n      if (this.#from !== from || this.#to !== to) {\r\n        if (from && to) {\r\n          this.sdChange.emit({\r\n            from,\r\n            to\r\n          });\r\n        } else if (!from && !to) {\r\n          this.sdChange.emit({\r\n            from: null,\r\n            to: null\r\n          });\r\n        }\r\n      }\r\n    }));\r\n    this.#onChanges();\r\n  }\r\n\r\n  #onChanges = () => {\r\n    const from = Date.isDate(this.#from) ? moment(Date.toFormat(this.#from, 'MM/dd/yyyy HH:mm:ss'), 'MM/DD/YYYY HH:mm:ss') :  null;\r\n    const to = Date.isDate(this.#to) ? moment(Date.toFormat(this.#to, 'MM/dd/yyyy HH:mm:ss'), 'MM/DD/YYYY HH:mm:ss') :  null;\r\n    this.control1.setValue(from, {\r\n      emitEvent: false\r\n    });\r\n    this.control2.setValue(to, {\r\n      emitEvent: false\r\n    });\r\n    this.formControl.setValue({\r\n      from: from,\r\n      to: to\r\n    }, {\r\n      emitEvent: false\r\n    });\r\n  }\r\n\r\n  onStartChange = (event: MatDatepickerInputEvent<Moment>) => {\r\n    const value = event.value?.toDate() || null;\r\n    if (value) {\r\n      if (new Date(this.#from) !== value) {\r\n        this.#from = value;\r\n        this.fromChange.emit(value);\r\n      }\r\n    } else {\r\n      this.#from = null;\r\n      this.fromChange.emit(null);\r\n    }\r\n  }\r\n\r\n  onEndChange = (event: MatDatepickerInputEvent<Moment>) => {\r\n    const value = event.value?.toDate() || null;\r\n    if (value) {\r\n      if (new Date(this.#to) !== value) {\r\n        this.#to = value;\r\n        this.toChange.emit(value);\r\n      }\r\n    } else {\r\n      this.#to = null;\r\n      this.toChange.emit(null);\r\n    }\r\n  }\r\n\r\n  clear = () => {\r\n    this.control1.setValue(null, {\r\n      emitEvent: false\r\n    });\r\n    this.control2.setValue(null, {\r\n      emitEvent: false\r\n    });\r\n    this.formControl.setValue({\r\n      from: null,\r\n      to: null\r\n    }, {\r\n      emitEvent: false\r\n    });\r\n    this.#from = null;\r\n    this.#to = null;\r\n    this.fromChange.emit(null);\r\n    this.toChange.emit(null);\r\n    this.sdChange.emit(this.formControl.value);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatDatepickerModule } from '@angular/material/datepicker';\r\nimport { MatMomentDateModule } from '@angular/material-moment-adapter';\r\nimport { SdDateRange } from './date-range.component';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport '@sd-angular/core/typing';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    MatFormFieldModule,\r\n    MatIconModule,\r\n    MatDatepickerModule,\r\n    MatMomentDateModule,\r\n    SdTranslateModule\r\n  ],\r\n  declarations: [\r\n    SdDateRange\r\n  ],\r\n  exports: [\r\n    SdDateRange\r\n  ],\r\n  providers: [\r\n  ]\r\n})\r\nexport class SdDateRangeModule {\r\n\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}

package/fesm2015/sd-angular-core-date-time.js

@@ -1,5 +1,5 @@
 import '@sd-angular/core/typing';
-import { EventEmitter, Component, ChangeDetectorRef, Input, Output, NgModule } from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, ChangeDetectorRef, Input, Output, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormControl, NgForm, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatFormFieldModule } from '@angular/material/form-field';
@@ -194,6 +194,7 @@ SdDateTime.decorators = [
     { type: Component, args: [{
                 selector: 'sd-date-time',
                 template: "<div class=\"d-flex align-items-center\">\r\n  <mat-form-field *ngIf=\"type === 'datetime' || type === 'time'\" class=\"sd-md\"\r\n    [ngClass]=\"{ 'sd-sm': size === 'sm', 'no-padding-wrapper': disableErrorMessage }\" appearance=\"outline\">\r\n    <mat-label *ngIf=\"label\">{{ label }}</mat-label>\r\n    <input [id]=\"id\" matInput (dateInput)=\"onChange($event)\" [value]=\"date\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n      [autocomplete]=\"id\" autocorrect=\"off\" [formControl]=\"dateControl\" [ngxMatDatetimePicker]=\"picker1\"\r\n      placeholder=\"{{ placeholder || label }}\" [min]=\"min\" [required]=\"isRequired\" [max]=\"max\" />\r\n    <!-- <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!dateControl?.disabled && picker1.open()\" matSuffix>today\r\n      </mat-icon> -->\r\n    <mat-icon *ngIf=\"dateControl?.value && !isRequired && !dateControl.disabled\" class=\"pointer sd-suffix-icon\"\r\n      (click)=\"clear($event)\" matSuffix>cancel\r\n    </mat-icon>\r\n    <mat-datepicker-toggle matSuffix [for]=\"picker1\"></mat-datepicker-toggle>\r\n    <ngx-mat-datetime-picker #picker1 [defaultTime]=\"defaultTime\" [touchUi]=\"isMobileOrTablet\" [showSpinners]=\"false\">\r\n    </ngx-mat-datetime-picker>\r\n\r\n    <mat-error *ngIf=\"dateControl?.errors?.required && !disableErrorMessage\">\r\n      {{ \"This field is required\" | sdTranslate }}\r\n    </mat-error>\r\n    <mat-error *ngIf=\"dateControl?.errors?.matDatetimePickerMin && !disableErrorMessage\">\r\n      {{ \"Min date\" | sdTranslate }}:\r\n      <strong>{{ min | date: \"dd/MM/yyyy HH:mm\" }}</strong>\r\n    </mat-error>\r\n    <mat-error *ngIf=\"dateControl?.errors?.matDatetimePickerMax && !disableErrorMessage\">\r\n      {{ \"Max date\" | sdTranslate }}:\r\n      <strong>{{ max | date: \"dd/MM/yyyy HH:mm\" }}</strong>\r\n    </mat-error>\r\n    <mat-error *ngIf=\"dateControl?.errors?.matDatetimePickerParse && !disableErrorMessage\">\r\n      {{ \"Parse error\" | sdTranslate }}:\r\n      <strong>{{ dateControl?.errors?.matDatetimePickerParse?.text }}</strong>\r\n    </mat-error>\r\n    <mat-error *ngIf=\"dateControl?.errors?.customValidator && !disableErrorMessage\">\r\n      <strong>{{ dateControl?.errors?.customValidator }}</strong>\r\n    </mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field *ngIf=\"type === 'date'\" class=\"sd-md\"\r\n    [ngClass]=\"{ 'sd-sm': size === 'sm' , 'no-padding-wrapper': disableErrorMessage}\" appearance=\"outline\">\r\n    <mat-label *ngIf=\"label\">{{ label }}</mat-label>\r\n    <input [id]=\"id\" matInput (dateInput)=\"onChange($event)\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [autocomplete]=\"id\"\r\n      autocorrect=\"off\" [formControl]=\"dateControl\" [required]=\"isRequired\" [matDatepicker]=\"picker2\"\r\n      placeholder=\"{{ placeholder || label }}\" [min]=\"min\" [max]=\"max\" />\r\n    <mat-icon *ngIf=\"dateControl?.value && !isRequired && !dateControl.disabled\" class=\"pointer sd-suffix-icon\"\r\n      (click)=\"clear($event)\" matSuffix>cancel\r\n    </mat-icon>\r\n\r\n    <mat-icon class=\"pointer sd-suffix-icon\" (click)=\"!dateControl?.disabled && picker2.open()\" matSuffix>today\r\n    </mat-icon>\r\n\r\n    <mat-datepicker #picker2 [touchUi]=\"isMobileOrTablet\"></mat-datepicker>\r\n\r\n    <mat-error *ngIf=\"dateControl?.errors?.required && !disableErrorMessage\">\r\n      {{ \"This field is required\" | sdTranslate }}\r\n    </mat-error>\r\n    <mat-error *ngIf=\"dateControl?.errors?.customValidator && !disableErrorMessage\">\r\n      <strong>{{ dateControl?.errors?.customValidator }}</strong>\r\n    </mat-error>\r\n  </mat-form-field>\r\n  <!-- <ngx-mat-timepicker *ngIf=\"type === 'time'\" formControlName=\"name\" [disabled]=\"disabled\" showSpinners=\"false\" stepHour=\"1\"\r\n  stepMinute=\"1\" stepSecond=\"1\">\r\n</ngx-mat-timepicker> -->\r\n</div>",
+                changeDetection: ChangeDetectionStrategy.OnPush,
                 providers: [
                     { provide: MAT_DATE_FORMATS, useValue: ɵ0 },
                     { provide: NGX_MAT_DATE_FORMATS, useValue: ɵ1 }

package/fesm2015/sd-angular-core-date-time.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-date-time.js","sources":["../../../../projects/sd-core/date-time/src/lib/date-time.component.ts","../../../../projects/sd-core/date-time/src/lib/date-time.module.ts","../../../../projects/sd-core/date-time/sd-angular-core-date-time.ts"],"sourcesContent":["import {\r\n  Component,\r\n  Input,\r\n  EventEmitter,\r\n  Output,\r\n  OnDestroy,\r\n  AfterViewInit,\r\n  ChangeDetectorRef,\r\n  OnInit,\r\n  ViewChild\r\n} from '@angular/core';\r\nimport * as uuid from 'uuid';\r\nimport moment, { Moment } from 'moment';\r\nimport { FormControl, FormGroup, NgForm, Validators } from '@angular/forms';\r\nimport { DeviceDetectorService } from 'ngx-device-detector';\r\nimport { MatDatepickerInputEvent } from '@angular/material/datepicker';\r\nimport { NGX_MAT_DATE_FORMATS, } from '@angular-material-components/datetime-picker';\r\nimport { MAT_DATE_FORMATS } from '@angular/material/core';\r\nimport '@sd-angular/core/typing';\r\n\r\nconst CUSTOM_DATETIME_FORMATS = {\r\n  parse: {\r\n    dateInput: 'DD/MM/YYYY HH:mm'\r\n  },\r\n  display: {\r\n    dateInput: 'DD/MM/YYYY HH:mm',\r\n    monthYearLabel: 'MMM YYYY',\r\n    dateA11yLabel: 'LL',\r\n    monthYearA11yLabel: 'MMMM YYYY'\r\n  }\r\n};\r\nconst CUSTOM_DATE_FORMATS = {\r\n  parse: {\r\n    dateInput: 'DD/MM/YYYY'\r\n  },\r\n  display: {\r\n    dateInput: 'DD/MM/YYYY',\r\n    monthYearLabel: 'MMM YYYY',\r\n    dateA11yLabel: 'LL',\r\n    monthYearA11yLabel: 'MMMM YYYY'\r\n  }\r\n};\r\n@Component({\r\n  selector: 'sd-date-time',\r\n  templateUrl: './date-time.component.html',\r\n  styleUrls: ['./date-time.component.scss'],\r\n  providers: [\r\n    { provide: MAT_DATE_FORMATS, useValue: CUSTOM_DATE_FORMATS },\r\n    { provide: NGX_MAT_DATE_FORMATS, useValue: CUSTOM_DATETIME_FORMATS }\r\n  ]\r\n})\r\nexport class SdDateTime implements OnDestroy, OnInit, AfterViewInit {\r\n  id = `I${uuid.v4()}`;\r\n  isMobileOrTablet = false;\r\n  #date: any;\r\n  #name = uuid.v4();\r\n  @Input() set name(val: string) {\r\n    if (val) {\r\n      this.#name = val;\r\n    }\r\n  }\r\n  disableErrorMessage = false;\r\n  @Input('disableErrorMessage') set _disableErrorMessage(val: boolean | '') {\r\n    this.disableErrorMessage = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  dateControl = new FormControl();\r\n  min: Date;\r\n  @Input('min') set _min(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.min = new Date(val);\r\n    } else {\r\n      this.min = null;\r\n    }\r\n  }\r\n  max: Date;\r\n  @Input('max') set _max(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.max = new Date(val);\r\n    } else {\r\n      this.max = null;\r\n    }\r\n  }\r\n  @Input() size: 'sm' | 'lg';\r\n  #form: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n  @Input() type: 'datetime' | 'date' | 'time' = 'datetime';\r\n  @Input() set disabled(val: boolean | '') {\r\n    val = (val === '') || val;\r\n    if (val) {\r\n      this.dateControl.disable();\r\n    } else {\r\n      this.dateControl.enable();\r\n    }\r\n  }\r\n  isRequired = false;\r\n  @Input() set required(val: boolean | '') {\r\n    this.isRequired = (val === '') || val;\r\n    if (this.isRequired) {\r\n      this.dateControl.setValidators([Validators.required]);\r\n    } else {\r\n      this.dateControl.clearValidators();\r\n    }\r\n  }\r\n  @Input() label: string;\r\n  @Input() placeholder: string;\r\n  @Input() defaultTime: any;\r\n  @Input() set minDate(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.min = new Date(val);\r\n    } else {\r\n      this.min = null;\r\n    }\r\n  }\r\n  @Input() set maxDate(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.max = new Date(val);\r\n    } else {\r\n      this.max = null;\r\n    }\r\n  }\r\n  @Input() validator: (value: any) => string | Promise<string>;\r\n  @Output() sdChange = new EventEmitter();\r\n  date: any;\r\n\r\n  @Input() set model(val: any) {\r\n    if (!Date.isDate(val)) {\r\n      val = null;\r\n    }\r\n    if (this.#date !== val) {\r\n      this.#date = val;\r\n      const date = Date.isDate(this.#date) ? moment(Date.toFormat(this.#date, 'MM/dd/yyyy HH:mm:ss'), 'MM/DD/YYYY HH:mm:ss') : null;\r\n      this.dateControl.setValue(date);\r\n    }\r\n  }\r\n  @Output() modelChange = new EventEmitter();\r\n  constructor(\r\n    private ref: ChangeDetectorRef,\r\n    deviceService: DeviceDetectorService) {\r\n    this.isMobileOrTablet = !deviceService.isDesktop();\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#name);\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#form?.addControl(this.#name, this.dateControl);\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n  }\r\n\r\n  onBlur = () => {\r\n    // const value = this.dateControl.value?.toDate();\r\n    // if (value) {\r\n    //   if (new Date(this.#date) !== value) {\r\n    //     this.modelChange.emit(value);\r\n    //     this.sdChange.emit(value);\r\n    //   }\r\n    // } else {\r\n    //   if (!this.dateControl?.value) {\r\n    //     this.modelChange.emit(null);\r\n    //     this.sdChange.emit(null);\r\n    //   }\r\n    // }\r\n  }\r\n\r\n  onFocus = () => {\r\n    if (this.isMobileOrTablet) {\r\n      // $(this.control.nativeElement).trigger('blur');\r\n    }\r\n  }\r\n\r\n  onChange = (event: MatDatepickerInputEvent<Moment>) => {\r\n    const value = event.value?.toDate();\r\n    if (value) {\r\n      if (new Date(this.#date) !== value) {\r\n        this.modelChange.emit(value);\r\n        this.sdChange.emit(value);\r\n      }\r\n    } else {\r\n      if (!this.dateControl?.value) {\r\n        this.modelChange.emit(null);\r\n        this.sdChange.emit(null);\r\n      }\r\n    }\r\n  }\r\n\r\n  clear = ($event: any) => {\r\n    $event?.stopPropagation();\r\n    if (this.#date) {\r\n      this.dateControl.setValue(null);\r\n      this.modelChange.emit(null);\r\n      this.sdChange.emit(null);\r\n    }\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatDatepickerModule } from '@angular/material/datepicker';\r\nimport {\r\n  NgxMatDatetimePickerModule,\r\n  NgxMatTimepickerModule\r\n} from '@angular-material-components/datetime-picker';\r\nimport { SdDateTime } from './date-time.component';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { NgxMatMomentModule } from '@angular-material-components/moment-adapter';\r\nimport { MatMomentDateModule } from '@angular/material-moment-adapter';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport '@sd-angular/core/typing';\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    MatInputModule,\r\n    MatIconModule,\r\n    MatFormFieldModule,\r\n    MatDatepickerModule,\r\n    MatMomentDateModule,\r\n    NgxMatDatetimePickerModule,\r\n    NgxMatTimepickerModule,\r\n    NgxMatMomentModule,\r\n    SdTranslateModule\r\n  ],\r\n  declarations: [\r\n    SdDateTime\r\n  ],\r\n  exports: [\r\n    SdDateTime\r\n  ],\r\n  providers: [\r\n  ]\r\n})\r\nexport class SdDateTimeModule {\r\n\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":";;;;;;;;;;;;;;;;;;;AAoBA,MAAM,uBAAuB,GAAG;IAC9B,KAAK,EAAE;QACL,SAAS,EAAE,kBAAkB;KAC9B;IACD,OAAO,EAAE;QACP,SAAS,EAAE,kBAAkB;QAC7B,cAAc,EAAE,UAAU;QAC1B,aAAa,EAAE,IAAI;QACnB,kBAAkB,EAAE,WAAW;KAChC;CACF,CAAC;AACF,MAAM,mBAAmB,GAAG;IAC1B,KAAK,EAAE;QACL,SAAS,EAAE,YAAY;KACxB;IACD,OAAO,EAAE;QACP,SAAS,EAAE,YAAY;QACvB,cAAc,EAAE,UAAU;QAC1B,aAAa,EAAE,IAAI;QACnB,kBAAkB,EAAE,WAAW;KAChC;CACF,CAAC;WAMyC,mBAAmB,OACf,uBAAuB;MAGzD,UAAU;IA6FrB,YACU,GAAsB,EAC9B,aAAoC;QAD5B,QAAG,GAAH,GAAG,CAAmB;QA7FhC,OAAE,GAAG,IAAIA,EAAO,EAAE,EAAE,CAAC;QACrB,qBAAgB,GAAG,KAAK,CAAC;QACzB,wBAAW;QACX,gBAAQA,EAAO,EAAE,EAAC;QAMlB,wBAAmB,GAAG,KAAK,CAAC;QAK5B,gBAAW,GAAG,IAAI,WAAW,EAAE,CAAC;QAkBhC,wBAAiB;QAUR,SAAI,GAAiC,UAAU,CAAC;QASzD,eAAU,GAAG,KAAK,CAAC;QA2BT,aAAQ,GAAG,IAAI,YAAY,EAAE,CAAC;QAa9B,gBAAW,GAAG,IAAI,YAAY,EAAE,CAAC;QAkB3C,WAAM,GAAG;;;;;;;;;;;;;SAaR,CAAA;QAED,YAAO,GAAG;YACR,IAAI,IAAI,CAAC,gBAAgB,EAAE;;aAE1B;SACF,CAAA;QAED,aAAQ,GAAG,CAAC,KAAsC;;YAChD,MAAM,KAAK,SAAG,KAAK,CAAC,KAAK,0CAAE,MAAM,EAAE,CAAC;YACpC,IAAI,KAAK,EAAE;gBACT,IAAI,IAAI,IAAI,qCAAY,KAAK,KAAK,EAAE;oBAClC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;oBAC7B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;iBAC3B;aACF;iBAAM;gBACL,IAAI,QAAC,IAAI,CAAC,WAAW,0CAAE,KAAK,CAAA,EAAE;oBAC5B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;oBAC5B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;iBAC1B;aACF;SACF,CAAA;QAED,UAAK,GAAG,CAAC,MAAW;YAClB,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,eAAe,GAAG;YAC1B,yCAAgB;gBACd,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;gBAChC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;gBAC5B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAC1B;SACF,CAAA;QAzDC,IAAI,CAAC,gBAAgB,GAAG,CAAC,aAAa,CAAC,SAAS,EAAE,CAAC;KACpD;IA5FD,IAAa,IAAI,CAAC,GAAW;QAC3B,IAAI,GAAG,EAAE;YACP,uBAAA,IAAI,SAAS,GAAG,EAAC;SAClB;KACF;IAED,IAAkC,oBAAoB,CAAC,GAAiB;QACtE,IAAI,CAAC,mBAAmB,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;QAC/C,GAAG,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;KAC3B;IAGD,IAAkB,IAAI,CAAC,GAAkB;QACvC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE;YACpB,IAAI,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;SACjB;KACF;IAED,IAAkB,IAAI,CAAC,GAAkB;QACvC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE;YACpB,IAAI,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;SACjB;KACF;IAGD,IAAa,IAAI,CAAC,GAAuB;QACvC,IAAI,GAAG,EAAE;YACP,IAAI,GAAG,YAAY,MAAM,EAAE;gBACzB,uBAAA,IAAI,SAAS,GAAG,CAAC,IAAI,EAAC;aACvB;iBAAM;gBACL,uBAAA,IAAI,SAAS,GAAG,EAAC;aAClB;SACF;KACF;IAED,IAAa,QAAQ,CAAC,GAAiB;QACrC,GAAG,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;QAC1B,IAAI,GAAG,EAAE;YACP,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC;SAC5B;aAAM;YACL,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC;SAC3B;KACF;IAED,IAAa,QAAQ,CAAC,GAAiB;QACrC,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;QACtC,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;SACvD;aAAM;YACL,IAAI,CAAC,WAAW,CAAC,eAAe,EAAE,CAAC;SACpC;KACF;IAID,IAAa,OAAO,CAAC,GAAkB;QACrC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE;YACpB,IAAI,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;SACjB;KACF;IACD,IAAa,OAAO,CAAC,GAAkB;QACrC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE;YACpB,IAAI,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;SACjB;KACF;IAKD,IAAa,KAAK,CAAC,GAAQ;QACzB,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE;YACrB,GAAG,GAAG,IAAI,CAAC;SACZ;QACD,IAAI,wCAAe,GAAG,EAAE;YACtB,uBAAA,IAAI,SAAS,GAAG,EAAC;YACjB,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,qCAAY,GAAG,MAAM,CAAC,IAAI,CAAC,QAAQ,sCAAa,qBAAqB,CAAC,EAAE,qBAAqB,CAAC,GAAG,IAAI,CAAC;YAC9H,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;SACjC;KACF;IAQD,WAAW;;QACT,mFAAY,aAAa,sCAAa;KACvC;IAED,QAAQ;;QACN,mFAAY,UAAU,sCAAa,IAAI,CAAC,WAAW,EAAE;KACtD;IAED,eAAe;KACd;;;;YArHF,SAAS,SAAC;gBACT,QAAQ,EAAE,cAAc;gBACxB,gyHAAyC;gBAEzC,SAAS,EAAE;oBACT,EAAE,OAAO,EAAE,gBAAgB,EAAE,QAAQ,IAAqB,EAAE;oBAC5D,EAAE,OAAO,EAAE,oBAAoB,EAAE,QAAQ,IAAyB,EAAE;iBACrE;;aACF;;;YA3CC,iBAAiB;YAOV,qBAAqB;;;mBA0C3B,KAAK;mCAML,KAAK,SAAC,qBAAqB;mBAM3B,KAAK,SAAC,KAAK;mBAQX,KAAK,SAAC,KAAK;mBAOX,KAAK;mBAEL,KAAK;mBASL,KAAK;uBACL,KAAK;uBASL,KAAK;oBAQL,KAAK;0BACL,KAAK;0BACL,KAAK;sBACL,KAAK;sBAOL,KAAK;wBAOL,KAAK;uBACL,MAAM;oBAGN,KAAK;0BAUL,MAAM;;;MCvGI,gBAAgB;;;YAxB5B,QAAQ,SAAC;gBACR,OAAO,EAAE;oBACP,YAAY;oBACZ,WAAW;oBACX,mBAAmB;oBACnB,cAAc;oBACd,aAAa;oBACb,kBAAkB;oBAClB,mBAAmB;oBACnB,mBAAmB;oBACnB,0BAA0B;oBAC1B,sBAAsB;oBACtB,kBAAkB;oBAClB,iBAAiB;iBAClB;gBACD,YAAY,EAAE;oBACZ,UAAU;iBACX;gBACD,OAAO,EAAE;oBACP,UAAU;iBACX;gBACD,SAAS,EAAE,EACV;aACF;;;ACvCD;;;;;;"}
+{"version":3,"file":"sd-angular-core-date-time.js","sources":["../../../../projects/sd-core/date-time/src/lib/date-time.component.ts","../../../../projects/sd-core/date-time/src/lib/date-time.module.ts","../../../../projects/sd-core/date-time/sd-angular-core-date-time.ts"],"sourcesContent":["import {\r\n  Component,\r\n  Input,\r\n  EventEmitter,\r\n  Output,\r\n  OnDestroy,\r\n  AfterViewInit,\r\n  ChangeDetectorRef,\r\n  OnInit,\r\n  ViewChild,\r\n  ChangeDetectionStrategy\r\n} from '@angular/core';\r\nimport * as uuid from 'uuid';\r\nimport moment, { Moment } from 'moment';\r\nimport { FormControl, FormGroup, NgForm, Validators } from '@angular/forms';\r\nimport { DeviceDetectorService } from 'ngx-device-detector';\r\nimport { MatDatepickerInputEvent } from '@angular/material/datepicker';\r\nimport { NGX_MAT_DATE_FORMATS, } from '@angular-material-components/datetime-picker';\r\nimport { MAT_DATE_FORMATS } from '@angular/material/core';\r\nimport '@sd-angular/core/typing';\r\n\r\nconst CUSTOM_DATETIME_FORMATS = {\r\n  parse: {\r\n    dateInput: 'DD/MM/YYYY HH:mm'\r\n  },\r\n  display: {\r\n    dateInput: 'DD/MM/YYYY HH:mm',\r\n    monthYearLabel: 'MMM YYYY',\r\n    dateA11yLabel: 'LL',\r\n    monthYearA11yLabel: 'MMMM YYYY'\r\n  }\r\n};\r\nconst CUSTOM_DATE_FORMATS = {\r\n  parse: {\r\n    dateInput: 'DD/MM/YYYY'\r\n  },\r\n  display: {\r\n    dateInput: 'DD/MM/YYYY',\r\n    monthYearLabel: 'MMM YYYY',\r\n    dateA11yLabel: 'LL',\r\n    monthYearA11yLabel: 'MMMM YYYY'\r\n  }\r\n};\r\n@Component({\r\n  selector: 'sd-date-time',\r\n  templateUrl: './date-time.component.html',\r\n  styleUrls: ['./date-time.component.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  providers: [\r\n    { provide: MAT_DATE_FORMATS, useValue: CUSTOM_DATE_FORMATS },\r\n    { provide: NGX_MAT_DATE_FORMATS, useValue: CUSTOM_DATETIME_FORMATS }\r\n  ]\r\n})\r\nexport class SdDateTime implements OnDestroy, OnInit, AfterViewInit {\r\n  id = `I${uuid.v4()}`;\r\n  isMobileOrTablet = false;\r\n  #date: any;\r\n  #name = uuid.v4();\r\n  @Input() set name(val: string) {\r\n    if (val) {\r\n      this.#name = val;\r\n    }\r\n  }\r\n  disableErrorMessage = false;\r\n  @Input('disableErrorMessage') set _disableErrorMessage(val: boolean | '') {\r\n    this.disableErrorMessage = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  dateControl = new FormControl();\r\n  min: Date;\r\n  @Input('min') set _min(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.min = new Date(val);\r\n    } else {\r\n      this.min = null;\r\n    }\r\n  }\r\n  max: Date;\r\n  @Input('max') set _max(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.max = new Date(val);\r\n    } else {\r\n      this.max = null;\r\n    }\r\n  }\r\n  @Input() size: 'sm' | 'lg';\r\n  #form: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n  @Input() type: 'datetime' | 'date' | 'time' = 'datetime';\r\n  @Input() set disabled(val: boolean | '') {\r\n    val = (val === '') || val;\r\n    if (val) {\r\n      this.dateControl.disable();\r\n    } else {\r\n      this.dateControl.enable();\r\n    }\r\n  }\r\n  isRequired = false;\r\n  @Input() set required(val: boolean | '') {\r\n    this.isRequired = (val === '') || val;\r\n    if (this.isRequired) {\r\n      this.dateControl.setValidators([Validators.required]);\r\n    } else {\r\n      this.dateControl.clearValidators();\r\n    }\r\n  }\r\n  @Input() label: string;\r\n  @Input() placeholder: string;\r\n  @Input() defaultTime: any;\r\n  @Input() set minDate(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.min = new Date(val);\r\n    } else {\r\n      this.min = null;\r\n    }\r\n  }\r\n  @Input() set maxDate(val: string | Date) {\r\n    if (Date.isDate(val)) {\r\n      this.max = new Date(val);\r\n    } else {\r\n      this.max = null;\r\n    }\r\n  }\r\n  @Input() validator: (value: any) => string | Promise<string>;\r\n  @Output() sdChange = new EventEmitter();\r\n  date: any;\r\n\r\n  @Input() set model(val: any) {\r\n    if (!Date.isDate(val)) {\r\n      val = null;\r\n    }\r\n    if (this.#date !== val) {\r\n      this.#date = val;\r\n      const date = Date.isDate(this.#date) ? moment(Date.toFormat(this.#date, 'MM/dd/yyyy HH:mm:ss'), 'MM/DD/YYYY HH:mm:ss') : null;\r\n      this.dateControl.setValue(date);\r\n    }\r\n  }\r\n  @Output() modelChange = new EventEmitter();\r\n  constructor(\r\n    private ref: ChangeDetectorRef,\r\n    deviceService: DeviceDetectorService) {\r\n    this.isMobileOrTablet = !deviceService.isDesktop();\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#name);\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#form?.addControl(this.#name, this.dateControl);\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n  }\r\n\r\n  onBlur = () => {\r\n    // const value = this.dateControl.value?.toDate();\r\n    // if (value) {\r\n    //   if (new Date(this.#date) !== value) {\r\n    //     this.modelChange.emit(value);\r\n    //     this.sdChange.emit(value);\r\n    //   }\r\n    // } else {\r\n    //   if (!this.dateControl?.value) {\r\n    //     this.modelChange.emit(null);\r\n    //     this.sdChange.emit(null);\r\n    //   }\r\n    // }\r\n  }\r\n\r\n  onFocus = () => {\r\n    if (this.isMobileOrTablet) {\r\n      // $(this.control.nativeElement).trigger('blur');\r\n    }\r\n  }\r\n\r\n  onChange = (event: MatDatepickerInputEvent<Moment>) => {\r\n    const value = event.value?.toDate();\r\n    if (value) {\r\n      if (new Date(this.#date) !== value) {\r\n        this.modelChange.emit(value);\r\n        this.sdChange.emit(value);\r\n      }\r\n    } else {\r\n      if (!this.dateControl?.value) {\r\n        this.modelChange.emit(null);\r\n        this.sdChange.emit(null);\r\n      }\r\n    }\r\n  }\r\n\r\n  clear = ($event: any) => {\r\n    $event?.stopPropagation();\r\n    if (this.#date) {\r\n      this.dateControl.setValue(null);\r\n      this.modelChange.emit(null);\r\n      this.sdChange.emit(null);\r\n    }\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatDatepickerModule } from '@angular/material/datepicker';\r\nimport {\r\n  NgxMatDatetimePickerModule,\r\n  NgxMatTimepickerModule\r\n} from '@angular-material-components/datetime-picker';\r\nimport { SdDateTime } from './date-time.component';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { NgxMatMomentModule } from '@angular-material-components/moment-adapter';\r\nimport { MatMomentDateModule } from '@angular/material-moment-adapter';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport '@sd-angular/core/typing';\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    MatInputModule,\r\n    MatIconModule,\r\n    MatFormFieldModule,\r\n    MatDatepickerModule,\r\n    MatMomentDateModule,\r\n    NgxMatDatetimePickerModule,\r\n    NgxMatTimepickerModule,\r\n    NgxMatMomentModule,\r\n    SdTranslateModule\r\n  ],\r\n  declarations: [\r\n    SdDateTime\r\n  ],\r\n  exports: [\r\n    SdDateTime\r\n  ],\r\n  providers: [\r\n  ]\r\n})\r\nexport class SdDateTimeModule {\r\n\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}

package/fesm2015/sd-angular-core-grid-material.js

@@ -1213,6 +1213,7 @@ class SdGridMaterial {
         _filterLocal.set(this, (localItems, filterInfo) => {
             const { columns } = this.gridOption;
             const items = localItems.filter(item => {
+                var _a, _b;
                 for (const column of columns) {
                     const filterValue = (filterInfo.rawColumnFilter[column.field] || '').toString().trim().toLowerCase();
                     const columnValue = (item[column.field] || '').toString().trim().toLowerCase();
@@ -1225,6 +1226,11 @@ class SdGridMaterial {
                                 return false;
                             }
                         }
+                        else if (column.type === 'values') {
+                            if (columnValue !== filterValue) {
+                                return false;
+                            }
+                        }
                         else if (column.type === 'number') {
                             const fValue = +filterValue.replace('>=', '').replace('<=', '').replace('>', '').replace('<', '');
                             const cValue = +columnValue;
@@ -1258,12 +1264,14 @@ class SdGridMaterial {
                             }
                         }
                         else if (column.type === 'date' || column.type === 'datetime') {
-                            const date = Date.toFormat(filterValue, 'MM/yyyy/dd');
-                            const fromDate = new Date(date);
-                            const toDate = new Date(date);
-                            toDate.setDate(toDate.getDate() + 1);
-                            if (new Date(columnValue).getTime() < fromDate.getTime() || new Date(columnValue).getTime() >= toDate.getTime()) {
-                                return false;
+                            const from = (_a = filterInfo.rawColumnFilter[column.field]) === null || _a === void 0 ? void 0 : _a.from;
+                            const to = (_b = filterInfo.rawColumnFilter[column.field]) === null || _b === void 0 ? void 0 : _b.to;
+                            const fromDate = Date.begin(from);
+                            const toDate = Date.end(to);
+                            if (!fromDate || !toDate) {
+                                if (new Date(columnValue).getTime() < fromDate.getTime() || new Date(columnValue).getTime() >= toDate.getTime()) {
+                                    return false;
+                                }
                             }
                         }
                     }
@@ -2113,9 +2121,9 @@ class SdDesktopCellView {
 SdDesktopCellView.decorators = [
     { type: Component, args: [{
                 selector: 'sd-desktop-cell-view',
-                template: "<ng-container *ngIf=\"column.htmlTemplate;else useDefaultView\">\r\n  <div (click)=\"column.click && column.click(item[column.field], item)\" style=\"overflow-wrap: break-word;\"\r\n    [ngClass]=\"{'cursor-pointer':column.click}\"\r\n    [innerHTML]=\"(item[column.field] | columnHtmlTemplate:item:column) | safeHtml\">\r\n  </div>\r\n</ng-container>\r\n<ng-template #useDefaultView>\r\n  <ng-container *sdLet=\"item[column.field] | columnBadge:item:column as badge\">\r\n    <ng-container *sdLet=\"item[column.field] | columnTooltip:item:column as tooltip\">\r\n      <ng-container *sdLet=\"item[column.field] | columnTransform:item:column:key | async as val\">\r\n        <ng-container\r\n          *ngIf=\"column.type === 'string' || column.type === 'number' || column.type === 'bool' || column.type === 'values'\">\r\n          <ng-container *ngIf=\"!!badge\">\r\n            <div *ngIf=\"!column.badgeType\" class=\"c-badge\" matTooltipPosition=\"above\" [matTooltip]=\"tooltip\"\r\n              [class]=\"{'c-secondary': badge === 'normal', 'c-info': badge === 'info', 'c-success': badge === 'success', 'c-danger': badge === 'danger', 'c-warning': badge === 'warning'}\">\r\n              <span *ngIf=\"column.click\" class=\"pointer\" (click)=\"column.click(item[column.field], item)\">{{val}}</span>\r\n              <ng-container *ngIf=\"!column.click\">{{val}}\r\n              </ng-container>\r\n            </div>\r\n            <div *ngIf=\"column.badgeType === 'circle'\" class=\"c-badge-circle d-flex align-items-center\"\r\n              [matTooltip]=\"tooltip\"\r\n              [class]=\"{'c-unknown': !badge, 'c-secondary': badge === 'normal', 'c-info': badge === 'info', 'c-success': badge === 'success', 'c-danger': badge === 'danger', 'c-warning': badge === 'warning'}\">\r\n              <span *ngIf=\"badge\" class=\"material-icons-round c-material-icon mr-4\">\r\n                fiber_manual_record\r\n              </span>\r\n              <span *ngIf=\"!badge\" class=\"material-icons-outlined c-material-icon mr-4\">\r\n                fiber_manual_record\r\n              </span>\r\n              <span *ngIf=\"column.click\" class=\"pointer\" (click)=\"column.click(item[column.field], item)\">{{val}}</span>\r\n              <ng-container *ngIf=\"!column.click\">{{val}}\r\n              </ng-container>\r\n            </div>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"!badge\">\r\n            <div class=\"text-break\" [matTooltip]=\"tooltip\">\r\n              <a *ngIf=\"column.click\" href=\"javascript:;\" (click)=\"column.click(item[column.field], item)\">{{val}}</a>\r\n              <ng-container *ngIf=\"!column.click\">{{val}}\r\n              </ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n        <div *ngIf=\"column.type === 'date'\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item[column.field] | date:'dd/MM/yyyy'\">\r\n          {{val | sdTimeDifferent:'dd/MM/yyyy':column.option?.timeDifferent | async}}\r\n        </div>\r\n        <div *ngIf=\"column.type === 'datetime'\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item[column.field] | date:'dd/MM/yyyy HH:mm'\">\r\n          {{val | sdTimeDifferent:'dd/MM/yyyy HH:mm':column.option?.timeDifferent | async}}\r\n        </div>\r\n        <div *ngIf=\"column.type === 'time'\">\r\n          {{val | date:'HH:mm'}}\r\n        </div>\r\n        <div *ngIf=\"column.type === 'image'\" class=\"align-middle text-center\">\r\n          <img *ngIf=\"val\" [src]=\"val\" [width]=\"column.option?.width\" [height]=\"column.option?.height\"\r\n            style=\"margin: 5px 0;object-fit: contain;\" (click)=\"column.click && column.click(item[column.field], item)\"\r\n            [ngClass]=\"{'pointer':column.click}\">\r\n          <mat-icon *ngIf=\"!val\" class=\"c-img\" [ngClass]=\"{'pointer':column.click}\"\r\n            (click)=\"column.click && column.click(item[column.field], item)\">image</mat-icon>\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </ng-container>\r\n  <sd-desktop-cell-children-view *ngIf=\"column.type === 'children'\" [key]=\"key\" [item]=\"item\" [column]=\"column\">\r\n  </sd-desktop-cell-children-view>\r\n</ng-template>",
+                template: "<ng-container *ngIf=\"column.htmlTemplate;else useDefaultView\">\r\n  <div (click)=\"column.click && column.click(item[column.field], item)\" style=\"overflow-wrap: break-word;\"\r\n    [ngClass]=\"{'cursor-pointer':column.click}\"\r\n    [innerHTML]=\"(item[column.field] | columnHtmlTemplate:item:column) | safeHtml\">\r\n  </div>\r\n</ng-container>\r\n<ng-template #useDefaultView>\r\n  <ng-container *sdLet=\"item[column.field] | columnBadge:item:column as badge\">\r\n    <ng-container *sdLet=\"item[column.field] | columnTooltip:item:column as tooltip\">\r\n      <ng-container *sdLet=\"item[column.field] | columnTransform:item:column:key | async as val\">\r\n        <ng-container\r\n          *ngIf=\"column.type === 'string' || column.type === 'number' || column.type === 'bool' || column.type === 'values'\">\r\n          <ng-container *ngIf=\"!!badge\">\r\n            <sd-badge [type]=\"!column.badgeType ? 'round' : 'circle'\" [title]=\"val\" [color]=\"badge\" [tooltip]=\"tooltip\"\r\n              (sdClick)=\"column.click(item[column.field], item)\"></sd-badge>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"!badge\">\r\n            <div class=\"text-break\" [matTooltip]=\"tooltip\">\r\n              <a *ngIf=\"column.click\" href=\"javascript:;\" (click)=\"column.click(item[column.field], item)\">{{val}}</a>\r\n              <ng-container *ngIf=\"!column.click\">{{val}}\r\n              </ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n        <div *ngIf=\"column.type === 'date'\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item[column.field] | date:'dd/MM/yyyy'\">\r\n          {{val | sdTimeDifferent:'dd/MM/yyyy':column.option?.timeDifferent | async}}\r\n        </div>\r\n        <div *ngIf=\"column.type === 'datetime'\" matTooltipPosition=\"above\"\r\n          [matTooltip]=\"item[column.field] | date:'dd/MM/yyyy HH:mm'\">\r\n          {{val | sdTimeDifferent:'dd/MM/yyyy HH:mm':column.option?.timeDifferent | async}}\r\n        </div>\r\n        <div *ngIf=\"column.type === 'time'\">\r\n          {{val | date:'HH:mm'}}\r\n        </div>\r\n        <div *ngIf=\"column.type === 'image'\" class=\"align-middle text-center\">\r\n          <img *ngIf=\"val\" [src]=\"val\" [width]=\"column.option?.width\" [height]=\"column.option?.height\"\r\n            style=\"margin: 5px 0;object-fit: contain;\" (click)=\"column.click && column.click(item[column.field], item)\"\r\n            [ngClass]=\"{'pointer':column.click}\">\r\n          <mat-icon *ngIf=\"!val\" class=\"c-img\" [ngClass]=\"{'pointer':column.click}\"\r\n            (click)=\"column.click && column.click(item[column.field], item)\">image</mat-icon>\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </ng-container>\r\n  <sd-desktop-cell-children-view *ngIf=\"column.type === 'children'\" [key]=\"key\" [item]=\"item\" [column]=\"column\">\r\n  </sd-desktop-cell-children-view>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".c-color-success{color:#4caf50}.c-color-danger{color:#f82c13}.c-img{font-size:30px;opacity:.5}.c-img.pointer:hover{opacity:.9}.c-badge{border-radius:20px;display:inline-block;margin-bottom:4px;overflow-wrap:break-word;padding:2px 12px;text-align:center}.c-badge.c-warning{background:#fff3e0;color:#ff9600}.c-badge.c-info{background:#e7e9ff;color:#2962ff}.c-badge.c-success{background:#e8f5e9;color:#4caf50}.c-badge.c-danger{background:#fee8e7;color:#f82c13}.c-badge.c-normal{background:rgba(0,0,0,.12);color:#000}.c-badge-circle{min-width:150px}.c-badge-circle .c-material-icon{font-size:12px;height:12px;width:12px}.c-badge-circle.c-unknown{color:#212121}.c-badge-circle.c-unknown .c-material-icon{color:rgba(0,0,0,.5)}.c-badge-circle.c-secondary{color:#212121}.c-badge-circle.c-info{color:#2962ff}.c-badge-circle.c-success{color:#4caf50}.c-badge-circle.c-danger{color:#f82c13}.c-badge-circle.c-warning{color:#ff9600}"]
+                styles: [".c-color-success{color:#4caf50}.c-color-danger{color:#f82c13}.c-img{font-size:30px;opacity:.5}.c-img.pointer:hover{opacity:.9}"]
             },] }
 ];
 SdDesktopCellView.ctorParameters = () => [];