import { Component, ViewChild, Input, Output, EventEmitter, HostListener, ElementRef, } from '@angular/core';
import moment from 'moment/moment';
import { lifecycleText } from './lifecycl.constant';
import dayjs from 'dayjs';
import * as i0 from "@angular/core";
import * as i1 from "../frequency.service";
import * as i2 from "@angular/forms";
import * as i3 from "@angular/common";
import * as i4 from "../../../formgroup/cs-radio/cs-radio.component";
import * as i5 from "ng2-date-picker";
export class FrequencyLifecycleComponent {
    constructor(frequencyService) {
        this.frequencyService = frequencyService;
        this.datePickerOverlay = false;
        this.showDateError = false;
        this.startDateUnix = Date.now();
        // All input variable
        this.startDate = new Date();
        this.endDate = moment(new Date(this.startDate).getTime() + 86400000);
        this.occurrance = 10;
        this.selectedLifecycleType = 2; // 0 = End by ,  End After, 2 = perpetual
        this.id = 0;
        //  lifecycle output
        this.selectedOccurance = new EventEmitter();
        this.openedDatePicker = '';
    }
    ngOnInit() {
        this.textDetails = lifecycleText[this.mode];
        this.startDateConfig = Object.assign({
            ...this.frequencyService.dateConfig,
        });
        this.endDateConfig = Object.assign({ ...this.frequencyService.dateConfig });
        this.startDateConfig['min'] = this.frequencyService.formatDate();
        //this.startDateUnix = this.startDate.getDate().toString()
        this.endDateConfig['min'] = moment(new Date(new Date(this.startDate).getTime() + 86400000));
        this.getEndDate(this.startDate);
        this.changeEndDateObj(this.endDate);
    }
    getEndDate(event) {
        const time = moment(this.endDate).format('DD-MM-YYYY HH:mm:ss');
        const getUnixTime = moment(time.split(' ')[0] + ' 00:00:00', 'DD-MM-YYYY HH:mm:ss').unix();
        this.startDateUnix = moment(event).unix();
        if (this.startDateUnix >= getUnixTime) {
            this.endDate = moment(new Date(this.startDate).getTime() + 86400000);
        }
        else {
            this.endDate = moment(this.endDate);
        }
    }
    changeEndDateObj(date) {
        this.endDateObject = new Date(moment(date).unix() * 1000);
        this.selectedEndDate = moment(this.endDate).unix();
    }
    ngOnChanges(change) {
        this.endBy = moment(this.endDate)
            .format('DD-MMMM-YYYYTHH:mm:ssZ')
            .split('T')[0];
    }
    openDatePicker() {
        const newDate = dayjs(this.startDate);
        this.startDatePicker?.api?.open();
        this.startDatePicker?.api?.moveCalendarTo(newDate);
        this.datePickerOverlay = true;
        this.openedDatePicker = 'START_DATE';
    }
    openDatePicker1() {
        const newDate = moment(this.endDate);
        this.endDatePicker?.api?.open();
        this.endDatePicker?.api?.moveCalendarTo(this.endDate);
        this.openedDatePicker = 'END_DATE';
        this.datePickerOverlay = true;
    }
    closeDatepicker() {
        this.startDatePicker?.api?.close();
        this.endDatePicker?.api?.close();
        this.datePickerOverlay = false;
    }
    // lifecycle type
    typeSelected(event) {
        this.selectedLifecycleType = event;
        this.selectedOccurance.emit({
            type: event,
            endsBy: this.endBy,
            endafter: this.occurrance,
            startFrom: this.startDateUnix,
        });
        return this.selectedLifecycleType;
    }
    // ends after selection
    endsAfter(event) {
        if (!Number.isNaN(Number(this.occurrance)) &&
            this.occurrance !== 0 &&
            Number(this.occurrance) > 0) {
            this.selectedOccurance.emit({
                type: this.selectedLifecycleType,
                endsBy: this.endBy,
                endafter: this.occurrance,
                startFrom: this.startDateUnix,
            });
        }
        else {
            this.occurrance = 10;
        }
        return this.occurrance;
    }
    // End by change
    endByChange(event) {
        this.endDatePicker?.api?.open();
        this.datePickerOverlay = true;
        this.endDate = event?.date?.$d;
        this.selectedEndDate = moment(this.endDate).unix();
        this.changeEndDateObj(this.endDate);
        this.endBy = moment(event?.date?.$d).format('DD-MMMM-YYYY');
        const dateObject = {
            type: this.selectedLifecycleType,
            endsBy: this.endBy,
            endafter: this.occurrance,
            startFrom: this.startDateUnix,
        };
        this.selectedOccurance.emit(dateObject);
    }
    // start from change event
    startFromChange(event) {
        this.startDateUnix = moment(event?.date?.$d).unix();
        if (this.startDateUnix >= this.selectedEndDate) {
            this.endDate = moment(this.startDateUnix * 1000 + 86400000);
            this.changeEndDateObj(this.endDate);
            this.endBy = moment(this.endDate)
                .format('DD-MMMM-YYYYTHH:mm:ssZ')
                .split('T')[0];
        }
        this.endDateConfig['min'] = Object.assign(moment(new Date(new Date(event?.date?.$d).getTime() + 86400000)));
        this.selectedOccurance.emit({
            type: this.selectedLifecycleType,
            endsBy: this.endBy,
            endafter: this.occurrance,
            startFrom: this.startDateUnix,
        });
    }
    documentClick(event) {
        const targetElement = event?.target;
        const fromDateInputElement = document.getElementById(this.openedDatePicker.toLowerCase()) || null;
        const datePickerCalendarContainer = document.getElementsByClassName('dp-day-calendar-container')[0];
        const monthYearElement = document.querySelector('.dp-month-calendar-container');
        const isNotMonthYearElement = !monthYearElement?.contains(targetElement);
        const openedElement = this.openedDatePicker === 'START_DATE'
            ? this.startDatePickerPopup
            : this.endDatePickerPopup;
        const isOutsideFromDateInput = !openedElement?.nativeElement?.contains(targetElement);
        const isNotFromDateElement = event?.target !== fromDateInputElement;
        const isNotInsideCalendar = !datePickerCalendarContainer?.contains(targetElement);
        const selectedDatePicker = this.openedDatePicker === 'START_DATE'
            ? this.startDatePicker
            : this.endDatePicker;
        const isNotCalendarMonth = !targetElement.className.includes('dp-calendar-month');
        if (isOutsideFromDateInput &&
            isNotFromDateElement &&
            isNotInsideCalendar &&
            isNotCalendarMonth &&
            isNotMonthYearElement &&
            datePickerCalendarContainer) {
            this.documentClickListener(event?.target, openedElement, selectedDatePicker);
        }
    }
    documentClickListener(target, openedElements, selectedDatePicker) {
        if (!openedElements?.nativeElement?.contains(target) &&
            selectedDatePicker?.areCalendarsShown) {
            selectedDatePicker?.api?.close();
            this.datePickerOverlay = false;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FrequencyLifecycleComponent, deps: [{ token: i1.FrequencyService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FrequencyLifecycleComponent, selector: "app-frequency-lifecycle", inputs: { startDate: "startDate", endDate: "endDate", endBy: "endBy", occurrance: "occurrance", selectedLifecycleType: "selectedLifecycleType", id: "id", mode: "mode" }, outputs: { selectedOccurance: "selectedOccurance" }, host: { listeners: { "document:click": "documentClick($event)" } }, viewQueries: [{ propertyName: "startDatePicker", first: true, predicate: ["startDatePicker"], descendants: true }, { propertyName: "endDatePicker", first: true, predicate: ["endDatePicker"], descendants: true }, { propertyName: "startDatePickerPopup", first: true, predicate: ["startDatePicker"], descendants: true, read: ElementRef }, { propertyName: "endDatePickerPopup", first: true, predicate: ["endDatePicker"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"frequency-lifecycle-responsibility vx-mt-5\">\n  <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">\n    {{ textDetails?.header }}\n  </div>\n  <div\n    class=\"frequency-lifecycle-responsibility-inner vx-p-3 vx-pt-2 vx-d-flex vx-align-center vx-justify-between\"\n  >\n    <div\n      class=\"frequency-lifecycle-responsibility-item\"\n      [class.with-policy]=\"mode === 'policy' || mode === 'reviewerFrequency'\"\n    >\n      <div class=\"vx-d-block\">\n        <div\n          *ngIf=\"mode === 'responsibility'\"\n          class=\"heading vx-fs-12 vx-label-txt vx-mb-1\"\n        >\n          Starts From\n        </div>\n        <div class=\"lifecycle-box vx-d-flex vx-align-center vx-p-2\">\n          <i class=\"icons vx-fs-16 vx-paragraph-txt vx-mr-3\">&#xe996;</i>\n          <input\n            class=\"start-date-input\"\n            type=\"text\"\n            [value]=\"startDate | date : 'dd MMM yyyy'\"\n            [placeholder]=\"startDate | date : 'dd MMM yyyy'\"\n            readonly\n            (click)=\"openDatePicker(); datePickerOverlay = true\"\n            id=\"start_date\"\n          />\n        </div>\n      </div>\n    </div>\n    <div\n      *ngIf=\"mode === 'responsibility'\"\n      class=\"frequency-lifecycle-responsibility-item\"\n    >\n      <div class=\"item-inner vx-d-block\">\n        <div class=\"heading vx-fs-12 vx-label-txt vx-mb-1\">Ends By</div>\n        <app-cs-radio\n          [checked]=\"selectedLifecycleType == 0\"\n          (checkedEvent)=\"typeSelected(0)\"\n        >\n          <div class=\"date-field\">\n            <i class=\"icons calendar-icon vx-fs-16 vx-paragraph-txt\"\n              >&#xe92d;</i\n            >\n            <input\n              type=\"text\"\n              [value]=\"endDateObject | date : 'dd MMM yyyy'\"\n              [placeholder]=\"endDateObject | date : 'dd MMM yyyy'\"\n              readonly\n              (click)=\"openDatePicker1(); datePickerOverlay = true\"\n              id=\"end_date\"\n            />\n          </div>\n        </app-cs-radio>\n      </div>\n    </div>\n    <div\n      *ngIf=\"mode === 'responsibility'\"\n      class=\"frequency-lifecycle-responsibility-item\"\n    >\n      <div class=\"item-inner vx-d-block\">\n        <div class=\"heading vx-fs-12 vx-label-txt vx-mb-1\">Ends After</div>\n        <app-cs-radio\n          [checked]=\"selectedLifecycleType == 1\"\n          (checkedEvent)=\"typeSelected(1)\"\n        >\n          <input\n            class=\"input-field\"\n            type=\"number\"\n            [(ngModel)]=\"occurrance\"\n            (focusout)=\"endsAfter($event)\"\n            onkeydown=\"return event.keyCode !== 190\"\n            min=\"0\"\n            oninput=\"this.value = Math.abs(this.value)\"\n          />\n          <span class=\"vx-fs-11 vx-paragraph-txt vx-ml-2\">Occurrences</span>\n        </app-cs-radio>\n      </div>\n    </div>\n    <div\n      *ngIf=\"mode === 'responsibility'\"\n      class=\"frequency-lifecycle-responsibility-item\"\n    >\n      <div class=\"item-inner vx-d-block\">\n        <div class=\"heading vx-fs-12 vx-label-txt vx-mb-1\">Ongoing</div>\n        <app-cs-radio\n          [checked]=\"selectedLifecycleType == 2\"\n          (checkedEvent)=\"typeSelected(2)\"\n        >\n          <span class=\"vx-fs-11 vx-paragraph-txt vx-ml-2\"\n            >The responsibility will perpetually exist.</span\n          >\n        </app-cs-radio>\n      </div>\n    </div>\n  </div>\n</div>\n\n<!-- start date date picker -->\n<dp-date-picker\n  #startDatePicker\n  [id]=\"'start-date-' + id\"\n  [placeholder]=\"startDate | date : 'dd MMM yyyy'\"\n  [(ngModel)]=\"startDate\"\n  [config]=\"startDateConfig\"\n  (onSelect)=\"\n    openDatePicker();\n    startFromChange($event);\n    showDateError = false;\n    datePickerOverlay = false\n  \"\n></dp-date-picker>\n<div\n  class=\"vx-overlay\"\n  (click)=\"closeDatepicker()\"\n  *ngIf=\"datePickerOverlay\"\n></div>\n\n<!-- end date date picker -->\n<dp-date-picker\n  #endDatePicker\n  [(ngModel)]=\"endDate\"\n  [placeholder]=\"endDateObject | date : 'dd MMM yyyy'\"\n  [id]=\"'end-by-input-' + id\"\n  [config]=\"endDateConfig\"\n  [minDate]=\"endDateConfig['min']\"\n  (onSelect)=\"\n    endByChange($event); showDateError = false; datePickerOverlay = false\n  \"\n></dp-date-picker>\n<div\n  class=\"vx-overlay\"\n  (click)=\"closeDatepicker()\"\n  *ngIf=\"datePickerOverlay\"\n></div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/header/header.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/popover/popover.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";::ng-deep .frequency-lifecycle-responsibility-inner{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-lifecycle-responsibility-inner mat-radio-group{display:flex;justify-content:space-between}::ng-deep .frequency-lifecycle-responsibility-item{position:relative;height:3.375rem}::ng-deep .frequency-lifecycle-responsibility-item.with-policy{height:unset;margin-top:.25rem}::ng-deep .frequency-lifecycle-responsibility-item:first-of-type{width:8.5rem}::ng-deep .frequency-lifecycle-responsibility-item:first-of-type label:after,::ng-deep .frequency-lifecycle-responsibility-item:first-of-type label:before{display:none}::ng-deep .frequency-lifecycle-responsibility-item:first-of-type label .heading{padding-left:0}::ng-deep .frequency-lifecycle-responsibility-item:nth-child(2){width:8.5rem}::ng-deep .frequency-lifecycle-responsibility-item:nth-child(3){width:11.25rem}::ng-deep .frequency-lifecycle-responsibility-item:last-of-type{width:14.25rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner{position:relative}::ng-deep .frequency-lifecycle-responsibility-item .item-inner .heading{padding-left:1.75rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio{position:absolute;top:0;left:0;width:100%;height:3.375rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item{width:100%;position:relative}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .radio{position:absolute;top:-17px;left:0;width:1rem;height:1rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .radiomark{position:absolute;top:2px;left:0;width:1rem;height:1rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value{background:#fff;border-radius:.25rem;border:1px solid #dbdbdb;width:calc(100% + 1rem);max-width:100%!important;height:2rem;cursor:pointer;text-transform:none;margin:22px 0 0 -1rem!important}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value .date-field{display:flex;align-items:center;position:relative;width:100%;height:100%;pointer-events:none}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value .date-field .calendar-icon{position:absolute;top:7px;left:.5rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value .date-field input{background:transparent;border-radius:0;border:none;color:#747576;font-size:11px;width:100%;height:1.875rem;padding:0 .5rem 0 2.25rem;position:absolute;top:0;left:0;cursor:pointer}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item input:checked~span.value{pointer-events:auto;margin:22px 0 0!important}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item input:checked~span.value .date-field,::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item input:checked~span.value .input-field{pointer-events:auto!important}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .input-field{-moz-appearance:textfield;border:none;border-bottom:1px solid #DBDBDB;color:#747576;display:inline-block;font-size:13px;text-align:center;width:2.75rem;height:1.25rem;padding:0 .125rem;margin:0 .5rem;outline:none;pointer-events:none}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .input-field::-webkit-inner-spin-button,::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .input-field::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-lifecycle-responsibility-item .lifecycle-box{border-radius:.25rem;border:1px solid #dbdbdb;height:2rem;position:relative;cursor:pointer}::ng-deep .frequency-lifecycle-responsibility-item .lifecycle-box .start-date-input{background:transparent;border-radius:0;border:none;color:#747576;font-size:11px;width:100%;outline:none;cursor:pointer}::ng-deep .frequency-lifecycle{border-top:1px solid #f1f1f1}::ng-deep .frequency-lifecycle-head{background:#fbfbfb;padding:8px 20px}::ng-deep .frequency-lifecycle-title{margin:0;padding:0;font-size:12px;line-height:16px;color:#747576;text-transform:uppercase}::ng-deep .frequency-lifecycle-body{padding:10px 20px;display:flex}::ng-deep .frequency-lifecycle-body .column{width:25%;padding:0;position:relative}::ng-deep .frequency-lifecycle-body .column label.text{color:#747576;font-size:11px;text-transform:uppercase;margin:0 0 4px;font-weight:500;line-height:16px;display:block}::ng-deep .frequency-lifecycle-body .column+.column{padding-left:28px}::ng-deep .frequency-lifecycle-body .column:first-child{width:20%}::ng-deep .frequency-lifecycle-body .column:last-child{width:30%}::ng-deep .frequency-lifecycle-body .column .block,::ng-deep .frequency-lifecycle-body .column span.value{display:flex;font-size:13px;color:#747576;border:1px solid #f1f1f1;border-radius:2px;padding:0 4px 0 16px;box-sizing:border-box;min-height:48px;justify-content:center;align-items:center;background:#fff;cursor:pointer;text-transform:none;margin:0!important}::ng-deep .frequency-lifecycle-body .column .block .date-picker,::ng-deep .frequency-lifecycle-body .column span.value .date-picker{display:flex;align-items:center;position:relative}::ng-deep .frequency-lifecycle-body .column .block .date-picker i,::ng-deep .frequency-lifecycle-body .column span.value .date-picker i{font-size:16px;margin-right:8px}::ng-deep .frequency-lifecycle-body .column .block .date-picker input,::ng-deep .frequency-lifecycle-body .column span.value .date-picker input{border:none;outline:none;width:100%;background:transparent;font-size:12px;cursor:pointer;line-height:40px}::ng-deep .frequency-lifecycle-body .column .block.active,::ng-deep .frequency-lifecycle-body .column span.value.active{border:1px solid #97d2a0;background:#d6f2da}::ng-deep .frequency-lifecycle-body .column app-cs-radio{display:flex}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item{width:100%;position:relative}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item span.radio,::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item svg{position:absolute;top:14px;left:-10px;height:20px;width:20px}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item span.value{max-width:100%;pointer-events:none;font-size:13px;color:#747576;width:100%}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input:checked~span.value{pointer-events:auto;border:1px solid #97d2a0;background:#d6f2da}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input.day{-moz-appearance:textfield;border:none;width:40px;padding:4px;text-align:center;border-bottom:2px solid #dcdcdc;line-height:26px;color:#161b2f;font-weight:400;outline:none;background:transparent;margin:0 4px 0 0;font-size:13px}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input.day::-webkit-outer-spin-button,::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input.day::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item span{font-size:13px;color:#747576}::ng-deep dp-date-picker{width:100%;position:fixed!important;z-index:14;top:-26px;left:0}::ng-deep dp-date-picker input{width:100%;border:none;opacity:0!important;pointer-events:none}::ng-deep dp-date-picker input:focus{outline:none}::ng-deep dp-date-picker .dp-popup{width:412px;box-shadow:0 0 20px #161b2f26;background-color:#fff;border-radius:4px;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both}::ng-deep dp-date-picker .dp-popup dp-day-calendar,::ng-deep dp-date-picker .dp-popup dp-month-calendar{width:100%;pointer-events:auto}::ng-deep dp-date-picker .dp-popup dp-day-calendar button,::ng-deep dp-date-picker .dp-popup dp-month-calendar button{background:transparent;border:none;outline:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right{width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-size:14px}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{display:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:before,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:before{content:\"\";height:10px;width:10px;border-radius:50%;background:#000;display:inline-flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week{display:flex;justify-content:space-around}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week .dp-calendar-weekday{width:52px;border-left:none;border-bottom-color:#fff;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-selected{background:#1e5dd3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day{border:1px solid rgba(0,0,0,.38);color:#1e5dd3;background-color:#fff}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-day-calendar-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-day-calendar-container{padding:20px;border-radius:2px}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container{display:flex;margin:0 0 20px;border:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container .dp-nav-header button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container .dp-nav-header button{color:#000;font-size:17px;font-weight:500;margin:0 0 0 12px;padding:0}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container{width:80px;display:flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button{margin:0!important}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-wrapper,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-wrapper{border:none}::ng-deep dp-date-picker .dp-open+div{position:fixed!important;inset:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:#0000004d}@keyframes slide-bottom{0%{transform:translateY(-100px)}to{transform:translateY(0)}}.vx-overlay{position:fixed;z-index:1;inset:0}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.CsRadioComponent, selector: "app-cs-radio", inputs: ["disabled", "readonly", "name", "checked", "value", "oneLine"], outputs: ["checkedEvent"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.DatePickerComponent, selector: "dp-date-picker", inputs: ["config", "mode", "placeholder", "disabled", "displayDate", "theme", "minDate", "maxDate", "minTime", "maxTime"], outputs: ["open", "close", "onChange", "onGoToCurrent", "onLeftNav", "onRightNav", "onSelect"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FrequencyLifecycleComponent, decorators: [{
            type: Component,
            args: [{ selector: 'app-frequency-lifecycle', template: "<div class=\"frequency-lifecycle-responsibility vx-mt-5\">\n  <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">\n    {{ textDetails?.header }}\n  </div>\n  <div\n    class=\"frequency-lifecycle-responsibility-inner vx-p-3 vx-pt-2 vx-d-flex vx-align-center vx-justify-between\"\n  >\n    <div\n      class=\"frequency-lifecycle-responsibility-item\"\n      [class.with-policy]=\"mode === 'policy' || mode === 'reviewerFrequency'\"\n    >\n      <div class=\"vx-d-block\">\n        <div\n          *ngIf=\"mode === 'responsibility'\"\n          class=\"heading vx-fs-12 vx-label-txt vx-mb-1\"\n        >\n          Starts From\n        </div>\n        <div class=\"lifecycle-box vx-d-flex vx-align-center vx-p-2\">\n          <i class=\"icons vx-fs-16 vx-paragraph-txt vx-mr-3\">&#xe996;</i>\n          <input\n            class=\"start-date-input\"\n            type=\"text\"\n            [value]=\"startDate | date : 'dd MMM yyyy'\"\n            [placeholder]=\"startDate | date : 'dd MMM yyyy'\"\n            readonly\n            (click)=\"openDatePicker(); datePickerOverlay = true\"\n            id=\"start_date\"\n          />\n        </div>\n      </div>\n    </div>\n    <div\n      *ngIf=\"mode === 'responsibility'\"\n      class=\"frequency-lifecycle-responsibility-item\"\n    >\n      <div class=\"item-inner vx-d-block\">\n        <div class=\"heading vx-fs-12 vx-label-txt vx-mb-1\">Ends By</div>\n        <app-cs-radio\n          [checked]=\"selectedLifecycleType == 0\"\n          (checkedEvent)=\"typeSelected(0)\"\n        >\n          <div class=\"date-field\">\n            <i class=\"icons calendar-icon vx-fs-16 vx-paragraph-txt\"\n              >&#xe92d;</i\n            >\n            <input\n              type=\"text\"\n              [value]=\"endDateObject | date : 'dd MMM yyyy'\"\n              [placeholder]=\"endDateObject | date : 'dd MMM yyyy'\"\n              readonly\n              (click)=\"openDatePicker1(); datePickerOverlay = true\"\n              id=\"end_date\"\n            />\n          </div>\n        </app-cs-radio>\n      </div>\n    </div>\n    <div\n      *ngIf=\"mode === 'responsibility'\"\n      class=\"frequency-lifecycle-responsibility-item\"\n    >\n      <div class=\"item-inner vx-d-block\">\n        <div class=\"heading vx-fs-12 vx-label-txt vx-mb-1\">Ends After</div>\n        <app-cs-radio\n          [checked]=\"selectedLifecycleType == 1\"\n          (checkedEvent)=\"typeSelected(1)\"\n        >\n          <input\n            class=\"input-field\"\n            type=\"number\"\n            [(ngModel)]=\"occurrance\"\n            (focusout)=\"endsAfter($event)\"\n            onkeydown=\"return event.keyCode !== 190\"\n            min=\"0\"\n            oninput=\"this.value = Math.abs(this.value)\"\n          />\n          <span class=\"vx-fs-11 vx-paragraph-txt vx-ml-2\">Occurrences</span>\n        </app-cs-radio>\n      </div>\n    </div>\n    <div\n      *ngIf=\"mode === 'responsibility'\"\n      class=\"frequency-lifecycle-responsibility-item\"\n    >\n      <div class=\"item-inner vx-d-block\">\n        <div class=\"heading vx-fs-12 vx-label-txt vx-mb-1\">Ongoing</div>\n        <app-cs-radio\n          [checked]=\"selectedLifecycleType == 2\"\n          (checkedEvent)=\"typeSelected(2)\"\n        >\n          <span class=\"vx-fs-11 vx-paragraph-txt vx-ml-2\"\n            >The responsibility will perpetually exist.</span\n          >\n        </app-cs-radio>\n      </div>\n    </div>\n  </div>\n</div>\n\n<!-- start date date picker -->\n<dp-date-picker\n  #startDatePicker\n  [id]=\"'start-date-' + id\"\n  [placeholder]=\"startDate | date : 'dd MMM yyyy'\"\n  [(ngModel)]=\"startDate\"\n  [config]=\"startDateConfig\"\n  (onSelect)=\"\n    openDatePicker();\n    startFromChange($event);\n    showDateError = false;\n    datePickerOverlay = false\n  \"\n></dp-date-picker>\n<div\n  class=\"vx-overlay\"\n  (click)=\"closeDatepicker()\"\n  *ngIf=\"datePickerOverlay\"\n></div>\n\n<!-- end date date picker -->\n<dp-date-picker\n  #endDatePicker\n  [(ngModel)]=\"endDate\"\n  [placeholder]=\"endDateObject | date : 'dd MMM yyyy'\"\n  [id]=\"'end-by-input-' + id\"\n  [config]=\"endDateConfig\"\n  [minDate]=\"endDateConfig['min']\"\n  (onSelect)=\"\n    endByChange($event); showDateError = false; datePickerOverlay = false\n  \"\n></dp-date-picker>\n<div\n  class=\"vx-overlay\"\n  (click)=\"closeDatepicker()\"\n  *ngIf=\"datePickerOverlay\"\n></div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/header/header.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/popover/popover.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";::ng-deep .frequency-lifecycle-responsibility-inner{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-lifecycle-responsibility-inner mat-radio-group{display:flex;justify-content:space-between}::ng-deep .frequency-lifecycle-responsibility-item{position:relative;height:3.375rem}::ng-deep .frequency-lifecycle-responsibility-item.with-policy{height:unset;margin-top:.25rem}::ng-deep .frequency-lifecycle-responsibility-item:first-of-type{width:8.5rem}::ng-deep .frequency-lifecycle-responsibility-item:first-of-type label:after,::ng-deep .frequency-lifecycle-responsibility-item:first-of-type label:before{display:none}::ng-deep .frequency-lifecycle-responsibility-item:first-of-type label .heading{padding-left:0}::ng-deep .frequency-lifecycle-responsibility-item:nth-child(2){width:8.5rem}::ng-deep .frequency-lifecycle-responsibility-item:nth-child(3){width:11.25rem}::ng-deep .frequency-lifecycle-responsibility-item:last-of-type{width:14.25rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner{position:relative}::ng-deep .frequency-lifecycle-responsibility-item .item-inner .heading{padding-left:1.75rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio{position:absolute;top:0;left:0;width:100%;height:3.375rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item{width:100%;position:relative}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .radio{position:absolute;top:-17px;left:0;width:1rem;height:1rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .radiomark{position:absolute;top:2px;left:0;width:1rem;height:1rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value{background:#fff;border-radius:.25rem;border:1px solid #dbdbdb;width:calc(100% + 1rem);max-width:100%!important;height:2rem;cursor:pointer;text-transform:none;margin:22px 0 0 -1rem!important}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value .date-field{display:flex;align-items:center;position:relative;width:100%;height:100%;pointer-events:none}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value .date-field .calendar-icon{position:absolute;top:7px;left:.5rem}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item .value .date-field input{background:transparent;border-radius:0;border:none;color:#747576;font-size:11px;width:100%;height:1.875rem;padding:0 .5rem 0 2.25rem;position:absolute;top:0;left:0;cursor:pointer}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item input:checked~span.value{pointer-events:auto;margin:22px 0 0!important}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item input:checked~span.value .date-field,::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .radio-item input:checked~span.value .input-field{pointer-events:auto!important}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .input-field{-moz-appearance:textfield;border:none;border-bottom:1px solid #DBDBDB;color:#747576;display:inline-block;font-size:13px;text-align:center;width:2.75rem;height:1.25rem;padding:0 .125rem;margin:0 .5rem;outline:none;pointer-events:none}::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .input-field::-webkit-inner-spin-button,::ng-deep .frequency-lifecycle-responsibility-item .item-inner app-cs-radio .input-field::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-lifecycle-responsibility-item .lifecycle-box{border-radius:.25rem;border:1px solid #dbdbdb;height:2rem;position:relative;cursor:pointer}::ng-deep .frequency-lifecycle-responsibility-item .lifecycle-box .start-date-input{background:transparent;border-radius:0;border:none;color:#747576;font-size:11px;width:100%;outline:none;cursor:pointer}::ng-deep .frequency-lifecycle{border-top:1px solid #f1f1f1}::ng-deep .frequency-lifecycle-head{background:#fbfbfb;padding:8px 20px}::ng-deep .frequency-lifecycle-title{margin:0;padding:0;font-size:12px;line-height:16px;color:#747576;text-transform:uppercase}::ng-deep .frequency-lifecycle-body{padding:10px 20px;display:flex}::ng-deep .frequency-lifecycle-body .column{width:25%;padding:0;position:relative}::ng-deep .frequency-lifecycle-body .column label.text{color:#747576;font-size:11px;text-transform:uppercase;margin:0 0 4px;font-weight:500;line-height:16px;display:block}::ng-deep .frequency-lifecycle-body .column+.column{padding-left:28px}::ng-deep .frequency-lifecycle-body .column:first-child{width:20%}::ng-deep .frequency-lifecycle-body .column:last-child{width:30%}::ng-deep .frequency-lifecycle-body .column .block,::ng-deep .frequency-lifecycle-body .column span.value{display:flex;font-size:13px;color:#747576;border:1px solid #f1f1f1;border-radius:2px;padding:0 4px 0 16px;box-sizing:border-box;min-height:48px;justify-content:center;align-items:center;background:#fff;cursor:pointer;text-transform:none;margin:0!important}::ng-deep .frequency-lifecycle-body .column .block .date-picker,::ng-deep .frequency-lifecycle-body .column span.value .date-picker{display:flex;align-items:center;position:relative}::ng-deep .frequency-lifecycle-body .column .block .date-picker i,::ng-deep .frequency-lifecycle-body .column span.value .date-picker i{font-size:16px;margin-right:8px}::ng-deep .frequency-lifecycle-body .column .block .date-picker input,::ng-deep .frequency-lifecycle-body .column span.value .date-picker input{border:none;outline:none;width:100%;background:transparent;font-size:12px;cursor:pointer;line-height:40px}::ng-deep .frequency-lifecycle-body .column .block.active,::ng-deep .frequency-lifecycle-body .column span.value.active{border:1px solid #97d2a0;background:#d6f2da}::ng-deep .frequency-lifecycle-body .column app-cs-radio{display:flex}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item{width:100%;position:relative}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item span.radio,::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item svg{position:absolute;top:14px;left:-10px;height:20px;width:20px}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item span.value{max-width:100%;pointer-events:none;font-size:13px;color:#747576;width:100%}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input:checked~span.value{pointer-events:auto;border:1px solid #97d2a0;background:#d6f2da}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input.day{-moz-appearance:textfield;border:none;width:40px;padding:4px;text-align:center;border-bottom:2px solid #dcdcdc;line-height:26px;color:#161b2f;font-weight:400;outline:none;background:transparent;margin:0 4px 0 0;font-size:13px}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input.day::-webkit-outer-spin-button,::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item input.day::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}::ng-deep .frequency-lifecycle-body .column app-cs-radio label.radio-item span{font-size:13px;color:#747576}::ng-deep dp-date-picker{width:100%;position:fixed!important;z-index:14;top:-26px;left:0}::ng-deep dp-date-picker input{width:100%;border:none;opacity:0!important;pointer-events:none}::ng-deep dp-date-picker input:focus{outline:none}::ng-deep dp-date-picker .dp-popup{width:412px;box-shadow:0 0 20px #161b2f26;background-color:#fff;border-radius:4px;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both}::ng-deep dp-date-picker .dp-popup dp-day-calendar,::ng-deep dp-date-picker .dp-popup dp-month-calendar{width:100%;pointer-events:auto}::ng-deep dp-date-picker .dp-popup dp-day-calendar button,::ng-deep dp-date-picker .dp-popup dp-month-calendar button{background:transparent;border:none;outline:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right{width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-size:14px}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{display:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:before,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:before{content:\"\";height:10px;width:10px;border-radius:50%;background:#000;display:inline-flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week{display:flex;justify-content:space-around}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week .dp-calendar-weekday{width:52px;border-left:none;border-bottom-color:#fff;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-selected{background:#1e5dd3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day{border:1px solid rgba(0,0,0,.38);color:#1e5dd3;background-color:#fff}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-day-calendar-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-day-calendar-container{padding:20px;border-radius:2px}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container{display:flex;margin:0 0 20px;border:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container .dp-nav-header button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container .dp-nav-header button{color:#000;font-size:17px;font-weight:500;margin:0 0 0 12px;padding:0}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container{width:80px;display:flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button{margin:0!important}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-wrapper,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-wrapper{border:none}::ng-deep dp-date-picker .dp-open+div{position:fixed!important;inset:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:#0000004d}@keyframes slide-bottom{0%{transform:translateY(-100px)}to{transform:translateY(0)}}.vx-overlay{position:fixed;z-index:1;inset:0}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.FrequencyService }]; }, propDecorators: { startDatePicker: [{
                type: ViewChild,
                args: ['startDatePicker']
            }], endDatePicker: [{
                type: ViewChild,
                args: ['endDatePicker']
            }], startDate: [{
                type: Input
            }], endDate: [{
                type: Input
            }], endBy: [{
                type: Input
            }], occurrance: [{
                type: Input
            }], selectedLifecycleType: [{
                type: Input
            }], id: [{
                type: Input
            }], mode: [{
                type: Input
            }], selectedOccurance: [{
                type: Output
            }], startDatePickerPopup: [{
                type: ViewChild,
                args: ['startDatePicker', { read: ElementRef, static: false }]
            }], endDatePickerPopup: [{
                type: ViewChild,
                args: ['endDatePicker', { read: ElementRef, static: false }]
            }], documentClick: [{
                type: HostListener,
                args: ['document:click', ['$event']]
            }] } });
//# sourceMappingURL=data:application/json;base64, 