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

package/fesm2015/mis-crystal-design-system-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"mis-crystal-design-system-button.mjs","sources":["../../../projects/mis-components/button/button.component.ts","../../../projects/mis-components/button/button.component.html","../../../projects/mis-components/button/button.directive.ts","../../../projects/mis-components/button/button.module.ts","../../../projects/mis-components/button/mis-crystal-design-system-button.ts"],"sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter, ContentChild, TemplateRef } from \"@angular/core\";\n\n@Component({\n  selector: \"mis-button\",\n  templateUrl: \"./button.component.html\",\n  styleUrls: [\"./button.component.scss\"]\n})\nexport class ButtonComponent implements OnInit {\n  @Input() name: string = \"Enabled\";\n  @Input() type: \"Solid\" | \"Outline\" | \"Text\" = \"Solid\";\n  @Input() size: \"Small\" | \"Medium\" | \"Large\" | \"Small-M\" | \"Large-M\" = \"Medium\";\n  @Input() width: string = \"\";\n\n  @Input() showIcon: boolean = false;\n  @Input() iconUrl: string = \"\";\n  @Input() iconPosition: \"Left\" | \"Right\" = \"Left\";\n\n  @Input() disabled: boolean = false;\n  @Input() disableLeftBorderRadius: boolean = false;\n  @Input() disableRightBorderRadius: boolean = false;\n\n  /** Emits event when button is clicked */\n  @Output() click = new EventEmitter<any>();\n\n  constructor() {}\n\n  ngOnInit() {}\n\n  onClick(event) {\n    this.click.emit(event);\n  }\n}\n","<button\n  (click)=\"onClick($event)\"\n  [disabled]=\"disabled\"\n  [ngClass]=\"{\n    solid: type === 'Solid',\n    outline: type === 'Outline',\n    text: type === 'Text',\n    large: size === 'Large',\n    medium: size === 'Medium',\n    small: size === 'Small',\n    'large-mobile': size === 'Large-M',\n    'small-mobile': size === 'Small-M'\n  }\"\n  [ngStyle]=\"{\n    'border-top-left-radius': disableLeftBorderRadius ? '0px' : '',\n    'border-bottom-left-radius': disableLeftBorderRadius ? '0px' : '',\n    'border-top-right-radius': disableRightBorderRadius ? '0px' : '',\n    'border-bottom-right-radius': disableRightBorderRadius ? '0px' : '',\n    width: width\n  }\"\n>\n  <span id=\"left-icon\" *ngIf=\"showIcon && iconPosition === 'Left'\">\n    <img [src]=\"iconUrl\" alt=\"\" />\n  </span>\n  {{ name }}\n  <span id=\"right-icon\" *ngIf=\"showIcon && iconPosition === 'Right'\">\n    <img [src]=\"iconUrl\" alt=\"\" />\n  </span>\n</button>\n","import { AfterViewInit, Directive, ElementRef, HostBinding, Input, Renderer2 } from \"@angular/core\";\n\n@Directive({\n  selector: \"[mis-button]\"\n})\nexport class ButtonDirective implements AfterViewInit {\n  @Input() type: \"primary\" | \"outline\" | \"none\" = \"none\";\n  @Input() size: \"sm\" | \"md\" | \"lg\" = \"md\";\n  @HostBinding(\"class\") elementClass = \"mis-btn\";\n\n  constructor(private el: ElementRef, private renderer: Renderer2) {}\n\n  ngAfterViewInit(): void {\n    this.bindTypeClass();\n    this.bindSizeClass();\n  }\n\n  private bindTypeClass(): void {\n    let className = \"\";\n    switch (this.type) {\n      case \"primary\":\n        className = \"mis-primary\";\n        break;\n      case \"outline\":\n        className = \"mis-outline\";\n        break;\n      default:\n        className = \"mis-none\";\n    }\n    this.renderer.addClass(this.el.nativeElement, className);\n  }\n\n  private bindSizeClass(): void {\n    let className = \"\";\n    switch (this.size) {\n      case \"lg\":\n        className = \"mis-btn-lg\";\n        break;\n      case \"sm\":\n        className = \"mis-btn-sm\";\n        break;\n      default:\n        className = \"mis-btn-md\";\n    }\n    this.renderer.addClass(this.el.nativeElement, className);\n  }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { ButtonDirective } from \"./button.directive\";\nimport { ButtonComponent } from \"./button.component\";\n\n@NgModule({\n  declarations: [ButtonComponent, ButtonDirective],\n  imports: [CommonModule],\n  exports: [ButtonComponent, ButtonDirective]\n})\nexport class ButtonModule {\n  static forRoot(): ModuleWithProviders<ButtonModule> {\n    return { ngModule: ButtonModule, providers: [] };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/mis-crystal-design-system-checkbox.mjs

@@ -0,0 +1,112 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ViewChild, Input, Output, NgModule } from '@angular/core';
+import * as i2 from '@angular/forms';
+import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class CheckboxComponent {
+    constructor() {
+        this.isError = false;
+        this.isIndeterminate = false;
+        this.name = "";
+        this.formControl = new UntypedFormControl();
+        this.valueChange = new EventEmitter();
+    }
+    set type(value) {
+        this.isError = value === "Error";
+    }
+    set indeterminate(value) {
+        if (value) {
+            this.formControl.setValue(true);
+            this.valueChange.emit({
+                name: this.name,
+                value: true
+            });
+        }
+        else {
+            this.formControl.setValue(false);
+            this.valueChange.emit({
+                name: this.name,
+                value: false
+            });
+        }
+        this.isIndeterminate = value;
+    }
+    set checked(value) {
+        if (value)
+            this.formControl.setValue(true);
+        else
+            this.formControl.setValue(false);
+    }
+    set disabled(value) {
+        if (value)
+            this.formControl.disable();
+        else
+            this.formControl.enable();
+    }
+    ngOnInit() { }
+    toggleState() {
+        if (this.isIndeterminate) {
+            this.isIndeterminate = false;
+            this.formControl.setValue(true);
+        }
+        else {
+            if (this.formControl.value)
+                this.formControl.setValue(false);
+            else
+                this.formControl.setValue(true);
+        }
+        this.valueChange.emit({
+            name: this.name,
+            value: this.formControl.value
+        });
+    }
+}
+CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: CheckboxComponent, selector: "mis-checkbox", inputs: { type: "type", indeterminate: "indeterminate", checked: "checked", disabled: "disabled", name: "name", formControl: "formControl" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "inputBox", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div\n  class=\"checkbox-container\"\n  [ngStyle]=\"{ cursor: formControl.disabled ? 'not-allowed' : 'pointer' }\"\n  (click)=\"!formControl.disabled && toggleState()\"\n>\n  <input hidden type=\"checkbox\" [formControl]=\"formControl\" (click)=\"$event.stopPropagation()\" />\n  <span\n    class=\"checkmark\"\n    tabindex=\"0\"\n    *ngIf=\"!isIndeterminate\"\n    [ngClass]=\"{\n      'disabled-checkbox': formControl.disabled,\n      error: isError && !formControl.disabled\n    }\"\n  ></span>\n  <span\n    class=\"checkmark indeterminate\"\n    tabindex=\"0\"\n    *ngIf=\"isIndeterminate\"\n    [ngClass]=\"{\n      'disabled-checkbox': formControl.disabled,\n      error: isError && !formControl.disabled\n    }\"\n  ></span>\n</div>\n", styles: [".checkbox-container{height:20px;width:20px;position:relative;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:sub}.checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:20px;width:20px}.checkmark{position:absolute;display:flex;justify-content:center;align-items:center;top:0;left:0;height:20px;width:20px;border-radius:4px;background-color:#fff;border:solid 2px #6a737d;box-sizing:border-box}.checkmark:hover{border-color:#929dab}.checkmark:focus-within,.checkmark:focus{box-shadow:0 0 0 .09em #fff,0 0 .01em .2em #0937b2;outline:none}.checkbox-container input:checked~.checkmark{background-color:#0937b2;border-color:#0937b2}.checkbox-container input:checked~.checkmark.disabled-checkbox{background-color:#c8cdd3;border-color:#c8cdd3}.checkmark:after{content:\"\";position:absolute;display:none}.checkbox-container input:checked~.checkmark:after{display:block}.checkbox-container .checkmark:after{top:1px;width:4px;height:9px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.checkbox-container .checkmark.indeterminate:after{top:2px;width:2px;height:0px;border:solid white;border-width:0 0px 12px 0;border-radius:14px;transform:rotate(90deg);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg)}.disabled-checkbox{pointer-events:none;border-color:#c8cdd3}.error{border-color:#b00020}.checkbox-container input:checked~.error.checkmark{border:#b00020!important;background:#b00020!important}.checkbox-container .error.checkmark:after{top:3px;width:4px;height:9px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.checkbox-container .error.checkmark.indeterminate:after{top:4px;width:2px;height:0px;border:solid white;border-width:0 0px 12px 0;border-radius:14px;transform:rotate(90deg);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg)}.error:focus-within,.error:focus{box-shadow:none!important;outline:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: CheckboxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "mis-checkbox", template: "<div\n  class=\"checkbox-container\"\n  [ngStyle]=\"{ cursor: formControl.disabled ? 'not-allowed' : 'pointer' }\"\n  (click)=\"!formControl.disabled && toggleState()\"\n>\n  <input hidden type=\"checkbox\" [formControl]=\"formControl\" (click)=\"$event.stopPropagation()\" />\n  <span\n    class=\"checkmark\"\n    tabindex=\"0\"\n    *ngIf=\"!isIndeterminate\"\n    [ngClass]=\"{\n      'disabled-checkbox': formControl.disabled,\n      error: isError && !formControl.disabled\n    }\"\n  ></span>\n  <span\n    class=\"checkmark indeterminate\"\n    tabindex=\"0\"\n    *ngIf=\"isIndeterminate\"\n    [ngClass]=\"{\n      'disabled-checkbox': formControl.disabled,\n      error: isError && !formControl.disabled\n    }\"\n  ></span>\n</div>\n", styles: [".checkbox-container{height:20px;width:20px;position:relative;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:sub}.checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:20px;width:20px}.checkmark{position:absolute;display:flex;justify-content:center;align-items:center;top:0;left:0;height:20px;width:20px;border-radius:4px;background-color:#fff;border:solid 2px #6a737d;box-sizing:border-box}.checkmark:hover{border-color:#929dab}.checkmark:focus-within,.checkmark:focus{box-shadow:0 0 0 .09em #fff,0 0 .01em .2em #0937b2;outline:none}.checkbox-container input:checked~.checkmark{background-color:#0937b2;border-color:#0937b2}.checkbox-container input:checked~.checkmark.disabled-checkbox{background-color:#c8cdd3;border-color:#c8cdd3}.checkmark:after{content:\"\";position:absolute;display:none}.checkbox-container input:checked~.checkmark:after{display:block}.checkbox-container .checkmark:after{top:1px;width:4px;height:9px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.checkbox-container .checkmark.indeterminate:after{top:2px;width:2px;height:0px;border:solid white;border-width:0 0px 12px 0;border-radius:14px;transform:rotate(90deg);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg)}.disabled-checkbox{pointer-events:none;border-color:#c8cdd3}.error{border-color:#b00020}.checkbox-container input:checked~.error.checkmark{border:#b00020!important;background:#b00020!important}.checkbox-container .error.checkmark:after{top:3px;width:4px;height:9px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.checkbox-container .error.checkmark.indeterminate:after{top:4px;width:2px;height:0px;border:solid white;border-width:0 0px 12px 0;border-radius:14px;transform:rotate(90deg);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg)}.error:focus-within,.error:focus{box-shadow:none!important;outline:none}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { inputBox: [{
+                type: ViewChild,
+                args: ["input"]
+            }], type: [{
+                type: Input
+            }], indeterminate: [{
+                type: Input
+            }], checked: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], formControl: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }] } });
+
+class CheckboxModule {
+    static forRoot() {
+        return { ngModule: CheckboxModule, providers: [] };
+    }
+}
+CheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: CheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+CheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: CheckboxModule, declarations: [CheckboxComponent], imports: [CommonModule, ReactiveFormsModule], exports: [CheckboxComponent] });
+CheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: CheckboxModule, imports: [CommonModule, ReactiveFormsModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: CheckboxModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [CheckboxComponent],
+                    imports: [CommonModule, ReactiveFormsModule],
+                    exports: [CheckboxComponent]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CheckboxComponent, CheckboxModule };
+//# sourceMappingURL=mis-crystal-design-system-checkbox.mjs.map

package/fesm2015/mis-crystal-design-system-checkbox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"mis-crystal-design-system-checkbox.mjs","sources":["../../../projects/mis-components/checkbox/checkbox.component.ts","../../../projects/mis-components/checkbox/checkbox.component.html","../../../projects/mis-components/checkbox/checkbox.module.ts","../../../projects/mis-components/checkbox/mis-crystal-design-system-checkbox.ts"],"sourcesContent":["import { Component, OnInit, EventEmitter, Input, Output, ViewChild, ElementRef, Renderer2 } from \"@angular/core\";\nimport { AbstractControl, UntypedFormControl } from \"@angular/forms\";\n\n@Component({\n  selector: \"mis-checkbox\",\n  templateUrl: \"./checkbox.component.html\",\n  styleUrls: [\"./checkbox.component.scss\"]\n})\nexport class CheckboxComponent implements OnInit {\n  public isError: boolean = false;\n  public isIndeterminate: boolean = false;\n\n  @ViewChild(\"input\") inputBox: ElementRef;\n  @Input() set type(value: \"Default\" | \"Error\") {\n    this.isError = value === \"Error\";\n  }\n  @Input() set indeterminate(value: boolean) {\n    if (value) {\n      this.formControl.setValue(true);\n      this.valueChange.emit({\n        name: this.name,\n        value: true\n      });\n    } else {\n      this.formControl.setValue(false);\n      this.valueChange.emit({\n        name: this.name,\n        value: false\n      });\n    }\n    this.isIndeterminate = value;\n  }\n  @Input() set checked(value: boolean) {\n    if (value) this.formControl.setValue(true);\n    else this.formControl.setValue(false);\n  }\n  @Input() set disabled(value: boolean) {\n    if (value) this.formControl.disable();\n    else this.formControl.enable();\n  }\n  @Input() name: string = \"\";\n  @Input() formControl: AbstractControl = new UntypedFormControl();\n  @Output() valueChange = new EventEmitter<{ name: string; value: boolean }>();\n\n  constructor() {}\n  ngOnInit() {}\n\n  toggleState() {\n    if (this.isIndeterminate) {\n      this.isIndeterminate = false;\n      this.formControl.setValue(true);\n    } else {\n      if (this.formControl.value) this.formControl.setValue(false);\n      else this.formControl.setValue(true);\n    }\n    this.valueChange.emit({\n      name: this.name,\n      value: this.formControl.value\n    });\n  }\n}\n","<div\n  class=\"checkbox-container\"\n  [ngStyle]=\"{ cursor: formControl.disabled ? 'not-allowed' : 'pointer' }\"\n  (click)=\"!formControl.disabled && toggleState()\"\n>\n  <input hidden type=\"checkbox\" [formControl]=\"formControl\" (click)=\"$event.stopPropagation()\" />\n  <span\n    class=\"checkmark\"\n    tabindex=\"0\"\n    *ngIf=\"!isIndeterminate\"\n    [ngClass]=\"{\n      'disabled-checkbox': formControl.disabled,\n      error: isError && !formControl.disabled\n    }\"\n  ></span>\n  <span\n    class=\"checkmark indeterminate\"\n    tabindex=\"0\"\n    *ngIf=\"isIndeterminate\"\n    [ngClass]=\"{\n      'disabled-checkbox': formControl.disabled,\n      error: isError && !formControl.disabled\n    }\"\n  ></span>\n</div>\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { CheckboxComponent } from \"./checkbox.component\";\n\n@NgModule({\n  declarations: [CheckboxComponent],\n  imports: [CommonModule, ReactiveFormsModule],\n  exports: [CheckboxComponent]\n})\nexport class CheckboxModule {\n  static forRoot(): ModuleWithProviders<CheckboxModule> {\n    return { ngModule: CheckboxModule, providers: [] };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/mis-crystal-design-system-chip.mjs

@@ -0,0 +1,61 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class ChipComponent {
+    constructor() {
+        this.label = "";
+        this.value = "";
+        this.size = "Medium";
+        this.iconUrl = null;
+        this.count = null;
+        this.dismissible = false;
+        this.cancel = new EventEmitter();
+    }
+    ngOnInit() { }
+}
+ChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ChipComponent, selector: "mis-chip", inputs: { label: "label", value: "value", size: "size", iconUrl: "iconUrl", count: "count", dismissible: "dismissible" }, outputs: { cancel: "cancel" }, ngImport: i0, template: "<div\n  id=\"chip-container\"\n  [ngClass]=\"{\n    small: size === 'Small',\n    medium: size === 'Medium',\n    'small-m': size === 'Small-M',\n    'medium-m': size === 'Medium-M'\n  }\"\n>\n  <img *ngIf=\"iconUrl && iconUrl.length > 0\" [src]=\"iconUrl\" alt=\"\" />\n  <span>{{ label }}</span>\n  <div *ngIf=\"count != null || count != undefined\" id=\"count-container\">\n    <div id=\"separator\"></div>\n    <span id=\"count-text\">{{ count }}</span>\n  </div>\n  <span *ngIf=\"dismissible\" id=\"close-icon\" (click)=\"cancel.emit(value)\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M5.49931 4.25725C5.15643 3.91437 4.60052 3.91437 4.25765 4.25725C3.91477 4.60012 3.91477 5.15604 4.25765 5.49891L6.75868 7.99994L4.25827 10.5004C3.91539 10.8432 3.91539 11.3991 4.25827 11.742C4.60114 12.0849 5.15706 12.0849 5.49993 11.742L8.00034 9.24161L10.5007 11.742C10.8436 12.0849 11.3995 12.0849 11.7424 11.742C12.0853 11.3991 12.0853 10.8432 11.7424 10.5003L9.24201 7.99995L11.743 5.49893C12.0859 5.15606 12.0859 4.60014 11.743 4.25727C11.4001 3.91439 10.8442 3.91439 10.5014 4.25727L8.00034 6.75828L5.49931 4.25725Z\"\n        fill=\"#181F33\"\n      />\n    </svg>\n  </span>\n</div>\n", styles: ["#chip-container{display:flex;justify-content:center;align-items:center;font-family:Lato,sans-serif!important;background-color:#e0e0e0;box-sizing:border-box;cursor:default}#chip-container:hover{background:#d7d9de}img{margin-right:4px}#close-icon{display:flex;justify-content:center;align-items:center;margin-left:4px;cursor:pointer}#count-container{display:flex;height:100%;justify-content:center;align-items:center}#separator{height:100%;width:1px;background-color:#c8cdd3;margin:0 8px}#count-text{font-weight:700;letter-spacing:.25px}.small{height:24px;padding:4px 8px;border-radius:7px;font-style:normal;font-weight:700;font-size:12px;line-height:16px;letter-spacing:.7px;color:#181f33}.medium{height:32px;padding:6px 12px;border-radius:16px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.small-m{height:20px;padding:4px 8px;border-radius:10px;font-style:normal;font-weight:400;font-size:11px;line-height:12px;letter-spacing:.1px;color:#181f33}.medium-m{height:24px;padding:4px 12px;border-radius:12px;font-style:normal;font-weight:400;font-size:12px;line-height:16px;letter-spacing:.25px;color:#181f33}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChipComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "mis-chip", template: "<div\n  id=\"chip-container\"\n  [ngClass]=\"{\n    small: size === 'Small',\n    medium: size === 'Medium',\n    'small-m': size === 'Small-M',\n    'medium-m': size === 'Medium-M'\n  }\"\n>\n  <img *ngIf=\"iconUrl && iconUrl.length > 0\" [src]=\"iconUrl\" alt=\"\" />\n  <span>{{ label }}</span>\n  <div *ngIf=\"count != null || count != undefined\" id=\"count-container\">\n    <div id=\"separator\"></div>\n    <span id=\"count-text\">{{ count }}</span>\n  </div>\n  <span *ngIf=\"dismissible\" id=\"close-icon\" (click)=\"cancel.emit(value)\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M5.49931 4.25725C5.15643 3.91437 4.60052 3.91437 4.25765 4.25725C3.91477 4.60012 3.91477 5.15604 4.25765 5.49891L6.75868 7.99994L4.25827 10.5004C3.91539 10.8432 3.91539 11.3991 4.25827 11.742C4.60114 12.0849 5.15706 12.0849 5.49993 11.742L8.00034 9.24161L10.5007 11.742C10.8436 12.0849 11.3995 12.0849 11.7424 11.742C12.0853 11.3991 12.0853 10.8432 11.7424 10.5003L9.24201 7.99995L11.743 5.49893C12.0859 5.15606 12.0859 4.60014 11.743 4.25727C11.4001 3.91439 10.8442 3.91439 10.5014 4.25727L8.00034 6.75828L5.49931 4.25725Z\"\n        fill=\"#181F33\"\n      />\n    </svg>\n  </span>\n</div>\n", styles: ["#chip-container{display:flex;justify-content:center;align-items:center;font-family:Lato,sans-serif!important;background-color:#e0e0e0;box-sizing:border-box;cursor:default}#chip-container:hover{background:#d7d9de}img{margin-right:4px}#close-icon{display:flex;justify-content:center;align-items:center;margin-left:4px;cursor:pointer}#count-container{display:flex;height:100%;justify-content:center;align-items:center}#separator{height:100%;width:1px;background-color:#c8cdd3;margin:0 8px}#count-text{font-weight:700;letter-spacing:.25px}.small{height:24px;padding:4px 8px;border-radius:7px;font-style:normal;font-weight:700;font-size:12px;line-height:16px;letter-spacing:.7px;color:#181f33}.medium{height:32px;padding:6px 12px;border-radius:16px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.small-m{height:20px;padding:4px 8px;border-radius:10px;font-style:normal;font-weight:400;font-size:11px;line-height:12px;letter-spacing:.1px;color:#181f33}.medium-m{height:24px;padding:4px 12px;border-radius:12px;font-style:normal;font-weight:400;font-size:12px;line-height:16px;letter-spacing:.25px;color:#181f33}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { label: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], iconUrl: [{
+                type: Input
+            }], count: [{
+                type: Input
+            }], dismissible: [{
+                type: Input
+            }], cancel: [{
+                type: Output
+            }] } });
+
+class ChipModule {
+    static forRoot() {
+        return { ngModule: ChipModule, providers: [] };
+    }
+}
+ChipModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ChipModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: ChipModule, declarations: [ChipComponent], imports: [CommonModule], exports: [ChipComponent] });
+ChipModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChipModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChipModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [ChipComponent],
+                    imports: [CommonModule],
+                    exports: [ChipComponent]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ChipComponent, ChipModule };
+//# sourceMappingURL=mis-crystal-design-system-chip.mjs.map

package/fesm2015/mis-crystal-design-system-chip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"mis-crystal-design-system-chip.mjs","sources":["../../../projects/mis-components/chip/chip.component.ts","../../../projects/mis-components/chip/chip.component.html","../../../projects/mis-components/chip/chip.module.ts","../../../projects/mis-components/chip/mis-crystal-design-system-chip.ts"],"sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter } from \"@angular/core\";\n\n@Component({\n  selector: \"mis-chip\",\n  templateUrl: \"chip.component.html\",\n  styleUrls: [\"chip.component.scss\"]\n})\nexport class ChipComponent implements OnInit {\n  @Input() label: string = \"\";\n  @Input() value: any = \"\";\n  @Input() size: \"Small\" | \"Medium\" | \"Small-M\" | \"Medium-M\" = \"Medium\";\n  @Input() iconUrl: string | null = null;\n  @Input() count: number | null | undefined = null;\n  @Input() dismissible: boolean = false;\n\n  @Output() cancel = new EventEmitter<any>();\n  constructor() {}\n  ngOnInit() {}\n}\n","<div\n  id=\"chip-container\"\n  [ngClass]=\"{\n    small: size === 'Small',\n    medium: size === 'Medium',\n    'small-m': size === 'Small-M',\n    'medium-m': size === 'Medium-M'\n  }\"\n>\n  <img *ngIf=\"iconUrl && iconUrl.length > 0\" [src]=\"iconUrl\" alt=\"\" />\n  <span>{{ label }}</span>\n  <div *ngIf=\"count != null || count != undefined\" id=\"count-container\">\n    <div id=\"separator\"></div>\n    <span id=\"count-text\">{{ count }}</span>\n  </div>\n  <span *ngIf=\"dismissible\" id=\"close-icon\" (click)=\"cancel.emit(value)\">\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M5.49931 4.25725C5.15643 3.91437 4.60052 3.91437 4.25765 4.25725C3.91477 4.60012 3.91477 5.15604 4.25765 5.49891L6.75868 7.99994L4.25827 10.5004C3.91539 10.8432 3.91539 11.3991 4.25827 11.742C4.60114 12.0849 5.15706 12.0849 5.49993 11.742L8.00034 9.24161L10.5007 11.742C10.8436 12.0849 11.3995 12.0849 11.7424 11.742C12.0853 11.3991 12.0853 10.8432 11.7424 10.5003L9.24201 7.99995L11.743 5.49893C12.0859 5.15606 12.0859 4.60014 11.743 4.25727C11.4001 3.91439 10.8442 3.91439 10.5014 4.25727L8.00034 6.75828L5.49931 4.25725Z\"\n        fill=\"#181F33\"\n      />\n    </svg>\n  </span>\n</div>\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { ChipComponent } from \"./chip.component\";\n\n@NgModule({\n  declarations: [ChipComponent],\n  imports: [CommonModule],\n  exports: [ChipComponent]\n})\nexport class ChipModule {\n  static forRoot(): ModuleWithProviders<ChipModule> {\n    return { ngModule: ChipModule, providers: [] };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAOa,aAAa,CAAA;AASxB,IAAA,WAAA,GAAA;AARS,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE,CAAC;AACnB,QAAA,IAAK,CAAA,KAAA,GAAQ,EAAE,CAAC;AAChB,QAAA,IAAI,CAAA,IAAA,GAAgD,QAAQ,CAAC;AAC7D,QAAA,IAAO,CAAA,OAAA,GAAkB,IAAI,CAAC;AAC9B,QAAA,IAAK,CAAA,KAAA,GAA8B,IAAI,CAAC;AACxC,QAAA,IAAW,CAAA,WAAA,GAAY,KAAK,CAAC;AAE5B,QAAA,IAAA,CAAA,MAAM,GAAG,IAAI,YAAY,EAAO,CAAC;KAC3B;AAChB,IAAA,QAAQ,MAAK;;2GAVF,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAb,aAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,aAAa,yMCP1B,g0CA0BA,EAAA,MAAA,EAAA,CAAA,2oCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;4FDnBa,aAAa,EAAA,UAAA,EAAA,CAAA;kBALzB,SAAS;+BACE,UAAU,EAAA,QAAA,EAAA,g0CAAA,EAAA,MAAA,EAAA,CAAA,2oCAAA,CAAA,EAAA,CAAA;0EAKX,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBAEI,MAAM,EAAA,CAAA;sBAAf,MAAM;;;MENI,UAAU,CAAA;AACrB,IAAA,OAAO,OAAO,GAAA;QACZ,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC;KAChD;;wGAHU,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAV,UAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAU,EAJN,YAAA,EAAA,CAAA,aAAa,CAClB,EAAA,OAAA,EAAA,CAAA,YAAY,aACZ,aAAa,CAAA,EAAA,CAAA,CAAA;AAEZ,UAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAU,YAHX,YAAY,CAAA,EAAA,CAAA,CAAA;4FAGX,UAAU,EAAA,UAAA,EAAA,CAAA;kBALtB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,aAAa,CAAC;oBAC7B,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,aAAa,CAAC;iBACzB,CAAA;;;ACRD;;AAEG;;;;"}

package/fesm2015/mis-crystal-design-system-datepicker_v2.mjs

@@ -0,0 +1,360 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, Component, Inject, EventEmitter, Injector, Directive, Self, Optional, Input, Output, HostListener, NgModule } from '@angular/core';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i2$1 from '@angular/cdk/overlay';
+import { OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
+import { parseZone, tz } from 'moment-timezone';
+import * as i1 from 'mis-crystal-design-system/toast';
+import { ToastModule } from 'mis-crystal-design-system/toast';
+import * as i3 from 'mis-crystal-design-system/button';
+import { ButtonModule } from 'mis-crystal-design-system/button';
+import { ComponentPortal } from '@angular/cdk/portal';
+import { take } from 'rxjs/operators';
+import { genPositionPairs } from 'mis-crystal-design-system/utils';
+import * as i1$1 from '@angular/forms';
+
+/** @format */
+const CONTAINER_DATA = new InjectionToken("CONTAINER_DATA");
+const DATE_FORMAT = "DD-MM-YYYY";
+
+const getMonth = (index) => {
+    let month;
+    switch (index) {
+        case 0:
+            month = "January";
+            break;
+        case 1:
+            month = "February";
+            break;
+        case 2:
+            month = "March";
+            break;
+        case 3:
+            month = "April";
+            break;
+        case 4:
+            month = "May";
+            break;
+        case 5:
+            month = "June";
+            break;
+        case 6:
+            month = "July";
+            break;
+        case 7:
+            month = "August";
+            break;
+        case 8:
+            month = "September";
+            break;
+        case 9:
+            month = "October";
+            break;
+        case 10:
+            month = "November";
+            break;
+        case 11:
+            month = "December";
+            break;
+        default:
+            break;
+    }
+    return month;
+};
+
+class TzDpContainerComponent {
+    constructor(data, toast) {
+        var _a, _b, _c, _d;
+        this.toast = toast;
+        this.parseZoneInstance = (...args) => {
+            return parseZone(...args);
+        };
+        this.rawWeekDays = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
+        this.weekDays = [];
+        this.currentMonthDates = [];
+        this.isPreviousMonthDisabled = false;
+        this.isNextMonthDisabled = false;
+        this.allowBookingOnDisabledDay = false;
+        this.data = data;
+        if ((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.dpConfig) === null || _b === void 0 ? void 0 : _b.timezone) {
+            this.parseZoneInstance = (...args) => {
+                return tz(args[0], args[1], this.data.dpConfig.timezone);
+            };
+        }
+        this.currentMonthNumber = this.parseZoneInstance().month();
+        this.currentMonth = getMonth(this.currentMonthNumber);
+        this.currentYearNumber = this.parseZoneInstance().year();
+        this.weekDays = this.rawWeekDays.map((day, index) => ({
+            label: `${day[0]}${day.slice(1).toLowerCase()}`,
+            isCurrentDay: this.parseZoneInstance().day() === index
+        }));
+        if (!((_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c.dpConfig) === null || _d === void 0 ? void 0 : _d.format)) {
+            this.data.dpConfig = Object.assign(Object.assign({}, this.data.dpConfig), { format: DATE_FORMAT });
+        }
+    }
+    ngOnInit() {
+        this.currentDateInstance();
+        this.calculateMinMaxDays();
+    }
+    currentDateInstance() {
+        const selectedDate = parseZone(this.data.date, this.data.dpConfig.format);
+        if (selectedDate.isValid()) {
+            this.currentYearNumber = selectedDate.year();
+            this.currentMonthNumber = selectedDate.month();
+            this.currentMonth = getMonth(this.currentMonthNumber);
+        }
+        this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
+    }
+    calculateMinMaxDays() {
+        const currentInstance = this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber);
+        const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);
+        if (minDate.isValid()) {
+            this.isPreviousMonthDisabled = minDate.isSameOrAfter(currentInstance, "month");
+        }
+        const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
+        if (maxDate.isValid()) {
+            this.isNextMonthDisabled = maxDate.isSameOrBefore(currentInstance, "month");
+        }
+    }
+    navigateMonth(direction) {
+        let thisMonth = parseZone().year(this.currentYearNumber).month(this.currentMonthNumber);
+        if (direction === "NEXT") {
+            thisMonth = thisMonth.add(1, "month");
+        }
+        else if (direction === "PREVIOUS") {
+            thisMonth = thisMonth.subtract(1, "month");
+        }
+        this.currentMonthNumber = thisMonth.month();
+        this.currentMonth = getMonth(this.currentMonthNumber);
+        this.currentYearNumber = thisMonth.year();
+        this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
+        this.calculateMinMaxDays();
+    }
+    generateDates(month, currentYearNumber) {
+        var _a;
+        let dates = [];
+        const daysInMonth = parseZone().year(currentYearNumber).month(month).daysInMonth();
+        for (let currentDate = 1; currentDate <= daysInMonth; currentDate++) {
+            const date = this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate);
+            const dateString = date.format(this.data.dpConfig.format);
+            let isDisabledDay = this.data.datesDisabled.some(d => d === dateString);
+            const minDate = this.parseZoneInstance(this.data.dpConfig.minDate, this.data.dpConfig.format);
+            if (!isDisabledDay && minDate.isValid()) {
+                isDisabledDay = minDate.isAfter(date, "day");
+            }
+            const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate, this.data.dpConfig.format);
+            if (!isDisabledDay && maxDate.isValid()) {
+                isDisabledDay = maxDate.isBefore(date, "day");
+            }
+            dates.push({
+                date: currentDate,
+                weekDay: date.day(),
+                isCurrentDay: this.parseZoneInstance().year(currentYearNumber).month(month).date(currentDate).format(this.data.dpConfig.format) ===
+                    this.parseZoneInstance().format(this.data.dpConfig.format),
+                isSelectedDay: !isDisabledDay && date.format(this.data.dpConfig.format) === this.data.date,
+                toastMessage: ((_a = this.data.messages.find(q => date.format(this.data.dpConfig.format) === q.date)) === null || _a === void 0 ? void 0 : _a.message) || "",
+                isDisabledDay
+            });
+        }
+        for (let i = dates[0].weekDay; i > 0; i--) {
+            dates.unshift({ date: 0, weekDay: i - 1 });
+        }
+        return dates;
+    }
+    selectDay(day) {
+        this.currentSelection = this.parseZoneInstance().year(this.currentYearNumber).month(this.currentMonthNumber).date(day.date);
+        const maxDate = this.parseZoneInstance(this.data.dpConfig.maxDate);
+        const minDate = this.parseZoneInstance(this.data.dpConfig.minDate);
+        this.allowBookingOnDisabledDay = this.data.allowBookingOnDisabledDay;
+        if (day.date <= 0)
+            return;
+        if ((this.currentSelection.isSameOrAfter(minDate) && this.currentSelection.isSameOrBefore(maxDate) && this.allowBookingOnDisabledDay) || (!day.isDisabledDay && !this.allowBookingOnDisabledDay)) {
+            this.localSelectedDate = day;
+            if (!this.data.dpConfig.showApplyButton) {
+                this.applyDate(day);
+            }
+        }
+        if (day.toastMessage || (this.allowBookingOnDisabledDay && day.toastMessage)) {
+            this.toast.displayMsg(day.toastMessage, 4000);
+        }
+    }
+    applyDate(day) {
+        if (day || this.localSelectedDate) {
+            this.data.dateChange(parseZone()
+                .year(this.currentYearNumber)
+                .month(this.currentMonthNumber)
+                .date(day ? day.date : this.localSelectedDate.date)
+                .format(this.data.dpConfig.format));
+        }
+        else {
+            this.cancelDatePicker();
+        }
+    }
+    cancelDatePicker() {
+        this.data.dateChange("");
+    }
+}
+TzDpContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TzDpContainerComponent, deps: [{ token: CONTAINER_DATA }, { token: i1.ToastService }], target: i0.ɵɵFactoryTarget.Component });
+TzDpContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TzDpContainerComponent, selector: "mis-tz-dp", ngImport: i0, template: "<div class=\"datepicker-container\">\n  <div class=\"datepicker-container__header\">\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n      [ngClass]=\"{\n        'disabled-month': isPreviousMonthDisabled\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n    <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n      [ngClass]=\"{\n        'disabled-month': isNextMonthDisabled\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n  </div>\n  <div class=\"datepicker-container__body\">\n    <div class=\"datepicker-container__weekdays\">\n      <div class=\"datepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n        <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{ weekDay.label }}</span>\n      </div>\n    </div>\n    <div class=\"datepicker-container__days\">\n      <div\n        class=\"datepicker-container__day\"\n        [ngClass]=\"{\n          'selected-day': !localSelectedDate ? day.isSelectedDay : day === localSelectedDate,\n          'disabled-day': day.isDisabledDay,\n          'is-valid-date': day.date > 0 && !day.isSelectedDay\n        }\"\n        *ngFor=\"let day of currentMonthDates\"\n        (click)=\"selectDay(day)\"\n      >\n        <span\n          *ngIf=\"day.date > 0\"\n          [ngClass]=\"{\n            'current-day': day.isCurrentDay,\n            'selected-day': !localSelectedDate ? day.isSelectedDay : day === localSelectedDate,\n            'disabled-day': day.isDisabledDay\n          }\"\n        >\n          {{ day.date }}\n        </span>\n      </div>\n    </div>\n  </div>\n  <div class=\"datepicker-container__footer\" *ngIf=\"data.dpConfig.showApplyButton\">\n    <button mis-button size=\"md\" type=\"'none'\" (click)=\"cancelDatePicker()\">Cancel</button>\n    <button mis-button size=\"md\" type=\"primary\" (click)=\"applyDate()\" [disabled]=\"!(data.date || localSelectedDate)\">Apply</button>\n  </div>\n</div>\n", styles: [".datepicker-container{background:#ffffff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;-webkit-user-select:none;user-select:none;box-sizing:border-box;width:290px}.datepicker-container .datepicker-container__header{display:flex;height:32px;margin:16px;justify-content:space-between;align-items:center;width:258px}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}.datepicker-container .datepicker-container__body{width:258px;height:100%;margin:0 16px 16px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}.datepicker-container .datepicker-container__footer{display:flex;justify-content:flex-end;gap:8px;bottom:0;align-items:center;position:sticky;padding:16px;border-top:1px solid #e0e0e0}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ButtonDirective, selector: "[mis-button]", inputs: ["type", "size"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TzDpContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "mis-tz-dp", template: "<div class=\"datepicker-container\">\n  <div class=\"datepicker-container__header\">\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n      [ngClass]=\"{\n        'disabled-month': isPreviousMonthDisabled\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n    <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n      [ngClass]=\"{\n        'disabled-month': isNextMonthDisabled\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n  </div>\n  <div class=\"datepicker-container__body\">\n    <div class=\"datepicker-container__weekdays\">\n      <div class=\"datepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n        <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{ weekDay.label }}</span>\n      </div>\n    </div>\n    <div class=\"datepicker-container__days\">\n      <div\n        class=\"datepicker-container__day\"\n        [ngClass]=\"{\n          'selected-day': !localSelectedDate ? day.isSelectedDay : day === localSelectedDate,\n          'disabled-day': day.isDisabledDay,\n          'is-valid-date': day.date > 0 && !day.isSelectedDay\n        }\"\n        *ngFor=\"let day of currentMonthDates\"\n        (click)=\"selectDay(day)\"\n      >\n        <span\n          *ngIf=\"day.date > 0\"\n          [ngClass]=\"{\n            'current-day': day.isCurrentDay,\n            'selected-day': !localSelectedDate ? day.isSelectedDay : day === localSelectedDate,\n            'disabled-day': day.isDisabledDay\n          }\"\n        >\n          {{ day.date }}\n        </span>\n      </div>\n    </div>\n  </div>\n  <div class=\"datepicker-container__footer\" *ngIf=\"data.dpConfig.showApplyButton\">\n    <button mis-button size=\"md\" type=\"'none'\" (click)=\"cancelDatePicker()\">Cancel</button>\n    <button mis-button size=\"md\" type=\"primary\" (click)=\"applyDate()\" [disabled]=\"!(data.date || localSelectedDate)\">Apply</button>\n  </div>\n</div>\n", styles: [".datepicker-container{background:#ffffff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;-webkit-user-select:none;user-select:none;box-sizing:border-box;width:290px}.datepicker-container .datepicker-container__header{display:flex;height:32px;margin:16px;justify-content:space-between;align-items:center;width:258px}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}.datepicker-container .datepicker-container__body{width:258px;height:100%;margin:0 16px 16px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}.datepicker-container .datepicker-container__footer{display:flex;justify-content:flex-end;gap:8px;bottom:0;align-items:center;position:sticky;padding:16px;border-top:1px solid #e0e0e0}\n"] }]
+        }], ctorParameters: function () {
+        return [{ type: undefined, decorators: [{
+                        type: Inject,
+                        args: [CONTAINER_DATA]
+                    }] }, { type: i1.ToastService }];
+    } });
+
+class TzDatepickerDirective {
+    constructor(control, element, overlay, viewContainerRef) {
+        this.control = control;
+        this.element = element;
+        this.overlay = overlay;
+        this.viewContainerRef = viewContainerRef;
+        this.dateMessages = [];
+        this.positionX = "center";
+        this.positionY = "bottom";
+        this.offsetX = 0;
+        this.offsetY = 0;
+        this.allowBookingOnDisabledDay = false;
+        this.dateChange = new EventEmitter(true);
+        this.isOpen = false;
+        this.dpDisabledDates = [];
+    }
+    // dd-mm-yyyy 01-12-2022
+    set selectedDate(date) {
+        this.date = date;
+    }
+    set datesDisabled(dates) {
+        this.dpDisabledDates = dates;
+    }
+    ngOnInit() { }
+    toggleDatePicker() {
+        if (this.isOpen) {
+            this.close();
+        }
+        else {
+            this.open();
+        }
+    }
+    open() {
+        var _a;
+        this.dpConfig = Object.assign({ format: DATE_FORMAT, minDate: "", maxDate: "", showApplyButton: false }, this.dpConfig);
+        this.isOpen = true;
+        const positionStrategy = this.overlay
+            .position()
+            .flexibleConnectedTo(this.element)
+            .withPositions(genPositionPairs({
+            positionX: this.positionX,
+            positionY: this.positionY,
+            offsetX: this.offsetX,
+            offsetY: this.offsetY
+        }, true))
+            .withPush(true);
+        const config = new OverlayConfig({
+            hasBackdrop: true,
+            positionStrategy,
+            scrollStrategy: this.overlay.scrollStrategies.reposition(),
+            backdropClass: "cdk-overlay-transparent-backdrop"
+        });
+        this.overlayRef = this.overlay.create(config);
+        const tempRef = new ComponentPortal(TzDpContainerComponent, this.viewContainerRef, Injector.create({
+            providers: [
+                {
+                    provide: CONTAINER_DATA,
+                    useValue: {
+                        messages: this.dateMessages,
+                        date: ((_a = this.control) === null || _a === void 0 ? void 0 : _a.control.value) || this.date,
+                        allowBookingOnDisabledDay: this.allowBookingOnDisabledDay,
+                        dpConfig: this.dpConfig,
+                        datesDisabled: this.dpDisabledDates,
+                        dateChange: this.applyDate.bind(this)
+                    }
+                }
+            ]
+        }));
+        this.overlayRef.attach(tempRef);
+        this.overlayRef
+            .backdropClick()
+            .pipe(take(1))
+            .subscribe(() => {
+            this.close();
+        });
+    }
+    applyDate(date = "") {
+        var _a;
+        if (!date) {
+            this.close();
+            return;
+        }
+        this.dateChange.emit(date);
+        (_a = this.control) === null || _a === void 0 ? void 0 : _a.control.patchValue(date);
+        this.date = date;
+        this.close();
+    }
+    close() {
+        this.isOpen = false;
+        this.overlayRef.detach();
+        this.overlayRef.dispose();
+    }
+}
+TzDatepickerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TzDatepickerDirective, deps: [{ token: i1$1.NgControl, optional: true, self: true }, { token: i0.ElementRef }, { token: i2$1.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+TzDatepickerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.12", type: TzDatepickerDirective, selector: "input[misTzDp]", inputs: { dpConfig: "dpConfig", selectedDate: "selectedDate", datesDisabled: "datesDisabled", dateMessages: "dateMessages", positionX: "positionX", positionY: "positionY", offsetX: "offsetX", offsetY: "offsetY", allowBookingOnDisabledDay: "allowBookingOnDisabledDay" }, outputs: { dateChange: "dateChange" }, host: { listeners: { "click": "toggleDatePicker()" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TzDatepickerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "input[misTzDp]"
+                }]
+        }], ctorParameters: function () {
+        return [{ type: i1$1.NgControl, decorators: [{
+                        type: Self
+                    }, {
+                        type: Optional
+                    }] }, { type: i0.ElementRef }, { type: i2$1.Overlay }, { type: i0.ViewContainerRef }];
+    }, propDecorators: { dpConfig: [{
+                type: Input
+            }], selectedDate: [{
+                type: Input
+            }], datesDisabled: [{
+                type: Input
+            }], dateMessages: [{
+                type: Input
+            }], positionX: [{
+                type: Input
+            }], positionY: [{
+                type: Input
+            }], offsetX: [{
+                type: Input
+            }], offsetY: [{
+                type: Input
+            }], allowBookingOnDisabledDay: [{
+                type: Input
+            }], dateChange: [{
+                type: Output
+            }], toggleDatePicker: [{
+                type: HostListener,
+                args: ["click"]
+            }] } });
+
+class DatepickerModuleV2 {
+}
+DatepickerModuleV2.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DatepickerModuleV2, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+DatepickerModuleV2.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: DatepickerModuleV2, declarations: [TzDpContainerComponent, TzDatepickerDirective], imports: [CommonModule, OverlayModule, i1.ToastModule, ButtonModule], exports: [TzDpContainerComponent, TzDatepickerDirective] });
+DatepickerModuleV2.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DatepickerModuleV2, imports: [CommonModule, OverlayModule, ToastModule.forRoot(), ButtonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DatepickerModuleV2, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [TzDpContainerComponent, TzDatepickerDirective],
+                    imports: [CommonModule, OverlayModule, ToastModule.forRoot(), ButtonModule],
+                    exports: [TzDpContainerComponent, TzDatepickerDirective]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { DatepickerModuleV2, TzDatepickerDirective, TzDpContainerComponent };
+//# sourceMappingURL=mis-crystal-design-system-datepicker_v2.mjs.map