mis-crystal-design-system 18.0.2 → 18.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -447,11 +447,11 @@ export class TableComponent {
447
447
  i0.ɵɵproperty("ngForOf", ctx.tableData);
448
448
  i0.ɵɵadvance();
449
449
  i0.ɵɵproperty("ngIf", (ctx.config == null ? null : ctx.config.paginationConfig) && (ctx.tableLength >= ctx.config.paginationConfig.rowsPerPage || (ctx.config.paginationConfig == null ? null : ctx.config.paginationConfig.selectedPage) !== 1));
450
- } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, i2.SubTableComponent, i3.TableFilterComponent, i4.CustomTableCellDirective], styles: ["#main-container[_ngcontent-%COMP%]{font-family:Lato,sans-serif;position:relative}.no-scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:0}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:15px}#table-container[_ngcontent-%COMP%]{height:inherit;overflow-y:auto}.scroll-horizontally[_ngcontent-%COMP%]{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container[_ngcontent-%COMP%]{display:flex;align-items:center;position:sticky;background-color:#fff;width:100%;z-index:1;min-height:44px;border-bottom:1px solid #e0e0e0;top:0;left:0;right:0}.col-header[_ngcontent-%COMP%]{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text[_ngcontent-%COMP%]{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.filter-icon[_ngcontent-%COMP%]{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active[_ngcontent-%COMP%]{height:8px;width:8px;background:#16cbbc;border-radius:50%;position:absolute;top:4px;right:4px}.sub-row[_ngcontent-%COMP%]{height:auto;border-bottom:none}.loader[_ngcontent-%COMP%] .mat-progress-spinner circle, .mat-spinner[_ngcontent-%COMP%] circle[_ngcontent-%COMP%]{stroke:#0937b2}.t-row[_ngcontent-%COMP%]{display:flex;min-height:44px;background-color:#fff;width:100%;border-bottom:1px solid #e0e0e0}.t-row[_ngcontent-%COMP%]:hover{background-color:#e7eefd}.active-row[_ngcontent-%COMP%]{background-color:#e6f6fd}.t-col-container[_ngcontent-%COMP%]{padding:0 16px}.t-row-hover[_ngcontent-%COMP%]:hover{background-color:#0000}.t-col-container-hover[_ngcontent-%COMP%]:hover{background-color:#e6ebf7}.t-col-container-hover[_ngcontent-%COMP%]:first-child{border-left:1px solid #e0e0e0}.t-col-container-hover[_ngcontent-%COMP%]{border-right:1px solid #e0e0e0}.t-col[_ngcontent-%COMP%]{display:flex;align-items:center;height:100%}.t-col-text[_ngcontent-%COMP%]{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}#pagination-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text[_ngcontent-%COMP%]{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:#6a737d;margin:0 96px 0 0}#pages-container[_ngcontent-%COMP%]{display:flex;margin-right:32px}.page[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;border:1px solid #6a737d;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:#6a737d;margin-right:8px;cursor:pointer}.page-seperator[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot[_ngcontent-%COMP%]{height:3px;width:3px;border-radius:50%;background:#6a737d}.page-active[_ngcontent-%COMP%]{color:#0937b2;border:1px solid #0937b2}"] }); }
450
+ } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, i2.SubTableComponent, i3.TableFilterComponent, i4.CustomTableCellDirective], styles: ["#main-container[_ngcontent-%COMP%]{font-family:Lato,sans-serif;position:relative}.no-scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:0}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:15px}#table-container[_ngcontent-%COMP%]{height:inherit;overflow-y:auto}.scroll-horizontally[_ngcontent-%COMP%]{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container[_ngcontent-%COMP%]{display:flex;align-items:center;position:sticky;background-color:#fff;width:100%;z-index:1;min-height:44px;border-bottom:1px solid #e0e0e0;top:0;left:0;right:0}.col-header[_ngcontent-%COMP%]{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text[_ngcontent-%COMP%]{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.filter-icon[_ngcontent-%COMP%]{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active[_ngcontent-%COMP%]{height:8px;width:8px;background:#16cbbc;border-radius:50%;position:absolute;top:4px;right:4px}.sub-row[_ngcontent-%COMP%]{height:auto;border-bottom:none}.loader[_ngcontent-%COMP%] .mat-progress-spinner circle, .mat-spinner[_ngcontent-%COMP%] circle[_ngcontent-%COMP%]{stroke:#0937b2}.t-row[_ngcontent-%COMP%]{display:flex;min-height:44px;background-color:#fff;width:100%;border-bottom:1px solid #e0e0e0}.t-row[_ngcontent-%COMP%]:hover{background-color:#e7eefd}.active-row[_ngcontent-%COMP%]{background-color:#e6f6fd}.t-col-container[_ngcontent-%COMP%]{padding:0 16px;overflow-wrap:anywhere}.t-row-hover[_ngcontent-%COMP%]:hover{background-color:#0000}.t-col-container-hover[_ngcontent-%COMP%]:hover{background-color:#e6ebf7}.t-col-container-hover[_ngcontent-%COMP%]:first-child{border-left:1px solid #e0e0e0}.t-col-container-hover[_ngcontent-%COMP%]{border-right:1px solid #e0e0e0}.t-col[_ngcontent-%COMP%]{display:flex;align-items:center;height:100%}.t-col-text[_ngcontent-%COMP%]{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}#pagination-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text[_ngcontent-%COMP%]{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:#6a737d;margin:0 96px 0 0}#pages-container[_ngcontent-%COMP%]{display:flex;margin-right:32px}.page[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;border:1px solid #6a737d;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:#6a737d;margin-right:8px;cursor:pointer}.page-seperator[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot[_ngcontent-%COMP%]{height:3px;width:3px;border-radius:50%;background:#6a737d}.page-active[_ngcontent-%COMP%]{color:#0937b2;border:1px solid #0937b2}"] }); }
451
451
  }
452
452
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableComponent, [{
453
453
  type: Component,
454
- args: [{ selector: "mis-table", template: "<div\n [ngStyle]=\"{\n height: getContainerHeight(),\n width: getContainerWidth(),\n 'overflow-x': config.canScrollHorizontally ? 'auto' : 'unset'\n }\"\n id=\"main-container\"\n>\n <mis-table-filter\n #filter\n (filtersApplied)=\"updateAppliedFilters($event)\"\n *ngIf=\"showFilter\"\n [containerStyles]=\"filterContainerStyles\"\n [filtersData]=\"filterData\"\n ></mis-table-filter>\n <div\n #table\n id=\"table-container\"\n [ngClass]=\"{ 'no-scrollbar': expandedIndex < 0, scrollbar: !(expandedIndex < 0), 'scroll-horizontally': config.canScrollHorizontally }\"\n >\n <div\n [ngStyle]=\"getColHeadersRowStyles()\"\n id=\"col-headers-container\"\n >\n <div\n #colHeaderRef\n (click)=\"colHeader?.action ? colHeader?.action(colHeader) : null\"\n *ngFor=\"let colHeader of config?.colHeaderConfig\"\n class=\"col-header\"\n [ngStyle]=\"{\n width: colHeader?.style?.width || '',\n cursor: colHeader.action ? 'pointer' : 'default',\n 'justify-content': colHeader?.style?.justifyContent\n ? colHeader?.style?.justifyContent\n : colHeader.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <p *ngIf=\"colHeader?.type !== 'custom'\" class=\"col-header-text\">\n {{ colHeader?.data || \" \" }}\n </p>\n <span\n (click)=\"filterData = colHeader.filters; toggleFilter(colHeader.data); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type !== 'custom' && colHeader?.filters && colHeader?.filters?.length > 0\"\n class=\"filter-icon\"\n >\n <span *ngIf=\"appliedFilters[colHeader.data]?.length > 0\" id=\"filter-active\"></span>\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 13 10\" width=\"13\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M4.97546 10H7.64213V8H4.97546V10ZM0.308472 0V2H12.3085V0H0.308472ZM2.30847 6H10.3085V4H2.30847V6Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <ng-template\n *ngIf=\"colHeader?.type === 'custom'\"\n [customComponent]=\"colHeader?.componentRef\"\n [data]=\"colHeader.data\"\n customTableCell\n ></ng-template>\n </div>\n </div>\n <div id=\"data-container\">\n <div class=\"row-wrapper\" *ngFor=\"let row of tableData; let i = index\">\n <div\n class=\"t-row\"\n [ngClass]=\"{ 't-row-hover': config.cellHover, 'active-row': i === activeRowIndex }\"\n [ngStyle]=\"{ 'min-height': config?.rowConfig?.height ? config.rowConfig.height : '44px' }\"\n (click)=\"selectRow(i)\"\n >\n <div\n (click)=\"config?.colConfig[i]?.action ? config?.colConfig[i]?.action(col) : null\"\n *ngFor=\"let col of row; let i = index\"\n [ngStyle]=\"{\n width: config?.colConfig[i]?.style?.width || config?.colHeaderConfig[i]?.style?.width || ''\n }\"\n class=\"t-col-container\"\n [ngClass]=\"{ 't-col-container-hover': config.cellHover }\"\n >\n <div\n class=\"t-col\"\n [style]=\"config.colConfig[i]?.style\"\n [ngStyle]=\"{\n width: '100%',\n cursor: config.colConfig[i]?.action ? 'pointer' : 'default',\n 'justify-content': config.colConfig[i]?.style?.justifyContent\n ? config.colConfig[i]?.style?.justifyContent\n : config.colConfig[i]?.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <p\n *ngIf=\"config.colConfig[i]?.type !== 'custom'\"\n [ngStyle]=\"{\n color: config?.colConfig[i]?.style?.color ? config?.colConfig[i]?.style?.color : ''\n }\"\n class=\"t-col-text\"\n >\n {{ col }}\n </p>\n <ng-template\n *ngIf=\"config.colConfig[i]?.type === 'custom'\"\n [customComponent]=\"config.colConfig[i].componentRef\"\n [data]=\"col\"\n customTableCell\n ></ng-template>\n </div>\n </div>\n </div>\n <div *ngIf=\"config?.canExpand && expandedIndex === i\" class=\"sub-row\">\n <ng-container *ngIf=\"subTableDataLoading\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n Loading...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading && subTableData.length === 0\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n No Data Available...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading && subTableData.length > 0\">\n <sub-table [config]=\"subTableconfig\" [tableData]=\"subTableData\"></sub-table>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <div\n *ngIf=\"config?.paginationConfig && (tableLength >= config.paginationConfig.rowsPerPage || config.paginationConfig?.selectedPage !== 1)\"\n id=\"pagination-container\"\n >\n <p id=\"pagination-text\">\n Showing\n {{ (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + 1 }}-{{\n (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + tableLength\n }}\n of {{ config.paginationConfig.totalNoOfRows }} items\n </p>\n <div id=\"pages-container\">\n <span (click)=\"updateSelectedPage(config.paginationConfig?.selectedPage - 1)\" class=\"page\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M0.857405 5.56295C0.855794 5.56139 0.854188 5.55982 0.852588 5.55824C0.695955 5.40408 0.617641 5.20203 0.617647 4.99998C0.617641 4.79793 0.695955 4.59588 0.852588 4.44172C0.854188 4.44014 0.855794 4.43858 0.857404 4.43702L5.13066 0.231231C5.44392 -0.0770771 5.9518 -0.0770771 6.26506 0.231231C6.57831 0.53954 6.57831 1.03941 6.26506 1.34772L2.5542 4.99998L6.26506 8.65225C6.57831 8.96055 6.57831 9.46042 6.26506 9.76873C5.9518 10.077 5.44392 10.077 5.13066 9.76873L0.857405 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <div *ngFor=\"let pageNumber of pages\">\n <span\n (click)=\"updateSelectedPage(pageNumber)\"\n *ngIf=\"pageNumber != 0\"\n [ngClass]=\"{ 'page-active': pageNumber == config.paginationConfig?.selectedPage }\"\n class=\"page\"\n >{{ pageNumber }}</span\n >\n <span *ngIf=\"pageNumber == 0\" class=\"page-seperator\">\n <div [ngStyle]=\"{ display: 'flex' }\">\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\"></span>\n </div> \n </span>\n </div>\n <span (click)=\"updateSelectedPage(config.paginationConfig?.selectedPage + 1)\" class=\"page\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M6.1426 5.56295C6.14421 5.56139 6.14581 5.55982 6.14741 5.55824C6.30405 5.40408 6.38236 5.20203 6.38236 4.99998C6.38236 4.79793 6.30405 4.59588 6.14741 4.44172C6.14581 4.44014 6.14421 4.43858 6.1426 4.43702L1.86934 0.231231C1.55608 -0.0770771 1.0482 -0.0770771 0.734942 0.231231C0.421688 0.53954 0.421688 1.03941 0.734942 1.34772L4.4458 4.99998L0.734941 8.65225C0.421686 8.96055 0.421686 9.46042 0.734941 9.76873C1.0482 10.077 1.55608 10.077 1.86934 9.76873L6.1426 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n </div>\n </div>\n</div>\n", styles: ["#main-container{font-family:Lato,sans-serif;position:relative}.no-scrollbar::-webkit-scrollbar{width:0}.scrollbar::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:15px}#table-container{height:inherit;overflow-y:auto}.scroll-horizontally{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container{display:flex;align-items:center;position:sticky;background-color:#fff;width:100%;z-index:1;min-height:44px;border-bottom:1px solid #e0e0e0;top:0;left:0;right:0}.col-header{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.filter-icon{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active{height:8px;width:8px;background:#16cbbc;border-radius:50%;position:absolute;top:4px;right:4px}.sub-row{height:auto;border-bottom:none}.loader ::ng-deep .mat-progress-spinner circle,.mat-spinner circle{stroke:#0937b2}.t-row{display:flex;min-height:44px;background-color:#fff;width:100%;border-bottom:1px solid #e0e0e0}.t-row:hover{background-color:#e7eefd}.active-row{background-color:#e6f6fd}.t-col-container{padding:0 16px}.t-row-hover:hover{background-color:#0000}.t-col-container-hover:hover{background-color:#e6ebf7}.t-col-container-hover:first-child{border-left:1px solid #e0e0e0}.t-col-container-hover{border-right:1px solid #e0e0e0}.t-col{display:flex;align-items:center;height:100%}.t-col-text{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}#pagination-container{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:#6a737d;margin:0 96px 0 0}#pages-container{display:flex;margin-right:32px}.page{display:flex;justify-content:center;align-items:center;border:1px solid #6a737d;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:#6a737d;margin-right:8px;cursor:pointer}.page-seperator{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot{height:3px;width:3px;border-radius:50%;background:#6a737d}.page-active{color:#0937b2;border:1px solid #0937b2}\n"] }]
454
+ args: [{ selector: "mis-table", template: "<div\n [ngStyle]=\"{\n height: getContainerHeight(),\n width: getContainerWidth(),\n 'overflow-x': config.canScrollHorizontally ? 'auto' : 'unset'\n }\"\n id=\"main-container\"\n>\n <mis-table-filter\n #filter\n (filtersApplied)=\"updateAppliedFilters($event)\"\n *ngIf=\"showFilter\"\n [containerStyles]=\"filterContainerStyles\"\n [filtersData]=\"filterData\"\n ></mis-table-filter>\n <div\n #table\n id=\"table-container\"\n [ngClass]=\"{ 'no-scrollbar': expandedIndex < 0, scrollbar: !(expandedIndex < 0), 'scroll-horizontally': config.canScrollHorizontally }\"\n >\n <div\n [ngStyle]=\"getColHeadersRowStyles()\"\n id=\"col-headers-container\"\n >\n <div\n #colHeaderRef\n (click)=\"colHeader?.action ? colHeader?.action(colHeader) : null\"\n *ngFor=\"let colHeader of config?.colHeaderConfig\"\n class=\"col-header\"\n [ngStyle]=\"{\n width: colHeader?.style?.width || '',\n cursor: colHeader.action ? 'pointer' : 'default',\n 'justify-content': colHeader?.style?.justifyContent\n ? colHeader?.style?.justifyContent\n : colHeader.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <p *ngIf=\"colHeader?.type !== 'custom'\" class=\"col-header-text\">\n {{ colHeader?.data || \" \" }}\n </p>\n <span\n (click)=\"filterData = colHeader.filters; toggleFilter(colHeader.data); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type !== 'custom' && colHeader?.filters && colHeader?.filters?.length > 0\"\n class=\"filter-icon\"\n >\n <span *ngIf=\"appliedFilters[colHeader.data]?.length > 0\" id=\"filter-active\"></span>\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 13 10\" width=\"13\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M4.97546 10H7.64213V8H4.97546V10ZM0.308472 0V2H12.3085V0H0.308472ZM2.30847 6H10.3085V4H2.30847V6Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <ng-template\n *ngIf=\"colHeader?.type === 'custom'\"\n [customComponent]=\"colHeader?.componentRef\"\n [data]=\"colHeader.data\"\n customTableCell\n ></ng-template>\n </div>\n </div>\n <div id=\"data-container\">\n <div class=\"row-wrapper\" *ngFor=\"let row of tableData; let i = index\">\n <div\n class=\"t-row\"\n [ngClass]=\"{ 't-row-hover': config.cellHover, 'active-row': i === activeRowIndex }\"\n [ngStyle]=\"{ 'min-height': config?.rowConfig?.height ? config.rowConfig.height : '44px' }\"\n (click)=\"selectRow(i)\"\n >\n <div\n (click)=\"config?.colConfig[i]?.action ? config?.colConfig[i]?.action(col) : null\"\n *ngFor=\"let col of row; let i = index\"\n [ngStyle]=\"{\n width: config?.colConfig[i]?.style?.width || config?.colHeaderConfig[i]?.style?.width || ''\n }\"\n class=\"t-col-container\"\n [ngClass]=\"{ 't-col-container-hover': config.cellHover }\"\n >\n <div\n class=\"t-col\"\n [style]=\"config.colConfig[i]?.style\"\n [ngStyle]=\"{\n width: '100%',\n cursor: config.colConfig[i]?.action ? 'pointer' : 'default',\n 'justify-content': config.colConfig[i]?.style?.justifyContent\n ? config.colConfig[i]?.style?.justifyContent\n : config.colConfig[i]?.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <p\n *ngIf=\"config.colConfig[i]?.type !== 'custom'\"\n [ngStyle]=\"{\n color: config?.colConfig[i]?.style?.color ? config?.colConfig[i]?.style?.color : ''\n }\"\n class=\"t-col-text\"\n >\n {{ col }}\n </p>\n <ng-template\n *ngIf=\"config.colConfig[i]?.type === 'custom'\"\n [customComponent]=\"config.colConfig[i].componentRef\"\n [data]=\"col\"\n customTableCell\n ></ng-template>\n </div>\n </div>\n </div>\n <div *ngIf=\"config?.canExpand && expandedIndex === i\" class=\"sub-row\">\n <ng-container *ngIf=\"subTableDataLoading\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n Loading...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading && subTableData.length === 0\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n No Data Available...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading && subTableData.length > 0\">\n <sub-table [config]=\"subTableconfig\" [tableData]=\"subTableData\"></sub-table>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <div\n *ngIf=\"config?.paginationConfig && (tableLength >= config.paginationConfig.rowsPerPage || config.paginationConfig?.selectedPage !== 1)\"\n id=\"pagination-container\"\n >\n <p id=\"pagination-text\">\n Showing\n {{ (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + 1 }}-{{\n (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + tableLength\n }}\n of {{ config.paginationConfig.totalNoOfRows }} items\n </p>\n <div id=\"pages-container\">\n <span (click)=\"updateSelectedPage(config.paginationConfig?.selectedPage - 1)\" class=\"page\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M0.857405 5.56295C0.855794 5.56139 0.854188 5.55982 0.852588 5.55824C0.695955 5.40408 0.617641 5.20203 0.617647 4.99998C0.617641 4.79793 0.695955 4.59588 0.852588 4.44172C0.854188 4.44014 0.855794 4.43858 0.857404 4.43702L5.13066 0.231231C5.44392 -0.0770771 5.9518 -0.0770771 6.26506 0.231231C6.57831 0.53954 6.57831 1.03941 6.26506 1.34772L2.5542 4.99998L6.26506 8.65225C6.57831 8.96055 6.57831 9.46042 6.26506 9.76873C5.9518 10.077 5.44392 10.077 5.13066 9.76873L0.857405 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <div *ngFor=\"let pageNumber of pages\">\n <span\n (click)=\"updateSelectedPage(pageNumber)\"\n *ngIf=\"pageNumber != 0\"\n [ngClass]=\"{ 'page-active': pageNumber == config.paginationConfig?.selectedPage }\"\n class=\"page\"\n >{{ pageNumber }}</span\n >\n <span *ngIf=\"pageNumber == 0\" class=\"page-seperator\">\n <div [ngStyle]=\"{ display: 'flex' }\">\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\"></span>\n </div> \n </span>\n </div>\n <span (click)=\"updateSelectedPage(config.paginationConfig?.selectedPage + 1)\" class=\"page\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M6.1426 5.56295C6.14421 5.56139 6.14581 5.55982 6.14741 5.55824C6.30405 5.40408 6.38236 5.20203 6.38236 4.99998C6.38236 4.79793 6.30405 4.59588 6.14741 4.44172C6.14581 4.44014 6.14421 4.43858 6.1426 4.43702L1.86934 0.231231C1.55608 -0.0770771 1.0482 -0.0770771 0.734942 0.231231C0.421688 0.53954 0.421688 1.03941 0.734942 1.34772L4.4458 4.99998L0.734941 8.65225C0.421686 8.96055 0.421686 9.46042 0.734941 9.76873C1.0482 10.077 1.55608 10.077 1.86934 9.76873L6.1426 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n </div>\n </div>\n</div>\n", styles: ["#main-container{font-family:Lato,sans-serif;position:relative}.no-scrollbar::-webkit-scrollbar{width:0}.scrollbar::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:15px}#table-container{height:inherit;overflow-y:auto}.scroll-horizontally{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container{display:flex;align-items:center;position:sticky;background-color:#fff;width:100%;z-index:1;min-height:44px;border-bottom:1px solid #e0e0e0;top:0;left:0;right:0}.col-header{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.filter-icon{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active{height:8px;width:8px;background:#16cbbc;border-radius:50%;position:absolute;top:4px;right:4px}.sub-row{height:auto;border-bottom:none}.loader ::ng-deep .mat-progress-spinner circle,.mat-spinner circle{stroke:#0937b2}.t-row{display:flex;min-height:44px;background-color:#fff;width:100%;border-bottom:1px solid #e0e0e0}.t-row:hover{background-color:#e7eefd}.active-row{background-color:#e6f6fd}.t-col-container{padding:0 16px;overflow-wrap:anywhere}.t-row-hover:hover{background-color:#0000}.t-col-container-hover:hover{background-color:#e6ebf7}.t-col-container-hover:first-child{border-left:1px solid #e0e0e0}.t-col-container-hover{border-right:1px solid #e0e0e0}.t-col{display:flex;align-items:center;height:100%}.t-col-text{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}#pagination-container{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:#6a737d;margin:0 96px 0 0}#pages-container{display:flex;margin-right:32px}.page{display:flex;justify-content:center;align-items:center;border:1px solid #6a737d;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:#6a737d;margin-right:8px;cursor:pointer}.page-seperator{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot{height:3px;width:3px;border-radius:50%;background:#6a737d}.page-active{color:#0937b2;border:1px solid #0937b2}\n"] }]
455
455
  }], () => [{ type: i0.Renderer2 }], { filtersUpdated: [{
456
456
  type: Output
457
457
  }], filter: [{
@@ -39,11 +39,15 @@ export class TimepickerDirective {
39
39
  this.overlayRef.backdropClick().subscribe(resp => {
40
40
  this.openStatus = false;
41
41
  this.statusEmitter.emit(false);
42
- this.overlayRef.detach();
42
+ if (this.overlay) {
43
+ this.overlayRef.detach();
44
+ }
43
45
  });
44
46
  }
45
47
  destroyOverlay() {
46
- this.overlayRef.detach();
48
+ if (this.overlay) {
49
+ this.overlayRef.detach();
50
+ }
47
51
  }
48
52
  static { this.ɵfac = function TimepickerDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TimepickerDirective)(i0.ɵɵdirectiveInject(i0.TemplateRef), i0.ɵɵdirectiveInject(i1.Overlay), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); }; }
49
53
  static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TimepickerDirective, selectors: [["", "libTimepicker", ""]], inputs: { originEl: "originEl", createOverlayOnInput: [0, "openStatus", "createOverlayOnInput"] }, outputs: { statusEmitter: "statusEmitter" } }); }
@@ -62,4 +66,4 @@ export class TimepickerDirective {
62
66
  type: Input,
63
67
  args: ['openStatus']
64
68
  }] }); })();
65
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGltZXBpY2tlci5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9taXMtY29tcG9uZW50cy90aW1lcGlja2VyL3RpbWVwaWNrZXIuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFlLE1BQU0sZUFBZSxDQUFDO0FBQy9ELE9BQU8sRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFvQixNQUFNLGVBQWUsQ0FBQztBQUN0RSxPQUFPLEVBQUUsc0JBQXNCLEVBQVcsYUFBYSxFQUFjLE1BQU0sc0JBQXNCLENBQUM7QUFDbEcsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7QUFLckQsTUFBTSxPQUFPLG1CQUFtQjtJQUs5QixJQUEwQixvQkFBb0IsQ0FBQyxVQUFVO1FBQ3ZELElBQUksQ0FBQyxVQUFVLEdBQUcsVUFBVSxDQUFDO1FBQzdCLElBQUcsSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsVUFBVTtZQUFFLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO0lBQ3pFLENBQUM7SUFBQSxDQUFDO0lBRUYsWUFBb0IsV0FBaUMsRUFBVSxPQUFnQixFQUFVLGdCQUFrQztRQUF2RyxnQkFBVyxHQUFYLFdBQVcsQ0FBc0I7UUFBVSxZQUFPLEdBQVAsT0FBTyxDQUFTO1FBQVUscUJBQWdCLEdBQWhCLGdCQUFnQixDQUFrQjtRQVRuSCxlQUFVLEdBQVksS0FBSyxDQUFDO1FBRTFCLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztJQU93RSxDQUFDO0lBRS9ILGFBQWEsQ0FBQyxNQUFXO1FBQ3ZCLE1BQU0sU0FBUyxHQUFHO1lBQ2hCLElBQUksc0JBQXNCLENBQUMsRUFBRSxPQUFPLEVBQUUsT0FBTyxFQUFFLE9BQU8sRUFBRSxRQUFRLEVBQUUsRUFBRSxFQUFFLFFBQVEsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUM7WUFDakgsSUFBSSxzQkFBc0IsQ0FBQyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxRQUFRLEVBQUUsS0FBSyxFQUFFLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztTQUM5RyxDQUFDO1FBRUYsTUFBTSxhQUFhLEdBQUcsSUFBSSxhQUFhLENBQUM7WUFDdEMsV0FBVyxFQUFFLElBQUk7WUFDakIsYUFBYSxFQUFFLGtDQUFrQztZQUNqRCxnQkFBZ0IsRUFBRSxJQUFJLENBQUMsT0FBTztpQkFDM0IsUUFBUSxFQUFFO2dCQUNYLHNEQUFzRDtpQkFDckQsbUJBQW1CLENBQUMsTUFBTSxDQUFDO2lCQUMzQixhQUFhLENBQUMsQ0FBQyxHQUFHLFNBQVMsQ0FBQyxDQUFDO2lCQUM3QixRQUFRLENBQUMsSUFBSSxDQUFDO1NBQ2xCLENBQUMsQ0FBQztRQUVILElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDckQsTUFBTSxjQUFjLEdBQUcsSUFBSSxjQUFjLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxJQUFJLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztRQUNuRixJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQztRQUN2QyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsRUFBRSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsRUFBRTtZQUMvQyxJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztZQUN4QixJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUMvQixJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sRUFBRSxDQUFDO1FBQzNCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVELGNBQWM7UUFDWixJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sRUFBRSxDQUFDO0lBQzNCLENBQUM7b0hBekNVLG1CQUFtQjtvRUFBbkIsbUJBQW1COztpRkFBbkIsbUJBQW1CO2NBSC9CLFNBQVM7ZUFBQztnQkFDVCxRQUFRLEVBQUUsaUJBQWlCO2FBQzVCO2lHQUdvQixRQUFRO2tCQUExQixLQUFLO21CQUFDLFVBQVU7WUFDUCxhQUFhO2tCQUF0QixNQUFNO1lBRW1CLG9CQUFvQjtrQkFBN0MsS0FBSzttQkFBQyxZQUFZIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBPdXRwdXQsIFRlbXBsYXRlUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBFdmVudEVtaXR0ZXIsIElucHV0LCBWaWV3Q29udGFpbmVyUmVmIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IENvbm5lY3Rpb25Qb3NpdGlvblBhaXIsIE92ZXJsYXksIE92ZXJsYXlDb25maWcsIE92ZXJsYXlSZWYgfSBmcm9tIFwiQGFuZ3VsYXIvY2RrL292ZXJsYXlcIjtcbmltcG9ydCB7IFRlbXBsYXRlUG9ydGFsIH0gZnJvbSBcIkBhbmd1bGFyL2Nkay9wb3J0YWxcIjtcblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW2xpYlRpbWVwaWNrZXJdJ1xufSlcbmV4cG9ydCBjbGFzcyBUaW1lcGlja2VyRGlyZWN0aXZlIHtcbiAgcHJpdmF0ZSBvcGVuU3RhdHVzOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgnb3JpZ2luRWwnKSBvcmlnaW5FbCA6IGFueTtcbiAgQE91dHB1dCgpIHN0YXR1c0VtaXR0ZXIgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7IFxuXG4gIEBJbnB1dCgnb3BlblN0YXR1cycpICBzZXQgY3JlYXRlT3ZlcmxheU9uSW5wdXQob3BlblN0YXR1cyl7XG4gICAgdGhpcy5vcGVuU3RhdHVzID0gb3BlblN0YXR1cztcbiAgICBpZih0aGlzLm9yaWdpbkVsICYmIHRoaXMub3BlblN0YXR1cykgdGhpcy5jcmVhdGVPdmVybGF5KHRoaXMub3JpZ2luRWwpO1xuICB9OyBcbiAgcHJpdmF0ZSBvdmVybGF5UmVmITogT3ZlcmxheVJlZjtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSB0ZW1wbGF0ZVJlZjogVGVtcGxhdGVSZWY8RWxlbWVudD4sIHByaXZhdGUgb3ZlcmxheTogT3ZlcmxheSwgcHJpdmF0ZSB2aWV3Q29udGFpbmVyUmVmOiBWaWV3Q29udGFpbmVyUmVmKSB7fVxuXG4gIGNyZWF0ZU92ZXJsYXkob3JpZ2luOiBhbnkpOiB2b2lkIHtcbiAgICBjb25zdCBwb3NpdGlvbnMgPSBbXG4gICAgICBuZXcgQ29ubmVjdGlvblBvc2l0aW9uUGFpcih7IG9yaWdpblg6IFwic3RhcnRcIiwgb3JpZ2luWTogXCJib3R0b21cIiB9LCB7IG92ZXJsYXlYOiBcInN0YXJ0XCIsIG92ZXJsYXlZOiBcInRvcFwiIH0sIDAsIDQpLFxuICAgICAgbmV3IENvbm5lY3Rpb25Qb3NpdGlvblBhaXIoeyBvcmlnaW5YOiBcImVuZFwiLCBvcmlnaW5ZOiBcImJvdHRvbVwiIH0sIHsgb3ZlcmxheVg6IFwiZW5kXCIsIG92ZXJsYXlZOiBcInRvcFwiIH0sIDAsIDQpXG4gICAgXTtcblxuICAgIGNvbnN0IG92ZXJsYXlDb25maWcgPSBuZXcgT3ZlcmxheUNvbmZpZyh7XG4gICAgICBoYXNCYWNrZHJvcDogdHJ1ZSxcbiAgICAgIGJhY2tkcm9wQ2xhc3M6IFwiY2RrLW92ZXJsYXktdHJhbnNwYXJlbnQtYmFja2Ryb3BcIixcbiAgICAgIHBvc2l0aW9uU3RyYXRlZ3k6IHRoaXMub3ZlcmxheVxuICAgICAgICAucG9zaXRpb24oKVxuICAgICAgICAvL2Nvbm5lY3RpbmcgdGhlIGRyb3Bkb3duIG92ZXJsYXkgdG8gdGhlIGlucHV0IGVsZW1lbnRcbiAgICAgICAgLmZsZXhpYmxlQ29ubmVjdGVkVG8ob3JpZ2luKVxuICAgICAgICAud2l0aFBvc2l0aW9ucyhbLi4ucG9zaXRpb25zXSlcbiAgICAgICAgLndpdGhQdXNoKHRydWUpXG4gICAgfSk7XG5cbiAgICB0aGlzLm92ZXJsYXlSZWYgPSB0aGlzLm92ZXJsYXkuY3JlYXRlKG92ZXJsYXlDb25maWcpO1xuICAgIGNvbnN0IGRyb3Bkb3duUG9ydGFsID0gbmV3IFRlbXBsYXRlUG9ydGFsKHRoaXMudGVtcGxhdGVSZWYsIHRoaXMudmlld0NvbnRhaW5lclJlZik7XG4gICAgdGhpcy5vdmVybGF5UmVmLmF0dGFjaChkcm9wZG93blBvcnRhbCk7XG4gICAgdGhpcy5vdmVybGF5UmVmLmJhY2tkcm9wQ2xpY2soKS5zdWJzY3JpYmUocmVzcCA9PiB7XG4gICAgICB0aGlzLm9wZW5TdGF0dXMgPSBmYWxzZTtcbiAgICAgIHRoaXMuc3RhdHVzRW1pdHRlci5lbWl0KGZhbHNlKTtcbiAgICAgIHRoaXMub3ZlcmxheVJlZi5kZXRhY2goKTtcbiAgICB9KTtcbiAgfVxuXG4gIGRlc3Ryb3lPdmVybGF5KCl7XG4gICAgdGhpcy5vdmVybGF5UmVmLmRldGFjaCgpO1xuICB9XG4gIFxufVxuIl19
69
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGltZXBpY2tlci5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9taXMtY29tcG9uZW50cy90aW1lcGlja2VyL3RpbWVwaWNrZXIuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFlLE1BQU0sZUFBZSxDQUFDO0FBQy9ELE9BQU8sRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFvQixNQUFNLGVBQWUsQ0FBQztBQUN0RSxPQUFPLEVBQUUsc0JBQXNCLEVBQVcsYUFBYSxFQUFjLE1BQU0sc0JBQXNCLENBQUM7QUFDbEcsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7QUFLckQsTUFBTSxPQUFPLG1CQUFtQjtJQUs5QixJQUEwQixvQkFBb0IsQ0FBQyxVQUFVO1FBQ3ZELElBQUksQ0FBQyxVQUFVLEdBQUcsVUFBVSxDQUFDO1FBQzdCLElBQUcsSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsVUFBVTtZQUFFLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO0lBQ3pFLENBQUM7SUFBQSxDQUFDO0lBRUYsWUFBb0IsV0FBaUMsRUFBVSxPQUFnQixFQUFVLGdCQUFrQztRQUF2RyxnQkFBVyxHQUFYLFdBQVcsQ0FBc0I7UUFBVSxZQUFPLEdBQVAsT0FBTyxDQUFTO1FBQVUscUJBQWdCLEdBQWhCLGdCQUFnQixDQUFrQjtRQVRuSCxlQUFVLEdBQVksS0FBSyxDQUFDO1FBRTFCLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztJQU93RSxDQUFDO0lBRS9ILGFBQWEsQ0FBQyxNQUFXO1FBQ3ZCLE1BQU0sU0FBUyxHQUFHO1lBQ2hCLElBQUksc0JBQXNCLENBQUMsRUFBRSxPQUFPLEVBQUUsT0FBTyxFQUFFLE9BQU8sRUFBRSxRQUFRLEVBQUUsRUFBRSxFQUFFLFFBQVEsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUM7WUFDakgsSUFBSSxzQkFBc0IsQ0FBQyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxRQUFRLEVBQUUsS0FBSyxFQUFFLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztTQUM5RyxDQUFDO1FBRUYsTUFBTSxhQUFhLEdBQUcsSUFBSSxhQUFhLENBQUM7WUFDdEMsV0FBVyxFQUFFLElBQUk7WUFDakIsYUFBYSxFQUFFLGtDQUFrQztZQUNqRCxnQkFBZ0IsRUFBRSxJQUFJLENBQUMsT0FBTztpQkFDM0IsUUFBUSxFQUFFO2dCQUNYLHNEQUFzRDtpQkFDckQsbUJBQW1CLENBQUMsTUFBTSxDQUFDO2lCQUMzQixhQUFhLENBQUMsQ0FBQyxHQUFHLFNBQVMsQ0FBQyxDQUFDO2lCQUM3QixRQUFRLENBQUMsSUFBSSxDQUFDO1NBQ2xCLENBQUMsQ0FBQztRQUVILElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDckQsTUFBTSxjQUFjLEdBQUcsSUFBSSxjQUFjLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxJQUFJLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztRQUNuRixJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQztRQUN2QyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsRUFBRSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsRUFBRTtZQUMvQyxJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztZQUN4QixJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUMvQixJQUFHLElBQUksQ0FBQyxPQUFPLEVBQUMsQ0FBQztnQkFDZixJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sRUFBRSxDQUFDO1lBQzNCLENBQUM7UUFDSCxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxjQUFjO1FBQ1osSUFBRyxJQUFJLENBQUMsT0FBTyxFQUFDLENBQUM7WUFDZixJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sRUFBRSxDQUFDO1FBQzNCLENBQUM7SUFDSCxDQUFDO29IQTdDVSxtQkFBbUI7b0VBQW5CLG1CQUFtQjs7aUZBQW5CLG1CQUFtQjtjQUgvQixTQUFTO2VBQUM7Z0JBQ1QsUUFBUSxFQUFFLGlCQUFpQjthQUM1QjtpR0FHb0IsUUFBUTtrQkFBMUIsS0FBSzttQkFBQyxVQUFVO1lBQ1AsYUFBYTtrQkFBdEIsTUFBTTtZQUVtQixvQkFBb0I7a0JBQTdDLEtBQUs7bUJBQUMsWUFBWSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgT3V0cHV0LCBUZW1wbGF0ZVJlZiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRXZlbnRFbWl0dGVyLCBJbnB1dCwgVmlld0NvbnRhaW5lclJlZiB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBDb25uZWN0aW9uUG9zaXRpb25QYWlyLCBPdmVybGF5LCBPdmVybGF5Q29uZmlnLCBPdmVybGF5UmVmIH0gZnJvbSBcIkBhbmd1bGFyL2Nkay9vdmVybGF5XCI7XG5pbXBvcnQgeyBUZW1wbGF0ZVBvcnRhbCB9IGZyb20gXCJAYW5ndWxhci9jZGsvcG9ydGFsXCI7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tsaWJUaW1lcGlja2VyXSdcbn0pXG5leHBvcnQgY2xhc3MgVGltZXBpY2tlckRpcmVjdGl2ZSB7XG4gIHByaXZhdGUgb3BlblN0YXR1czogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoJ29yaWdpbkVsJykgb3JpZ2luRWwgOiBhbnk7XG4gIEBPdXRwdXQoKSBzdGF0dXNFbWl0dGVyID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpOyBcblxuICBASW5wdXQoJ29wZW5TdGF0dXMnKSAgc2V0IGNyZWF0ZU92ZXJsYXlPbklucHV0KG9wZW5TdGF0dXMpe1xuICAgIHRoaXMub3BlblN0YXR1cyA9IG9wZW5TdGF0dXM7XG4gICAgaWYodGhpcy5vcmlnaW5FbCAmJiB0aGlzLm9wZW5TdGF0dXMpIHRoaXMuY3JlYXRlT3ZlcmxheSh0aGlzLm9yaWdpbkVsKTtcbiAgfTsgXG4gIHByaXZhdGUgb3ZlcmxheVJlZiE6IE92ZXJsYXlSZWY7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgdGVtcGxhdGVSZWY6IFRlbXBsYXRlUmVmPEVsZW1lbnQ+LCBwcml2YXRlIG92ZXJsYXk6IE92ZXJsYXksIHByaXZhdGUgdmlld0NvbnRhaW5lclJlZjogVmlld0NvbnRhaW5lclJlZikge31cblxuICBjcmVhdGVPdmVybGF5KG9yaWdpbjogYW55KTogdm9pZCB7XG4gICAgY29uc3QgcG9zaXRpb25zID0gW1xuICAgICAgbmV3IENvbm5lY3Rpb25Qb3NpdGlvblBhaXIoeyBvcmlnaW5YOiBcInN0YXJ0XCIsIG9yaWdpblk6IFwiYm90dG9tXCIgfSwgeyBvdmVybGF5WDogXCJzdGFydFwiLCBvdmVybGF5WTogXCJ0b3BcIiB9LCAwLCA0KSxcbiAgICAgIG5ldyBDb25uZWN0aW9uUG9zaXRpb25QYWlyKHsgb3JpZ2luWDogXCJlbmRcIiwgb3JpZ2luWTogXCJib3R0b21cIiB9LCB7IG92ZXJsYXlYOiBcImVuZFwiLCBvdmVybGF5WTogXCJ0b3BcIiB9LCAwLCA0KVxuICAgIF07XG5cbiAgICBjb25zdCBvdmVybGF5Q29uZmlnID0gbmV3IE92ZXJsYXlDb25maWcoe1xuICAgICAgaGFzQmFja2Ryb3A6IHRydWUsXG4gICAgICBiYWNrZHJvcENsYXNzOiBcImNkay1vdmVybGF5LXRyYW5zcGFyZW50LWJhY2tkcm9wXCIsXG4gICAgICBwb3NpdGlvblN0cmF0ZWd5OiB0aGlzLm92ZXJsYXlcbiAgICAgICAgLnBvc2l0aW9uKClcbiAgICAgICAgLy9jb25uZWN0aW5nIHRoZSBkcm9wZG93biBvdmVybGF5IHRvIHRoZSBpbnB1dCBlbGVtZW50XG4gICAgICAgIC5mbGV4aWJsZUNvbm5lY3RlZFRvKG9yaWdpbilcbiAgICAgICAgLndpdGhQb3NpdGlvbnMoWy4uLnBvc2l0aW9uc10pXG4gICAgICAgIC53aXRoUHVzaCh0cnVlKVxuICAgIH0pO1xuXG4gICAgdGhpcy5vdmVybGF5UmVmID0gdGhpcy5vdmVybGF5LmNyZWF0ZShvdmVybGF5Q29uZmlnKTtcbiAgICBjb25zdCBkcm9wZG93blBvcnRhbCA9IG5ldyBUZW1wbGF0ZVBvcnRhbCh0aGlzLnRlbXBsYXRlUmVmLCB0aGlzLnZpZXdDb250YWluZXJSZWYpO1xuICAgIHRoaXMub3ZlcmxheVJlZi5hdHRhY2goZHJvcGRvd25Qb3J0YWwpO1xuICAgIHRoaXMub3ZlcmxheVJlZi5iYWNrZHJvcENsaWNrKCkuc3Vic2NyaWJlKHJlc3AgPT4ge1xuICAgICAgdGhpcy5vcGVuU3RhdHVzID0gZmFsc2U7XG4gICAgICB0aGlzLnN0YXR1c0VtaXR0ZXIuZW1pdChmYWxzZSk7XG4gICAgICBpZih0aGlzLm92ZXJsYXkpe1xuICAgICAgICB0aGlzLm92ZXJsYXlSZWYuZGV0YWNoKCk7XG4gICAgICB9XG4gICAgfSk7XG4gIH1cblxuICBkZXN0cm95T3ZlcmxheSgpe1xuICAgIGlmKHRoaXMub3ZlcmxheSl7XG4gICAgICB0aGlzLm92ZXJsYXlSZWYuZGV0YWNoKCk7XG4gICAgfVxuICB9XG4gIFxufVxuIl19
@@ -76,98 +76,100 @@ const _c1 = () => [];
76
76
  const _c2 = a0 => ({ "active-range": a0 });
77
77
  const _c3 = (a0, a1, a2, a3, a4, a5) => ({ "selected-same-day": a0, "selected-start-day": a1, "selected-end-day": a2, "disabled-day": a3, "in-range-day": a4, "is-valid-date": a5 });
78
78
  function TzDrpContainerComponent_div_3_div_1_Template(rf, ctx) { if (rf & 1) {
79
- const _r1 = i0.ɵɵgetCurrentView();
80
- i0.ɵɵelementStart(0, "div")(1, "button", 23);
81
- i0.ɵɵlistener("click", function TzDrpContainerComponent_div_3_div_1_Template_button_click_1_listener() { const item_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.selectRange(item_r2)); });
79
+ const _r2 = i0.ɵɵgetCurrentView();
80
+ i0.ɵɵelementStart(0, "div")(1, "button", 22);
81
+ i0.ɵɵlistener("click", function TzDrpContainerComponent_div_3_div_1_Template_button_click_1_listener() { const item_r3 = i0.ɵɵrestoreView(_r2).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.selectRange(item_r3)); });
82
82
  i0.ɵɵtext(2);
83
83
  i0.ɵɵelementEnd()();
84
84
  } if (rf & 2) {
85
- const item_r2 = ctx.$implicit;
86
- const ctx_r2 = i0.ɵɵnextContext(2);
85
+ const item_r3 = ctx.$implicit;
86
+ const ctx_r3 = i0.ɵɵnextContext(2);
87
87
  i0.ɵɵadvance();
88
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(2, _c2, ctx_r2.selectedItemLabel === item_r2.label));
88
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(2, _c2, ctx_r3.selectedItemLabel === item_r3.label));
89
89
  i0.ɵɵadvance();
90
- i0.ɵɵtextInterpolate1(" ", item_r2.label, " ");
90
+ i0.ɵɵtextInterpolate1(" ", item_r3.label, " ");
91
91
  } }
92
92
  function TzDrpContainerComponent_div_3_Template(rf, ctx) { if (rf & 1) {
93
+ const _r1 = i0.ɵɵgetCurrentView();
93
94
  i0.ɵɵelementStart(0, "div", 20);
94
95
  i0.ɵɵtemplate(1, TzDrpContainerComponent_div_3_div_1_Template, 3, 4, "div", 21);
95
96
  i0.ɵɵelementStart(2, "div")(3, "button", 22);
97
+ i0.ɵɵlistener("click", function TzDrpContainerComponent_div_3_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r1); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.resetRange()); });
96
98
  i0.ɵɵtext(4, "Custom Range");
97
99
  i0.ɵɵelementEnd()()();
98
100
  } if (rf & 2) {
99
101
  let tmp_1_0;
100
- const ctx_r2 = i0.ɵɵnextContext();
102
+ const ctx_r3 = i0.ɵɵnextContext();
101
103
  i0.ɵɵadvance();
102
- i0.ɵɵproperty("ngForOf", (tmp_1_0 = ctx_r2.data == null ? null : ctx_r2.data.dpConfig == null ? null : ctx_r2.data.dpConfig.ranges) !== null && tmp_1_0 !== undefined ? tmp_1_0 : i0.ɵɵpureFunction0(2, _c1));
104
+ i0.ɵɵproperty("ngForOf", (tmp_1_0 = ctx_r3.data == null ? null : ctx_r3.data.dpConfig == null ? null : ctx_r3.data.dpConfig.ranges) !== null && tmp_1_0 !== undefined ? tmp_1_0 : i0.ɵɵpureFunction0(2, _c1));
103
105
  i0.ɵɵadvance(2);
104
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c2, ctx_r2.selectedItemLabel === "Custom Range"));
106
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c2, ctx_r3.selectedItemLabel === "Custom Range"));
105
107
  } }
106
108
  function TzDrpContainerComponent_div_17_Template(rf, ctx) { if (rf & 1) {
107
- i0.ɵɵelementStart(0, "div", 24)(1, "span");
109
+ i0.ɵɵelementStart(0, "div", 23)(1, "span");
108
110
  i0.ɵɵtext(2);
109
111
  i0.ɵɵelementEnd()();
110
112
  } if (rf & 2) {
111
- const weekDay_r4 = ctx.$implicit;
113
+ const weekDay_r5 = ctx.$implicit;
112
114
  i0.ɵɵadvance(2);
113
- i0.ɵɵtextInterpolate(weekDay_r4.label);
115
+ i0.ɵɵtextInterpolate(weekDay_r5.label);
114
116
  } }
115
117
  function TzDrpContainerComponent_div_19_span_1_Template(rf, ctx) { if (rf & 1) {
116
- i0.ɵɵelementStart(0, "span", 27);
118
+ i0.ɵɵelementStart(0, "span", 26);
117
119
  i0.ɵɵtext(1);
118
120
  i0.ɵɵelementEnd();
119
121
  } if (rf & 2) {
120
- const day_r6 = i0.ɵɵnextContext().$implicit;
121
- const ctx_r2 = i0.ɵɵnextContext();
122
- i0.ɵɵproperty("tabindex", day_r6.isDisabledDay ? -1 : 0);
123
- i0.ɵɵattribute("aria-label", ctx_r2.retractDayMonth(day_r6.date, ctx_r2.currentMonth, ctx_r2.currentYearNumber));
122
+ const day_r7 = i0.ɵɵnextContext().$implicit;
123
+ const ctx_r3 = i0.ɵɵnextContext();
124
+ i0.ɵɵproperty("tabindex", day_r7.isDisabledDay ? -1 : 0);
125
+ i0.ɵɵattribute("aria-label", ctx_r3.retractDayMonth(day_r7.date, ctx_r3.currentMonth, ctx_r3.currentYearNumber));
124
126
  i0.ɵɵadvance();
125
- i0.ɵɵtextInterpolate1(" ", day_r6.date, " ");
127
+ i0.ɵɵtextInterpolate1(" ", day_r7.date, " ");
126
128
  } }
127
129
  function TzDrpContainerComponent_div_19_Template(rf, ctx) { if (rf & 1) {
128
- const _r5 = i0.ɵɵgetCurrentView();
129
- i0.ɵɵelementStart(0, "div", 25);
130
- i0.ɵɵlistener("click", function TzDrpContainerComponent_div_19_Template_div_click_0_listener() { const day_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.selectDay("LEFT", day_r6)); })("keyup.enter", function TzDrpContainerComponent_div_19_Template_div_keyup_enter_0_listener() { const day_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.selectDay("LEFT", day_r6)); });
131
- i0.ɵɵtemplate(1, TzDrpContainerComponent_div_19_span_1_Template, 2, 3, "span", 26);
130
+ const _r6 = i0.ɵɵgetCurrentView();
131
+ i0.ɵɵelementStart(0, "div", 24);
132
+ i0.ɵɵlistener("click", function TzDrpContainerComponent_div_19_Template_div_click_0_listener() { const day_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.selectDay("LEFT", day_r7)); })("keyup.enter", function TzDrpContainerComponent_div_19_Template_div_keyup_enter_0_listener() { const day_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.selectDay("LEFT", day_r7)); });
133
+ i0.ɵɵtemplate(1, TzDrpContainerComponent_div_19_span_1_Template, 2, 3, "span", 25);
132
134
  i0.ɵɵelementEnd();
133
135
  } if (rf & 2) {
134
- const day_r6 = ctx.$implicit;
135
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction6(2, _c3, day_r6.isSelectedStartDay && day_r6.isSelectedEndDay, day_r6.isSelectedStartDay, day_r6.isSelectedEndDay, day_r6.isDisabledDay, day_r6.inRangeDay, day_r6.date > 0 && !(day_r6.isSelectedStartDay && day_r6.isSelectedEndDay)));
136
+ const day_r7 = ctx.$implicit;
137
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction6(2, _c3, day_r7.isSelectedStartDay && day_r7.isSelectedEndDay, day_r7.isSelectedStartDay, day_r7.isSelectedEndDay, day_r7.isDisabledDay, day_r7.inRangeDay, day_r7.date > 0 && !(day_r7.isSelectedStartDay && day_r7.isSelectedEndDay)));
136
138
  i0.ɵɵadvance();
137
- i0.ɵɵproperty("ngIf", day_r6.date > 0);
139
+ i0.ɵɵproperty("ngIf", day_r7.date > 0);
138
140
  } }
139
141
  function TzDrpContainerComponent_div_30_Template(rf, ctx) { if (rf & 1) {
140
- i0.ɵɵelementStart(0, "div", 24)(1, "span");
142
+ i0.ɵɵelementStart(0, "div", 23)(1, "span");
141
143
  i0.ɵɵtext(2);
142
144
  i0.ɵɵelementEnd()();
143
145
  } if (rf & 2) {
144
- const weekDay_r7 = ctx.$implicit;
146
+ const weekDay_r8 = ctx.$implicit;
145
147
  i0.ɵɵadvance(2);
146
- i0.ɵɵtextInterpolate(weekDay_r7.label);
148
+ i0.ɵɵtextInterpolate(weekDay_r8.label);
147
149
  } }
148
150
  function TzDrpContainerComponent_div_32_span_1_Template(rf, ctx) { if (rf & 1) {
149
- i0.ɵɵelementStart(0, "span", 27);
151
+ i0.ɵɵelementStart(0, "span", 26);
150
152
  i0.ɵɵtext(1);
151
153
  i0.ɵɵelementEnd();
152
154
  } if (rf & 2) {
153
- const day_r9 = i0.ɵɵnextContext().$implicit;
154
- const ctx_r2 = i0.ɵɵnextContext();
155
- i0.ɵɵproperty("tabindex", day_r9.isDisabledDay ? -1 : 0);
156
- i0.ɵɵattribute("aria-label", ctx_r2.retractDayMonth(day_r9.date, ctx_r2.nextMonth, ctx_r2.nextYearNumber));
155
+ const day_r10 = i0.ɵɵnextContext().$implicit;
156
+ const ctx_r3 = i0.ɵɵnextContext();
157
+ i0.ɵɵproperty("tabindex", day_r10.isDisabledDay ? -1 : 0);
158
+ i0.ɵɵattribute("aria-label", ctx_r3.retractDayMonth(day_r10.date, ctx_r3.nextMonth, ctx_r3.nextYearNumber));
157
159
  i0.ɵɵadvance();
158
- i0.ɵɵtextInterpolate1(" ", day_r9.date, " ");
160
+ i0.ɵɵtextInterpolate1(" ", day_r10.date, " ");
159
161
  } }
160
162
  function TzDrpContainerComponent_div_32_Template(rf, ctx) { if (rf & 1) {
161
- const _r8 = i0.ɵɵgetCurrentView();
162
- i0.ɵɵelementStart(0, "div", 25);
163
- i0.ɵɵlistener("click", function TzDrpContainerComponent_div_32_Template_div_click_0_listener() { const day_r9 = i0.ɵɵrestoreView(_r8).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.selectDay("RIGHT", day_r9)); })("keyup.enter", function TzDrpContainerComponent_div_32_Template_div_keyup_enter_0_listener() { const day_r9 = i0.ɵɵrestoreView(_r8).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.selectDay("RIGHT", day_r9)); });
164
- i0.ɵɵtemplate(1, TzDrpContainerComponent_div_32_span_1_Template, 2, 3, "span", 26);
163
+ const _r9 = i0.ɵɵgetCurrentView();
164
+ i0.ɵɵelementStart(0, "div", 24);
165
+ i0.ɵɵlistener("click", function TzDrpContainerComponent_div_32_Template_div_click_0_listener() { const day_r10 = i0.ɵɵrestoreView(_r9).$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.selectDay("RIGHT", day_r10)); })("keyup.enter", function TzDrpContainerComponent_div_32_Template_div_keyup_enter_0_listener() { const day_r10 = i0.ɵɵrestoreView(_r9).$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.selectDay("RIGHT", day_r10)); });
166
+ i0.ɵɵtemplate(1, TzDrpContainerComponent_div_32_span_1_Template, 2, 3, "span", 25);
165
167
  i0.ɵɵelementEnd();
166
168
  } if (rf & 2) {
167
- const day_r9 = ctx.$implicit;
168
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction6(2, _c3, day_r9.isSelectedStartDay && day_r9.isSelectedEndDay, day_r9.isSelectedStartDay, day_r9.isSelectedEndDay, day_r9.isDisabledDay, day_r9.inRangeDay, day_r9.date > 0 && !(day_r9.isSelectedStartDay && day_r9.isSelectedEndDay)));
169
+ const day_r10 = ctx.$implicit;
170
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction6(2, _c3, day_r10.isSelectedStartDay && day_r10.isSelectedEndDay, day_r10.isSelectedStartDay, day_r10.isSelectedEndDay, day_r10.isDisabledDay, day_r10.inRangeDay, day_r10.date > 0 && !(day_r10.isSelectedStartDay && day_r10.isSelectedEndDay)));
169
171
  i0.ɵɵadvance();
170
- i0.ɵɵproperty("ngIf", day_r9.date > 0);
172
+ i0.ɵɵproperty("ngIf", day_r10.date > 0);
171
173
  } }
172
174
  dayjs.extend(isBetween);
173
175
  dayjs.extend(utc);
@@ -178,6 +180,7 @@ dayjs.extend(isSameOrBefore);
178
180
  class TzDrpContainerComponent {
179
181
  constructor(data, toast) {
180
182
  this.toast = toast;
183
+ this.CUSTOM_RANGE_LABEL = "Custom Range";
181
184
  this.dayjsInstance = (...args) => {
182
185
  return tz(args[0], args[1] || 'DD/MM/YYYY', this.data.dpConfig.timezone || 'Asia/Kolkata');
183
186
  };
@@ -189,13 +192,17 @@ class TzDrpContainerComponent {
189
192
  this.isNextMonthDisabled = false;
190
193
  this.selectionStarted = false;
191
194
  this.isDatesValid = false;
192
- this.selectedItemLabel = "Custom Range";
195
+ this.selectedItemLabel = this.CUSTOM_RANGE_LABEL;
193
196
  this.data = data;
194
197
  this.localSelectedDates = this.data.dates;
195
198
  this.isDatesValid = false;
196
199
  if (this.localSelectedDates.startDate && this.localSelectedDates.endDate) {
197
200
  this.isDatesValid = true;
198
201
  }
202
+ // Initialize selectedItemLabel from data.selectedRangeLabel if available
203
+ if (this.data.selectedRangeLabel) {
204
+ this.selectedItemLabel = this.data.selectedRangeLabel;
205
+ }
199
206
  if (this.data?.dpConfig?.timezone) {
200
207
  this.dayjsInstance = (...args) => {
201
208
  return tz(args[0], args[1], this.data.dpConfig.timezone);
@@ -351,7 +358,7 @@ class TzDrpContainerComponent {
351
358
  if (day.date <= 0)
352
359
  return;
353
360
  if (!day.isDisabledDay) {
354
- this.selectedItemLabel = "Custom Range";
361
+ this.selectedItemLabel = this.CUSTOM_RANGE_LABEL;
355
362
  if (this.selectionStarted) {
356
363
  const dayjsDay = dayjs()
357
364
  .year(from === "LEFT" ? this.currentYearNumber : this.nextYearNumber)
@@ -360,7 +367,8 @@ class TzDrpContainerComponent {
360
367
  if (dayjsDay.isBefore(dayjs(this.localSelectedDates.startDate, this.data.dpConfig.format), 'day')) {
361
368
  this.localSelectedDates = {
362
369
  startDate: dayjsDay.format(this.data.dpConfig.format),
363
- endDate: null
370
+ endDate: null,
371
+ selectedRangeLabel: this.CUSTOM_RANGE_LABEL
364
372
  };
365
373
  this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
366
374
  this.nextMonthDates = this.generateDates(this.nextMonthNumber, this.nextYearNumber);
@@ -369,7 +377,8 @@ class TzDrpContainerComponent {
369
377
  this.selectionStarted = false;
370
378
  this.localSelectedDates = {
371
379
  ...this.localSelectedDates,
372
- endDate: dayjsDay.format(this.data.dpConfig.format)
380
+ endDate: dayjsDay.format(this.data.dpConfig.format),
381
+ selectedRangeLabel: this.CUSTOM_RANGE_LABEL
373
382
  };
374
383
  }
375
384
  else {
@@ -380,7 +389,8 @@ class TzDrpContainerComponent {
380
389
  .month(from === "LEFT" ? this.currentMonthNumber : this.nextMonthNumber)
381
390
  .date(day.date)
382
391
  .format(this.data.dpConfig.format),
383
- endDate: null
392
+ endDate: null,
393
+ selectedRangeLabel: this.CUSTOM_RANGE_LABEL
384
394
  };
385
395
  }
386
396
  this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
@@ -421,15 +431,35 @@ class TzDrpContainerComponent {
421
431
  this.nextMonthNumber = this.currentMonthNumber + 1;
422
432
  this.nextYearNumber = this.currentYearNumber;
423
433
  }
424
- this.localSelectedDates = { startDate: startDateStr, endDate: endDateStr };
434
+ this.localSelectedDates = {
435
+ startDate: startDateStr,
436
+ endDate: endDateStr,
437
+ selectedRangeLabel: item.label
438
+ };
425
439
  this.currentMonth = getMonth(this.currentMonthNumber);
426
440
  this.nextMonth = getMonth(this.nextMonthNumber);
427
441
  this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
428
442
  this.nextMonthDates = this.generateDates(this.nextMonthNumber, this.nextYearNumber);
429
443
  this.isDatesValid = !!(this.localSelectedDates.startDate && this.localSelectedDates.endDate);
430
444
  }
445
+ resetRange() {
446
+ this.selectedItemLabel = this.CUSTOM_RANGE_LABEL;
447
+ this.localSelectedDates = {
448
+ startDate: null,
449
+ endDate: null,
450
+ selectedRangeLabel: this.CUSTOM_RANGE_LABEL
451
+ };
452
+ this.selectionStarted = false;
453
+ this.isDatesValid = false;
454
+ this.currentMonthDates = this.generateDates(this.currentMonthNumber, this.currentYearNumber);
455
+ this.nextMonthDates = this.generateDates(this.nextMonthNumber, this.nextYearNumber);
456
+ }
431
457
  applyDates() {
432
- this.data.dateChange(this.localSelectedDates);
458
+ const result = {
459
+ ...this.localSelectedDates,
460
+ selectedRangeLabel: this.selectedItemLabel
461
+ };
462
+ this.data.dateChange(result);
433
463
  }
434
464
  cancelDatePicker() {
435
465
  this.data.close();
@@ -437,7 +467,7 @@ class TzDrpContainerComponent {
437
467
  static { this.ɵfac = function TzDrpContainerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TzDrpContainerComponent)(i0.ɵɵdirectiveInject(CONTAINER_DATA), i0.ɵɵdirectiveInject(i1.ToastService)); }; }
438
468
  static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TzDrpContainerComponent, selectors: [["mis-tz-drp"]], hostBindings: function TzDrpContainerComponent_HostBindings(rf, ctx) { if (rf & 1) {
439
469
  i0.ɵɵlistener("keydown.esc", function TzDrpContainerComponent_keydown_esc_HostBindingHandler() { return ctx.closeOnEsc(); });
440
- } }, decls: 38, vars: 20, consts: [["aria-label", "date range picker", "cdkTrapFocus", "", 1, "daterangepicker-container", 3, "cdkTrapFocusAutoCapture"], [1, "daterangepicker-container__view"], ["tabindex", "-1", "cdkFocusInitial", ""], ["class", "daterangepicker-container__ranges", 4, "ngIf"], [1, "datepicker__left"], [1, "daterangepicker-container__header__prabu"], ["tabindex", "0", "aria-label", "Previous Month", 1, "daterangepicker-container__arrow__icon", 3, "click", "keyup.enter", "ngClass"], ["width", "20", "height", "16", "viewBox", "0 0 20 16", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["d", "M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z", "fill", "#181F33"], ["tabindex", "0", "aria-label", "Next Month", 1, "daterangepicker-container__arrow__icon", "mobile_view", 3, "click", "keyup.enter", "ngClass"], [1, "daterangepicker-container__body"], [1, "daterangepicker-container__weekdays"], ["class", "daterangepicker-container__weekday", 4, "ngFor", "ngForOf"], [1, "daterangepicker-container__days"], ["class", "daterangepicker-container__day", 3, "ngClass", "click", "keyup.enter", 4, "ngFor", "ngForOf"], [1, "datepicker__right"], ["tabindex", "0", 1, "daterangepicker-container__arrow__icon", "pc_view", 3, "click", "keyup.enter", "ngClass"], [1, "daterangepicker__footer"], ["mis-button", "", "type", "none", "id", "mobile-footer-btn", 3, "click"], ["mis-button", "", "type", "primary", "id", "mobile-footer-btn", 3, "click", "disabled"], [1, "daterangepicker-container__ranges"], [4, "ngFor", "ngForOf"], [1, "mis-btn", 3, "ngClass"], [1, "mis-btn", 3, "click", "ngClass"], [1, "daterangepicker-container__weekday"], [1, "daterangepicker-container__day", 3, "click", "keyup.enter", "ngClass"], [3, "tabindex", 4, "ngIf"], [3, "tabindex"]], template: function TzDrpContainerComponent_Template(rf, ctx) { if (rf & 1) {
470
+ } }, decls: 38, vars: 20, consts: [["aria-label", "date range picker", "cdkTrapFocus", "", 1, "daterangepicker-container", 3, "cdkTrapFocusAutoCapture"], [1, "daterangepicker-container__view"], ["tabindex", "-1", "cdkFocusInitial", ""], ["class", "daterangepicker-container__ranges", 4, "ngIf"], [1, "datepicker__left"], [1, "daterangepicker-container__header__prabu"], ["tabindex", "0", "aria-label", "Previous Month", 1, "daterangepicker-container__arrow__icon", 3, "click", "keyup.enter", "ngClass"], ["width", "20", "height", "16", "viewBox", "0 0 20 16", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["d", "M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z", "fill", "#181F33"], ["tabindex", "0", "aria-label", "Next Month", 1, "daterangepicker-container__arrow__icon", "mobile_view", 3, "click", "keyup.enter", "ngClass"], [1, "daterangepicker-container__body"], [1, "daterangepicker-container__weekdays"], ["class", "daterangepicker-container__weekday", 4, "ngFor", "ngForOf"], [1, "daterangepicker-container__days"], ["class", "daterangepicker-container__day", 3, "ngClass", "click", "keyup.enter", 4, "ngFor", "ngForOf"], [1, "datepicker__right"], ["tabindex", "0", 1, "daterangepicker-container__arrow__icon", "pc_view", 3, "click", "keyup.enter", "ngClass"], [1, "daterangepicker__footer"], ["mis-button", "", "type", "none", "id", "mobile-footer-btn", 3, "click"], ["mis-button", "", "type", "primary", "id", "mobile-footer-btn", 3, "click", "disabled"], [1, "daterangepicker-container__ranges"], [4, "ngFor", "ngForOf"], [1, "mis-btn", 3, "click", "ngClass"], [1, "daterangepicker-container__weekday"], [1, "daterangepicker-container__day", 3, "click", "keyup.enter", "ngClass"], [3, "tabindex", 4, "ngIf"], [3, "tabindex"]], template: function TzDrpContainerComponent_Template(rf, ctx) { if (rf & 1) {
441
471
  i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
442
472
  i0.ɵɵelement(2, "div", 2);
443
473
  i0.ɵɵtemplate(3, TzDrpContainerComponent_div_3_Template, 5, 5, "div", 3);
@@ -519,7 +549,7 @@ class TzDrpContainerComponent {
519
549
  }
520
550
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TzDrpContainerComponent, [{
521
551
  type: Component,
522
- args: [{ selector: "mis-tz-drp", template: "<div class=\"daterangepicker-container\" aria-label=\"date range picker\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\n <div class=\"daterangepicker-container__view\">\n <div tabindex=\"-1\" cdkFocusInitial></div>\n <div *ngIf=\"data?.dpConfig?.ranges?.length > 0\" class=\"daterangepicker-container__ranges\">\n <div *ngFor=\"let item of data?.dpConfig?.ranges ?? []\" >\n <button\n [ngClass]=\"{'active-range' : selectedItemLabel === item.label}\"\n (click)=\"selectRange(item)\"\n class=\"mis-btn\"\n >\n {{ item.label }}\n </button>\n </div>\n <div> <button class=\"mis-btn\" [ngClass]=\"{'active-range' : selectedItemLabel === 'Custom Range'}\">Custom Range</button> </div>\n </div>\n <div class=\"datepicker__left\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div\n class=\"daterangepicker-container__arrow__icon\"\n tabindex=\"0\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n (keyup.enter)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n aria-label=\"Previous Month\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div></div>\n <!-- Button visible in mobile view -->\n <div\n class=\"daterangepicker-container__arrow__icon mobile_view\"\n tabindex=\"0\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n (keyup.enter)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n aria-label=\"Next Month\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n <span>{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\" \n [ngClass]=\"{\n 'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n 'selected-start-day': day.isSelectedStartDay,\n 'selected-end-day': day.isSelectedEndDay,\n 'disabled-day': day.isDisabledDay,\n 'in-range-day': day.inRangeDay,\n 'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay('LEFT', day)\"\n (keyup.enter)=\"selectDay('LEFT', day)\"\n >\n <span *ngIf=\"day.date > 0\"\n [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n [attr.aria-label]=\"retractDayMonth(day.date, currentMonth, currentYearNumber)\">\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n <div class=\"datepicker__right\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div></div>\n <span> {{ nextMonth }} {{ nextYearNumber }} </span>\n <div\n class=\"daterangepicker-container__arrow__icon pc_view\"\n tabindex=\"0\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n (keyup.enter)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n <span>{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\"\n [ngClass]=\"{\n 'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n 'selected-start-day': day.isSelectedStartDay,\n 'selected-end-day': day.isSelectedEndDay,\n 'disabled-day': day.isDisabledDay,\n 'in-range-day': day.inRangeDay,\n 'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n *ngFor=\"let day of nextMonthDates\"\n (click)=\"selectDay('RIGHT', day)\"\n (keyup.enter)=\"selectDay('RIGHT', day)\"\n >\n <span *ngIf=\"day.date > 0\"\n [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n [attr.aria-label]=\"retractDayMonth(day.date, nextMonth, nextYearNumber)\">\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"daterangepicker__footer\">\n <button mis-button type=\"none\" id='mobile-footer-btn' (click)=\"cancelDatePicker()\">Cancel</button>\n <button mis-button type=\"primary\" id=\"mobile-footer-btn\" (click)=\"applyDates()\" [disabled]=\"!isDatesValid\">Apply</button>\n </div>\n</div>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-disabled: #929DAB;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3}.daterangepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}@media only screen and (max-width: 900px){.daterangepicker-container{max-width:100vw;border:none}}.daterangepicker-container .daterangepicker-container__view{display:flex;gap:24px;padding:16px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__ranges{display:flex;flex-direction:column}.daterangepicker-container .daterangepicker-container__view .mis-btn{background:none;outline:none;border:none;cursor:pointer;border-radius:4px;vertical-align:middle;text-align:center;box-sizing:border-box;display:flex;align-items:center;text-decoration:none;justify-content:center;padding:10px 16px;font-size:16px;line-height:24px;background-color:transparent;color:#0937b2}.daterangepicker-container .daterangepicker-container__view .active-range{background-color:#cadcfb}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view{flex-direction:column;align-items:center;position:fixed;bottom:0;left:0;background-color:#fff;width:100%;max-height:68vh;overflow-y:auto;border-radius:30px;gap:24px;padding:10% 0 30%;box-shadow:0 -4px 8px 10000px #0000001f;scrollbar-width:none;-ms-overflow-style:none}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__view::-webkit-scrollbar{display:none}}.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{display:flex;flex-direction:column}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{width:90%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:10%}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{margin:0 auto;font-size:4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{width:7%}}@media only screen and (min-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .mobile_view{display:none}}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .pc_view{display:none}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{height:100%;width:252px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{width:100%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{width:36px;height:18px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{margin:0 auto}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:3vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-wrap:wrap}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{width:36px;height:36px;display:flex;align-items:center;justify-content:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{flex:0 0 14.2857142857%;width:14.2857142857%;height:14.2857142857%;aspect-ratio:1}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day{cursor:default}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day:hover{background-color:transparent}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day>span{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day)>span{color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:#cbddfb;cursor:pointer}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:3.4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.selected-day{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.disabled-day{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day{background-color:#0937b2;border-radius:50%!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day{background-color:#0937b2;border-radius:20px 4px 4px 20px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day{background-color:#0937b2;border-radius:0 20px 20px 0}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .in-range-day:not(.disabled-day){background-color:#cbddfb}.daterangepicker-container .daterangepicker__footer{display:flex;justify-content:flex-end;border-top:1px solid #e0e0e0;padding:16px 24px;gap:24px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker__footer{justify-content:space-evenly;padding:2% 0;background-color:#fff;position:fixed;bottom:0;left:0;width:100%;height:8vh;border-top:2px solid #C8CDD3}.daterangepicker-container .daterangepicker__footer #mobile-footer-btn{width:36%;font-size:3.8vw}}\n"] }]
552
+ args: [{ selector: "mis-tz-drp", template: "<div class=\"daterangepicker-container\" aria-label=\"date range picker\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\n <div class=\"daterangepicker-container__view\">\n <div tabindex=\"-1\" cdkFocusInitial></div>\n <div *ngIf=\"data?.dpConfig?.ranges?.length > 0\" class=\"daterangepicker-container__ranges\">\n <div *ngFor=\"let item of data?.dpConfig?.ranges ?? []\" >\n <button\n [ngClass]=\"{'active-range' : selectedItemLabel === item.label}\"\n (click)=\"selectRange(item)\"\n class=\"mis-btn\"\n >\n {{ item.label }}\n </button>\n </div>\n <div> <button class=\"mis-btn\" [ngClass]=\"{'active-range' : selectedItemLabel === 'Custom Range'}\" (click)=\"resetRange()\">Custom Range</button> </div>\n </div>\n <div class=\"datepicker__left\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div\n class=\"daterangepicker-container__arrow__icon\"\n tabindex=\"0\"\n (click)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n (keyup.enter)=\"!isPreviousMonthDisabled && navigateMonth('PREVIOUS')\"\n aria-label=\"Previous Month\"\n [ngClass]=\"{\n 'disabled-month': isPreviousMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n <span> {{ currentMonth }} {{ currentYearNumber }} </span>\n <div></div>\n <!-- Button visible in mobile view -->\n <div\n class=\"daterangepicker-container__arrow__icon mobile_view\"\n tabindex=\"0\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n (keyup.enter)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n aria-label=\"Next Month\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n <span>{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\" \n [ngClass]=\"{\n 'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n 'selected-start-day': day.isSelectedStartDay,\n 'selected-end-day': day.isSelectedEndDay,\n 'disabled-day': day.isDisabledDay,\n 'in-range-day': day.inRangeDay,\n 'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n *ngFor=\"let day of currentMonthDates\"\n (click)=\"selectDay('LEFT', day)\"\n (keyup.enter)=\"selectDay('LEFT', day)\"\n >\n <span *ngIf=\"day.date > 0\"\n [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n [attr.aria-label]=\"retractDayMonth(day.date, currentMonth, currentYearNumber)\">\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n <div class=\"datepicker__right\">\n <div class=\"daterangepicker-container__header__prabu\">\n <div></div>\n <span> {{ nextMonth }} {{ nextYearNumber }} </span>\n <div\n class=\"daterangepicker-container__arrow__icon pc_view\"\n tabindex=\"0\"\n (click)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n (keyup.enter)=\"!isNextMonthDisabled && navigateMonth('NEXT')\"\n [ngClass]=\"{\n 'disabled-month': isNextMonthDisabled\n }\"\n >\n <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n fill=\"#181F33\"\n ></path>\n </svg>\n </div>\n </div>\n <div class=\"daterangepicker-container__body\">\n <div class=\"daterangepicker-container__weekdays\">\n <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays\">\n <span>{{ weekDay.label }}</span>\n </div>\n </div>\n <div class=\"daterangepicker-container__days\">\n <div\n class=\"daterangepicker-container__day\"\n [ngClass]=\"{\n 'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n 'selected-start-day': day.isSelectedStartDay,\n 'selected-end-day': day.isSelectedEndDay,\n 'disabled-day': day.isDisabledDay,\n 'in-range-day': day.inRangeDay,\n 'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n }\"\n *ngFor=\"let day of nextMonthDates\"\n (click)=\"selectDay('RIGHT', day)\"\n (keyup.enter)=\"selectDay('RIGHT', day)\"\n >\n <span *ngIf=\"day.date > 0\"\n [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n [attr.aria-label]=\"retractDayMonth(day.date, nextMonth, nextYearNumber)\">\n {{ day.date }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"daterangepicker__footer\">\n <button mis-button type=\"none\" id='mobile-footer-btn' (click)=\"cancelDatePicker()\">Cancel</button>\n <button mis-button type=\"primary\" id=\"mobile-footer-btn\" (click)=\"applyDates()\" [disabled]=\"!isDatesValid\">Apply</button>\n </div>\n</div>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-disabled: #929DAB;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3}.daterangepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}@media only screen and (max-width: 900px){.daterangepicker-container{max-width:100vw;border:none}}.daterangepicker-container .daterangepicker-container__view{display:flex;gap:24px;padding:16px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__ranges{display:flex;flex-direction:column}.daterangepicker-container .daterangepicker-container__view .mis-btn{background:none;outline:none;border:none;cursor:pointer;border-radius:4px;vertical-align:middle;text-align:center;box-sizing:border-box;display:flex;align-items:center;text-decoration:none;justify-content:center;padding:10px 16px;font-size:16px;line-height:24px;background-color:transparent;color:#0937b2}.daterangepicker-container .daterangepicker-container__view .active-range{background-color:#cadcfb}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view{flex-direction:column;align-items:center;position:fixed;bottom:0;left:0;background-color:#fff;width:100%;max-height:68vh;overflow-y:auto;border-radius:30px;gap:24px;padding:10% 0 30%;box-shadow:0 -4px 8px 10000px #0000001f;scrollbar-width:none;-ms-overflow-style:none}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__view::-webkit-scrollbar{display:none}}.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{display:flex;flex-direction:column}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{width:90%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:10%}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{margin:0 auto;font-size:4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{width:7%}}@media only screen and (min-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .mobile_view{display:none}}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .pc_view{display:none}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{height:100%;width:252px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{width:100%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{width:36px;height:18px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{margin:0 auto}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:3vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-wrap:wrap}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{width:36px;height:36px;display:flex;align-items:center;justify-content:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{flex:0 0 14.2857142857%;width:14.2857142857%;height:14.2857142857%;aspect-ratio:1}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day{cursor:default}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day:hover{background-color:transparent}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day>span{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day)>span{color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:#cbddfb;cursor:pointer}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:3.4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.selected-day{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.disabled-day{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day{background-color:#0937b2;border-radius:50%!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day{background-color:#0937b2;border-radius:20px 4px 4px 20px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day{background-color:#0937b2;border-radius:0 20px 20px 0}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .in-range-day:not(.disabled-day){background-color:#cbddfb}.daterangepicker-container .daterangepicker__footer{display:flex;justify-content:flex-end;border-top:1px solid #e0e0e0;padding:16px 24px;gap:24px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker__footer{justify-content:space-evenly;padding:2% 0;background-color:#fff;position:fixed;bottom:0;left:0;width:100%;height:8vh;border-top:2px solid #C8CDD3}.daterangepicker-container .daterangepicker__footer #mobile-footer-btn{width:36%;font-size:3.8vw}}\n"] }]
523
553
  }], () => [{ type: undefined, decorators: [{
524
554
  type: Inject,
525
555
  args: [CONTAINER_DATA]
@@ -549,6 +579,7 @@ class TzDaterangepickerDirective {
549
579
  maxAllowedRange: 0,
550
580
  ranges: []
551
581
  };
582
+ this.selectedRangeLabel = 'Custom Range';
552
583
  this.dateMessages = [];
553
584
  this.positionX = "center";
554
585
  this.positionY = "bottom";
@@ -607,6 +638,7 @@ class TzDaterangepickerDirective {
607
638
  dates: this.control?.control.value || this.dates,
608
639
  dpConfig: this.dpConfig,
609
640
  datesDisabled: this.dpDisabledDates,
641
+ selectedRangeLabel: this.selectedRangeLabel,
610
642
  dateChange: this.applyDate.bind(this),
611
643
  close: this.close.bind(this)
612
644
  }
@@ -622,9 +654,14 @@ class TzDaterangepickerDirective {
622
654
  });
623
655
  }
624
656
  applyDate(dates) {
625
- this.dateChange.emit(dates);
626
- this.control?.control.patchValue(dates);
627
- this.dates = dates;
657
+ // If selectedRangeLabel is present in the date object, keep it, otherwise it's a custom range
658
+ const result = {
659
+ ...dates,
660
+ selectedRangeLabel: dates['selectedRangeLabel'] || 'Custom Range'
661
+ };
662
+ this.dateChange.emit(result);
663
+ this.control?.control.patchValue(result);
664
+ this.dates = result;
628
665
  this.close();
629
666
  }
630
667
  close() {
@@ -635,7 +672,7 @@ class TzDaterangepickerDirective {
635
672
  static { this.ɵfac = function TzDaterangepickerDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TzDaterangepickerDirective)(i0.ɵɵdirectiveInject(i1$1.NgControl, 10), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i2$1.Overlay), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); }; }
636
673
  static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TzDaterangepickerDirective, selectors: [["input", "misTzDrp", ""]], hostBindings: function TzDaterangepickerDirective_HostBindings(rf, ctx) { if (rf & 1) {
637
674
  i0.ɵɵlistener("click", function TzDaterangepickerDirective_click_HostBindingHandler() { return ctx.toggleDatePicker(); })("keydown.enter", function TzDaterangepickerDirective_keydown_enter_HostBindingHandler() { return ctx.toggleDatePickerOnEnter(); })("keydown.esc", function TzDaterangepickerDirective_keydown_esc_HostBindingHandler() { return ctx.closeOnEsc(); });
638
- } }, inputs: { dpConfig: "dpConfig", selectedDates: "selectedDates", datesDisabled: "datesDisabled", dateMessages: "dateMessages", positionX: "positionX", positionY: "positionY", offsetX: "offsetX", offsetY: "offsetY" }, outputs: { dateChange: "dateChange" } }); }
675
+ } }, inputs: { dpConfig: "dpConfig", selectedDates: "selectedDates", datesDisabled: "datesDisabled", selectedRangeLabel: "selectedRangeLabel", dateMessages: "dateMessages", positionX: "positionX", positionY: "positionY", offsetX: "offsetX", offsetY: "offsetY" }, outputs: { dateChange: "dateChange" } }); }
639
676
  }
640
677
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TzDaterangepickerDirective, [{
641
678
  type: Directive,
@@ -652,6 +689,8 @@ class TzDaterangepickerDirective {
652
689
  type: Input
653
690
  }], datesDisabled: [{
654
691
  type: Input
692
+ }], selectedRangeLabel: [{
693
+ type: Input
655
694
  }], dateMessages: [{
656
695
  type: Input
657
696
  }], positionX: [{