automate-datepicker 1.0.1 → 1.0.2

package/README.md

@@ -0,0 +1,115 @@
+## Automate DatePicker
+
+Automate datepicker is a simple datepicker for Automate web sites purposes. 
+
+## **Features**
+
+*   [x] Custom formatting
+*   [x] Min/Max date restriction
+*   [x] Ability to disable specific days of week
+*   [x] Ability to disable specific dates
+*   [x] Ability to hightlight specific dates
+*   [x] Ability to change initial view (days, month, year)
+*   [x] Custom template
+*   [x] Accessibility
+*   [x] Themes
+
+## **Warning**
+
+Library is under active development and may have API breaking changes for subsequent major versions after 1.0.0.
+
+## **Getting started**
+
+### Step 1: Install `**automate-datepicker**`**:**
+
+#### NPM
+
+```plaintext
+npm install --save @automate-datepicker
+```
+
+### Step 2: Import the AutomateDatePickerModule and angular FormsModule module:
+
+```typescript
+import { AutomateDatePickerModule } from 'automate-datepicker';
+import { FormsModule } from '@angular/forms';
+
+@NgModule({
+  declarations: [AppComponent],
+  imports: [AutomateDatePickerModule, FormsModule],
+  bootstrap: [AppComponent]
+})
+export class AppModule {}
+```
+
+### **Usage**
+
+Define options in your consuming component:
+
+```typescript
+@Component({...})
+export class ExampleComponent {
+    selectedDate: Date;
+}
+```
+
+In template use `automate-datepicker` component with your options
+
+```html
+<!--Using template-->
+<automate-datepicker [(ngModel)]="selectedDate">
+    <ng-template appendToTmp let-formattedDate="formattedDate">
+
+        <button>{{formattedDate}}</button>
+
+    </ng-template>
+</automate-datepicker>
+
+<!--Simple use-->
+<automate-datepicker [(ngModel)]="selectedDate">
+</automate-datepicker>
+```
+
+## API
+
+---
+
+### Inputs
+
+<table><tbody><tr><td><strong>Input</strong></td><td><strong>Type</strong></td><td><strong>Default</strong></td><td><strong>Required</strong></td><td><strong>Description</strong></td></tr><tr><td>[container]</td><td><code>string</code> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</td><td><code>null</code></td><td>no</td><td>Append dropdown to body or any other element using css selector. For correct positioning <code>body</code> should have <code>position:relative</code></td></tr><tr><td>[placeholder]</td><td><code>string</code></td><td>-</td><td>no</td><td style="border:1px solid var(--color-border-default);padding:6px 13px;">The date-picker input placeholder</td></tr><tr><td>[disabled]</td><td><code>boolean</code></td><td><code>false</code></td><td>no</td><td>If set to true the input would be disabled</td></tr><tr><td>[placement]</td><td><code>'left' | 'right'</code></td><td><code>left</code> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</td><td>no</td><td>Set the dropdown position on open</td></tr><tr><td>[theme]</td><td><p><code>'default' | 'dark' |&nbsp;</code></p><p><code>'default christmas' |&nbsp;</code></p><p><code>'dark christmas'</code></p></td><td><code>default</code></td><td>no</td><td>Theme is a class added to the popup container (and inner components) - this will allow styling of the calendar when it's appended to outer element (for example - body)</td></tr><tr><td>[config]</td><td>DatePickerConfig</td><td><code>See Below</code></td><td>no</td><td>Configuration object - see description below</td></tr></tbody></table>
+
+### Outputs
+
+<table><tbody><tr><td><strong>Output</strong></td><td><strong>Description</strong></td></tr><tr><td>(onShown)</td><td>Fired on datepicker open &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</td></tr><tr><td>(onClose)</td><td>Fired on datepicker close</td></tr></tbody></table>
+
+### Methods
+
+<table><tbody><tr><td><strong>Name</strong></td><td><strong>Description</strong></td></tr><tr><td>show</td><td>Opens the datepicker panel &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</td></tr><tr><td>hide</td><td>Closes the datepicker panel</td></tr><tr><td>toggle</td><td>Change from open state to close or close state to open</td></tr></tbody></table>
+
+### Configuration: In order to provide configurations to the date-picker you need to pass it to the `automate-datepicker` component:
+
+```typescript
+<automate-datepicker [(ngModel)]="selectedDate" [config]="config"></automate-datepicker>
+```
+
+Here are the available configurations:
+
+<table><tbody><tr><td><strong>Name</strong></td><td><strong>Type</strong></td><td><strong>Default</strong></td><td><strong>Applies To</strong></td><td><strong>Description</strong></td></tr><tr><td>format</td><td><code>string</code></td><td><code>'MM/dd/yyyy'</code></td><td>All</td><td>Will be used as the input format style.</td></tr><tr><td>minDate</td><td><code>Date</code></td><td><code>undefined</code></td><td>All</td><td>Disables all dates (on the date-picker) that are set to before the <code>minDate.</code></td></tr><tr><td>maxDate</td><td><code>Date</code></td><td><code>undefined</code></td><td>All</td><td>Disables all dates (on the date-picker) that are set to after the <code>maxDate.</code></td></tr><tr><td>disabledDaysOfWeek</td><td><code>number[]</code></td><td><code>undefined</code></td><td>day</td><td>Disables provided days of week.</td></tr><tr><td>disabledDates</td><td><code>Date[]</code></td><td><code>undefined</code></td><td>day</td><td>Disables provided dates.</td></tr><tr><td>hightLightedDates</td><td><code>{ date:Date, style:Partial&lt;CSSStyleDeclaration&gt; }[]</code></td><td><code>undefined</code></td><td>day</td><td>Hightlight provided dates by specific style.</td></tr><tr><td>daysOfWeek</td><td><code>string[]</code></td><td>&nbsp;</td><td>day</td><td>Days of week names.</td></tr><tr><td>startView</td><td><p><code>EAutomateDatepickerCalendarMode</code>&nbsp;</p><p>(Days = 1, Months = 2, Years = 3)</p></td><td><code>Days</code></td><td>All</td><td>The mode of the calender which will be displayed first.</td></tr><tr><td>closeAfterSelect</td><td><code>boolean</code></td><td><code>true</code></td><td>All</td><td>Indicate, should datepicker be closed after selection.</td></tr><tr><td>showTodayDay</td><td><code>boolean</code></td><td><code>true</code></td><td>day</td><td>Indicate, should datepicker days calendar hightlight today date.</td></tr><tr><td>monthTitle</td><td><code>string</code></td><td><code>'MMMM'</code></td><td>day</td><td>Month format at the datepicker header.</td></tr><tr><td>yearTitle</td><td><code>string</code></td><td><code>'yyyy'</code></td><td>month, year</td><td>Year format at the datepicker header.</td></tr><tr><td>dayLabel</td><td><code>string</code></td><td><code>'d'</code></td><td>day</td><td>Day format at the datepicker calendar.</td></tr><tr><td>monthLabel</td><td><code>string</code></td><td><code>'MMMM'</code></td><td>month</td><td>Month format at the datepicker calendar.</td></tr><tr><td>yearLabel</td><td><code>string</code></td><td><code>'yyyy'</code></td><td>year</td><td>Year format at the datepicker calendar.</td></tr></tbody></table>
+
+### Screenshots
+
+**Default**
+
+![](https://33333.cdn.cke-cs.com/kSW7V9NHUXugvhoQeFaf/images/582ae8756065fe6eae1dca3092b310c4aac06949590dbd70.png)
+
+**Dark**
+
+![](https://33333.cdn.cke-cs.com/kSW7V9NHUXugvhoQeFaf/images/181fefe470fdb651cde948110fd05d2335bce1cca046f906.png)
+
+**Default Christmas**
+
+![](https://33333.cdn.cke-cs.com/kSW7V9NHUXugvhoQeFaf/images/8c493367601ccdce840203bc5fc71a602abfe508e38267b2.png)
+
+**Dark Christmas**
+
+![](https://33333.cdn.cke-cs.com/kSW7V9NHUXugvhoQeFaf/images/d9e5250d2b35646db32d1dcc806d65d3e5c8c05f0ac9b000.png)

package/automate-datepicker.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"AutomateDatePickerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":17,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵg"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵi"},{"__symbolic":"reference","name":"ɵj"},{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵl"},{"__symbolic":"reference","name":"ɵm"},{"__symbolic":"reference","name":"ɵn"}],"entryComponents":[{"__symbolic":"reference","name":"ɵn"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":38,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":39,"character":4}],"exports":[{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵa"}]}]}],"members":{}},"DatePickerConfig":{"__symbolic":"class","members":{}},"HightLightedDateConfig":{"__symbolic":"class","members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":3,"character":1},"arguments":[{"selector":"[appendToTmp]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"reference","name":"ɵb"}]}]}]}},"ɵb":{"__symbolic":"interface"},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"chevron","template":"<i [className]=\"'chevron ' + orientation\"></i>","styles":[".chevron::before{border-style:solid;border-width:2px 2px 0 0;border-radius:2px;content:\"\";display:inline-block;height:.45em;left:.15em;position:relative;top:.15em;transform:rotate(-45deg);vertical-align:top;width:.45em;margin-top:6px;margin-left:-1px}.chevron::before ::before{height:.55rem;width:.55rem;vertical-align:middle}:host{width:25px;height:25px;text-align:center}.chevron.right::before{left:-.03rem;transform:rotate(45deg)}.chevron.left::before{left:.1rem;transform:rotate(-135deg)}"]}]}],"members":{"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":3}}]}]}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"automate-datepicker","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":14,"character":11},"useExisting":{"__symbolic":"reference","name":"ɵd"},"multi":true}],"template":"<div class=\"append-to-container\" (click)=\"toggle()\">\r\n    <div class=\"append-to-wrapper\" #appendToTmpWrapper>\r\n        <ng-template #defaultAppendToTemplate>\r\n            <input class=\"datepicker-input\" [placeholder]=\"placeholder\" [ngModel]=\"formattedDate\" #datepickerInput />\r\n        </ng-template>\r\n\r\n        <ng-template [ngTemplateOutletContext]=\"{ date: model, formattedDate: formattedDate, config: config }\"\r\n            [ngTemplateOutlet]=\"appendToTemplate?.template || defaultAppendToTemplate\">\r\n        </ng-template>\r\n    </div>\r\n</div>\r\n\r\n<automate-datepicker-calendar-container [appendTo]=\"appendToTemplateWrapper\" [container]=\"container\" [placement]=\"placement\"\r\n    *ngIf=\"isOpen && container !== 'body'\">\r\n    <automate-datepicker-calendar [config]=\"config\" [selectedDate]=\"model\" (onDaySelected)=\"daySelected($event)\">\r\n    </automate-datepicker-calendar>\r\n</automate-datepicker-calendar-container>","styles":[":host{display:inline-flex}.append-to-container{display:flex;width:100%}.append-to-wrapper{width:100%;display:flex}.datepicker-input{padding:.375rem .75rem;border:1px solid #ced4da;color:#43484c;font-size:14px;width:100%;border-radius:4px}.datepicker-input:focus{outline:0;border:1px solid #ced4da}"]}]}],"members":{"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"container":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"placement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"onShown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":51,"character":3}}]}],"onClose":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":53,"character":3}}]}],"appendToTemplateWrapper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":56,"character":3},"arguments":["appendToTmpWrapper"]}]}],"defaultAppendToTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":59,"character":3},"arguments":["defaultAppendToTemplate",{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":59,"character":48}}]}]}],"appendToTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":62,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵa"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":93,"character":48},{"__symbolic":"reference","module":"@angular/core","name":"ApplicationRef","line":94,"character":30},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":95,"character":32}]}],"ngOnDestroy":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"daySelected":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"hide":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}],"_createDropdown":[{"__symbolic":"method"}],"_destroyDropdown":[{"__symbolic":"method"}],"_appendComponentToBody":[{"__symbolic":"method"}],"_updateFormattedDate":[{"__symbolic":"method"}],"documentClick":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":220,"character":3},"arguments":["document:click",["$event"]]}]}],"_parentHasElement":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-container","template":"<div class=\"date-picker-container\" #container [ngStyle]=\"positionStyle\">\r\n    <ng-content></ng-content>\r\n</div>","styles":[".date-picker-container{position:absolute;font-family:system-ui;background:#fff;white-space:nowrap;border:1px solid #f0f0f0;padding:0 5px;margin-top:1px;z-index:1;box-shadow:3px 3px 8px -2px rgba(235,235,235,.77)}:host{position:relative}"]}]}],"members":{"appendTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":5}}]}],"placement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"container":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"containerElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":17,"character":5},"arguments":["container"]}]}],"_getAppendToPositions":[{"__symbolic":"method"}],"_getLeft":[{"__symbolic":"method"}],"_getTop":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"automate-datepicker-calendar","template":"<div class=\"calendar\">\r\n    <automate-datepicker-calendar-header [mode]=\"mode\" [currentYearsRange]=\"currentYearsRange\" [currentYear]=\"currentYear\"\r\n        [currentMonth]=\"currentMonth\" [config]=\"config\" (onYearSelected)=\"yearSelected($event)\" (onMonthSelected)=\"monthSelected($event)\"\r\n        (onOpenYearsCalendar)=\"openYearsCalendar()\" (onOpenMonthsCalendar)=\"openMonthsCalendar()\" (onNextYearsRange)=\"nextYearsRange()\"\r\n        (onPrevYearsRange)=\"prevYearsRange()\">\r\n    </automate-datepicker-calendar-header>\r\n\r\n    <div class=\"calendar-container\">\r\n        <automate-datepicker-days-calendar *ngIf=\"mode === EAutomateDatepickerCalendarMode.Days\" [config]=\"config\"\r\n            [currentMonth]=\"currentMonth\" (onDaySelected)=\"daySelected($event)\">\r\n        </automate-datepicker-days-calendar>\r\n\r\n        <automate-datepicker-months-calendar *ngIf=\"mode === EAutomateDatepickerCalendarMode.Months\" [currentYear]=\"currentYear\"\r\n            (onMonthSelected)=\"monthSelected($event)\" (onOpenDaysCalendar)=\"openDaysCalendar()\">\r\n        </automate-datepicker-months-calendar>\r\n\r\n        <automate-datepicker-years-calendar *ngIf=\"mode === EAutomateDatepickerCalendarMode.Years\" [currentYearsRange]=\"currentYearsRange\"\r\n            (onYearSelected)=\"yearSelected($event)\" (onOpenMonthsCalendar)=\"openMonthsCalendar()\">\r\n        </automate-datepicker-years-calendar>\r\n    </div>\r\n</div>","styles":[".calendar-container{width:15rem;height:15rem;border-top:1px solid #f0f0f0;color:#43484c}"]}]}],"members":{"selectedDate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"onDaySelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":37,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"openDaysCalendar":[{"__symbolic":"method"}],"openMonthsCalendar":[{"__symbolic":"method"}],"openYearsCalendar":[{"__symbolic":"method"}],"nextYearsRange":[{"__symbolic":"method"}],"prevYearsRange":[{"__symbolic":"method"}],"yearSelected":[{"__symbolic":"method"}],"monthSelected":[{"__symbolic":"method"}],"daySelected":[{"__symbolic":"method"}],"_setCurrentMonthAndYear":[{"__symbolic":"method"}],"_setCurrentMonth":[{"__symbolic":"method"}],"_setCurrentYear":[{"__symbolic":"method"}],"_createYearsRangeByCurrentYear":[{"__symbolic":"method"}],"_createYearsRange":[{"__symbolic":"method"}],"_updateDisabledState":[{"__symbolic":"method"}],"_updateHightLightedState":[{"__symbolic":"method"}],"_updateCalendarMode":[{"__symbolic":"method"}]}},"ɵg":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-header","template":"<div class=\"header-container\">\r\n    <automate-datepicker-calendar-days-mode-header *ngIf=\"mode === EAutomateDatepickerCalendarMode.Days\" [currentYear]=\"currentYear\"\r\n        [currentMonth]=\"currentMonth\" (onYearSelected)=\"onYearSelected.emit($event)\" (onMonthSelected)=\"onMonthSelected.emit($event)\"\r\n        [config]=\"config\" (onOpenYearsCalendar)=\"onOpenYearsCalendar.emit()\" (onOpenMonthsCalendar)=\"onOpenMonthsCalendar.emit($event)\">\r\n    </automate-datepicker-calendar-days-mode-header>\r\n\r\n\r\n    <automate-datepicker-calendar-months-mode-header *ngIf=\"mode === EAutomateDatepickerCalendarMode.Months\"\r\n        [currentYear]=\"currentYear\" [config]=\"config\" (onYearSelected)=\"onYearSelected.emit($event)\" (onMonthSelected)=\"onMonthSelected.emit($event)\"\r\n        (onOpenYearsCalendar)=\"onOpenYearsCalendar.emit()\">\r\n    </automate-datepicker-calendar-months-mode-header>\r\n\r\n    <automate-datepicker-calendar-years-mode-header *ngIf=\"mode === EAutomateDatepickerCalendarMode.Years\"\r\n        [currentYearsRange]=\"currentYearsRange\" [config]=\"config\" (onNextYearsRange)=\"onNextYearsRange.emit()\"\r\n        (onPrevYearsRange)=\"onPrevYearsRange.emit()\">\r\n    </automate-datepicker-calendar-years-mode-header>\r\n</div>","styles":[".header-container{background:#fff;height:35px;display:flex;align-items:center;color:#43484c;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem;color:#0192c8}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"mode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"currentYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":5}}]}],"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":5}}]}],"currentMonth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":5}}]}],"onNextYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":5}}]}],"onPrevYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":27,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":29,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":5}}]}],"onOpenMonthsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":33,"character":5}}]}],"onOpenYearsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":35,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵh":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-years-mode-header","template":"<div class=\"years-header\" *ngIf=\"currentYearsRange\">\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isPrevRangeEnabled\" (click)=\"prevRange()\">\r\n        <chevron [orientation]=\"'left'\"></chevron>\r\n    </div>\r\n\r\n    <div class=\"years-range\">\r\n        {{currentYearsRange.startYearTitle}}-{{currentYearsRange.endYearTitle}}\r\n    </div>\r\n\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isNextRangeEnabled\" (click)=\"nextRange()\">\r\n        <chevron [orientation]=\"'right'\"></chevron>\r\n    </div>\r\n</div>","styles":[".years-header{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center}.years-range{display:inline-flex;cursor:pointer}",".header-container{background:#fff;height:35px;display:flex;align-items:center;color:#43484c;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem;color:#0192c8}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"currentYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"onNextYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":16,"character":5}}]}],"onPrevYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":18,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"prevRange":[{"__symbolic":"method"}],"nextRange":[{"__symbolic":"method"}]}},"ɵi":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-months-mode-header","template":"<div class=\"months-header\">\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isPrevYearEnabled\" (click)=\"prevYear()\">\r\n        <chevron [orientation]=\"'left'\"></chevron>\r\n    </div>\r\n\r\n    <div class=\"current-year\" (click)=\"openYearsCalendar()\">\r\n        {{currentYear.yearTitle}}\r\n    </div>\r\n\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isNextYearEnabled\" (click)=\"nextYear()\">\r\n        <chevron [orientation]=\"'right'\"></chevron>\r\n    </div>\r\n</div>","styles":[".months-header{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center}.current-year{display:inline-flex;cursor:pointer}",".header-container{background:#fff;height:35px;display:flex;align-items:center;color:#43484c;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem;color:#0192c8}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":16,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":18,"character":5}}]}],"onOpenYearsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":20,"character":5}}]}],"openYearsCalendar":[{"__symbolic":"method"}],"prevYear":[{"__symbolic":"method"}],"nextYear":[{"__symbolic":"method"}]}},"ɵj":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-days-mode-header","template":"<div class=\"days-header\">\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isPrevMonthEnabled\" (click)=\"prevMonth()\">\r\n        <chevron [orientation]=\"'left'\"></chevron>\r\n    </div>\r\n\r\n    <div class=\"current-month\" (click)=\"openMonthsCalendar()\">\r\n        {{currentMonth.monthTitle}}\r\n    </div>\r\n\r\n    <div class=\"current-year\" (click)=\"openYearsCalendar()\">\r\n        {{currentYear.yearTitle}}\r\n    </div>\r\n\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isNextMonthEnabled\" (click)=\"nextMonth()\">\r\n        <chevron [orientation]=\"'right'\"></chevron>\r\n    </div>\r\n</div>","styles":[".days-header{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center}.current-month,.current-year{display:inline-flex;cursor:pointer}",".header-container{background:#fff;height:35px;display:flex;align-items:center;color:#43484c;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem;color:#0192c8}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":5}}]}],"currentMonth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":21,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":5}}]}],"onOpenMonthsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":5}}]}],"onOpenYearsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":27,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"openMonthsCalendar":[{"__symbolic":"method"}],"openYearsCalendar":[{"__symbolic":"method"}],"prevMonth":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}]}},"ɵk":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-years-calendar","template":"<div class=\"years-container\" *ngIf=\"currentYearsRange\">\r\n    <div class=\"year\" [class.selected]=\"year.isSelected\" [class.disabled]=\"year.isDisabled\" *ngFor=\"let year of currentYearsRange.years\"\r\n        (click)=\"selectYear(year)\">\r\n        {{year.yearLabel}}\r\n    </div>\r\n</div>","styles":[".years-container{display:flex;flex-wrap:wrap;height:100%}.year{display:inline-flex;width:calc((100% / 4) - 10px);border-radius:50%;margin:5px;font-size:14px;justify-content:center;align-items:center;cursor:pointer;color:#686d73;line-height:100%;transition:.5s}.year:not(.selected):not(.disabled):hover{background:#d9ebfe}.year.selected{font-weight:700;box-sizing:border-box}.year.disabled{cursor:default;opacity:.5}"]}]}],"members":{"currentYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":13,"character":5}}]}],"onOpenMonthsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":15,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"selectYear":[{"__symbolic":"method"}]}},"ɵl":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-months-calendar","template":"<div class=\"months-container\">\r\n    <div class=\"month\" [class.selected]=\"month.isSelected\" [class.disabled]=\"month.isDisabled\" *ngFor=\"let month of currentYear.months\"\r\n        (click)=\"selectMonth(month)\">\r\n        {{month.monthLabel}}\r\n    </div>\r\n</div>","styles":[".months-container{display:flex;flex-wrap:wrap;height:100%}.month{display:inline-flex;width:calc((100% / 3) - 0px);margin:7px 0;font-size:13px;justify-content:center;align-items:center;cursor:pointer;color:#686d73;border-radius:10%;transition:.5s}.month:not(.selected):not(.disabled):hover{background:#d9ebfe}.month.selected{font-weight:700;box-sizing:border-box}.month.disabled{cursor:default;opacity:.5}"]}]}],"members":{"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":13,"character":5}}]}],"onOpenDaysCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":15,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"selectMonth":[{"__symbolic":"method"}]}},"ɵm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"automate-datepicker-days-calendar","template":"<div *ngIf=\"currentMonth\">\r\n    <div>\r\n        <div class=\"day-of-week\" *ngFor=\"let dayOfWeek of config.daysOfWeek\">\r\n            {{dayOfWeek}}\r\n        </div>\r\n    </div>\r\n    <div class=\"week\" *ngFor=\"let week of currentMonth.weeks\">\r\n        <div class=\"day\" *ngFor=\"let day of week.days\" [class.selected]=\"day.isSelected\" [class.today]=\"day.isToday\"\r\n            [class.disabled]=\"day.isDisabled\" [ngStyle]=\"day.hightLightedStyle\" (click)=\"selectDay(day)\">\r\n            {{day.dayLabel}}\r\n        </div>\r\n    </div>\r\n</div>","styles":[".day,.day-of-week{width:calc((100% / 7) - 4px);height:30px}.day-of-week{font-size:12px;display:inline-flex;justify-content:center;align-items:center;margin:2px;color:#a3a8ab;font-weight:500;cursor:default}.day{display:inline-flex;border-radius:50%;margin:2px;cursor:pointer;justify-content:center;align-items:center;font-size:13px;color:#686d73;transition:.5s;line-height:30px}.day:not(.selected):not(.disabled):hover{background:#d9ebfe}.day.selected{background:rgba(1,146,200,.8);color:#fff;box-sizing:border-box}.day.today:not(.selected){background:#d9ebfe}.day.disabled{cursor:default;opacity:.5}"]}]}],"members":{"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"currentMonth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"onDaySelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":17,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"selectDay":[{"__symbolic":"method"}]}},"ɵn":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"automate-datepicker-dropdown","template":"<div class=\"automate-datepicker-dropdown\" [ngStyle]=\"positionStyle\">\r\n    <automate-datepicker-calendar-container #container>\r\n        <automate-datepicker-calendar [config]=\"config\" [selectedDate]=\"selectedDate\" (onDaySelected)=\"onDaySelected.emit($event)\">\r\n        </automate-datepicker-calendar>\r\n    </automate-datepicker-calendar-container>\r\n</div>","styles":[".automate-datepicker-dropdown{position:absolute;z-index:1060}"]}]}],"members":{"appendTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"placement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"selectedDate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"onDaySelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":3}}]}],"container":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":26,"character":3},"arguments":["container"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_updatePositionStyle":[{"__symbolic":"method"}],"_getAppendToPositions":[{"__symbolic":"method"}],"_getTop":[{"__symbolic":"method"}],"_getLeft":[{"__symbolic":"method"}]}}},"origins":{"AutomateDatePickerModule":"./lib/automate-datepicker.module","DatePickerConfig":"./lib/datepicker/models/datepicker-config","HightLightedDateConfig":"./lib/datepicker/models/datepicker-config","ɵa":"./lib/directives/append-to-template.directive","ɵb":"./lib/directives/append-to-template-context","ɵc":"./lib/datepicker/chevron/chevron.component","ɵd":"./lib/datepicker/automate-datepicker.component","ɵe":"./lib/datepicker/automate-datepicker-calendar-container/automate-datepicker-calendar-container.component","ɵf":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar.component","ɵg":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-header.component","ɵh":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-years-mode-header/automate-datepicker-calendar-years-mode-header.component","ɵi":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-months-mode-header/automate-datepicker-calendar-months-mode-header.component","ɵj":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-days-mode-header/automate-datepicker-calendar-days-mode-header.component","ɵk":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-years-calendar/automate-datepicker-years-calendar.component","ɵl":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-months-calendar/automate-datepicker-months-calendar.component","ɵm":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-days-calendar/automate-datepicker-days-calendar.component","ɵn":"./lib/datepicker/automate-datepicker-dropdown/automate-datepicker-dropdown.component"},"importAs":"automate-datepicker"}
+{"__symbolic":"module","version":4,"metadata":{"AutomateDatePickerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":17,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵg"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵi"},{"__symbolic":"reference","name":"ɵj"},{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵl"},{"__symbolic":"reference","name":"ɵm"},{"__symbolic":"reference","name":"ɵn"}],"entryComponents":[{"__symbolic":"reference","name":"ɵn"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":38,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":39,"character":4}],"exports":[{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵa"}]}]}],"members":{}},"DatePickerConfig":{"__symbolic":"class","members":{}},"HightLightedDateConfig":{"__symbolic":"class","members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":3,"character":1},"arguments":[{"selector":"[appendToTmp]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"reference","name":"ɵb"}]}]}]}},"ɵb":{"__symbolic":"interface"},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"chevron","template":"<i [className]=\"'chevron ' + orientation\"></i>","styles":[".chevron::before{border-style:solid;border-width:2px 2px 0 0;border-radius:2px;content:\"\";display:inline-block;height:.45em;left:.15em;position:relative;top:.15em;transform:rotate(-45deg);vertical-align:top;width:.45em;margin-top:6px;margin-left:-1px}.chevron::before ::before{height:.55rem;width:.55rem;vertical-align:middle}:host{width:25px;height:25px;text-align:center}.chevron.right::before{left:-.03rem;transform:rotate(45deg)}.chevron.left::before{left:.1rem;transform:rotate(-135deg)}"]}]}],"members":{"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":3}}]}]}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"automate-datepicker","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":14,"character":11},"useExisting":{"__symbolic":"reference","name":"ɵd"},"multi":true}],"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":25,"character":17},"member":"None"},"template":"<div class=\"automate-datepicker\" [ngClass]=\"theme\">\r\n    <div class=\"append-to-container\" (click)=\"toggle()\">\r\n        <div class=\"append-to-wrapper\" #appendToTmpWrapper>\r\n            <ng-template #defaultAppendToTemplate>\r\n                <input [id]=\"id\" class=\"datepicker-input\" [placeholder]=\"placeholder\" [ngModel]=\"formattedDate\" #datepickerInput />\r\n            </ng-template>\r\n\r\n            <ng-template [ngTemplateOutletContext]=\"{ date: model, formattedDate: formattedDate, config: config }\"\r\n                [ngTemplateOutlet]=\"appendToTemplate?.template || defaultAppendToTemplate\">\r\n            </ng-template>\r\n        </div>\r\n    </div>\r\n\r\n    <automate-datepicker-calendar-container [theme]=\"theme\" [appendTo]=\"appendToTemplateWrapper\" [container]=\"container\"\r\n        [placement]=\"placement\" *ngIf=\"isOpen && container !== 'body'\">\r\n        <automate-datepicker-calendar [config]=\"config\" [selectedDate]=\"model\" (onDaySelected)=\"daySelected($event)\">\r\n        </automate-datepicker-calendar>\r\n    </automate-datepicker-calendar-container>\r\n</div>","styles":[".automate-datepicker,automate-datepicker{display:inline-flex}.append-to-container{display:flex;width:100%}.append-to-wrapper{width:100%;display:flex}.datepicker-input{padding:.375rem .75rem;font-size:14px;width:100%;border-radius:4px}.datepicker-input:focus{outline:0}",".automate-datepicker.default .datepicker-input{border:1px solid #ced4da;color:#43484c}.automate-datepicker.default .datepicker-input:focus{border:1px solid #ced4da}.automate-datepicker .date-picker-container.default,.automate-datepicker-dropdown .date-picker-container.default{background:#fff;border:1px solid #f0f0f0;box-shadow:3px 3px 8px -2px rgba(235,235,235,.77)}.automate-datepicker .date-picker-container.default .header-container,.automate-datepicker-dropdown .date-picker-container.default .header-container{color:#43484c}.automate-datepicker .date-picker-container.default .chevron-container,.automate-datepicker-dropdown .date-picker-container.default .chevron-container{color:#0192c8}.automate-datepicker .date-picker-container.default .calendar-container,.automate-datepicker-dropdown .date-picker-container.default .calendar-container{border-top:1px solid #f0f0f0}.automate-datepicker .date-picker-container.default .day-of-week,.automate-datepicker-dropdown .date-picker-container.default .day-of-week{color:#a3a8ab}.automate-datepicker .date-picker-container.default .day,.automate-datepicker-dropdown .date-picker-container.default .day{color:#686d73}.automate-datepicker .date-picker-container.default .day:not(.selected):not(.disabled):hover,.automate-datepicker-dropdown .date-picker-container.default .day:not(.selected):not(.disabled):hover{background:#d9ebfe}.automate-datepicker .date-picker-container.default .day.selected,.automate-datepicker-dropdown .date-picker-container.default .day.selected{background:rgba(1,146,200,.8);color:#fff}.automate-datepicker .date-picker-container.default .day.today:not(.selected),.automate-datepicker-dropdown .date-picker-container.default .day.today:not(.selected){background:#d9ebfe}.automate-datepicker .date-picker-container.default .month,.automate-datepicker-dropdown .date-picker-container.default .month{color:#686d73}.automate-datepicker .date-picker-container.default .month:not(.selected):not(.disabled):hover,.automate-datepicker-dropdown .date-picker-container.default .month:not(.selected):not(.disabled):hover{background:#d9ebfe}.automate-datepicker .date-picker-container.default .year,.automate-datepicker-dropdown .date-picker-container.default .year{color:#686d73}.automate-datepicker .date-picker-container.default .year:not(.selected):not(.disabled):hover,.automate-datepicker-dropdown .date-picker-container.default .year:not(.selected):not(.disabled):hover{background:#d9ebfe}",".automate-datepicker.dark .datepicker-input{border:1px solid #ced4da;color:#43484c}.automate-datepicker.dark .datepicker-input:focus{border:1px solid #ced4da}.date-picker-container.dark{background:#262829;border:1px solid #262829;box-shadow:3px 3px 8px -2px #262829}.date-picker-container.dark .chevron-container,.date-picker-container.dark .header-container{color:#fff}.date-picker-container.dark .calendar-container{border-top:1px solid #404040}.date-picker-container.dark .day-of-week{color:#484848}.date-picker-container.dark .day{color:#fff}.date-picker-container.dark .day:not(.selected):not(.disabled):hover{background:initial;border:1px solid #505050}.date-picker-container.dark .day.selected{background:#03a9f4;color:#fff}.date-picker-container.dark .day.today:not(.selected){background:initial;border:1px solid #fff}.date-picker-container.dark .month{color:#fff}.date-picker-container.dark .month:not(.selected):not(.disabled):hover{background:initial;border:1px solid #505050}.date-picker-container.dark .year{color:#fff}.date-picker-container.dark .year:not(.selected):not(.disabled):hover{background:initial;border:1px solid #505050}",".date-picker-container.dark.christmas .snowflake{color:#fff}.date-picker-container.default.christmas .snowflake{color:#add8e6}.date-picker-container.christmas{position:relative}.date-picker-container.christmas .datepicker-container-header{background:url(images/christmasHeader.png) 0 0/contain no-repeat;background-position-x:right;background-position-y:top;height:75px;width:100%;position:absolute;top:-15px;right:-12px;pointer-events:none}.date-picker-container.christmas .snowflake{font-size:.7em;font-family:Arial;text-shadow:0 0 1px #000;position:absolute;top:0;height:0;opacity:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:7s,3s;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:7s,3s;-webkit-animation-timing-function:linear,ease-out;animation-timing-function:linear,ease-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}@-webkit-keyframes snowflakes-fall{0%{top:0}100%{top:95%}}@-webkit-keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(30px)}}@keyframes snowflakes-fall{0%{top:0;opacity:1}100%{top:90%;opacity:1}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(30px)}}.date-picker-container.christmas .snowflake:nth-of-type(0){left:0;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.date-picker-container.christmas .snowflake:nth-of-type(1){left:5%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.date-picker-container.christmas .snowflake:nth-of-type(2){left:10%;-webkit-animation-delay:6s,6s;animation-delay:6s,6s}.date-picker-container.christmas .snowflake:nth-of-type(3){left:15%;-webkit-animation-delay:4s,4s;animation-delay:4s,4s}.date-picker-container.christmas .snowflake:nth-of-type(4){left:20%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.date-picker-container.christmas .snowflake:nth-of-type(5){left:25%;-webkit-animation-delay:8s,8s;animation-delay:8s,8s}.date-picker-container.christmas .snowflake:nth-of-type(6){left:30%;-webkit-animation-delay:6s,6s;animation-delay:6s,6s}.date-picker-container.christmas .snowflake:nth-of-type(7){left:35%;-webkit-animation-delay:2.5s,2.5s;animation-delay:2.5s,2.5s}.date-picker-container.christmas .snowflake:nth-of-type(8){left:40%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.date-picker-container.christmas .snowflake:nth-of-type(9){left:45%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.date-picker-container.christmas .snowflake:nth-of-type(10){left:50%;-webkit-animation-delay:3s,3s;animation-delay:3s,3s}.date-picker-container.christmas .snowflake:nth-of-type(11){left:55%;-webkit-animation-delay:6s,6s;animation-delay:6s,6s}.date-picker-container.christmas .snowflake:nth-of-type(12){left:60%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.date-picker-container.christmas .snowflake:nth-of-type(13){left:65%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.date-picker-container.christmas .snowflake:nth-of-type(14){left:70%;-webkit-animation-delay:4s,4s;animation-delay:4s,4s}.date-picker-container.christmas .snowflake:nth-of-type(15){left:75%;-webkit-animation-delay:6s,6s;animation-delay:6s,6s}.date-picker-container.christmas .snowflake:nth-of-type(16){left:80%;-webkit-animation-delay:2.5s,2.5s;animation-delay:2.5s,2.5s}.date-picker-container.christmas .snowflake:nth-of-type(17){left:85%;-webkit-animation-delay:3s,3s;animation-delay:3s,3s}"]}]}],"members":{"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"container":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"placement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3}}]}],"open":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":56,"character":3}}]}],"close":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":58,"character":3}}]}],"appendToTemplateWrapper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":61,"character":3},"arguments":["appendToTmpWrapper"]}]}],"defaultAppendToTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":64,"character":3},"arguments":["defaultAppendToTemplate",{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":64,"character":48}}]}]}],"appendToTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":67,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵa"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":99,"character":48},{"__symbolic":"reference","module":"@angular/core","name":"ApplicationRef","line":100,"character":30},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":101,"character":32}]}],"ngOnDestroy":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"daySelected":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"hide":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}],"_createDropdown":[{"__symbolic":"method"}],"_destroyDropdown":[{"__symbolic":"method"}],"_appendComponentToBody":[{"__symbolic":"method"}],"_updateFormattedDate":[{"__symbolic":"method"}],"documentClick":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":232,"character":3},"arguments":["document:click",["$event"]]}]}],"_parentHasElement":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-container","template":"<div class=\"date-picker-container\" [ngClass]=\"theme\" #container [ngStyle]=\"positionStyle\">\r\n    <div class=\"datepicker-container-header\"></div>\r\n    <ng-content></ng-content>\r\n\r\n    <div class=\"snowflakes\" aria-hidden=\"true\" *ngIf=\"theme.includes('christmas')\">\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❆\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❄\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❆\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❄\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❆\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❆\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❄\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❆\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❄\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❅\r\n        </div>\r\n        <div class=\"snowflake\">\r\n            ❆\r\n        </div>\r\n    </div>\r\n</div>","styles":[".date-picker-container{position:absolute;font-family:inherit;white-space:nowrap;border-radius:4px;padding:0 5px;margin-top:1px;z-index:1;border:1px solid transparent}:host{position:relative}"]}]}],"members":{"appendTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":5}}]}],"placement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"container":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":5}}]}],"containerElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":20,"character":5},"arguments":["container"]}]}],"_getAppendToPositions":[{"__symbolic":"method"}],"_getLeft":[{"__symbolic":"method"}],"_getTop":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"automate-datepicker-calendar","template":"<div class=\"calendar\">\r\n    <automate-datepicker-calendar-header [mode]=\"mode\" [currentYearsRange]=\"currentYearsRange\" [currentYear]=\"currentYear\"\r\n        [currentMonth]=\"currentMonth\" [config]=\"config\" (onYearSelected)=\"yearSelected($event)\" (onMonthSelected)=\"monthSelected($event)\"\r\n        (onOpenYearsCalendar)=\"openYearsCalendar()\" (onOpenMonthsCalendar)=\"openMonthsCalendar()\" (onNextYearsRange)=\"nextYearsRange()\"\r\n        (onPrevYearsRange)=\"prevYearsRange()\">\r\n    </automate-datepicker-calendar-header>\r\n\r\n    <div class=\"calendar-container\">\r\n        <automate-datepicker-days-calendar *ngIf=\"mode === EAutomateDatepickerCalendarMode.Days\" [config]=\"config\"\r\n            [currentMonth]=\"currentMonth\" (onDaySelected)=\"daySelected($event)\">\r\n        </automate-datepicker-days-calendar>\r\n\r\n        <automate-datepicker-months-calendar *ngIf=\"mode === EAutomateDatepickerCalendarMode.Months\" [currentYear]=\"currentYear\"\r\n            (onMonthSelected)=\"monthSelected($event)\" (onOpenDaysCalendar)=\"openDaysCalendar()\">\r\n        </automate-datepicker-months-calendar>\r\n\r\n        <automate-datepicker-years-calendar *ngIf=\"mode === EAutomateDatepickerCalendarMode.Years\" [currentYearsRange]=\"currentYearsRange\"\r\n            (onYearSelected)=\"yearSelected($event)\" (onOpenMonthsCalendar)=\"openMonthsCalendar()\">\r\n        </automate-datepicker-years-calendar>\r\n    </div>\r\n</div>","styles":[".calendar-container{width:15rem;height:15rem}"]}]}],"members":{"selectedDate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"onDaySelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":37,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"openDaysCalendar":[{"__symbolic":"method"}],"openMonthsCalendar":[{"__symbolic":"method"}],"openYearsCalendar":[{"__symbolic":"method"}],"nextYearsRange":[{"__symbolic":"method"}],"prevYearsRange":[{"__symbolic":"method"}],"yearSelected":[{"__symbolic":"method"}],"monthSelected":[{"__symbolic":"method"}],"daySelected":[{"__symbolic":"method"}],"_setCurrentMonthAndYear":[{"__symbolic":"method"}],"_setCurrentMonth":[{"__symbolic":"method"}],"_setCurrentYear":[{"__symbolic":"method"}],"_createYearsRangeByCurrentYear":[{"__symbolic":"method"}],"_createYearsRange":[{"__symbolic":"method"}],"_updateDisabledState":[{"__symbolic":"method"}],"_updateHightLightedState":[{"__symbolic":"method"}],"_updateCalendarMode":[{"__symbolic":"method"}]}},"ɵg":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-header","template":"<div class=\"header-container\">\r\n    <automate-datepicker-calendar-days-mode-header *ngIf=\"mode === EAutomateDatepickerCalendarMode.Days\" [currentYear]=\"currentYear\"\r\n        [currentMonth]=\"currentMonth\" (onYearSelected)=\"onYearSelected.emit($event)\" (onMonthSelected)=\"onMonthSelected.emit($event)\"\r\n        [config]=\"config\" (onOpenYearsCalendar)=\"onOpenYearsCalendar.emit()\" (onOpenMonthsCalendar)=\"onOpenMonthsCalendar.emit($event)\">\r\n    </automate-datepicker-calendar-days-mode-header>\r\n\r\n\r\n    <automate-datepicker-calendar-months-mode-header *ngIf=\"mode === EAutomateDatepickerCalendarMode.Months\"\r\n        [currentYear]=\"currentYear\" [config]=\"config\" (onYearSelected)=\"onYearSelected.emit($event)\" (onMonthSelected)=\"onMonthSelected.emit($event)\"\r\n        (onOpenYearsCalendar)=\"onOpenYearsCalendar.emit()\">\r\n    </automate-datepicker-calendar-months-mode-header>\r\n\r\n    <automate-datepicker-calendar-years-mode-header *ngIf=\"mode === EAutomateDatepickerCalendarMode.Years\"\r\n        [currentYearsRange]=\"currentYearsRange\" [config]=\"config\" (onNextYearsRange)=\"onNextYearsRange.emit()\"\r\n        (onPrevYearsRange)=\"onPrevYearsRange.emit()\">\r\n    </automate-datepicker-calendar-years-mode-header>\r\n</div>","styles":[".header-container{height:35px;display:flex;align-items:center;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"mode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"currentYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":5}}]}],"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":5}}]}],"currentMonth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":5}}]}],"onNextYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":24,"character":5}}]}],"onPrevYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":30,"character":5}}]}],"onOpenMonthsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":32,"character":5}}]}],"onOpenYearsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":34,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵh":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-years-mode-header","template":"<div class=\"years-header\" *ngIf=\"currentYearsRange\">\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isPrevRangeEnabled\" (click)=\"prevRange()\">\r\n        <chevron [orientation]=\"'left'\"></chevron>\r\n    </div>\r\n\r\n    <div class=\"years-range\">\r\n        {{currentYearsRange.startYearTitle}}-{{currentYearsRange.endYearTitle}}\r\n    </div>\r\n\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isNextRangeEnabled\" (click)=\"nextRange()\">\r\n        <chevron [orientation]=\"'right'\"></chevron>\r\n    </div>\r\n</div>","styles":[".years-header{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center}.years-range{display:inline-flex;cursor:pointer}",".header-container{height:35px;display:flex;align-items:center;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"currentYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"onNextYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":16,"character":5}}]}],"onPrevYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":18,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"prevRange":[{"__symbolic":"method"}],"nextRange":[{"__symbolic":"method"}]}},"ɵi":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-months-mode-header","template":"<div class=\"months-header\">\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isPrevYearEnabled\" (click)=\"prevYear()\">\r\n        <chevron [orientation]=\"'left'\"></chevron>\r\n    </div>\r\n\r\n    <div class=\"current-year\" (click)=\"openYearsCalendar()\">\r\n        {{currentYear.yearTitle}}\r\n    </div>\r\n\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isNextYearEnabled\" (click)=\"nextYear()\">\r\n        <chevron [orientation]=\"'right'\"></chevron>\r\n    </div>\r\n</div>","styles":[".months-header{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center}.current-year{display:inline-flex;cursor:pointer}",".header-container{height:35px;display:flex;align-items:center;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":16,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":18,"character":5}}]}],"onOpenYearsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":20,"character":5}}]}],"openYearsCalendar":[{"__symbolic":"method"}],"prevYear":[{"__symbolic":"method"}],"nextYear":[{"__symbolic":"method"}]}},"ɵj":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"automate-datepicker-calendar-days-mode-header","template":"<div class=\"days-header\">\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isPrevMonthEnabled\" (click)=\"prevMonth()\">\r\n        <chevron [orientation]=\"'left'\"></chevron>\r\n    </div>\r\n\r\n    <div class=\"current-month\" (click)=\"openMonthsCalendar()\">\r\n        {{currentMonth.monthTitle}}\r\n    </div>\r\n\r\n    <div class=\"current-year\" (click)=\"openYearsCalendar()\">\r\n        {{currentYear.yearTitle}}\r\n    </div>\r\n\r\n    <div class=\"chevron-container\" [class.disabled]=\"!isNextMonthEnabled\" (click)=\"nextMonth()\">\r\n        <chevron [orientation]=\"'right'\"></chevron>\r\n    </div>\r\n</div>","styles":[".days-header{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center}.current-month,.current-year{display:inline-flex;cursor:pointer}",".header-container{height:35px;display:flex;align-items:center;font-weight:700}.chevron-container{display:inline-flex;cursor:pointer;width:25px;height:25px;margin:0 .5rem}.chevron-container.disabled{cursor:default;opacity:.5}:host{width:100%}"]}]}],"members":{"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":5}}]}],"currentMonth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":21,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":5}}]}],"onOpenMonthsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":5}}]}],"onOpenYearsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":27,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"openMonthsCalendar":[{"__symbolic":"method"}],"openYearsCalendar":[{"__symbolic":"method"}],"prevMonth":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}]}},"ɵk":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-years-calendar","template":"<div class=\"years-container\" *ngIf=\"currentYearsRange\">\r\n    <div class=\"year\" [class.selected]=\"year.isSelected\" [class.disabled]=\"year.isDisabled\" *ngFor=\"let year of currentYearsRange.years\"\r\n        (click)=\"selectYear(year)\">\r\n        {{year.yearLabel}}\r\n    </div>\r\n</div>","styles":[".years-container{display:flex;flex-wrap:wrap;height:100%}.year{display:inline-flex;width:calc((100% / 4) - 10px);border-radius:50%;margin:5px;font-size:14px;justify-content:center;align-items:center;cursor:pointer;line-height:100%;transition:.5s;border:1px solid transparent}.year.selected{font-weight:700;box-sizing:border-box}.year.disabled{cursor:default;opacity:.5}"]}]}],"members":{"currentYearsRange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":5}}]}],"onYearSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":13,"character":5}}]}],"onOpenMonthsCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":15,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"selectYear":[{"__symbolic":"method"}]}},"ɵl":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"automate-datepicker-months-calendar","template":"<div class=\"months-container\">\r\n    <div class=\"month\" [class.selected]=\"month.isSelected\" [class.disabled]=\"month.isDisabled\" *ngFor=\"let month of currentYear.months\"\r\n        (click)=\"selectMonth(month)\">\r\n        {{month.monthLabel}}\r\n    </div>\r\n</div>","styles":[".months-container{display:flex;flex-wrap:wrap;height:100%}.month{display:inline-flex;width:calc((100% / 3) - 0px);margin:7px 0;font-size:13px;justify-content:center;align-items:center;cursor:pointer;border-radius:10%;transition:.5s;border:1px solid transparent}.month.selected{font-weight:700;box-sizing:border-box}.month.disabled{cursor:default;opacity:.5}"]}]}],"members":{"currentYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":5}}]}],"onMonthSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":13,"character":5}}]}],"onOpenDaysCalendar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":15,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"selectMonth":[{"__symbolic":"method"}]}},"ɵm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"automate-datepicker-days-calendar","template":"<div *ngIf=\"currentMonth\">\r\n    <div>\r\n        <div class=\"day-of-week\" *ngFor=\"let dayOfWeek of config.daysOfWeek\">\r\n            {{dayOfWeek}}\r\n        </div>\r\n    </div>\r\n    <div class=\"week\" *ngFor=\"let week of currentMonth.weeks\">\r\n        <div class=\"day\" *ngFor=\"let day of week.days\" [class.selected]=\"day.isSelected\" [class.today]=\"day.isToday\"\r\n            [class.disabled]=\"day.isDisabled\" [ngStyle]=\"day.hightLightedStyle\" (click)=\"selectDay(day)\">\r\n            {{day.dayLabel}}\r\n        </div>\r\n    </div>\r\n</div>","styles":[".day,.day-of-week{width:calc((100% / 7) - 4px);height:30px}.day-of-week{font-size:12px;display:inline-flex;justify-content:center;align-items:center;margin:2px;font-weight:500;cursor:default}.day{display:inline-flex;border-radius:50%;margin:2px;cursor:pointer;justify-content:center;align-items:center;font-size:13px;transition:.5s;line-height:30px;box-sizing:border-box;border:1px solid transparent}.day.disabled{cursor:default;opacity:.5}"]}]}],"members":{"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":5}}]}],"currentMonth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"onDaySelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":17,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"selectDay":[{"__symbolic":"method"}]}},"ɵn":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"automate-datepicker-dropdown","template":"<div class=\"automate-datepicker-dropdown\" [ngStyle]=\"positionStyle\">\r\n    <automate-datepicker-calendar-container [theme]=\"theme\" #container>\r\n        <automate-datepicker-calendar [config]=\"config\" [selectedDate]=\"selectedDate\" (onDaySelected)=\"onDaySelected.emit($event)\">\r\n        </automate-datepicker-calendar>\r\n    </automate-datepicker-calendar-container>\r\n</div>","styles":[".automate-datepicker-dropdown{position:absolute;z-index:1060}"]}]}],"members":{"appendTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"placement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"selectedDate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"onDaySelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":3}}]}],"container":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":29,"character":3},"arguments":["container"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_updatePositionStyle":[{"__symbolic":"method"}],"_getAppendToPositions":[{"__symbolic":"method"}],"_getTop":[{"__symbolic":"method"}],"_getLeft":[{"__symbolic":"method"}]}}},"origins":{"AutomateDatePickerModule":"./lib/automate-datepicker.module","DatePickerConfig":"./lib/datepicker/models/datepicker-config","HightLightedDateConfig":"./lib/datepicker/models/datepicker-config","ɵa":"./lib/directives/append-to-template.directive","ɵb":"./lib/directives/append-to-template-context","ɵc":"./lib/datepicker/chevron/chevron.component","ɵd":"./lib/datepicker/automate-datepicker.component","ɵe":"./lib/datepicker/automate-datepicker-calendar-container/automate-datepicker-calendar-container.component","ɵf":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar.component","ɵg":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-header.component","ɵh":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-years-mode-header/automate-datepicker-calendar-years-mode-header.component","ɵi":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-months-mode-header/automate-datepicker-calendar-months-mode-header.component","ɵj":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-calendar-header/automate-datepicker-calendar-days-mode-header/automate-datepicker-calendar-days-mode-header.component","ɵk":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-years-calendar/automate-datepicker-years-calendar.component","ɵl":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-months-calendar/automate-datepicker-months-calendar.component","ɵm":"./lib/datepicker/automate-datepicker-calendar/automate-datepicker-days-calendar/automate-datepicker-days-calendar.component","ɵn":"./lib/datepicker/automate-datepicker-dropdown/automate-datepicker-dropdown.component"},"importAs":"automate-datepicker"}