{"__symbolic":"module","version":4,"metadata":{"NgxMonthPickerService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]},"statics":{"ɵprov":{}}},"NgxMonthPickerComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"ngx-month-picker","template":"\n  <div class=\"calendar-widget\" #select>\n    <div [ngClass]=\"inputContainerClass\" (click)=\"onShowCalendar($event)\" role=\"listbox\" #calendarInputContainer [title]=\"valueText\">\n        <span [ngClass]=\"inputValueClass\">{{valueText}}</span>\n    </div>\n    <div [ngClass]=\"calendarContainerClass\" #calendarUI style=\"display: none;\">\n        <div class=\"outerCard\">\n            <div class=\"topPanel\">\n                <button class=\"prevYearButton\" (click)=\"decrementYear()\">\n                    <i class=\"arrow arrow-left\"></i>\n                </button>\n                <span class=\"yearLabel\">{{ years[currentYearIndex] }}</span>\n                <button class=\"nextYearButton\" (click)=\"incrementYear()\">\n                    <i class=\"arrow arrow-right\"></i>\n                </button>\n            </div>\n            <div class=\"contentPanel\" #calendarContent>\n                <div (click)=\"onClick(i)\" *ngFor=\"let month of monthDataSlice; let i = index\" [ngClass]=\"[monthItemClass, \n                        (rangeIndexes[0]===globalIndexOffset+i || rangeIndexes[1]===globalIndexOffset+i) ? edgeClass: '', \n                        (currentYearIndex===0? i > 11:(i < 6 || i > 17)) ? notYearClass : '']\">\n                    <div [id]=\"i\" class=\"monthItemHighlight\" [ngClass]=\"[ month.isInRange ? inRangeClass : '', \n                    month.isLowerEdge ? lowerEdgeClass : '', month.isUpperEdge ? upperEdgeClass : '' ]\">\n                        {{ month.monthName }}\n                    </div>\n                </div>\n            </div>\n            <div class=\"footerPanel\">\n                <a id=\"cleanBtn\" href=\"javascript:void(0)\" [ngClass]=\"cleanBtnClass\" (click)=\"clearData()\">\n                    Limpiar\n                </a>\n                <a id=\"acceptBtn\" href=\"javascript:void(0)\" [ngClass]=\"acceptBtnClass\" (click)=\"emitData()\">\n                    Aceptar\n                </a>\n            </div>\n        </div>\n    </div>\n</div>\n  ","styles":["\n  .calendar-ui {\n    z-index: 1003;\n    width: 350px;\n    background-color: white;\n}\n\n.calendar-input-container {\n    background: #F5F5F6 !important;\n    border: solid 1px #C2D1D9 !important;\n    color: #A8B0BA !important;\n    font-family: \"open_sansitalic\", sans-serif !important;\n    line-height: 17px;\n    min-height: 48px;\n    display: flex;\n    align-items: center;\n    border-radius: 3px;\n    width: 100%;\n    font-size: 16px;\n    letter-spacing: 0;\n}\n\n.calendar-input-value {\n    padding-left: 10px;\n    padding-right: 10px;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    overflow: hidden;\n}\n\n.outerCard {\n    touch-action: none;\n    overflow: hidden;\n    width: inherit;\n    /*height: 350px;*/\n    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);\n}\n\n.topPanel {\n    width: inherit;\n    height: 44px;\n    text-align: center;\n    line-height: 64px;\n}\n\n.prevYearButton {\n    float: left;\n}\n\n.nextYearButton {\n    float: right;\n}\n\nbutton {\n    width: 64px;\n    height: 64px;\n    background: none;\n    border: none;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n}\n\nbutton:focus {\n    outline: 0;\n}\n\ni {\n    border: solid black;\n    border-width: 0 3px 3px 0;\n    display: inline-block;\n    padding: 6px;\n}\n\n.arrow-right {\n    transform: rotate(-45deg);\n    -webkit-transform: rotate(-45deg);\n}\n\n.arrow-left {\n    transform: rotate(135deg);\n    -webkit-transform: rotate(135deg);\n}\n\n.topPanel.yearLabel {\n    display: inline-block;\n    margin: 0 auto;\n}\n\n.contentPanel {\n    padding: 32px 6px;\n}\n\n.footerPanel {\n    display: flex;\n}\n\n.monthItem {\n    display: inline-block;\n    height: 54px;\n    width: 54px;\n    cursor: pointer;\n    text-align: center;\n    line-height: 54px;\n    margin-top: 1px;\n    margin-bottom: 1px;\n}\n\n.monthItem:hover {\n    border-radius: 100%;\n    background-color: #F5F5F6;\n    color: #A8B0BA;\n}\n\n.isEdge {\n    border-radius: 100%;\n    background-color: #1474a4;\n    color: white;\n}\n\n.inRange {\n    background-color: #1474a4;\n    opacity: 0.5;\n    color: white;\n}\n\n.isLowerEdge {\n    background-color: none;\n    background: linear-gradient(to right, transparent 50%, #1474a4 50%);\n}\n\n.isUpperEdge {\n    background-color: none;\n    background: linear-gradient(to right, #1474a4 50%, transparent 50%);\n}\n\n.notCurrentYear {\n    color: #c4cbd6;\n}\n\n.clean-btn {\n    text-decoration: none;\n    width: 50%;\n    display: inline-block;\n    font-weight: 400;\n    color: #A8B0BA;\n    background-color: #F5F5F6;\n    text-align: center;\n    vertical-align: middle;\n    user-select: none;\n    border: 1px solid transparent;\n    padding: .375rem .75rem;\n    font-size: 1rem;\n    line-height: 1.5;\n}\n\n.accept-btn {\n    text-decoration: none;\n    width: 50%;\n    display: inline-block;\n    font-weight: 400;\n    text-align: center;\n    vertical-align: middle;\n    user-select: none;\n    border: 1px solid transparent;\n    padding: .375rem .75rem;\n    font-size: 1rem;\n    line-height: 1.5;\n    color: white;\n    background-color: #1474a4;\n}\n  "],"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":218,"character":15},"useExisting":{"__symbolic":"reference","name":"NgxMonthPickerComponent"},"multi":true},{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALIDATORS","line":223,"character":15},"useExisting":{"__symbolic":"reference","name":"NgxMonthPickerComponent"},"multi":true}]}]}],"members":{"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":231,"character":3},"arguments":["placeholder"]}]}],"isRequired":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":232,"character":3},"arguments":["required"]}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":233,"character":3},"arguments":["disabled"]}]}],"isReadOnly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":234,"character":3},"arguments":["readonly"]}]}],"mode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":236,"character":3},"arguments":["mode"]}]}],"firstYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":237,"character":3},"arguments":["firstYear"]}]}],"lastYear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":238,"character":3},"arguments":["lastYear"]}]}],"inputContainerClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":240,"character":3},"arguments":["inputContainerClass"]}]}],"inputValueClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":241,"character":3},"arguments":["inputValueClass"]}]}],"calendarContainerClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":242,"character":3},"arguments":["inputValueClass"]}]}],"monthItemClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":243,"character":3},"arguments":["monthItemClass"]}]}],"edgeClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":244,"character":3},"arguments":["edgeClass"]}]}],"notYearClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":245,"character":3},"arguments":["notYearClass"]}]}],"inRangeClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":246,"character":3},"arguments":["inRangeClass"]}]}],"lowerEdgeClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":247,"character":3},"arguments":["lowerEdgeClass"]}]}],"upperEdgeClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":248,"character":3},"arguments":["upperEdgeClass"]}]}],"cleanBtnClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":249,"character":3},"arguments":["cleanBtnClass"]}]}],"acceptBtnClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":250,"character":3},"arguments":["acceptBtnClass"]}]}],"locale":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":252,"character":3},"arguments":["locale"]}]}],"calendarInputContainer":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":254,"character":3},"arguments":["calendarInputContainer",{"static":false}]}]}],"calendarUI":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":255,"character":3},"arguments":["calendarUI",{"static":false}]}]}],"calendarContent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":256,"character":3},"arguments":["calendarContent",{"static":false}]}]}],"containerViewChild":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":257,"character":3},"arguments":["select",{"static":false}]}]}],"monthRangeSelected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":270,"character":3}}]}],"tabindex":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":272,"character":3},"arguments":["tabindex"]}]}],"blurHandler":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":274,"character":3},"arguments":["blur"]}]}],"focusHandler":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":281,"character":3},"arguments":["focus"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":328,"character":32},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":328,"character":55},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":328,"character":88}]}],"ngOnInit":[{"__symbolic":"method"}],"initCalendar":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onShowCalendar":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"hide":[{"__symbolic":"method"}],"appendOverlay":[{"__symbolic":"method"}],"restoreOverlayAppend":[{"__symbolic":"method"}],"alignOverlay":[{"__symbolic":"method"}],"onClick":[{"__symbolic":"method"}],"paintRange":[{"__symbolic":"method"}],"emitData":[{"__symbolic":"method"}],"sliceDataIntoView":[{"__symbolic":"method"}],"incrementYear":[{"__symbolic":"method"}],"decrementYear":[{"__symbolic":"method"}],"initRangeIndexes":[{"__symbolic":"method"}],"initMonthsData":[{"__symbolic":"method"}],"initYearLabels":[{"__symbolic":"method"}],"initMonthLabels":[{"__symbolic":"method"}],"initViewSlices":[{"__symbolic":"method"}],"clearData":[{"__symbolic":"method"}],"validate":[{"__symbolic":"method"}],"updateChanges":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"setReadOnlyState":[{"__symbolic":"method"}]}},"NgxMonthPickerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"NgxMonthPickerComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":4}],"exports":[{"__symbolic":"reference","name":"NgxMonthPickerComponent"}],"schemas":[{"__symbolic":"reference","module":"@angular/core","name":"CUSTOM_ELEMENTS_SCHEMA","line":12,"character":12}]}]}],"members":{}}},"origins":{"NgxMonthPickerService":"./lib/ngx-month-picker.service","NgxMonthPickerComponent":"./lib/ngx-month-picker.component","NgxMonthPickerModule":"./lib/ngx-month-picker.module"},"importAs":"ngx-month-picker-range"}