vcomply-workflow-engine 2.9.36 → 2.9.38

package/esm2015/lib/sharedComponents/frequency/frequency-responsibility-list/frequency-responsibility-list.component.js

@@ -182,7 +182,7 @@ FrequencyResponsibilityListComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-responsibility-list',
                 template: "<div class=\"frequency-responsibility-list\" [class.animate]=\"animation\">\r\n    <div class=\"frequency-responsibility-list-head vx-p-3 vx-d-flex vx-align-center vx-justify-between\">\r\n        <div class=\"vx-d-flex vx-align-center\">\r\n            <i class=\"icons arrow vx-fs-16 vx-label-txt vx-mr-1\" (click)=\"back()\" >&#xe91d;</i>\r\n            <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Responsibility</div>\r\n        </div>\r\n    </div>\r\n    <div class=\"frequency-responsibility-list-body\">\r\n        <!-- <app-loader-inline *ngIf=\"othersCount === 0\"></app-loader-inline> -->\r\n        <div *ngIf=\"responsibilitiesData?.allResponsibilityCount !== 0\" class=\"vx-d-flex vx-align-center vx-justify-between vx-mb-2\"  >\r\n            <div class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\" [class.active]=\"currentTab === 1\" (click)=\"onClickTabChange(responsibilityTabs[0])\" [class.pointer-none]=\"responsibilityLoader\">\r\n                <div class=\"left vx-d-block vx-w-100\">\r\n                    <div class=\"label vx-d-flex vx-align-center\">\r\n                        <label class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\">REGULATIONS</label>\r\n                    </div>\r\n                </div>\r\n                <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\r\n                    <span class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\">{{responsibilityTabCount?.regulationCount}}</span>\r\n                </div>\r\n            </div>\r\n            <div class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\" [class.active]=\"currentTab === 2\" (click)=\"onClickTabChange(responsibilityTabs[1])\" [class.pointer-none]=\"responsibilityLoader\">\r\n                <div class=\"left vx-d-block vx-w-100\">\r\n                    <div class=\"label vx-d-flex vx-align-center\">\r\n                        <label class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\">STANDARDS</label>\r\n                    </div>\r\n                </div>\r\n                <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\r\n                    <span class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\">{{responsibilityTabCount?.standardCount}}</span>\r\n                </div>\r\n            </div>\r\n            <div class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\" [class.active]=\"currentTab === 3\"(click)=\"onClickTabChange(responsibilityTabs[2])\" [class.pointer-none]=\"responsibilityLoader\">\r\n                <div class=\"left vx-d-block vx-w-100\">\r\n                    <div class=\"label vx-d-flex vx-align-center\">\r\n                        <label class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\">INTERNAL CONTROLS</label>\r\n                    </div>\r\n                </div>\r\n                <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\r\n                    <span class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\">{{responsibilityTabCount?.internalCount}}</span>\r\n                </div>\r\n            </div>\r\n            <div class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\" [class.active]=\"currentTab === 0\" (click)=\"onClickTabChange(responsibilityTabs[3])\" [class.pointer-none]=\"responsibilityLoader\">\r\n                <div class=\"left vx-d-block vx-w-100\">\r\n                    <div class=\"label vx-d-flex vx-align-center\">\r\n                        <label class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\">OTHERS</label>\r\n                    </div>\r\n                </div>\r\n                <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\r\n                    <span class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\">{{responsibilityTabCount?.othersCount}}</span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"frequency-responsibility-list-search vx-mb-2\">\r\n            <i class=\"icons vx-fs-12\">&#xe90b;</i>\r\n            <input type=\"text\" [(ngModel)]=\"responsibilitySearchText\" (keyup.enter)=\"search()\" placeholder=\"Search Responsibilities\" />\r\n        </div>\r\n        <app-pagination *ngIf=\"!responsibilityLoader && responsibilitiesData?.total_pages > 1\" [start]=\"responsibilitiesData?.responsibilities_from\"\r\n            [end]=\"responsibilitiesData?.responsibilities_to\" [total]=\"responsibilitiesData?.total_responsibilities\" \r\n            [pageCount]=\"responsibilitiesData?.total_pages\" [currentPage]=\"responsibilityCurrentPage\"\r\n            (selectedPage)=\"responsibilityPageChange($event)\" >\r\n        </app-pagination>\r\n        <app-loader-inline *ngIf=\"responsibilityLoader\"></app-loader-inline>\r\n        <div class=\"frequency-responsibility-list-mid vx-mb-4\" [class.with-pagination]=\"!responsibilityLoader && responsibilitiesData?.total_pages > 1\">\r\n            <app-no-data *ngIf=\"responsibilitiesData?.data?.length === 0 && !responsibilityLoader\" [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\" [noDataText]=\"'No Data to Display'\"></app-no-data>\r\n            <ng-container *ngIf=\"responsibilitiesData?.data?.length > 0 && !responsibilityLoader\">\r\n            <div class=\"table-header\">\r\n                <div class=\"table-row\">\r\n                    <div class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\">#</div>\r\n                    <div class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\">RESPONSIBILITIES</div>\r\n                    <div class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\">PROGRAMS</div>\r\n                </div>\r\n            </div>\r\n            <div class=\"table-body\">\r\n\r\n                <!-- when click on radio then active class should be true -->\r\n                <div class=\"table-row\" [class.active]=\"selectedResponsibilityId?.includes(responsibility?.ReportId)\" *ngFor=\"let responsibility of responsibilitiesData?.data; let i = index\">\r\n                    <div class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\">\r\n                        <div class=\"sr-no\" [appTooltip]=\"responsibilitiesData?.responsibilities_from + i\" placement=\"bottom\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">{{responsibilitiesData?.responsibilities_from + i}}</div>\r\n                        <app-cs-radio  [name]=\"'responsibility'\" [checked]=\"selectedResponsibilityId?.includes(responsibility?.ReportId)\"\r\n                        (checkedEvent)=\"selectResponsibility(responsibility)\"></app-cs-radio>\r\n                    </div>\r\n                    <div class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\">\r\n                        <div class=\"value vx-fs-12 vx-label-txt vx-pr-5\" [appTooltip]=\"responsibility?.ReportName\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">{{responsibility?.ControlId}} {{responsibility?.ReportName}}</div>\r\n                    </div>\r\n                    <div class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\">\r\n                        <div class=\"program-inner vx-d-block\">\r\n                            <div class=\"program-value vx-fs-11 vx-label-txt vx-pr-5\" [appTooltip]=\"responsibility?.category_details_array[0]?.category_name ?? '--'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">{{responsibility?.category_details_array[0]?.category_name ?? '--'}}</div>\r\n                            <div *ngIf=\"responsibility?.category_details_array[0]?.parent_category_name?.length\" class=\"within-part vx-d-flex vx-align-center vx-pr-3\">\r\n                                <div class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\">Within</div>\r\n                                <div class=\"within-value vx-fs-11 vx-paragraph-txt\" [appTooltip]=\"responsibility?.category_details_array[0]?.parent_category_name?.slice()?.reverse()?.join(' < ')\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">{{responsibility?.category_details_array[0]?.parent_category_name?.slice()?.reverse()?.join(' < ')}}</div>\r\n                              </div>\r\n                        </div>\r\n                        <button *ngIf=\"responsibility?.category_details_array?.length >= 2\" appPopover (click)=\"programPopup.popover()\" placement=\"right\" class=\"program-count vx-fs-11 vx-fw-500 vx-txt-white vx-p-0 vx-pl-1 vx-pr-1 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">+{{responsibility?.category_details_array?.length - 1}}</button>\r\n                        <app-popover #programPopup>\r\n                            <div class=\"action-list\">\r\n                              <ul class=\"action-item\">\r\n                                <li *ngFor=\"let subCategory of responsibility?.category_details_array | slice : 1\">\r\n                                  <div class=\"avatar-card\">\r\n                                      <div class=\"vx-d-block vx-w-100\">\r\n                                          <span class=\"value\" [appTooltip]=\"subCategory?.category_name\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">{{subCategory?.category_name}}</span>\r\n                                          <div *ngIf=\"responsibility?.category_details_array[0]?.parent_category_name?.length\" class=\"within-part vx-d-flex vx-align-center vx-pr-3\">\r\n                                            <div class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\">Within</div>\r\n                                            <div class=\"within-value vx-fs-11 vx-paragraph-txt\" [appTooltip]=\"responsibility?.category_details_array[0]?.parent_category_name?.slice()?.reverse()?.join(' < ')\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">{{responsibility?.category_details_array[0]?.parent_category_name?.slice()?.reverse()?.join(' < ')}}</div>\r\n                                        </div>\r\n                                      </div>\r\n                                  </div>\r\n                                </li>\r\n                              </ul>\r\n                            </div>\r\n                        </app-popover>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </ng-container>\r\n        </div>\r\n        <app-floating-bar [selectedData]=\"(isValidObj) ? [selectedResponsibilityValues]:[]\" [displayElementKey]=\"'ReportName'\" (closeList)=\"back()\"  (closeEvent)=\"save($event)\" (deleteEvent)=\"deleteItem($event)\" [isDisabled]=\"!isValidObj\" ></app-floating-bar>\r\n    </div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@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/table-card/table-card.css\";::ng-deep .frequency-responsibility-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:32.5rem;bottom:0;left:0}::ng-deep .frequency-responsibility-list.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both}::ng-deep .frequency-responsibility-list-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-responsibility-list-head .arrow{cursor:pointer}::ng-deep .frequency-responsibility-list-body{background:#fff;height:calc(100vh - 2.75rem);padding:1.5rem .75rem 1.5rem 2rem}::ng-deep .frequency-responsibility-list-body app-pagination .wk-pagination-sec-ds{border-radius:0;padding:0 0 .5rem}::ng-deep .frequency-responsibility-list-body app-floating-bar .floating-bar{padding:0;position:relative;left:-1rem;width:calc(100% + 2rem)}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar{padding-left:0!important;padding-right:0!important}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar .userGroup-floating-bar-container .left .chip span{max-width:240px}::ng-deep .frequency-responsibility-list-search{position:relative}::ng-deep .frequency-responsibility-list-search input{height:2.75rem;line-height:1.5rem;padding:.75rem .75rem .75rem 2.5rem;outline:none;border:1px solid #7475763F;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .frequency-responsibility-list-search input::placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search i{position:absolute;left:1rem;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .frequency-responsibility-list-mid{height:calc(100vh - 17.5rem);overflow:auto}::ng-deep .frequency-responsibility-list-mid::-webkit-scrollbar-track{background-color:#fff}::ng-deep .frequency-responsibility-list-mid.with-pagination{height:calc(100vh - 19.5rem)}::ng-deep .frequency-responsibility-list-mid .table-header{background:#fff;position:sticky;top:0;z-index:1}::ng-deep .frequency-responsibility-list-mid .table-header .table-column{color:#161b2f!important;line-height:.75rem!important;min-height:1.875rem!important}::ng-deep .frequency-responsibility-list-mid .table-body{position:relative}::ng-deep .frequency-responsibility-list-mid .table-body .table-row{background:#fff;border-radius:.25rem;border:1px solid #f1f1f1;margin-bottom:.25rem}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial .sr-no,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial .sr-no{opacity:0}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial app-cs-radio,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial app-cs-radio{opacity:1}::ng-deep .frequency-responsibility-list-mid .table-row{display:flex;justify-content:space-between;position:relative}::ng-deep .frequency-responsibility-list-mid .table-row .table-column{color:#747576;min-height:2.5rem;position:relative;width:100%}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial{width:2rem;max-width:2rem;justify-content:center}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial .sr-no{width:1rem;background:#f8f8f8;writing-mode:vertical-lr;color:#747576;font-size:.625rem;font-weight:500;display:flex;height:2.5rem;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-radio{position:absolute;top:.75rem;left:.5rem;width:1rem;height:1rem;opacity:0;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-radio .radio-item{position:absolute}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility{width:calc(100% - 22rem);min-width:calc(100% - 22rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program{width:20rem;min-width:20rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program button.program-count{background:#1E5DD3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}@keyframes animate-right{0%{transform:translate(5px);opacity:0}to{transform:translate(0);opacity:1}}.action-list{width:220px}.action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#ffffff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.action-list ul.action-item{display:block}.action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.action-list ul.action-item li .avatar-card.within-con{display:block}.action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;overflow:hidden;background:#4681ef;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.action-list ul.action-item li .avatar-card .avatar img{width:100%}.action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#1c5bd1;cursor:pointer;margin-right:5px}.action-list ul.action-item li .avatar-card.no-image{display:block}.action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/header/header.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/button/button.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/popover/popover.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/table-card/table-card.css\");::ng-deep .frequency-responsibility-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:32.5rem;bottom:0;left:0}::ng-deep .frequency-responsibility-list.animate{-webkit-animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both;animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both}::ng-deep .frequency-responsibility-list-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-responsibility-list-head .arrow{cursor:pointer}::ng-deep .frequency-responsibility-list-body{background:#fff;height:calc(100vh - 2.75rem);padding:1.5rem .75rem 1.5rem 2rem}::ng-deep .frequency-responsibility-list-body app-pagination .wk-pagination-sec-ds{border-radius:0;padding:0 0 .5rem}::ng-deep .frequency-responsibility-list-body app-floating-bar .floating-bar{padding:0;position:relative;left:-1rem;width:calc(100% + 2rem)}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar{padding-left:0!important;padding-right:0!important}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar .userGroup-floating-bar-container .left .chip span{max-width:240px}::ng-deep .frequency-responsibility-list-search{position:relative}::ng-deep .frequency-responsibility-list-search input{height:2.75rem;line-height:1.5rem;padding:.75rem .75rem .75rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .frequency-responsibility-list-search input::-moz-placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search input:-ms-input-placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search input::placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search i{position:absolute;left:1rem;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .frequency-responsibility-list-mid{height:calc(100vh - 17.5rem);overflow:auto}::ng-deep .frequency-responsibility-list-mid::-webkit-scrollbar-track{background-color:#fff}::ng-deep .frequency-responsibility-list-mid.with-pagination{height:calc(100vh - 19.5rem)}::ng-deep .frequency-responsibility-list-mid .table-header{background:#fff;position:sticky;top:0;z-index:1}::ng-deep .frequency-responsibility-list-mid .table-header .table-column{color:#161b2f!important;line-height:.75rem!important;min-height:1.875rem!important}::ng-deep .frequency-responsibility-list-mid .table-body{position:relative}::ng-deep .frequency-responsibility-list-mid .table-body .table-row{background:#fff;border-radius:.25rem;border:1px solid #f1f1f1;margin-bottom:.25rem}::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial .sr-no,::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial .sr-no{opacity:0}::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial app-cs-radio,::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial app-cs-radio{opacity:1}::ng-deep .frequency-responsibility-list-mid .table-row{display:flex;justify-content:space-between;position:relative}::ng-deep .frequency-responsibility-list-mid .table-row .table-column{color:#747576;min-height:2.5rem;position:relative;width:100%}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial{width:2rem;max-width:2rem;justify-content:center}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial .sr-no{width:1rem;background:#f8f8f8;-ms-writing-mode:tb-lr;writing-mode:vertical-lr;color:#747576;font-size:.625rem;font-weight:500;display:flex;height:2.5rem;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-radio{position:absolute;top:.75rem;left:.5rem;width:1rem;height:1rem;opacity:0;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-radio .radio-item{position:absolute}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility{width:calc(100% - 22rem);min-width:calc(100% - 22rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program{width:20rem;min-width:20rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}@-webkit-keyframes animate-right{0%{transform:translateX(5px);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes animate-right{0%{transform:translateX(5px);opacity:0}to{transform:translateX(0);opacity:1}}.action-list{width:220px}.action-list ul{padding:0;margin:0;-webkit-animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.action-list ul.action-item{display:block}.action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.action-list ul.action-item li .avatar-card.within-con{display:block}.action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;overflow:hidden;background:#4681ef;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.action-list ul.action-item li .avatar-card .avatar img{width:100%}.action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;-moz-text-align-last:left;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#1c5bd1;cursor:pointer;margin-right:5px}.action-list ul.action-item li .avatar-card.no-image{display:block}.action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.action-list ul.action-item li:first-child{-webkit-animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(2){-webkit-animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(3){-webkit-animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(4){-webkit-animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(5){-webkit-animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(6){-webkit-animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(7){-webkit-animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(8){-webkit-animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(9){-webkit-animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(10){-webkit-animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@-webkit-keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@-webkit-keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}"]
             },] }
 ];
 FrequencyResponsibilityListComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency/frequency-top/frequency-top.component.js

@@ -85,7 +85,7 @@ FrequencyTopComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-top',
                 template: "<div *ngIf=\"mode !== 'policy'\" class=\"frequency-top\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">DUE DATE FREQUENCY:</div>\r\n    <div class=\"frequency-top-box vx-p-3 vx-d-flex vx-align-center\">\r\n        <div class=\"vx-fs-13 vx-paragraph-txt\">{{id === 0 || id === 1 || id === 5 ? 'Every' : 'Day'}}</div>\r\n        <input type=\"number\" [id]=\"'occurrence' + id\" [(ngModel)]=\"occurrenceFirst\" class=\"countNum\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\" (focusout) = \"enterValueFirst($event, 'occurrenceFirst')\" >\r\n        <div *ngIf=\"frequencyType === 0\" class=\"vx-fs-13 vx-paragraph-txt vx-mr-3\">{{ occurrenceFirst > 1 ? 'days' : 'day' }} by</div>\r\n        <div *ngIf=\"frequencyType === 1\" class=\"vx-fs-13 vx-paragraph-txt vx-mr-3\">{{ occurrenceFirst > 1 ? 'weeks' : 'week' }} by</div>\r\n        <div *ngIf=\"id !== 0 && id !== 1 && id !== 5\" class=\"vx-fs-13 vx-paragraph-txt vx-mr-3\">by</div>\r\n\r\n        <ng-container *ngIf=\"frequencyType === 2\">\r\n            <div class=\"vx-fs-13 vx-paragraph-txt\">{{ occurrenceFirst > 1 ? 'years' : 'year' }} on day</div>\r\n            <input class=\"countNum\" type=\"number\" [id]=\"'occurrence-day' + id\" [(ngModel)]=\"yearlyDay\" (focusout)=\"enterYearDay($event)\"  onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\"/>\r\n            <div class=\"vx-fs-13 vx-paragraph-txt vx-mr-3\">by</div>\r\n        </ng-container>\r\n            \r\n        <div class=\"time-picker-group vx-d-flex\">\r\n            <div class=\"time-field\">\r\n                <input class=\"input\" placeholder=\"11:59 PM\" readonly />\r\n                <div class=\"clock-icon vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-fs-12 vx-paragraph-txt\">&#xe955;</i></div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n\r\n\r\n<!-- For Policy -->\r\n\r\n<div *ngIf=\"mode === 'policy'\" class=\"top-part\">\r\n    <span>{{id === 0 || id === 1 || id === 5 ? 'Every' : 'Day'}}</span>\r\n    <input\r\n    type=\"number\"\r\n    [id]=\"'occurrence' + id\"\r\n    [(ngModel)]=\"occurrenceFirst\"\r\n    class=\"day-counter\"\r\n    onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\"\r\n    (focusout) = \"enterValueFirst($event, 'occurrenceFirst')\"\r\n    >\r\n\r\n    <span  *ngIf=\"frequencyType === 0\">  {{ occurrenceFirst > 1 ? 'days' : 'day' }} by </span>\r\n    <span  *ngIf=\"frequencyType === 1\">  {{ occurrenceFirst > 1 ? 'weeks' : 'week' }} by  </span>\r\n    <span *ngIf=\"id !== 0 && id !== 1 && id !== 5\">by</span>\r\n\r\n    <ng-container *ngIf=\"frequencyType === 2\">\r\n        <span> {{ occurrenceFirst > 1 ? 'years' : 'year' }} on day</span>\r\n        <input class=\"day-counter\" type=\"number\" [id]=\"'occurrence-day' + id\" [(ngModel)]=\"yearlyDay\" (focusout)=\"enterYearDay($event)\"  onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\"/>\r\n        <span>by</span>\r\n    </ng-container>\r\n    <div class=\"time-picker\">\r\n        <input type=\"text\" [id]=\"'time-picker-input-top'+id\" [(ngModel)]=\"inputTime\" readonly  placeholder=\"Select Time\">\r\n        <!-- <i class=\"icons\">&#xe955;</i> -->\r\n        <!-- <ngx-material-timepicker [id]=\"'time-picker-top'+id\" (timeChanged)=\"onTimeChanged($event)\" #dailyTime></ngx-material-timepicker> -->\r\n    </div>\r\n</div>\r\n\r\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-top-box{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-top-box input.countNum{-moz-appearance:textfield;border:none;border-bottom:1px solid #DBDBDB;color:#161b2f;display:inline-block;font-size:13px;text-align:center;width:2.75rem;padding:.125rem;margin:0 .5rem;outline:none}::ng-deep .frequency-top-box input.countNum::-webkit-inner-spin-button,::ng-deep .frequency-top-box input.countNum::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-top-box .time-picker-group{background:#fff;border-radius:.25rem;display:flex;position:relative}::ng-deep .frequency-top-box .time-picker-group input{background:transparent;border-radius:.25rem;border:1px solid #DBDBDB;color:#747576;font-size:13px;font-weight:400;width:6.25rem;padding:0 .75rem;margin:0;height:2rem;outline:none;position:relative;z-index:1}::ng-deep .frequency-top-box .time-picker-group input::placeholder{color:#747576}::ng-deep .frequency-top-box .time-picker-group .time-field{position:relative}::ng-deep .frequency-top-box .time-picker-group .time-field .clock-icon{height:2rem;width:.75rem;position:absolute;right:.75rem;top:0}.top-part{display:flex;justify-content:flex-start;padding:12px 20px;align-items:center}.top-part span{font-size:14px;color:#161b2f;width:auto;display:block;line-height:28px}.top-part .day-counter{-webkit-appearance:textfield;-moz-appearance:textfield;border:none;width:40px;margin:6px 8px 0;padding:0 4px;text-align:center;border-bottom:2px solid #dcdcdc;line-height:26px;color:#161b2f;font-weight:400;outline:none;font-size:14px}.top-part .day-counter::-webkit-outer-spin-button,.top-part .day-counter::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.top-part .time-picker{width:120px;margin-left:8px;position:relative}.top-part .time-picker input{color:#161b2f;font-weight:400;line-height:34px;border:1px solid #f1f1f1;border-radius:2px;height:36px;width:100%;outline:none;padding:0 28px 0 8px;cursor:pointer;font-size:14px}.top-part .time-picker i{display:flex;justify-content:center;align-items:center;height:36px;width:32px;position:absolute;right:0;top:0;color:#1e5dd3;font-size:16px;pointer-events:none}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/header/header.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/button/button.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/popover/popover.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");::ng-deep .frequency-top-box{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-top-box input.countNum{-moz-appearance:textfield;border:none;border-bottom:1px solid #dbdbdb;color:#161b2f;display:inline-block;font-size:13px;text-align:center;width:2.75rem;padding:.125rem;margin:0 .5rem;outline:none}::ng-deep .frequency-top-box input.countNum::-webkit-inner-spin-button,::ng-deep .frequency-top-box input.countNum::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-top-box .time-picker-group{background:#fff;border-radius:.25rem;display:flex;position:relative}::ng-deep .frequency-top-box .time-picker-group input{background:transparent;border-radius:.25rem;border:1px solid #dbdbdb;color:#747576;font-size:13px;font-weight:400;width:6.25rem;padding:0 .75rem;margin:0;height:2rem;outline:none;position:relative;z-index:1}::ng-deep .frequency-top-box .time-picker-group input::-moz-placeholder{color:#747576}::ng-deep .frequency-top-box .time-picker-group input:-ms-input-placeholder{color:#747576}::ng-deep .frequency-top-box .time-picker-group input::placeholder{color:#747576}::ng-deep .frequency-top-box .time-picker-group .time-field{position:relative}::ng-deep .frequency-top-box .time-picker-group .time-field .clock-icon{height:2rem;width:.75rem;position:absolute;right:.75rem;top:0}.top-part{display:flex;justify-content:flex-start;padding:12px 20px;align-items:center}.top-part span{font-size:14px;color:#161b2f;width:auto;display:block;line-height:28px}.top-part .day-counter{-webkit-appearance:textfield;-moz-appearance:textfield;width:40px;margin:6px 8px 0;padding:0 4px;text-align:center;border:none;border-bottom:2px solid #dcdcdc;line-height:26px;color:#161b2f;font-weight:400;outline:none;font-size:14px}.top-part .day-counter::-webkit-inner-spin-button,.top-part .day-counter::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.top-part .time-picker{width:120px;margin-left:8px;position:relative}.top-part .time-picker input{color:#161b2f;font-weight:400;line-height:34px;border:1px solid #f1f1f1;border-radius:2px;height:36px;width:100%;outline:none;padding:0 28px 0 8px;cursor:pointer;font-size:14px}.top-part .time-picker i{display:flex;justify-content:center;align-items:center;height:36px;width:32px;position:absolute;right:0;top:0;color:#1e5dd3;font-size:16px;pointer-events:none}"]
             },] }
 ];
 FrequencyTopComponent.ctorParameters = () => [];

package/esm2015/lib/sharedComponents/frequency/frequency-weekly/frequency-weekly.component.js

@@ -165,7 +165,7 @@ FrequencyWeeklyComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-weekly',
                 template: "<!-- <p>frequency-weekly works!</p> -->\r\n<div class=\"frequency-weekly\">\r\n    <app-frequency-top\r\n        [id]=\"1\"\r\n        [inputTime]=\"weeklyInterval\"\r\n        [occurrenceFirst]=\"weeklyInput\"\r\n        [frequencyType]=\"1\"\r\n        (timeChanged)=\"onTimeChanged($event)\"\r\n        (valueChangedFirst)=\"valueChangedFirst($event)\"\r\n        [mode]=\"mode\"\r\n    ></app-frequency-top>\r\n    <app-frequency-checkbox-list\r\n        [id]=\"1\"\r\n        [listArray]=\"dayArray\"\r\n        [selectedIndex]=\"selectedWeekly\"\r\n        (selectedCheckbox)=\"onDaySelected($event)\"\r\n        [mode]=\"mode\"\r\n    ></app-frequency-checkbox-list>\r\n    <app-frequency-due-date\r\n        [id] = '1'\r\n        [mode]=\"mode\"\r\n        [pageName]=\"'weekly'\"\r\n        [deactivateValue]=\"weeklyDeactivatedValue\"\r\n        [isDeactivated]=\"true\"\r\n        [completedValue]=\"weeklyWindow\"\r\n        [notCompletedValue]=\"weeklyFailed\"\r\n        (valueChange)=\"onValueChange($event)\"\r\n        [mode]=\"mode\"\r\n    ></app-frequency-due-date>\r\n    <app-frequency-lifecycle *ngIf=\"mode=='responsibility'\"\r\n        [id]=\"1\"\r\n        [startDate]=\"weeklyLifeCycleStart\"\r\n        [endDate]=\"weeklyLifeCycleEndTime\"\r\n        [occurrance]=\"weeklyLifecycleOccurance\"\r\n        [selectedLifecycleType]=\"weeklySeletedLifecycleType\"\r\n        (selectedOccurance)=\"lifecycleChange($event)\"\r\n    ></app-frequency-lifecycle>\r\n</div>",
-                styles: ["::ng-deep .frequency-weekly{position:relative}@media screen and (max-width: 1366px){::ng-deep .frequency-weekly app-frequency-checkbox-list .frequency-checkbox .frequency-checkbox-item{padding:.625rem!important}}\n"]
+                styles: ["::ng-deep .frequency-weekly{position:relative}@media screen and (max-width:1366px){::ng-deep .frequency-weekly app-frequency-checkbox-list .frequency-checkbox .frequency-checkbox-item{padding:.625rem!important}}"]
             },] }
 ];
 FrequencyWeeklyComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-annual/frequency-dialog-annual.component.js

@@ -195,7 +195,7 @@ FrequencyDialogAnnualComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-annual',
                 template: "<!-- <div class=\"frequency-dialog-annual\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-annual-item vx-mb-5\">\r\n        <app-frequency-dialog-top></app-frequency-dialog-top>\r\n        <app-frequency-dialog-radio-list></app-frequency-dialog-radio-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-annual-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date></app-frequency-dialog-due-date>\r\n    </div>\r\n</div> -->\r\n\r\n\r\n<div class=\"frequency-dialog-annual\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-annual-item vx-mb-5\">\r\n        <app-frequency-dialog-top\r\n            [id]=\"5\"\r\n            [inputTime]=\"yearlyInterval\"\r\n            [occurrenceFirst]=\"yearlyInput\"\r\n            [yearlyDay]=\"yearlyDay\"\r\n            [frequencyType]=\"2\"\r\n            (timeChanged)=\"onTimeChanged($event)\"\r\n            (valueChangedFirst)=\"valueChangedFirst($event)\"\r\n            (yearlyDateChanged)=\"dateChange($event)\">\r\n        </app-frequency-dialog-top>\r\n        <app-frequency-dialog-radio-list\r\n            [radioList]=\"monthList\" \r\n            [selectedIndex]=\"yearlySelected\" \r\n            (selectedRadio)=\"selectedMonth($event)\"\r\n            [name]=\"'annual'\">\r\n        </app-frequency-dialog-radio-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-annual-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date\r\n            [pageName]=\"'yearly'\"\r\n            [mode]=\"mode\"\r\n            [id]=\"5\"\r\n            [completedValue]=\"yearlyWindow\"\r\n            (valueChange)=\"onValueChange($event)\">\r\n        </app-frequency-dialog-due-date>\r\n    </div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-annual-item{border-radius:.25rem;border:1px solid #f1f1f1}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-annual-item{border-radius:.25rem;border:1px solid #f1f1f1}"]
             },] }
 ];
 FrequencyDialogAnnualComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-biannual/frequency-dialog-biannual.component.js

@@ -172,7 +172,7 @@ FrequencyDialogBiannualComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-biannual',
                 template: "<!-- <div class=\"frequency-dialog-biannual\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-biannual-item vx-mb-5\">\r\n        <app-frequency-dialog-top></app-frequency-dialog-top>\r\n        <app-frequency-dialog-checkbox-list></app-frequency-dialog-checkbox-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-biannual-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date></app-frequency-dialog-due-date>\r\n    </div>\r\n</div> -->\r\n<div class=\"frequency-dialog-biannual\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-biannual-item vx-mb-5\">\r\n        <app-frequency-dialog-top\r\n            [id]=\"4\"\r\n            [inputTime]=\"biannualInterval\"\r\n            [occurrenceFirst]=\"biannualInput\"\r\n            [frequencyType]=\"4\"\r\n            (timeChanged)=\"onTimeChanged($event)\"\r\n            (valueChangedFirst)=\"valueChangedFirst($event)\"\r\n        ></app-frequency-dialog-top>\r\n        <app-frequency-dialog-checkbox-list \r\n            [id]=\"4\"\r\n            [listArray]=\"monthNameArray\"\r\n            [selectedIndex]=\"biannualSelected\"\r\n            (selectedCheckbox)=\"onMonthSelected($event)\">\r\n        </app-frequency-dialog-checkbox-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-biannual-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date\r\n            [pageName]=\"'biannual'\"\r\n            [mode]=\"mode\"\r\n            [id]=\"4\"\r\n            [completedValue]=\"biannualWindow\"\r\n            (valueChange)=\"onValueChange($event)\"\r\n        ></app-frequency-dialog-due-date>\r\n    </div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-biannual-item{border-radius:.25rem;border:1px solid #f1f1f1}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-biannual-item{border-radius:.25rem;border:1px solid #f1f1f1}"]
             },] }
 ];
 FrequencyDialogBiannualComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-checkbox-list/frequency-dialog-checkbox-list.component.js

@@ -13,7 +13,7 @@ FrequencyDialogCheckboxListComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-checkbox-list',
                 template: "<div class=\"frequency-dialog-checkbox-list vx-d-flex\" [class.week]=\"id === 1\" [class.vx-align-center]=\"id === 1\" [class.month]=\"id === 2 || id === 4\" [class.vx-flex-wrap]=\"id === 2 || id === 4\">\r\n    <!-- <div class=\"frequency-dialog-checkbox-list vx-d-flex vx-align-center week\"> -->\r\n    <!-- <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">Monday</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">Tuesday</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">Wednesday</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">Thursday</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">Friday</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">Saturday</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">Sunday</div></app-cs-checkbox> -->\r\n\r\n    <app-cs-checkbox \r\n        *ngFor=\"let eachList of listArray; let i = index;\"\r\n        [id]=\"i\" [value]=\"i\" [ngValue]=\"selectedIndex.includes(i)\" \r\n        (ngValueChange)=\"selectedCheckbox.emit({checked:$event, index:i})\"\r\n        [disabled]=\"id === 4 && selectedIndex.length == 2 && !selectedIndex.includes(i)\"\r\n        >\r\n        <div class=\"vx-fs-12 vx-label-txt\">{{eachList}}</div>\r\n    </app-cs-checkbox>\r\n</div>\r\n\r\n<div *ngIf=\"false\" class=\"frequency-dialog-checkbox-list vx-d-flex vx-flex-wrap month\">\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">January</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">February</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">March</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">April</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">May</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">June</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">June</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">August</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">September</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">October</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">November</div></app-cs-checkbox>\r\n    <app-cs-checkbox><div class=\"vx-fs-12 vx-label-txt\">December</div></app-cs-checkbox>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-checkbox-list{border-top:1px solid #f1f1f1}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox{border-right:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox:last-of-type{border-right:none}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item{padding-left:1.5rem!important;position:relative;top:-6px}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item .checkbox,::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item .checkmark{position:absolute!important;top:0;left:0}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item .value{max-width:100%!important;margin:0!important}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox{border-right:1px solid #f1f1f1;border-bottom:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem;width:16.66%}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(6){border-right:none}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(7),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(8),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(9),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(10),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(11),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(12){border-bottom:none}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(12){border-right:none}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item{padding-left:1.5rem!important;position:relative;top:-6px}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item .checkbox,::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item .checkmark{position:absolute!important;top:0;left:0}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item .value{max-width:100%!important;margin:0!important}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-checkbox-list{border-top:1px solid #f1f1f1}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox{border-right:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox:last-of-type{border-right:none}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item{padding-left:1.5rem!important;position:relative;top:-6px}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item .checkbox,::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item .checkmark{position:absolute!important;top:0;left:0}::ng-deep .frequency-dialog-checkbox-list.week app-cs-checkbox .checkbox-item .value{max-width:100%!important;margin:0!important}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox{border-right:1px solid #f1f1f1;border-bottom:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem;width:16.66%}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(6){border-right:none}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(7),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(8),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(9),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(10),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(11),::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(12){border-bottom:none}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox:nth-child(12){border-right:none}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item{padding-left:1.5rem!important;position:relative;top:-6px}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item .checkbox,::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item .checkmark{position:absolute!important;top:0;left:0}::ng-deep .frequency-dialog-checkbox-list.month app-cs-checkbox .checkbox-item .value{max-width:100%!important;margin:0!important}"]
             },] }
 ];
 FrequencyDialogCheckboxListComponent.ctorParameters = () => [];

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-container/frequency-dialog-container.component.js

@@ -271,7 +271,7 @@ FrequencyDialogContainerComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-container',
                 template: "<div class=\"frequency-dialog\">\r\n    <div class=\"frequency-dialog-head vx-pl-3 vx-pr-3 vx-d-flex vx-align-center\">\r\n        <div class=\"frequency-dialog-title vx-fs-14 vx-fw-500 vx-label-txt\">Set a Reassessment Frequency</div>\r\n    </div>\r\n    <div class=\"frequency-dialog-body\">\r\n        <div class=\"frequency-dialog-tab vx-mb-3 vx-d-flex\">\r\n            <button (click)=\"switchTab('weekly')\" class=\"tab-btn vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-lh-6\" [class.active]=\"frequencyTab === 'weekly'\">WEEKLY</button>\r\n            <button (click)=\"switchTab('monthly')\" class=\"tab-btn vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-lh-6\" [class.active]=\"frequencyTab === 'monthly'\">MONTHLY</button>\r\n            <button (click)=\"switchTab('quarterly')\" class=\"tab-btn vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-lh-6\" [class.active]=\"frequencyTab === 'quarterly'\">QUARTERLY</button>\r\n            <button (click)=\"switchTab('biannual')\" class=\"tab-btn vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-lh-6\" [class.active]=\"frequencyTab === 'biannual'\">BIANNUAL</button>\r\n            <button (click)=\"switchTab('annual')\" class=\"tab-btn vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-lh-6\" [class.active]=\"frequencyTab === 'annual'\">ANNUAL</button>\r\n            <button (click)=\"switchTab('oneTime')\" class=\"tab-btn vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-lh-6\" [class.active]=\"frequencyTab === 'oneTime'\">ONE TIME</button>\r\n        </div>\r\n\r\n        <div class=\"frequency-dialog-container vx-p-4\">\r\n            <!-- <app-frequency-dialog-weekly *ngIf=\"frequencyTab === 'WEEKLY'\"></app-frequency-dialog-weekly> -->\r\n            <app-frequency-dialog-weekly *ngIf=\"frequencyTab === 'weekly'\"\r\n                [mode]=\"mode\"\r\n                (frequencyDetails)=\"onFrequencySelected($event)\"\r\n                [frequencyData]=\"frequencyDetails\"\r\n            ></app-frequency-dialog-weekly>\r\n            <!-- <app-frequency-dialog-monthly *ngIf=\"frequencyTab === 'MONTHLY'\"></app-frequency-dialog-monthly> -->\r\n            <app-frequency-dialog-monthly *ngIf=\"frequencyTab === 'monthly'\"\r\n                [mode]=\"mode\"\r\n                (frequencyDetails)=\"onFrequencySelected($event)\"\r\n                [frequencyData]=\"frequencyDetails\">\r\n            </app-frequency-dialog-monthly>\r\n            <!-- <app-frequency-dialog-quarterly *ngIf=\"frequencyTab === 'QUARTERLY'\"></app-frequency-dialog-quarterly>\r\n            <app-frequency-dialog-biannual *ngIf=\"frequencyTab === 'BIANNUAL'\"></app-frequency-dialog-biannual>\r\n            <app-frequency-dialog-annual *ngIf=\"frequencyTab === 'ANNUAL'\"></app-frequency-dialog-annual>\r\n            <app-frequency-dialog-one-time *ngIf=\"frequencyTab === 'ONETIME'\"></app-frequency-dialog-one-time> -->\r\n            <app-frequency-dialog-quarterly \r\n                *ngIf=\"frequencyTab === 'quarterly'\"\r\n                [mode]=\"mode\"\r\n                (frequencyDetails)=\"onFrequencySelected($event)\"\r\n                [frequencyData]=\"frequencyDetails\">\r\n            </app-frequency-dialog-quarterly>\r\n            <app-frequency-dialog-biannual \r\n                *ngIf=\"frequencyTab === 'biannual'\"\r\n                [mode]=\"mode\"\r\n                (frequencyDetails)=\"onFrequencySelected($event)\"\r\n                [frequencyData]=\"frequencyDetails\">\r\n            </app-frequency-dialog-biannual>\r\n            <app-frequency-dialog-annual \r\n                *ngIf=\"frequencyTab === 'annual'\"\r\n                [mode]=\"mode\"\r\n                (frequencyDetails)=\"onFrequencySelected($event)\"\r\n                [frequencyData]=\"frequencyDetails\">\r\n            </app-frequency-dialog-annual>\r\n            <app-frequency-dialog-one-time \r\n                *ngIf=\"frequencyTab === 'oneTime'\"\r\n                [mode]=\"mode\"\r\n                (frequencyDetails)=\"onFrequencySelected($event)\"\r\n                [frequencyData]=\"frequencyDetails\">\r\n            </app-frequency-dialog-one-time>\r\n        </div>\r\n    </div>\r\n    <div class=\"frequency-dialog-footer vx-d-flex vx-align-center vx-justify-between vx-pl-4 vx-pr-3 vx-ml-4 vx-mr-4\">\r\n        <div class=\"vx-fs-12 vx-paragraph-txt\">You have selected <span class=\"vx-fw-500 vx-label-txt\">{{currentTabName}}</span> frequency.</div>\r\n        <div class=\"vx-d-flex vx-align-center\">\r\n            <button class=\"cancel-btn vx-fs-11 vx-fw-500 vx-txt-red vx-tt-uppercase vx-p-0 vx-pl-2 vx-pr-2 vx-m-0 vx-d-flex vx-align-center vx-lh-7\" (click)=\"close()\">CANCEL</button>\r\n            <button class=\"next-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-pl-2 vx-pr-2 vx-m-0 vx-ml-3 vx-d-flex vx-align-center vx-lh-7\" [class.disabled]=\"isNextDisabled\" (click)=\"save()\">NEXT <i class=\"icons vx-fs-14 vx-ml-2\">&#xe91e;</i></button>\r\n        </div>\r\n    </div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog{border-top:3px solid #1E5DD3;position:fixed;top:0;right:31.25rem;bottom:0;left:0;z-index:11}::ng-deep .frequency-dialog-head{background:#FBFBFB;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-dialog-body{padding:1rem!important;height:calc(100vh - 7.75rem);overflow:auto}::ng-deep .frequency-dialog-tab{border-bottom:1px solid #f1f1f1}::ng-deep .frequency-dialog-tab button.tab-btn{background:transparent;border-radius:0;border:none;border-bottom:.125rem solid transparent;margin-right:1.75rem!important}::ng-deep .frequency-dialog-tab button.active.tab-btn{color:#1e5dd3;border-color:#1e5dd3}::ng-deep .frequency-dialog-footer{background:#fff;border-radius:.25rem;box-shadow:0 6px 12px #4681ef40;height:3rem}::ng-deep .frequency-dialog-footer button{border-radius:.125rem;border:none}::ng-deep .frequency-dialog-footer button.cancel-btn{background:transparent}::ng-deep .frequency-dialog-footer button.next-btn{background:#1E5DD3}::ng-deep .frequency-dialog-footer button.disabled{background:#f1f1f1!important;color:#747576!important;pointer-events:none}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog{border-top:3px solid #1e5dd3;position:fixed;top:0;right:31.25rem;bottom:0;left:0;z-index:11}::ng-deep .frequency-dialog-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-dialog-body{padding:1rem!important;height:calc(100vh - 7.75rem);overflow:auto}::ng-deep .frequency-dialog-tab{border-bottom:1px solid #f1f1f1}::ng-deep .frequency-dialog-tab button.tab-btn{background:transparent;border-radius:0;border:none;border-bottom:.125rem solid transparent;margin-right:1.75rem!important}::ng-deep .frequency-dialog-tab button.active.tab-btn{color:#1e5dd3;border-color:#1e5dd3}::ng-deep .frequency-dialog-footer{background:#fff;border-radius:.25rem;box-shadow:0 6px 12px #4681ef40;height:3rem}::ng-deep .frequency-dialog-footer button{border-radius:.125rem;border:none}::ng-deep .frequency-dialog-footer button.cancel-btn{background:transparent}::ng-deep .frequency-dialog-footer button.next-btn{background:#1e5dd3}::ng-deep .frequency-dialog-footer button.disabled{background:#f1f1f1!important;color:#747576!important;pointer-events:none}"]
             },] }
 ];
 FrequencyDialogContainerComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-due-date/frequency-dialog-due-date.component.js

@@ -46,7 +46,7 @@ FrequencyDialogDueDateComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-due-date',
                 template: "<!-- <div class=\"frequency-dialog-due-date-item vx-p-3 vx-d-flex vx-align-center\">\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-mr-2\">VComply will send email reminders every</div>\r\n    <input type=\"number\" value=\"5\" />\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-ml-2\">days to <span class=\"vx-fw-500\">complete</span> the risk assessment if it is not done.</div>\r\n</div>\r\n<div class=\"frequency-dialog-due-date-item vx-p-3 vx-d-flex vx-align-center\">\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-mr-2\">VComply will send email reminders every</div>\r\n    <input type=\"number\" value=\"10\" />\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-ml-2\">days to <span class=\"vx-fw-500\">not complete</span> the risk assessment if it is not done.</div>\r\n</div> -->\r\n\r\n<div class=\"frequency-dialog-due-date-item vx-p-3 vx-d-flex vx-align-center\">\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-mr-2\">VComply will send an email reminder</div>\r\n    <input [id]=\"'complete-' + id\" \r\n        type=\"number\" \r\n        [(ngModel)]=\"completedValue\" \r\n        (change)=\"onValueChange($event, 'completed')\"\r\n        onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\" />\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-ml-2\">{{ completedValue < 2 ? 'day' : 'days' }} before the risk assessment due date if it is not done.</div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-due-date-item{border-top:1px solid #f1f1f1;height:3.5rem}::ng-deep .frequency-dialog-due-date-item:first-of-type,::ng-deep .frequency-dialog-due-date-item:only-child{border-top:none}::ng-deep .frequency-dialog-due-date-item input[type=number]{background:transparent;border-radius:0;border:none;border-bottom:1px solid #dbdbdb;color:#161b2f;font-size:13px;height:1.5rem;width:3rem;text-align:center;outline:none}::ng-deep .frequency-dialog-due-date-item input[type=number]::-webkit-outer-spin-button,::ng-deep .frequency-dialog-due-date-item input[type=number]::-webkit-inner-spin-button{-moz-appearance:none;-webkit-appearance:none;margin:0}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-due-date-item{border-top:1px solid #f1f1f1;height:3.5rem}::ng-deep .frequency-dialog-due-date-item:first-of-type,::ng-deep .frequency-dialog-due-date-item:only-child{border-top:none}::ng-deep .frequency-dialog-due-date-item input[type=number]{background:transparent;border-radius:0;border:none;border-bottom:1px solid #dbdbdb;color:#161b2f;font-size:13px;height:1.5rem;width:3rem;text-align:center;outline:none}::ng-deep .frequency-dialog-due-date-item input[type=number]::-webkit-inner-spin-button,::ng-deep .frequency-dialog-due-date-item input[type=number]::-webkit-outer-spin-button{-moz-appearance:none;-webkit-appearance:none;margin:0}"]
             },] }
 ];
 FrequencyDialogDueDateComponent.ctorParameters = () => [];

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-monthly/frequency-dialog-monthly.component.js

@@ -182,7 +182,7 @@ FrequencyDialogMonthlyComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-monthly',
                 template: "<!-- <div class=\"frequency-dialog-monthly\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-monthly-item vx-mb-5\">\r\n        <app-frequency-dialog-top></app-frequency-dialog-top>\r\n        <app-frequency-dialog-checkbox-list></app-frequency-dialog-checkbox-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-monthly-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date></app-frequency-dialog-due-date>\r\n    </div>\r\n</div> -->\r\n\r\n<div class=\"frequency-dialog-monthly\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-monthly-item vx-mb-5\">\r\n        <app-frequency-dialog-top\r\n            [id]=\"2\"\r\n            [inputTime]=\"monthlyInterval\"\r\n            [occurrenceFirst]=\"monthlyInput\"\r\n            [frequencyType]=\"3\"\r\n            (timeChanged)=\"onTimeChanged($event)\"\r\n            (valueChangedFirst)=\"valueChangedFirst($event)\">\r\n        </app-frequency-dialog-top>\r\n        <app-frequency-dialog-checkbox-list\r\n            [id]=\"2\"\r\n            [listArray]=\"monthNameArray\"\r\n            [selectedIndex]=\"selectedMonthly\"\r\n            (selectedCheckbox)=\"onMonthSelected($event)\">\r\n        </app-frequency-dialog-checkbox-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-monthly-item vx-mb-5\">\r\n        <!-- <app-frequency-dialog-due-date></app-frequency-dialog-due-date> -->\r\n        <app-frequency-dialog-due-date \r\n            [id] = '2'\r\n            [mode]=\"mode\"\r\n            [pageName]=\"'monthly'\"\r\n            [deactivateValue]=\"monthlyDeactivatedValue\"\r\n            [isDeactivated]=\"true\"\r\n            [completedValue]=\"monthlyWindow\"\r\n            (valueChange)=\"onValueChange($event)\"\r\n        ></app-frequency-dialog-due-date>\r\n    </div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-monthly-item{border-radius:.25rem;border:1px solid #f1f1f1}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-monthly-item{border-radius:.25rem;border:1px solid #f1f1f1}"]
             },] }
 ];
 FrequencyDialogMonthlyComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-one-time/frequency-dialog-one-time.component.js

@@ -122,7 +122,7 @@ FrequencyDialogOneTimeComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-one-time',
                 template: "<!-- <div class=\"frequency-dialog-one-time\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-one-time-item vx-p-3 vx-d-flex vx-align-center vx-justify-between vx-mb-5\">\r\n        <div class=\"date-picker\">\r\n            <i class=\"icons calendar-icon vx-fs-14 vx-txt-blue\">&#xe92d;</i>\r\n            <input class=\"datePicker\" (click)=\"openDatePicker()\" placeholder=\"Select Date\">\r\n            <dp-date-picker #datePicker placeholder='Select Date' (click)=\"openDatePicker()\" (click)=\"closeDatepicker()\"></dp-date-picker>\r\n            <div class=\"overlay\" (click)=\"closeDatepicker()\" *ngIf=\"datepickerOverlay\"></div>\r\n        </div>\r\n        <div class=\"time-picker vx-d-flex vx-align-center vx-justify-end vx-pr-3\">\r\n            <input type=\"text\" readonly aria-label=\"12hr format\" [ngxTimepicker]=\"dailyTime\" placeholder=\"11:59 PM\">\r\n            <i class=\"icons vx-fs-12 vx-txt-blue\">&#xe955;</i>\r\n            <ngx-material-timepicker #dailyTime></ngx-material-timepicker>\r\n        </div>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-one-time-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date></app-frequency-dialog-due-date>\r\n    </div>\r\n</div> -->\r\n\r\n<div class=\"frequency-dialog-one-time\" *ngIf=\"true\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-one-time-item vx-p-3 vx-d-flex vx-align-center vx-justify-between vx-mb-5\">\r\n        <div class=\"date-picker\">\r\n            <i class=\"icons calendar-icon vx-fs-14 vx-txt-blue\">&#xe92d;</i>\r\n            <!-- <input class=\"datePicker\" (click)=\"openDatePicker()\" placeholder=\"Select Date\"> -->\r\n            <input class=\"datePicker\" type=\"text\" [value]=\"todayDate | date: 'dd MMM yyyy'\" [placeholder]=\"todayDate | date: 'dd MMM yyyy'\" (click)=\"openDatePicker()\" readonly>\r\n            <!-- <dp-date-picker #datePicker placeholder='Select Date' (click)=\"openDatePicker()\" (click)=\"closeDatepicker()\"></dp-date-picker> -->\r\n            <dp-date-picker\r\n                #datePicker\r\n                [id]=\"'start-date-' + 6\"\r\n                [placeholder]=\"todayDate | date: 'dd MMM yyyy'\"\r\n                [(ngModel)]=\"selectedDate\"\r\n                [config]=\"dateConfig\"\r\n                (onSelect)=\"openDatePicker();dateChange($event); showDateError = false; datepickerOverlay = false\">\r\n            </dp-date-picker>\r\n            <div class=\"overlay\" (click)=\"closeDatepicker()\" *ngIf=\"datepickerOverlay\"></div>\r\n        </div>\r\n        <div class=\"time-picker vx-d-flex vx-align-center vx-justify-end vx-pr-3\">\r\n            <!-- <input type=\"text\" readonly aria-label=\"12hr format\" [ngxTimepicker]=\"dailyTime\" placeholder=\"11:59 PM\"> -->\r\n            <input type=\"text\" readonly aria-label=\"12hr format\" [(ngModel)]=\"oneTimeStartTime\"  placeholder=\"Select Time\">\r\n            <!-- <i class=\"icons vx-fs-12 vx-txt-blue\">&#xe955;</i> -->\r\n            <ngx-material-timepicker [hoursOnly]=\"true\" (timeChanged)=\"onTimeChanged($event)\" #dailyTime></ngx-material-timepicker>\r\n        </div>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-one-time-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date\r\n            [id] = '6'\r\n            [mode]=\"mode\"\r\n            [pageName]=\"'one-time'\"\r\n            [isDeactivated]=\"false\"\r\n            [completedValue]=\"oneTimeWindow\"\r\n            (valueChange)=\"onValueChange($event)\"\r\n        ></app-frequency-dialog-due-date>\r\n    </div>\r\n</div>\r\n",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-one-time-item{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-dialog-one-time-item .date-picker{position:relative;width:calc(100% - 6.75rem)}::ng-deep .frequency-dialog-one-time-item .date-picker .calendar-icon{position:absolute;left:.75rem;top:9px;pointer-events:none;z-index:1}::ng-deep .frequency-dialog-one-time-item .date-picker input{border-radius:.25rem;border:1px solid #dbdbdb;color:#161b2f;font-size:13px;font-weight:400;padding:0 .5rem 0 2.25rem;height:2rem;width:100%;cursor:pointer;outline:none}::ng-deep .frequency-dialog-one-time-item .date-picker input::placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .time-picker{border-radius:.25rem;border:1px solid #dbdbdb;height:2rem;width:6.25rem;position:relative}::ng-deep .frequency-dialog-one-time-item .time-picker input{background:transparent;border-radius:0;border:none;color:#161b2f;font-size:13px;margin:0!important;padding:0 0 0 .75rem;position:absolute;top:0;left:0;height:100%;width:100%;cursor:pointer}::ng-deep .frequency-dialog-one-time-item .time-picker input::placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .time-picker input:focus{outline:none}::ng-deep dp-date-picker{width:100%;position:fixed!important;z-index:14;top:-40px;left:0}::ng-deep dp-date-picker input{width:100%;border:none;opacity:0;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:#000000;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;top:0!important;right:0!important;bottom:0!important;left:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:rgba(0,0,0,.3)}@keyframes slide-bottom{0%{transform:translateY(-100px)}to{transform:translateY(0)}}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-one-time-item{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-dialog-one-time-item .date-picker{position:relative;width:calc(100% - 6.75rem)}::ng-deep .frequency-dialog-one-time-item .date-picker .calendar-icon{position:absolute;left:.75rem;top:9px;pointer-events:none;z-index:1}::ng-deep .frequency-dialog-one-time-item .date-picker input{border-radius:.25rem;border:1px solid #dbdbdb;color:#161b2f;font-size:13px;font-weight:400;padding:0 .5rem 0 2.25rem;height:2rem;width:100%;cursor:pointer;outline:none}::ng-deep .frequency-dialog-one-time-item .date-picker input::-moz-placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .date-picker input:-ms-input-placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .date-picker input::placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .time-picker{border-radius:.25rem;border:1px solid #dbdbdb;height:2rem;width:6.25rem;position:relative}::ng-deep .frequency-dialog-one-time-item .time-picker input{background:transparent;border-radius:0;border:none;color:#161b2f;font-size:13px;margin:0!important;padding:0 0 0 .75rem;position:absolute;top:0;left:0;height:100%;width:100%;cursor:pointer}::ng-deep .frequency-dialog-one-time-item .time-picker input::-moz-placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .time-picker input:-ms-input-placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .time-picker input::placeholder{color:#161b2f}::ng-deep .frequency-dialog-one-time-item .time-picker input:focus{outline:none}::ng-deep dp-date-picker{width:100%;position:fixed!important;z-index:14;top:-40px;left:0}::ng-deep dp-date-picker input{width:100%;border:none;opacity:0;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;-webkit-animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;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-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-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{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-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-day-calendar button.dp-current-location-btn: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-month-calendar button.dp-calendar-nav-right:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn: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-calendar-week,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays{display:flex;justify-content:space-around}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,::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-calendar-week .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .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-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays 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-calendar-week button:hover,::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-calendar-week button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,::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-calendar-week button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected{background:#1e5dd3}::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-day-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays 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-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-left 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;top:0!important;right:0!important;bottom:0!important;left:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:rgba(0,0,0,.3)}@-webkit-keyframes slide-bottom{0%{transform:translateY(-100px)}to{transform:translateY(0)}}@keyframes slide-bottom{0%{transform:translateY(-100px)}to{transform:translateY(0)}}"]
             },] }
 ];
 FrequencyDialogOneTimeComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-quarterly/frequency-dialog-quarterly.component.js

@@ -166,7 +166,7 @@ FrequencyDialogQuarterlyComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-quarterly',
                 template: "<!-- <div class=\"frequency-dialog-quarterly\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-quarterly-item vx-mb-5\">\r\n        <app-frequency-dialog-top></app-frequency-dialog-top>\r\n        <app-frequency-dialog-radio-list></app-frequency-dialog-radio-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-quarterly-item vx-mb-5\">\r\n        <app-frequency-dialog-due-date></app-frequency-dialog-due-date>\r\n    </div>\r\n</div> -->\r\n\r\n<div class=\"frequency-dialog-quarterly\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-quarterly-item vx-mb-5\">\r\n        <!-- <app-frequency-dialog-top></app-frequency-dialog-top> -->\r\n        <app-frequency-dialog-top\r\n            [id]=\"3\"\r\n            [inputTime]=\"quarterlyInterval\"\r\n            [occurrenceFirst]=\"quarterlyInput\"\r\n            [frequencyType]=\"3\"\r\n            (timeChanged)=\"onTimeChanged($event)\"\r\n            (valueChangedFirst)=\"valueChangedFirst($event)\"\r\n        ></app-frequency-dialog-top>\r\n        <app-frequency-dialog-radio-list></app-frequency-dialog-radio-list>\r\n        <app-frequency-dialog-radio-list\r\n            [radioList]=\"quarterlyArray\" \r\n            [selectedIndex]=\"selectedQuarterly\" \r\n            (selectedRadio)=\"selectedMonth($event)\"\r\n            [name]=\"'quarter'\">\r\n        </app-frequency-dialog-radio-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-quarterly-item vx-mb-5\">\r\n        <!-- <app-frequency-dialog-due-date></app-frequency-dialog-due-date> -->\r\n        <app-frequency-dialog-due-date\r\n            [id] = '3'\r\n            [mode]=\"mode\"\r\n            [pageName]=\"'quarterly'\"\r\n            [isDeactivated]=\"false\"\r\n            [completedValue]=\"quarterlyWindow\"\r\n            (valueChange)=\"onValueChange($event)\"\r\n        ></app-frequency-dialog-due-date>\r\n    </div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-quarterly-item{border-radius:.25rem;border:1px solid #f1f1f1}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-quarterly-item{border-radius:.25rem;border:1px solid #f1f1f1}"]
             },] }
 ];
 FrequencyDialogQuarterlyComponent.ctorParameters = () => [

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-radio-list/frequency-dialog-radio-list.component.js

@@ -18,7 +18,7 @@ FrequencyDialogRadioListComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-radio-list',
                 template: "<!-- <div class=\"frequency-dialog-radio-list vx-d-flex vx-align-center quarterly\">\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">January, April, July, October</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">February, May, August, November</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">March, June, September, December</div></app-cs-radio>\r\n</div>\r\n\r\n<div *ngIf=\"false\" class=\"frequency-dialog-radio-list vx-d-flex vx-flex-wrap yearly\">\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">January</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">February</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">March</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">April</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">May</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">June</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">June</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">August</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">September</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">October</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">November</div></app-cs-radio>\r\n    <app-cs-radio><div class=\"vx-fs-12 vx-label-txt\">December</div></app-cs-radio>\r\n</div> -->\r\n\r\n<div class=\"frequency-dialog-radio-list vx-d-flex \" [class.vx-align-center]=\"name === 'quarter'\" [class.quarterly]=\"name === 'quarter'\" [class.vx-flex-wrap]=\"name === 'annual'\" [class.yearly]=\"name === 'annual'\">\r\n    <app-cs-radio \r\n        *ngFor=\"let eachList of radioList; let i = index;\" \r\n        [id]=\"i\" \r\n        [value]=\"i\" \r\n        [name]=\"name\"\r\n        [checked]=\"(selectedIndex === i)\" \r\n        (checkedEvent)=\"selectedRadio.emit($event)\">\r\n        <div class=\"vx-fs-12 vx-label-txt\">{{eachList}}</div>\r\n    </app-cs-radio>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-radio-list{border-top:1px solid #f1f1f1}::ng-deep .frequency-dialog-radio-list.quarterly app-cs-radio{border-right:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem}::ng-deep .frequency-dialog-radio-list.quarterly app-cs-radio:last-of-type{border-right:none}::ng-deep .frequency-dialog-radio-list.quarterly app-cs-radio .radio-item{position:relative;top:-2px}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio{border-right:1px solid #f1f1f1;border-bottom:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem;width:16.66%}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(6){border-right:none}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(7),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(8),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(9),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(10),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(11),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(12){border-bottom:none}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(12){border-right:none}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio .radio-item{position:relative;top:-2px}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-radio-list{border-top:1px solid #f1f1f1}::ng-deep .frequency-dialog-radio-list.quarterly app-cs-radio{border-right:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem}::ng-deep .frequency-dialog-radio-list.quarterly app-cs-radio:last-of-type{border-right:none}::ng-deep .frequency-dialog-radio-list.quarterly app-cs-radio .radio-item{position:relative;top:-2px}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio{border-right:1px solid #f1f1f1;border-bottom:1px solid #f1f1f1;padding:.75rem 1rem .75rem .75rem;height:2.5rem;width:16.66%}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(6){border-right:none}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(7),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(8),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(9),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(10),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(11),::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(12){border-bottom:none}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio:nth-child(12){border-right:none}::ng-deep .frequency-dialog-radio-list.yearly app-cs-radio .radio-item{position:relative;top:-2px}"]
             },] }
 ];
 FrequencyDialogRadioListComponent.ctorParameters = () => [];

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-top/frequency-dialog-top.component.js

@@ -84,7 +84,7 @@ FrequencyDialogTopComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-top',
                 template: "<!-- <div class=\"frequency-dialog-top vx-p-3 vx-d-flex vx-align-center\">\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-mr-3\">Every</div>\r\n    <input type=\"number\" value=\"1\" />\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-ml-3 vx-mr-3\">week by</div>\r\n    <input type=\"number\" value=\"1\" *ngIf=\"false\" />\r\n    <div *ngIf=\"false\" class=\"vx-fs-13 vx-paragraph-txt vx-ml-3 vx-mr-3\">by</div>\r\n    <div class=\"time-picker vx-d-flex vx-align-center vx-justify-end vx-pr-3\">\r\n        <input type=\"text\" readonly aria-label=\"12hr format\" [ngxTimepicker]=\"dailyTime\" placeholder=\"11:59 PM\">\r\n        <i class=\"icons vx-fs-12 vx-txt-blue\">&#xe955;</i>\r\n        <ngx-material-timepicker #dailyTime></ngx-material-timepicker>\r\n    </div>\r\n</div> -->\r\n\r\n\r\n<div class=\"frequency-dialog-top vx-p-3 vx-d-flex vx-align-center\">\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-mr-3\">{{id === 0 || id === 1 || id === 5 ? 'Every' : 'Day'}}</div>\r\n    <input type=\"number\"\r\n        [id]=\"'occurrence' + id\"\r\n        [(ngModel)]=\"occurrenceFirst\"\r\n        class=\"day-counter\"\r\n        onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\"\r\n        (focusout) = \"enterValueFirst($event, 'occurrenceFirst')\" />\r\n    <div *ngIf=\"frequencyType === 1\" class=\"vx-fs-13 vx-paragraph-txt vx-ml-3 vx-mr-3\">{{ occurrenceFirst > 1 ? 'weeks' : 'week' }} by  </div>\r\n    <div class=\"vx-fs-13 vx-paragraph-txt vx-ml-3 vx-mr-3\" *ngIf=\"id !== 0 && id !== 1 && id !== 5\">by</div>\r\n    <ng-container  *ngIf=\"frequencyType === 2\">\r\n        <div  class=\"vx-fs-13 vx-paragraph-txt vx-ml-3 vx-mr-3\">{{ occurrenceFirst > 1 ? 'years' : 'year' }} on day</div>\r\n        <input type=\"number\" type=\"number\" [id]=\"'occurrence-day' + id\" [(ngModel)]=\"yearlyDay\" (focusout)=\"enterYearDay($event)\"  onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\" />\r\n        <div class=\"vx-fs-13 vx-paragraph-txt vx-ml-3 vx-mr-3\">by</div>\r\n    </ng-container>\r\n    <div class=\"time-picker vx-d-flex vx-align-center vx-justify-end vx-pr-3\">\r\n        <input type=\"text\" [id]=\"'time-picker-input-top'+id\" [(ngModel)]=\"inputTime\" readonly aria-label=\"12hr format\"  placeholder=\"11:59 PM\">\r\n        <!-- <i class=\"icons vx-fs-12 vx-txt-blue\">&#xe955;</i> -->\r\n        <ngx-material-timepicker [id]=\"'time-picker-top'+id\" [hoursOnly]=\"true\" (timeChanged)=\"onTimeChanged($event)\" #dailyTime></ngx-material-timepicker>\r\n    </div>\r\n</div>\r\n",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-top input[type=number]{background:transparent;border-radius:0;border:none;border-bottom:1px solid #dbdbdb;color:#161b2f;font-size:13px;height:1.5rem;width:3rem;text-align:center;outline:none}::ng-deep .frequency-dialog-top input[type=number]::-webkit-outer-spin-button,::ng-deep .frequency-dialog-top input[type=number]::-webkit-inner-spin-button{-moz-appearance:none;-webkit-appearance:none;margin:0}::ng-deep .frequency-dialog-top .time-picker{border-radius:.25rem;border:1px solid #dbdbdb;height:2rem;width:6.25rem;position:relative}::ng-deep .frequency-dialog-top .time-picker input{background:transparent;border-radius:0;border:none;color:#161b2f;font-size:13px;margin:0!important;padding:0 0 0 .75rem;position:absolute;top:0;left:0;height:100%;width:100%;cursor:pointer}::ng-deep .frequency-dialog-top .time-picker input::placeholder{color:#161b2f}::ng-deep .frequency-dialog-top .time-picker input:focus{outline:none}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-top input[type=number]{background:transparent;border-radius:0;border:none;border-bottom:1px solid #dbdbdb;color:#161b2f;font-size:13px;height:1.5rem;width:3rem;text-align:center;outline:none}::ng-deep .frequency-dialog-top input[type=number]::-webkit-inner-spin-button,::ng-deep .frequency-dialog-top input[type=number]::-webkit-outer-spin-button{-moz-appearance:none;-webkit-appearance:none;margin:0}::ng-deep .frequency-dialog-top .time-picker{border-radius:.25rem;border:1px solid #dbdbdb;height:2rem;width:6.25rem;position:relative}::ng-deep .frequency-dialog-top .time-picker input{background:transparent;border-radius:0;border:none;color:#161b2f;font-size:13px;margin:0!important;padding:0 0 0 .75rem;position:absolute;top:0;left:0;height:100%;width:100%;cursor:pointer}::ng-deep .frequency-dialog-top .time-picker input::-moz-placeholder{color:#161b2f}::ng-deep .frequency-dialog-top .time-picker input:-ms-input-placeholder{color:#161b2f}::ng-deep .frequency-dialog-top .time-picker input::placeholder{color:#161b2f}::ng-deep .frequency-dialog-top .time-picker input:focus{outline:none}"]
             },] }
 ];
 FrequencyDialogTopComponent.ctorParameters = () => [];

package/esm2015/lib/sharedComponents/frequency-dialog/frequency-dialog-weekly/frequency-dialog-weekly.component.js

@@ -150,7 +150,7 @@ FrequencyDialogWeeklyComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-frequency-dialog-weekly',
                 template: "<div class=\"frequency-dialog-weekly\">\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT FREQUENCY:</div>\r\n    <div class=\"frequency-dialog-weekly-item vx-mb-5\">\r\n        <!-- <app-frequency-dialog-top></app-frequency-dialog-top> -->\r\n        <app-frequency-dialog-top\r\n            [id]=\"1\"\r\n            [inputTime]=\"weeklyInterval\"\r\n            [occurrenceFirst]=\"weeklyInput\"\r\n            [frequencyType]=\"1\"\r\n            (timeChanged)=\"onTimeChanged($event)\"\r\n            (valueChangedFirst)=\"valueChangedFirst($event)\"\r\n        ></app-frequency-dialog-top>\r\n        <!-- <app-frequency-dialog-checkbox-list></app-frequency-dialog-checkbox-list> -->\r\n        <app-frequency-dialog-checkbox-list\r\n            [id]=\"1\"\r\n            [listArray]=\"dayArray\"\r\n            [selectedIndex]=\"selectedWeekly\"\r\n            (selectedCheckbox)=\"onDaySelected($event)\"\r\n        ></app-frequency-dialog-checkbox-list>\r\n    </div>\r\n    <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">REASSESSMENT EMAIL NOTIFICATION:</div>\r\n    <div class=\"frequency-dialog-weekly-item vx-mb-5\">\r\n        <!-- <app-frequency-dialog-due-date></app-frequency-dialog-due-date> -->\r\n        <app-frequency-dialog-due-date\r\n            [id] = '1'\r\n            [mode]=\"mode\"\r\n            [pageName]=\"'weekly'\"\r\n            [deactivateValue]=\"weeklyDeactivatedValue\"\r\n            [isDeactivated]=\"true\"\r\n            [completedValue]=\"weeklyWindow\"\r\n            (valueChange)=\"onValueChange($event)\"\r\n        ></app-frequency-dialog-due-date>\r\n    </div>\r\n</div>",
-                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.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-bottom.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/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\";::ng-deep .frequency-dialog-weekly-item{border-radius:.25rem;border:1px solid #f1f1f1}\n"]
+                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");::ng-deep .frequency-dialog-weekly-item{border-radius:.25rem;border:1px solid #f1f1f1}"]
             },] }
 ];
 FrequencyDialogWeeklyComponent.ctorParameters = () => [