import { ChangeDetectionStrategy, Component, forwardRef } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { BehaviorSubject } from 'rxjs';
import { DaterangeBaseComponent } from '@ironsource/fusion-ui/components/daterange/common/base';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@ironsource/fusion-ui/components/icon/v1";
import * as i3 from "@ironsource/fusion-ui/directives/click-outside";
import * as i4 from "@ironsource/fusion-ui/components/calendar/v2";
import * as i5 from "@ironsource/fusion-ui/components/button/v2";
import * as i6 from "@ironsource/fusion-ui/components/dropdown-select/v2";
const _c0 = a0 => ({ selected: a0 });
function DaterangeComponent_div_8_ng_template_2_li_1_Template(rf, ctx) { if (rf & 1) {
    const _r9 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "li", 17);
    i0.ɵɵlistener("click", function DaterangeComponent_div_8_ng_template_2_li_1_Template_li_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r9); const preset_r7 = restoredCtx.$implicit; const ctx_r8 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r8.selectPreset(preset_r7)); });
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const preset_r7 = ctx.$implicit;
    const ctx_r6 = i0.ɵɵnextContext(3);
    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(2, _c0, ctx_r6.currentPreset === preset_r7));
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate1(" ", ctx_r6.daterangeService.getPresetName(preset_r7), " ");
} }
function DaterangeComponent_div_8_ng_template_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "ul");
    i0.ɵɵtemplate(1, DaterangeComponent_div_8_ng_template_2_li_1_Template, 2, 4, "li", 16);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r4 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngForOf", ctx_r4.options.presets);
} }
function DaterangeComponent_div_8_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 13);
    i0.ɵɵelementContainer(1, 14);
    i0.ɵɵtemplate(2, DaterangeComponent_div_8_ng_template_2_Template, 2, 1, "ng-template", null, 15, i0.ɵɵtemplateRefExtractor);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const _r5 = i0.ɵɵreference(3);
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.presetsHeaderTemplate || _r5);
} }
function DaterangeComponent_fusion_calendar_13_Template(rf, ctx) { if (rf & 1) {
    const _r12 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "fusion-calendar", 18);
    i0.ɵɵlistener("daySelected", function DaterangeComponent_fusion_calendar_13_Template_fusion_calendar_daySelected_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r11 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r11.onSelectDay($event)); });
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const month_r10 = ctx.$implicit;
    const ctx_r2 = i0.ɵɵnextContext();
    i0.ɵɵproperty("configuration", ctx_r2.getCalendarConfigurations(month_r10));
} }
function DaterangeComponent_div_16_Template(rf, ctx) { if (rf & 1) {
    const _r14 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 19)(1, "span");
    i0.ɵɵtext(2, "All reports and dates are in UTC");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "button", 20);
    i0.ɵɵlistener("click", function DaterangeComponent_div_16_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r14); const ctx_r13 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r13.apply()); });
    i0.ɵɵtext(4, "Apply");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(5, "button", 21);
    i0.ɵɵlistener("click", function DaterangeComponent_div_16_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r14); const ctx_r15 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r15.close()); });
    i0.ɵɵtext(6, "Cancel");
    i0.ɵɵelementEnd()();
} }
const _c1 = (a0, a1, a2) => ({ visible: a0, isOpen: a1, singleDatePicker: a2 });
const _c2 = a0 => ({ large: a0 });
export class DaterangeComponent extends DaterangeBaseComponent {
    constructor() {
        super(...arguments);
        this.dropdownSelectConfigurations$ = new BehaviorSubject({
            dropdownArrowIconName: { iconName: 'arrow-down', iconVersion: 'v2' }
        });
        this.pevIconName = { iconName: 'arrow-left', iconVersion: 'v2' };
        this.nextIconName = { iconName: 'arrow-right', iconVersion: 'v2' };
    }
    static { this.ɵfac = /*@__PURE__*/ (() => { let ɵDaterangeComponent_BaseFactory; return function DaterangeComponent_Factory(t) { return (ɵDaterangeComponent_BaseFactory || (ɵDaterangeComponent_BaseFactory = i0.ɵɵgetInheritedFactory(DaterangeComponent)))(t || DaterangeComponent); }; })(); }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DaterangeComponent, selectors: [["fusion-daterange"]], features: [i0.ɵɵProvidersFeature([
                {
                    provide: NG_VALUE_ACCESSOR,
                    useExisting: forwardRef(() => DaterangeComponent),
                    multi: true
                }
            ]), i0.ɵɵInheritDefinitionFeature], decls: 17, vars: 25, consts: [[3, "id", "fusionClickOutside"], [3, "configurations", "click"], [1, "overlay", 3, "ngClass"], ["overlay", ""], ["class", "presetsWrap", 4, "ngIf"], [1, "rightSide"], [1, "calendarsWrap", 3, "ngClass"], [1, "prev", 3, "click"], [1, "icon-prev", 3, "name"], [3, "configuration", "daySelected", 4, "ngFor", "ngForOf"], [1, "next", 3, "click"], [1, "icon-next", 3, "name"], ["class", "calendarsFooter", 4, "ngIf"], [1, "presetsWrap"], [3, "ngTemplateOutlet"], ["defaultPreset", ""], [3, "ngClass", "click", 4, "ngFor", "ngForOf"], [3, "ngClass", "click"], [3, "configuration", "daySelected"], [1, "calendarsFooter"], ["fusion-button", "", 1, "primary", "transparent", 3, "click"], ["fusion-button", "", 1, "secondary", "transparent", 3, "click"]], template: function DaterangeComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "div", 0);
            i0.ɵɵlistener("fusionClickOutside", function DaterangeComponent_Template_div_fusionClickOutside_0_listener($event) { return ctx.onOutsideClick($event); });
            i0.ɵɵelementStart(1, "fusion-dropdown-select", 1);
            i0.ɵɵlistener("click", function DaterangeComponent_Template_fusion_dropdown_select_click_1_listener() { return ctx.toggle(); });
            i0.ɵɵpipe(2, "async");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(3, "div", 2, 3);
            i0.ɵɵpipe(5, "async");
            i0.ɵɵpipe(6, "async");
            i0.ɵɵpipe(7, "async");
            i0.ɵɵtemplate(8, DaterangeComponent_div_8_Template, 4, 1, "div", 4);
            i0.ɵɵelementStart(9, "div", 5)(10, "div", 6)(11, "div", 7);
            i0.ɵɵlistener("click", function DaterangeComponent_Template_div_click_11_listener() { return ctx.onMonthChange("previous"); });
            i0.ɵɵelement(12, "fusion-icon", 8);
            i0.ɵɵelementEnd();
            i0.ɵɵtemplate(13, DaterangeComponent_fusion_calendar_13_Template, 1, 1, "fusion-calendar", 9);
            i0.ɵɵelementStart(14, "div", 10);
            i0.ɵɵlistener("click", function DaterangeComponent_Template_div_click_14_listener() { return ctx.onMonthChange("next"); });
            i0.ɵɵelement(15, "fusion-icon", 11);
            i0.ɵɵelementEnd()();
            i0.ɵɵtemplate(16, DaterangeComponent_div_16_Template, 7, 0, "div", 12);
            i0.ɵɵelementEnd()()();
        } if (rf & 2) {
            i0.ɵɵproperty("id", ctx.id);
            i0.ɵɵadvance();
            i0.ɵɵproperty("configurations", i0.ɵɵpipeBind1(2, 11, ctx.dropdownSelectConfigurations$));
            i0.ɵɵadvance(2);
            i0.ɵɵclassMap(i0.ɵɵpipeBind1(5, 13, ctx.overlayAlign$));
            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction3(19, _c1, i0.ɵɵpipeBind1(6, 15, ctx.overlayAlign$), i0.ɵɵpipeBind1(7, 17, ctx.isOpen$), ctx.isSingleDatePicker));
            i0.ɵɵadvance(5);
            i0.ɵɵproperty("ngIf", ctx.isPresetsShown);
            i0.ɵɵadvance(2);
            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(23, _c2, ctx.options.size === "large"));
            i0.ɵɵadvance(2);
            i0.ɵɵproperty("name", ctx.pevIconName);
            i0.ɵɵadvance();
            i0.ɵɵproperty("ngForOf", ctx.currentMonths);
            i0.ɵɵadvance(2);
            i0.ɵɵproperty("name", ctx.nextIconName);
            i0.ɵɵadvance();
            i0.ɵɵproperty("ngIf", !ctx.isSingleDatePicker);
        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i2.IconComponent, i3.ClickOutsideDirective, i4.CalendarComponent, i5.ButtonComponent, i6.DropdownSelectComponent, i1.AsyncPipe], styles: ["[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .presetsWrap[_ngcontent-%COMP%], [_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .calendarsFooter[_ngcontent-%COMP%]{font-size:12px;font-family:HelveticaNeue,helvetica,sans-serif;font-weight:400;letter-spacing:.04px}[_nghost-%COMP%]   *[_ngcontent-%COMP%]{box-sizing:border-box}[_nghost-%COMP%]{margin:0;padding:0;vertical-align:initial;text-align:initial}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]{z-index:2000!important}[_nghost-%COMP%]{position:relative;display:inline-block;width:100%;line-height:20px}.open-to-right[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]{left:0}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]{position:absolute;right:0;display:none;padding:8px;min-width:480px;border-radius:4px;background-color:var(--fu-white, #ffffff);box-shadow:0 2px 4px #0c003333;visibility:hidden}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   fusion-icon[class^=icon-prev][_ngcontent-%COMP%]     svg{height:8px;width:6px}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   fusion-icon[class^=icon-prev][_ngcontent-%COMP%]     svg *{fill:var(--fu-dark-700, #1d1c64)}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   fusion-icon[class^=icon-next][_ngcontent-%COMP%]     svg{height:8px;width:6px}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   fusion-icon[class^=icon-next][_ngcontent-%COMP%]     svg *{fill:var(--fu-dark-700, #1d1c64)}[_nghost-%COMP%]   .overlay.singleDatePicker[_ngcontent-%COMP%]{min-width:240px}[_nghost-%COMP%]   .overlay.singleDatePicker[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%], [_nghost-%COMP%]   .overlay.singleDatePicker[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .calendarsWrap[_ngcontent-%COMP%]{width:100%}[_nghost-%COMP%]   .overlay.singleDatePicker[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .calendarsWrap[_ngcontent-%COMP%]{padding-bottom:0}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]{width:460px;position:relative}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .calendarsWrap[_ngcontent-%COMP%]{padding-bottom:8px;width:460px;display:flex;justify-content:space-between}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .calendarsFooter[_ngcontent-%COMP%]{border-top:1px solid var(--fu-light-300, #e5e7e9);height:32px;padding:7px 0 7px 4px;color:var(--fu-light-900, #7b838c);line-height:24px}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .calendarsFooter[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{float:left}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .calendarsFooter[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{float:right}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .prev[_ngcontent-%COMP%], [_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .next[_ngcontent-%COMP%]{position:absolute;cursor:pointer;display:inline-block;top:10px;text-align:center;width:20px;height:20px;border-radius:100px}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .prev[_ngcontent-%COMP%]:hover, [_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .next[_ngcontent-%COMP%]:hover{background-color:var(--fu-light-200, #f0f1f2)}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .prev[_ngcontent-%COMP%]{left:4px}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .rightSide[_ngcontent-%COMP%]   .next[_ngcontent-%COMP%]{right:4px}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .presetsWrap[_ngcontent-%COMP%]{width:206px;padding-right:8px}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .presetsWrap[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]{padding:0;margin:0}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .presetsWrap[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{color:var(--fu-dark-300, #313d91);height:32px;padding:8px;display:flex;align-items:center}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .presetsWrap[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]:not(.selected):hover{cursor:pointer;border-radius:4px;background-color:var(--fu-light-300, #e5e7e9)}[_nghost-%COMP%]   .overlay[_ngcontent-%COMP%]   .presetsWrap[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li.selected[_ngcontent-%COMP%]{border-radius:3px;background-color:var(--fu-primary-200, #c9dfff)}[_nghost-%COMP%]   .overlay.isOpen[_ngcontent-%COMP%]{display:flex}[_nghost-%COMP%]   .overlay.left[_ngcontent-%COMP%]{left:0;right:initial}[_nghost-%COMP%]   .overlay.visible[_ngcontent-%COMP%]{visibility:initial}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DaterangeComponent, [{
        type: Component,
        args: [{ selector: 'fusion-daterange', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                    {
                        provide: NG_VALUE_ACCESSOR,
                        useExisting: forwardRef(() => DaterangeComponent),
                        multi: true
                    }
                ], template: "<div [id]=\"id\" (fusionClickOutside)=\"onOutsideClick($event)\">\n    <fusion-dropdown-select\n        (click)=\"toggle()\"\n        [configurations]=\"dropdownSelectConfigurations$ | async\"\n    >\n    </fusion-dropdown-select>\n\n    <div class=\"overlay\" #overlay [class]=\"overlayAlign$ | async\" [ngClass]=\"{visible: (overlayAlign$ | async), isOpen: (isOpen$ | async), singleDatePicker: isSingleDatePicker}\">\n        <div class=\"presetsWrap\" *ngIf=\"isPresetsShown\">\n            <ng-container [ngTemplateOutlet]=\"presetsHeaderTemplate || defaultPreset\"></ng-container>\n            <ng-template #defaultPreset>\n                <ul>\n                    <li\n                        *ngFor=\"let preset of options.presets\"\n                        (click)=\"selectPreset(preset)\"\n                        [ngClass]=\"{selected: currentPreset === preset}\"\n                    >\n                        {{ daterangeService.getPresetName(preset) }}\n                    </li>\n                </ul>\n            </ng-template>\n        </div>\n        <div class=\"rightSide\">\n            <div class=\"calendarsWrap\" [ngClass]=\"{large: options.size === 'large'}\">\n                <div class=\"prev\" (click)=\"onMonthChange('previous')\">\n                    <fusion-icon class=\"icon-prev\" [name]=\"pevIconName\"></fusion-icon>\n                </div>\n\n                <fusion-calendar\n                    *ngFor=\"let month of currentMonths\"\n                    (daySelected)=\"onSelectDay($event)\"\n                    [configuration]=\"getCalendarConfigurations(month)\"\n                >\n                </fusion-calendar>\n\n                <div class=\"next\" (click)=\"onMonthChange('next')\">\n                    <fusion-icon class=\"icon-next\" [name]=\"nextIconName\"></fusion-icon>\n                </div>\n            </div>\n            <div *ngIf=\"!isSingleDatePicker\" class=\"calendarsFooter\">\n                <span>All reports and dates are in UTC</span>\n                <button fusion-button class=\"primary transparent\" (click)=\"apply()\">Apply</button>\n                <button fusion-button class=\"secondary transparent\" (click)=\"close()\">Cancel</button>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [":host .overlay .presetsWrap,:host .overlay .rightSide .calendarsFooter{font-size:12px;font-family:HelveticaNeue,helvetica,sans-serif;font-weight:400;letter-spacing:.04px}:host *{box-sizing:border-box}:host{margin:0;padding:0;vertical-align:initial;text-align:initial}:host .overlay{z-index:2000!important}:host{position:relative;display:inline-block;width:100%;line-height:20px}:host.open-to-right .overlay{left:0}:host .overlay{position:absolute;right:0;display:none;padding:8px;min-width:480px;border-radius:4px;background-color:var(--fu-white, #ffffff);box-shadow:0 2px 4px #0c003333;visibility:hidden}:host .overlay fusion-icon[class^=icon-prev] ::ng-deep svg{height:8px;width:6px}:host .overlay fusion-icon[class^=icon-prev] ::ng-deep svg *{fill:var(--fu-dark-700, #1d1c64)}:host .overlay fusion-icon[class^=icon-next] ::ng-deep svg{height:8px;width:6px}:host .overlay fusion-icon[class^=icon-next] ::ng-deep svg *{fill:var(--fu-dark-700, #1d1c64)}:host .overlay.singleDatePicker{min-width:240px}:host .overlay.singleDatePicker .rightSide,:host .overlay.singleDatePicker .rightSide .calendarsWrap{width:100%}:host .overlay.singleDatePicker .rightSide .calendarsWrap{padding-bottom:0}:host .overlay .rightSide{width:460px;position:relative}:host .overlay .rightSide .calendarsWrap{padding-bottom:8px;width:460px;display:flex;justify-content:space-between}:host .overlay .rightSide .calendarsFooter{border-top:1px solid var(--fu-light-300, #e5e7e9);height:32px;padding:7px 0 7px 4px;color:var(--fu-light-900, #7b838c);line-height:24px}:host .overlay .rightSide .calendarsFooter span{float:left}:host .overlay .rightSide .calendarsFooter button{float:right}:host .overlay .rightSide .prev,:host .overlay .rightSide .next{position:absolute;cursor:pointer;display:inline-block;top:10px;text-align:center;width:20px;height:20px;border-radius:100px}:host .overlay .rightSide .prev:hover,:host .overlay .rightSide .next:hover{background-color:var(--fu-light-200, #f0f1f2)}:host .overlay .rightSide .prev{left:4px}:host .overlay .rightSide .next{right:4px}:host .overlay .presetsWrap{width:206px;padding-right:8px}:host .overlay .presetsWrap ul{padding:0;margin:0}:host .overlay .presetsWrap ul li{color:var(--fu-dark-300, #313d91);height:32px;padding:8px;display:flex;align-items:center}:host .overlay .presetsWrap ul li:not(.selected):hover{cursor:pointer;border-radius:4px;background-color:var(--fu-light-300, #e5e7e9)}:host .overlay .presetsWrap ul li.selected{border-radius:3px;background-color:var(--fu-primary-200, #c9dfff)}:host .overlay.isOpen{display:flex}:host .overlay.left{left:0;right:initial}:host .overlay.visible{visibility:initial}\n"] }]
    }], null, null); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DaterangeComponent, { className: "DaterangeComponent", filePath: "daterange.component.ts", lineNumber: 20 }); })();
//# sourceMappingURL=data:application/json;base64, 