import { Component, forwardRef, Output, EventEmitter, ViewChild, Input } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import * as moment from 'moment';
import { DaterangepickerDirective } from 'ngx-daterangepicker-material';
import * as i0 from "@angular/core";
import * as i1 from "@angular/material/radio";
import * as i2 from "@angular/common";
import * as i3 from "ngx-daterangepicker-material";
import * as i4 from "@angular/forms";
export class DateRangePickerComponent {
    constructor(_eref, cd) {
        this._eref = _eref;
        this.cd = cd;
        this.selectedDateKey = 'orderDate';
        this.calendarPlaceholder = 'Date Range';
        this.showControls = false;
        this.minDate = moment().subtract(364, 'days');
        this.selectedDate = new EventEmitter();
        this.ranges = {
            'Today': [moment(), moment()],
            'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
            'Last 7 Days': [moment().subtract(6, 'days'), moment()],
            'Last 30 Days': [moment().subtract(29, 'days'), moment()],
            // 'Last 1 Year': [moment().subtract(364, 'days'), moment()],
            'This Month': [moment().startOf('month'), moment()],
            'Last Month': [
                moment().subtract(1, 'month').startOf('month'),
                moment().subtract(1, 'month').endOf('month')
            ]
        };
        // Function to call when the input value changes.
        this.onChange = (e) => {
        };
        // Function to call when the input is touched.
        this.onTouched = () => {
        };
        this.onTypeChange = (val) => {
            this.openDatepicker();
            this.selectedDateKey = val;
        };
    }
    ngOnInit() {
        if (this.selectedDateRange == undefined) {
            this.selectedDateRange = { startDate: moment().subtract(29, 'days'), endDate: moment() };
        }
    }
    ngAfterViewInit() {
        this.maxDate = moment();
    }
    onClick(event) {
        if (!this._eref.nativeElement.contains(event.target)) {
            this.showControls = false;
        }
    }
    openDatepicker() {
        this.showControls = true;
        this.pickerDirective.open();
    }
    datesUpdated(eve) {
        if (this.selectedDateRange && this.selectedDateRange.startDate && this.selectedDateRange.startDate._d && this.selectedDateRange.endDate && this.selectedDateRange.endDate._d) {
            this.showControls = false;
            const dateValue = this.selectedDateRange.startDate._d.getDate() + '/' + (this.selectedDateRange.startDate._d.getMonth() + 1) + '/' + this.selectedDateRange.startDate._d.getFullYear() + ',' +
                this.selectedDateRange.endDate._d.getDate() + '/' + (this.selectedDateRange.endDate._d.getMonth() + 1) + '/' + this.selectedDateRange.endDate._d.getFullYear();
            // this.calendarPlaceholder = dateValue;
            let obj = {
                "key": this.selectedDateKey,
                "value": dateValue
            };
            this.selectedDate.emit(obj);
        }
    }
    // Allows Angular to update the model (rating).
    // Update the model and changes needed for the view here.
    writeValue(obj) {
    }
    // Allows Angular to register a function to call when the model (rating) changes.
    // Save the function as a property to call later here.
    registerOnChange(fn) {
        this.onChange = fn;
    }
    // Allows Angular to register a function to call when the input has been touched.
    // Save the function as a property to call later here.
    registerOnTouched(fn) {
        this.onTouched = fn;
    }
    // Allows Angular to disable the input.
    setDisabledState(isDisabled) {
        // this.disabled = isDisabled;
    }
}
DateRangePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DateRangePickerComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
DateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DateRangePickerComponent, selector: "app-date-range-picker", inputs: { selectedDateRange: "selectedDateRange" }, outputs: { selectedDate: "selectedDate" }, host: { listeners: { "document:mousedown": "onClick($event)" } }, providers: [
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => DateRangePickerComponent),
            multi: true
        }
    ], viewQueries: [{ propertyName: "pickerDirective", first: true, predicate: DaterangepickerDirective, descendants: true }], ngImport: i0, template: "<mat-radio-group *ngIf=\"showControls\" aria-label=\"Select an option\">\r\n    <mat-radio-button [checked]=\"selectedDateKey == 'orderDate'\" (change)=\"onTypeChange('orderDate')\" [value]=\"'orderDate'\" class=\"pl-0\">Order</mat-radio-button>\r\n    <mat-radio-button [checked]=\"selectedDateKey == 'deliveryDate'\" (change)=\"onTypeChange('deliveryDate')\" [value]=\"'deliveryDate'\" class=\"px-4\">Delivery</mat-radio-button>\r\n</mat-radio-group>\r\n<div class=\"fx-date-range-container\">\r\n    <input [closeOnAutoApply]=\"false\" #DaterangepickerDirective class=\"fx-date-range\" type=\"text\" matInput\r\n        ngxDaterangepickerMd [locale]=\"{applyLabel: 'apply', format: 'MM/DD/YY'}\" [drops]=\"'down'\" [opens]=\"'right'\"\r\n        [ranges]=\"ranges\" [showCustomRangeLabel]=\"false\" [alwaysShowCalendars]=\"true\" [keepCalendarOpeningWithRange]=\"true\"\r\n        [showCancel]=\"true\" autocomplete=\"off\" (datesUpdated)=\"datesUpdated($event)\" [(ngModel)]=\"selectedDateRange\"\r\n        name=\"daterange\" [minDate]=\"minDate\"/>\r\n</div>\r\n<!-- <a class=\"ngx-daterangepicker-action\" (click)=\"openDatepicker()\">\r\n    Open\r\n  </a> -->\r\n<input class=\"ngx-daterangepicker-action\" (click)=\"openDatepicker()\" [placeholder]=\"calendarPlaceholder\">\r\n<img src=\"../../../../assets/images/ic_calender.svg\" alt=\"calender\" class=\"date-icon ngx-daterangepicker-action\" (click)=\"openDatepicker()\">", styles: ["@charset \"UTF-8\";@media screen and (min-width: 1366px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: 1.063rem;--fontsize17-5: 1.1rem;--fontsize18: 1.125rem;--fontsize18-4: 1.5rem;--fontsize20: 1.25rem;--fontsize21: 1.313rem;--fontsize22: 1.375rem;--fontsize23: 1.438rem;--fontsize24: 1.5rem;--fontsize26: 1.625rem;--fontsize28: 1.75rem;--fontsize30: 1.625rem;--fontsize32: 2rem;--fontsize34: 2.125rem;--fontsize36: 2rem;--fontsize40: 2.25rem;--fontsize46: 2.875rem;--fontsize80: 5rem}}@media screen and (max-width: 1365px) and (min-width: 768px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2.875rem;--fontsize80: 3.5rem}}@media screen and (max-width: 767px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize16-5: .77rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize19: .938rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize26: 1.25rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2rem;--fontsize80: 2.5rem}}@font-face{font-family:icomoon;font-weight:400;src:url(../assets/fonts/icomoon.ttf) format(\"ttf\"),url(../assets/fonts/icomoon.woff) format(\"woff\");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:\"Arial Regular\";src:url(../assets/fonts/arial-webfont.woff) format(\"woff\"),url(../assets/fonts/arial-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Bold\";src:url(../assets/fonts/arialbold-webfont.woff) format(\"woff\"),url(../assets/fonts/arialbold-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Black\";src:url(../assets/fonts/arialblack-webfont.woff) format(\"woff\"),url(../assets/fonts/arialblack-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Reqular\";src:url(../assets/fonts/helveticaneue.woff) format(\"woff\"),url(../assets/fonts/helveticaneue.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Thin\";src:url(../assets/fonts/helveticaneuethin-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuethin-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Medium\";src:url(../assets/fonts/helveticaneuemedium-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuemedium-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}[class*=\" icon-\"],[class^=icon-]{font-family:icomoon!important;font-feature-settings:normal;font-variant:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;text-transform:none;font-display:swap}.icon-right:before{content:\"\\e902\"}.icon-materials:before{content:\"\\e900\"}.icon-natural-lighting:before{content:\"\\e90a\"}.icon-rainwater:before{content:\"\\e901\"}.icon-roofing:before{content:\"\\e90b\"}.icon-flashing{position:relative;display:inline-block;height:32px;text-align:center;width:32px}.icon-flashing:before,.mainnav-link-level-2.show .navTagChild .icon-flashing:before{content:url(../assets/images/icon-flashing-white.svg);height:20px;width:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:15px}li.megamenuSubChild:hover .icon-flashing:before{content:url(../assets/images/icon-flashing-black.svg)}.icon-structural:before{content:\"\\e90c\"}.icon-accessories-old .path1:before{content:\"\\e903\"}.icon-accessories-old .path2:before{margin-left:-1em;content:\"\\e904\"}.icon-accessories-old .path3:before{margin-left:-1em;content:\"\\e905\"}.icon-cladding-old .path1:before{content:\"\\e90d\"}.icon-cladding-old .path2:before{margin-left:-1em;content:\"\\e90e\"}.icon-close:before{content:\"\\e90f\"}.icon-message:before{content:\"\\e910\"}.icon-search .path1:before{content:\"\\e906\"}.icon-search .path2:before{content:\"\\e907\"}.icon-search .path3:before{margin-left:-1.0156em;content:\"\\e908\"}.icon-summary:before{content:\"\\e911\"}.icon-branch:before{content:\"\\e912\"}.icon-delivery:before{content:\"\\e913\"}.icon-downloads:before{content:\"\\e909\"}.icon-drawings:before{content:\"\\e914\"}.icon-full:before{content:\"\\e915\"}.icon-manual:before{content:\"\\e916\"}.icon-payment:before{content:\"\\e917\"}.icon-empty .path1:before{content:\"\\e918\"}.icon-empty .path2:before{margin-left:-1em;content:\"\\e919\"}.icon-empty .path3:before{margin-left:-1em;content:\"\\e91a\"}.icon-product-overview:before{content:\"\\e91b\"}.icon-arrows:before{content:\"\\e91c\"}.icon-selected:before{content:\"\\e91d\"}.icon-accessories:before{content:\"\\e91b\"}.icon-cladding:before{content:\"\\e91e\"}.icon-Triangle:before{content:\"\\e91f\"}.icon-home:before{content:\"\\e920\"}.icon-faq:before{content:\"\\e921\"}.icon-temperature:before{content:\"\\e922\"}body header{font-family:\"Arial Regular\",sans-serif}header{background-color:#1d1d1b;position:sticky;top:0;background-size:100% 25%!important;background-repeat:no-repeat;z-index:10}header .header{max-width:100%;padding:0}header cx-banner cx-media img{margin-top:.7rem;margin-bottom:0}header label{display:inline-flex}header .SiteLinks{height:52px;display:flex;align-items:center;justify-content:space-between;padding-top:5px;padding-bottom:5px}header .SiteLinks cx-paragraph p{color:#fff;font-size:var(--fontsize16);line-height:var(--fontsize16);margin-bottom:0}header .SiteLinks cx-paragraph{font-size:var(--fontsize16)}header .SiteLinks app-account-dropdown,header .SiteLinks app-find-store{width:calc(25% - 25px);max-width:328px;margin-right:25px}header .SiteLinks app-contact-us{width:calc(20% - 25px);max-width:100px;margin-left:auto}header .SiteLinks app-custom-mini-cart{width:10%}header .SiteLinks .preferenceLink{margin-left:auto}header .SiteLinks .preferenceLink cx-generic-link{margin:0}header .SiteLinks .preferenceLink cx-generic-link cx-media img{height:22px;margin:0}header .SiteLogo .storeLogo{position:absolute;z-index:99;left:40px;bottom:10px}header .SiteLogo .homeLogo{max-width:28px;height:28px;position:absolute;z-index:99;bottom:47px}header .NavigationBar{flex:70%;background-color:#b61828;min-height:40px;display:flex;align-items:center;position:relative;z-index:10}header .logoutMenu{margin-top:0!important}header .logoutMenu li{cursor:pointer;background-color:#4c4c4c;color:#fff}header .logoutMenu li:hover{text-decoration:underline;background-color:#4c4c4c}header .MarketingContext{width:100%;margin:auto}.customer-service-icon{cursor:pointer}d .helpSupport{width:20rem;border:0;margin-top:.5rem!important;transform:translate(-42%,36px)!important;padding:1rem 1rem 0;background-color:#393939;color:#fff;top:0}d .helpSupport .arrow-up{position:absolute;top:-8px;right:44%;width:0;height:0;border-left:15px solid rgba(0,0,0,0);border-right:15px solid rgba(0,0,0,0);border-bottom:15px solid #393939}d .helpSupport .contact-us-info .heading{font-family:\"Arial Bold\",sans-serif}d .helpSupport .contact-us-info .detail{font-size:var(--fontsize14);line-height:2rem}d .helpSupport .contact-us-info .detail .service-icon{height:20px;width:20px;margin-right:10px}d .helpSupport .contact-us-info .contactLink a{font-size:var(--fontsize14);text-decoration:underline;text-transform:uppercase}d .helpSupport .contact-us-info a{color:#fff;text-decoration:none}d .helpSupport .contact-us-info a:hover{text-decoration:underline}.pageTitle{font-family:\"Helvetica Neue Regular\",sans-serif;font-size:var(--fontsize54)}@media screen and (max-width: 991px){cx-storefront header{background-color:#b61828}cx-storefront header cx-banner cx-media img{margin:auto}cx-storefront header .SiteLogo{width:100%;max-width:211px;margin:auto;padding-left:30px;box-sizing:border-box}cx-storefront header .SiteLogo .storeLogo{position:unset}cx-storefront header .SearchBox{margin:14px 0 10px;width:30px}cx-storefront header .SiteLinks{background-color:transparent;width:110px;margin:auto 25px auto 0}cx-storefront header .SiteLinks app-account-dropdown,cx-storefront header .SiteLinks app-find-store,cx-storefront header .SiteLinks app-contact-us,cx-storefront header .SiteLinks cx-paragraph,cx-storefront header .SiteLinks .preferenceLink{display:none}cx-storefront header .SiteLinks app-custom-mini-cart,cx-storefront header .SiteLinks app-custom-user-account{width:35px}cx-storefront header.is-expanded{overflow-y:auto;position:fixed;bottom:0;top:0;width:calc(100% - 99px)}cx-storefront header.is-expanded .header{background-color:#b61828;margin-left:0}cx-storefront header.is-expanded .PreHeader{position:absolute;right:15px;top:15px}cx-storefront header.is-expanded .SearchBox{display:none}cx-storefront header.is-expanded .SiteLogo{position:absolute;top:25px;z-index:9}cx-storefront header.is-expanded .SiteLinks{background-color:#1d1d1b;width:100%;margin:15px auto 15px 0;height:unset;padding:15px;max-width:100%;position:relative;z-index:9;top:60px}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-account-dropdown{width:100%;max-width:100%}cx-storefront header.is-expanded .SiteLinks app-find-store{width:50%;max-width:328px;min-width:328px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-right:15px;margin-left:auto;width:115px;max-width:unset}cx-storefront header.is-expanded .navigation{position:relative;top:45px}cx-storefront header.is-expanded:before{background-color:#0000004d;right:0;content:\"\";position:fixed;z-index:2;top:0;bottom:0;height:100vh;width:99px}cx-storefront header.is-expanded:after{background-color:transparent}}@media screen and (max-width: 576px){cx-storefront header .SiteLogo{max-width:80px}cx-storefront header .SiteLogo .storeLogo{display:none}cx-storefront header .searchBox{height:45px}cx-storefront header.is-expanded{width:100%}cx-storefront header.is-expanded .header,cx-storefront header.is-expanded .navigation{width:100%}cx-storefront header.is-expanded .SiteLogo{max-width:211px!important}cx-storefront header.is-expanded .SiteLogo .storeLogo{display:block}cx-storefront header.is-expanded .SiteLinks{max-width:100%;width:100%}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-find-store{width:100%;max-width:100%;margin-bottom:10px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-left:0}cx-storefront header.is-expanded .SiteLinks cx-paragraph{margin-left:auto}cx-storefront header.is-expanded:before{display:none}}#visualization-container{text-align:center;margin:0 auto}#cds-viewer-container-3d{width:320px;height:200px}#cds-viewer-container-2d{width:320px;height:200px}[aria-label=Close]{cursor:pointer}cx-media.is-missing{background:url(./assets/images/search-noimage.svg);background-size:cover;background-position:center;background-repeat:no-repeat}.calender-class{height:1px;width:1px;border:transparent}::ng-deep .fx-date-range-container input{height:1px;width:1px;border:transparent}::ng-deep .fx-date-range-container .md-drppicker .ranges ul li button{font-size:var(--fontsize14)}::ng-deep .fx-date-range-container .md-drppicker .ranges ul li button.active{background-color:transparent;color:#000;font-family:\"Arial Bold\",sans-serif;font-size:var(--fontsize14)}::ng-deep .fx-date-range-container .md-drppicker td.active,::ng-deep .fx-date-range-container .md-drppicker td.active:hover{background-color:#b61828;border-radius:0}::ng-deep .fx-date-range-container .md-drppicker .btn{background-color:#000;color:#fff;font-size:var(--fontsize14);padding-left:1rem;padding-right:1rem}::ng-deep .fx-date-range-container .md-drppicker .btn:hover{background-color:#b61828}::ng-deep .fx-date-range-container .md-drppicker .btn.btn-default{background:none;box-shadow:none;margin-right:30px;font-size:var(--fontsize14)}::ng-deep .fx-date-range-container .md-drppicker .btn.btn-default:hover{background-color:transparent}\n"], components: [{ type: i1.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { type: i3.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["dateLimit", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "_endKey", "drops", "opens", "locale", "startKey", "endKey", "minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DateRangePickerComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'app-date-range-picker', host: {
                        '(document:mousedown)': 'onClick($event)',
                    },
                    templateUrl: './date-range-picker.component.html',
                    styleUrls: ['./date-range-picker.component.scss'],
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => DateRangePickerComponent),
                            multi: true
                        }
                    ]
                }]
        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { selectedDateRange: [{
                type: Input
            }], selectedDate: [{
                type: Output
            }], pickerDirective: [{
                type: ViewChild,
                args: [DaterangepickerDirective, { static: false }]
            }] } });
//# sourceMappingURL=data:application/json;base64, 