npm - tango-app-ui-manage-settings - Versions diffs - 3.4.0-beta.13 → 3.4.0-beta.15 - Mend

tango-app-ui-manage-settings 3.4.0-beta.13 → 3.4.0-beta.15

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.

Files changed (74) hide show

package/esm2022/lib/components/action-popup/action-popup.component.mjs CHANGED Viewed

@@ -12,10 +12,10 @@ export class ActionPopupComponent {
     onSubmit() {
         this.activeModal.close('submit');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ActionPopupComponent, deps: [{ token: i1.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ActionPopupComponent, selector: "lib-action-popup", ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n    <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n        <div class=\"my-5\">\r\n            <div class=\"symbol symbol-75px symbol-circle\">\r\n                <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                    <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n                    <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n                    <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg>\r\n                    \r\n            </div>\r\n        </div>\r\n        <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete User?</a>\r\n        <span  class=\"sub-title fw-normal mt-2\">Are you sure you want to delete this user? This action cannot be undone.</span>\r\n\r\n        <div class=\"mt-5 w-100\">\r\n                <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n                    <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n                    <button  id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onSubmit()\">Delete</button>                  \r\n                </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: [".sub-title{font-size:14px!important}\n"] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ActionPopupComponent, deps: [{ token: i1.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ActionPopupComponent, selector: "lib-action-popup", ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n    <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n        <div class=\"my-5\">\r\n            <div class=\"symbol symbol-75px symbol-circle\">\r\n                <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                    <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n                    <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n                    <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg>\r\n                    \r\n            </div>\r\n        </div>\r\n        <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete User?</a>\r\n        <span  class=\"sub-title fw-normal mt-2\">Are you sure you want to delete this user? This action cannot be undone.</span>\r\n\r\n        <div class=\"mt-5 w-100\">\r\n                <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n                    <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n                    <button  id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onSubmit()\">Delete</button>                  \r\n                </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: [".sub-title{font-size:14px!important}\n"] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ActionPopupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ActionPopupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-action-popup', template: "<div class=\"card group-delete py-0\">\r\n    <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n        <div class=\"my-5\">\r\n            <div class=\"symbol symbol-75px symbol-circle\">\r\n                <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                    <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n                    <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n                    <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg>\r\n                    \r\n            </div>\r\n        </div>\r\n        <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete User?</a>\r\n        <span  class=\"sub-title fw-normal mt-2\">Are you sure you want to delete this user? This action cannot be undone.</span>\r\n\r\n        <div class=\"mt-5 w-100\">\r\n                <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n                    <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n                    <button  id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onSubmit()\">Delete</button>                  \r\n                </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: [".sub-title{font-size:14px!important}\n"] }]
         }], ctorParameters: () => [{ type: i1.NgbActiveModal }] });

package/esm2022/lib/components/activity-logs/activity-logs.component.mjs CHANGED Viewed

@@ -246,10 +246,10 @@ export class ActivityLogsComponent {
         }
         this.getActivityLogs();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ActivityLogsComponent, deps: [{ token: i1.ClientApiService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ActivityLogsComponent, selector: "lib-activity-logs", host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"activity-card\">\r\n    <ng-container *ngIf=\"pageState$ | async as pageState\" >\r\n        <ng-container [ngSwitch]=\"pageState\" >\r\n            <ng-container *ngSwitchCase=\"'loaded'\"   >\r\n                <div class=\"d-flex justify-content-between align-items-center mb-10\">\r\n                    <div class=\"header\">Activity Logs</div>\r\n                    <div class=\"d-flex align-items-center\">\r\n                        <div class=\"d-flex align-items-center position-relative me-5\">\r\n                            <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd\r\n                                [drops]=\"'down'\" [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\"\r\n                                [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\"\r\n                                autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n                                [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n                                (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n                            <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n                                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                                    <path\r\n                                        d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                                        stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                                </svg>\r\n                            </span>\r\n                        </div>\r\n                        <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n                        <!-- <div>\r\n                                <div class=\"multi-select-dropdown\" >\r\n                                 <button (click)=\"$event.stopPropagation();showFilters = !showFilters;\" class=\"btn btn-outline\">\r\n                                    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                                        <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                      </svg>\r\n                                      <span class=\" ms-3\">{{getCheckedIds(filters).length}} selected</span>\r\n                                </button>  \r\n                                <div *ngIf=\"showFilters\" class=\"input-container dropdown\" >\r\n                                    <div>\r\n                                    <ul>\r\n                                        <li >\r\n                                            <div   class=\"form-check\">\r\n                                                <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n                                                    id=\"selectAll\">\r\n                                                <label class=\"form-check-label\" for=\"selectAll\">\r\n                                                    All Logs\r\n                                                </label>\r\n                                            </div>\r\n                                        </li>\r\n                                        <li *ngFor=\"let filter of filters\"  >\r\n                                            <div class=\"form-check\">\r\n                                                <input class=\"form-check-input me-3\" type=\"checkbox\" [(ngModel)]=\"filter.isChecked\" [id]=\"filter.id\">\r\n                                                <label class=\"form-check-label\" [for]=\"filter.id\" >\r\n                                                    {{filter.label}}\r\n                                                </label>\r\n                                            </div>\r\n                                        </li>\r\n                                        \r\n                                    </ul>     \r\n                                    </div>\r\n                                    <div >\r\n                                        <div class=\" w-100 footer-seperator\"></div>\r\n                                        <div class=\"d-flex justify-content-end m-2\">\r\n                                            <a type=\"button\" class=\"btn btn-outline me-4\" (click)=\"showFilters = false\" >Cancel</a>\r\n                                            <a type=\"submit\" class=\"btn btn-primary px-4 \" (click)=\"applyFilter()\" >Apply</a>\r\n                                        </div>\r\n                                    </div>\r\n                                     \r\n                                </div>   \r\n                                </div>\r\n                                \r\n                        </div> -->\r\n                    </div>\r\n                </div>\r\n            \r\n                <ng-container *ngIf=\"logList?.length\" >\r\n                <div *ngFor=\"let item of logList\" class=\"log-card mb-8\">\r\n                    <div class=\"d-flex me-10\">\r\n                        <div class=\"line me-4\"></div>\r\n                        <div class=\"d-flex flex-column\">\r\n                            <div class=\"d-flex align-items-center mb-2\">\r\n                                <div class=\"header me-4\">{{camelCaseToWords(item?.logSubType)}}</div>\r\n                                <div class=\"time\">{{formatDate(item?.date)}}</div>\r\n                            </div>\r\n                            <div class=\"sub\">{{arrayToString(item?.changes)}} <span *ngIf=\"item?.eventType\">{{item?.eventType + 'd'}}</span></div>\r\n                            <div class=\"sub\">By {{item?.userName}} - {{item?.email}}</div>\r\n                        </div>\r\n            \r\n                    </div>\r\n                    <div class=\"chip\">\r\n                        {{camelCaseToWords(item?.logType)}}\r\n                    </div>\r\n                </div>\r\n            \r\n                <div *ngIf=\"logList?.length\" class=\"my-3\">\r\n                    <lib-pagination [itemsPerPage]=\"itemsPerPage\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\"\r\n                    (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n            </div>    \r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!logList?.length\">\r\n                    <div class=\"d-flex align-items-center justify-content-center\" >\r\n                        <img width=\"300px\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">    \r\n                        </div>\r\n                </ng-container>\r\n                \r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'loading'\"  >\r\n                    <div class=\"row loader  d-flex justify-content-center align-items-center\">\r\n                        <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                          <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                          <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                    </div>\r\n                \r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</div>\r\n\r\n", styles: [".activity-card{border-radius:8px;background:var(--White, #FFF);padding:24px}.log-card{display:flex;justify-content:space-between}.log-card .line{border-radius:2px;background:var(--Primary-600, #00A3FF);min-width:2px;height:100%}.log-card .header{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.log-card .time{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.log-card .sub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:24px}.log-card .chip{padding:2px 10px;border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);font-size:14px;font-weight:500;line-height:20px;height:100%;white-space:nowrap}.header{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.multi-select-dropdown{position:relative}.multi-select-dropdown .input-container{position:absolute;width:212px;right:0;z-index:1;margin-top:5px;background-color:#fff;min-height:200px;border-radius:8px;border:1px solid var(--Gray-100, #F2F4F7);background:var(--White, #FFF);box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;display:flex;flex-direction:column;justify-content:space-between}.multi-select-dropdown .input-container ul{margin:0;padding:0}.multi-select-dropdown .input-container ul li{list-style:none;padding:10px 16px}.multi-select-dropdown .input-container .form-check{display:flex;align-items:center}.multi-select-dropdown .input-container .form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.multi-select-dropdown .input-container .form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.multi-select-dropdown .input-container .form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.multi-select-dropdown .input-container .footer-seperator{border-top:1px solid #EAECF0}.multi-select-dropdown .input-container .btn-primary{padding:10px 16px!important;font-size:12px!important;font-weight:600!important}.multi-select-dropdown .input-container .btn-outline{padding:10px 16px;font-size:12px;font-weight:600}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ActivityLogsComponent, deps: [{ token: i1.ClientApiService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ActivityLogsComponent, selector: "lib-activity-logs", host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"activity-card\">\r\n    <ng-container *ngIf=\"pageState$ | async as pageState\" >\r\n        <ng-container [ngSwitch]=\"pageState\" >\r\n            <ng-container *ngSwitchCase=\"'loaded'\"   >\r\n                <div class=\"d-flex justify-content-between align-items-center mb-10\">\r\n                    <div class=\"header\">Activity Logs</div>\r\n                    <div class=\"d-flex align-items-center\">\r\n                        <div class=\"d-flex align-items-center position-relative me-5\">\r\n                            <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd\r\n                                [drops]=\"'down'\" [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\"\r\n                                [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\"\r\n                                autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n                                [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n                                (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n                            <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n                                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                                    <path\r\n                                        d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                                        stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                                </svg>\r\n                            </span>\r\n                        </div>\r\n                        <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n                        <!-- <div>\r\n                                <div class=\"multi-select-dropdown\" >\r\n                                 <button (click)=\"$event.stopPropagation();showFilters = !showFilters;\" class=\"btn btn-outline\">\r\n                                    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                                        <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                      </svg>\r\n                                      <span class=\" ms-3\">{{getCheckedIds(filters).length}} selected</span>\r\n                                </button>  \r\n                                <div *ngIf=\"showFilters\" class=\"input-container dropdown\" >\r\n                                    <div>\r\n                                    <ul>\r\n                                        <li >\r\n                                            <div   class=\"form-check\">\r\n                                                <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n                                                    id=\"selectAll\">\r\n                                                <label class=\"form-check-label\" for=\"selectAll\">\r\n                                                    All Logs\r\n                                                </label>\r\n                                            </div>\r\n                                        </li>\r\n                                        <li *ngFor=\"let filter of filters\"  >\r\n                                            <div class=\"form-check\">\r\n                                                <input class=\"form-check-input me-3\" type=\"checkbox\" [(ngModel)]=\"filter.isChecked\" [id]=\"filter.id\">\r\n                                                <label class=\"form-check-label\" [for]=\"filter.id\" >\r\n                                                    {{filter.label}}\r\n                                                </label>\r\n                                            </div>\r\n                                        </li>\r\n                                        \r\n                                    </ul>     \r\n                                    </div>\r\n                                    <div >\r\n                                        <div class=\" w-100 footer-seperator\"></div>\r\n                                        <div class=\"d-flex justify-content-end m-2\">\r\n                                            <a type=\"button\" class=\"btn btn-outline me-4\" (click)=\"showFilters = false\" >Cancel</a>\r\n                                            <a type=\"submit\" class=\"btn btn-primary px-4 \" (click)=\"applyFilter()\" >Apply</a>\r\n                                        </div>\r\n                                    </div>\r\n                                     \r\n                                </div>   \r\n                                </div>\r\n                                \r\n                        </div> -->\r\n                    </div>\r\n                </div>\r\n            \r\n                <ng-container *ngIf=\"logList?.length\" >\r\n                <div *ngFor=\"let item of logList\" class=\"log-card mb-8\">\r\n                    <div class=\"d-flex me-10\">\r\n                        <div class=\"line me-4\"></div>\r\n                        <div class=\"d-flex flex-column\">\r\n                            <div class=\"d-flex align-items-center mb-2\">\r\n                                <div class=\"header me-4\">{{camelCaseToWords(item?.logSubType)}}</div>\r\n                                <div class=\"time\">{{formatDate(item?.date)}}</div>\r\n                            </div>\r\n                            <div class=\"sub\">{{arrayToString(item?.changes)}} <span *ngIf=\"item?.eventType\">{{item?.eventType + 'd'}}</span></div>\r\n                            <div class=\"sub\">By {{item?.userName}} - {{item?.email}}</div>\r\n                        </div>\r\n            \r\n                    </div>\r\n                    <div class=\"chip\">\r\n                        {{camelCaseToWords(item?.logType)}}\r\n                    </div>\r\n                </div>\r\n            \r\n                <div *ngIf=\"logList?.length\" class=\"my-3\">\r\n                    <lib-pagination [itemsPerPage]=\"itemsPerPage\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\"\r\n                    (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n            </div>    \r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!logList?.length\">\r\n                    <div class=\"d-flex align-items-center justify-content-center\" >\r\n                        <img width=\"300px\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">    \r\n                        </div>\r\n                </ng-container>\r\n                \r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'loading'\"  >\r\n                    <div class=\"row loader  d-flex justify-content-center align-items-center\">\r\n                        <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                          <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                          <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                    </div>\r\n                \r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</div>\r\n\r\n", styles: [".activity-card{border-radius:8px;background:var(--White, #FFF);padding:24px}.log-card{display:flex;justify-content:space-between}.log-card .line{border-radius:2px;background:var(--Primary-600, #00A3FF);min-width:2px;height:100%}.log-card .header{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.log-card .time{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.log-card .sub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:24px}.log-card .chip{padding:2px 10px;border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);font-size:14px;font-weight:500;line-height:20px;height:100%;white-space:nowrap}.header{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.multi-select-dropdown{position:relative}.multi-select-dropdown .input-container{position:absolute;width:212px;right:0;z-index:1;margin-top:5px;background-color:#fff;min-height:200px;border-radius:8px;border:1px solid var(--Gray-100, #F2F4F7);background:var(--White, #FFF);box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;display:flex;flex-direction:column;justify-content:space-between}.multi-select-dropdown .input-container ul{margin:0;padding:0}.multi-select-dropdown .input-container ul li{list-style:none;padding:10px 16px}.multi-select-dropdown .input-container .form-check{display:flex;align-items:center}.multi-select-dropdown .input-container .form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.multi-select-dropdown .input-container .form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.multi-select-dropdown .input-container .form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.multi-select-dropdown .input-container .footer-seperator{border-top:1px solid #EAECF0}.multi-select-dropdown .input-container .btn-primary{padding:10px 16px!important;font-size:12px!important;font-weight:600!important}.multi-select-dropdown .input-container .btn-outline{padding:10px 16px;font-size:12px;font-weight:600}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ActivityLogsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ActivityLogsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-activity-logs', template: "<div class=\"activity-card\">\r\n    <ng-container *ngIf=\"pageState$ | async as pageState\" >\r\n        <ng-container [ngSwitch]=\"pageState\" >\r\n            <ng-container *ngSwitchCase=\"'loaded'\"   >\r\n                <div class=\"d-flex justify-content-between align-items-center mb-10\">\r\n                    <div class=\"header\">Activity Logs</div>\r\n                    <div class=\"d-flex align-items-center\">\r\n                        <div class=\"d-flex align-items-center position-relative me-5\">\r\n                            <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd\r\n                                [drops]=\"'down'\" [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\"\r\n                                [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\"\r\n                                autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n                                [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n                                (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n                            <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n                                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                                    <path\r\n                                        d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                                        stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                                </svg>\r\n                            </span>\r\n                        </div>\r\n                        <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n                        <!-- <div>\r\n                                <div class=\"multi-select-dropdown\" >\r\n                                 <button (click)=\"$event.stopPropagation();showFilters = !showFilters;\" class=\"btn btn-outline\">\r\n                                    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                                        <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                      </svg>\r\n                                      <span class=\" ms-3\">{{getCheckedIds(filters).length}} selected</span>\r\n                                </button>  \r\n                                <div *ngIf=\"showFilters\" class=\"input-container dropdown\" >\r\n                                    <div>\r\n                                    <ul>\r\n                                        <li >\r\n                                            <div   class=\"form-check\">\r\n                                                <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n                                                    id=\"selectAll\">\r\n                                                <label class=\"form-check-label\" for=\"selectAll\">\r\n                                                    All Logs\r\n                                                </label>\r\n                                            </div>\r\n                                        </li>\r\n                                        <li *ngFor=\"let filter of filters\"  >\r\n                                            <div class=\"form-check\">\r\n                                                <input class=\"form-check-input me-3\" type=\"checkbox\" [(ngModel)]=\"filter.isChecked\" [id]=\"filter.id\">\r\n                                                <label class=\"form-check-label\" [for]=\"filter.id\" >\r\n                                                    {{filter.label}}\r\n                                                </label>\r\n                                            </div>\r\n                                        </li>\r\n                                        \r\n                                    </ul>     \r\n                                    </div>\r\n                                    <div >\r\n                                        <div class=\" w-100 footer-seperator\"></div>\r\n                                        <div class=\"d-flex justify-content-end m-2\">\r\n                                            <a type=\"button\" class=\"btn btn-outline me-4\" (click)=\"showFilters = false\" >Cancel</a>\r\n                                            <a type=\"submit\" class=\"btn btn-primary px-4 \" (click)=\"applyFilter()\" >Apply</a>\r\n                                        </div>\r\n                                    </div>\r\n                                     \r\n                                </div>   \r\n                                </div>\r\n                                \r\n                        </div> -->\r\n                    </div>\r\n                </div>\r\n            \r\n                <ng-container *ngIf=\"logList?.length\" >\r\n                <div *ngFor=\"let item of logList\" class=\"log-card mb-8\">\r\n                    <div class=\"d-flex me-10\">\r\n                        <div class=\"line me-4\"></div>\r\n                        <div class=\"d-flex flex-column\">\r\n                            <div class=\"d-flex align-items-center mb-2\">\r\n                                <div class=\"header me-4\">{{camelCaseToWords(item?.logSubType)}}</div>\r\n                                <div class=\"time\">{{formatDate(item?.date)}}</div>\r\n                            </div>\r\n                            <div class=\"sub\">{{arrayToString(item?.changes)}} <span *ngIf=\"item?.eventType\">{{item?.eventType + 'd'}}</span></div>\r\n                            <div class=\"sub\">By {{item?.userName}} - {{item?.email}}</div>\r\n                        </div>\r\n            \r\n                    </div>\r\n                    <div class=\"chip\">\r\n                        {{camelCaseToWords(item?.logType)}}\r\n                    </div>\r\n                </div>\r\n            \r\n                <div *ngIf=\"logList?.length\" class=\"my-3\">\r\n                    <lib-pagination [itemsPerPage]=\"itemsPerPage\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\"\r\n                    (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n            </div>    \r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!logList?.length\">\r\n                    <div class=\"d-flex align-items-center justify-content-center\" >\r\n                        <img width=\"300px\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">    \r\n                        </div>\r\n                </ng-container>\r\n                \r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'loading'\"  >\r\n                    <div class=\"row loader  d-flex justify-content-center align-items-center\">\r\n                        <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                          <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                          <div class=\"shimmer\">\r\n                            <div class=\"wrapper\">\r\n                              <div class=\"stroke animate title\"></div>\r\n                              <div class=\"stroke animate link\"></div>\r\n                              <div class=\"stroke animate description\"></div>\r\n                            </div>\r\n                          </div>\r\n                    </div>\r\n                \r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</div>\r\n\r\n", styles: [".activity-card{border-radius:8px;background:var(--White, #FFF);padding:24px}.log-card{display:flex;justify-content:space-between}.log-card .line{border-radius:2px;background:var(--Primary-600, #00A3FF);min-width:2px;height:100%}.log-card .header{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.log-card .time{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.log-card .sub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:24px}.log-card .chip{padding:2px 10px;border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);font-size:14px;font-weight:500;line-height:20px;height:100%;white-space:nowrap}.header{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.multi-select-dropdown{position:relative}.multi-select-dropdown .input-container{position:absolute;width:212px;right:0;z-index:1;margin-top:5px;background-color:#fff;min-height:200px;border-radius:8px;border:1px solid var(--Gray-100, #F2F4F7);background:var(--White, #FFF);box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;display:flex;flex-direction:column;justify-content:space-between}.multi-select-dropdown .input-container ul{margin:0;padding:0}.multi-select-dropdown .input-container ul li{list-style:none;padding:10px 16px}.multi-select-dropdown .input-container .form-check{display:flex;align-items:center}.multi-select-dropdown .input-container .form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.multi-select-dropdown .input-container .form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.multi-select-dropdown .input-container .form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.multi-select-dropdown .input-container .footer-seperator{border-top:1px solid #EAECF0}.multi-select-dropdown .input-container .btn-primary{padding:10px 16px!important;font-size:12px!important;font-weight:600!important}.multi-select-dropdown .input-container .btn-outline{padding:10px 16px;font-size:12px;font-weight:600}\n"] }]
         }], ctorParameters: () => [{ type: i1.ClientApiService }, { type: i0.ChangeDetectorRef }], propDecorators: { onClick: [{

package/esm2022/lib/components/brand-details/billing-details/billing-details.component.mjs CHANGED Viewed

@@ -68,10 +68,10 @@ export class BillingDetailsComponent {
         }
         this.apiService.clientFormData.next({ value: this.billingDetailsForm.value, type: 'submit', form: 'billing-details' });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BillingDetailsComponent, deps: [{ token: i1.FormBuilder }, { token: i2.ClientApiService }, { token: i3.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: BillingDetailsComponent, selector: "lib-billing-details", viewQueries: [{ propertyName: "uploadInput", first: true, predicate: ["gstFormInput"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"billingDetailsForm\">\r\n    <div class=\"row\">\r\n        <ng-container *ngIf=\"(gs.userAccess | async)?.Global_Configuration_isEdit\">\r\n                <div *ngIf=\"billingDetailsForm.disabled\" class=\"col-12 mb-5\">\r\n            <div class=\" d-flex justify-content-end\">\r\n                <button (click)=\"billingDetailsForm.disabled ? billingDetailsForm.enable() : billingDetailsForm.disable()\" type=\"button\" class=\"btn btn-outline align-items-end\"><span class=\"me-2\"><svg\r\n                            xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <g clip-path=\"url(#clip0_2579_25125)\">\r\n                                <path\r\n                                    d=\"M14.167 2.49993C14.3859 2.28106 14.6457 2.10744 14.9317 1.98899C15.2176 1.87054 15.5241 1.80957 15.8337 1.80957C16.1432 1.80957 16.4497 1.87054 16.7357 1.98899C17.0216 2.10744 17.2815 2.28106 17.5003 2.49993C17.7192 2.7188 17.8928 2.97863 18.0113 3.2646C18.1297 3.55057 18.1907 3.85706 18.1907 4.16659C18.1907 4.47612 18.1297 4.78262 18.0113 5.06859C17.8928 5.35455 17.7192 5.61439 17.5003 5.83326L6.25033 17.0833L1.66699 18.3333L2.91699 13.7499L14.167 2.49993Z\"\r\n                                    stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n                                    stroke-linejoin=\"round\" />\r\n                            </g>\r\n                            <defs>\r\n                                <clipPath id=\"clip0_2579_25125\">\r\n                                    <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n                                </clipPath>\r\n                            </defs>\r\n                        </svg></span>Edit Details</button>\r\n            </div>\r\n        </div>    \r\n        </ng-container>\r\n\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"tradeName\" class=\"form-label\">Trade Name <span class=\"alert-required\"></span></label>\r\n            <input formControlName=\"tradeName\" type=\"type\" class=\"form-control\" id=\"tradeName\" autocomplete=\"off\">\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"gstNumber\" class=\"form-label\">GST Number <span class=\"alert-required\"></span></label>\r\n            <div class=\"input-group \">\r\n                <input formControlName=\"gstNumber\" type=\"text\" class=\"form-control\" placeholder=\"\" aria-label=\"Example text with button addon\"\r\n                    aria-describedby=\"button-addon1\" id=\"gstNumber\">\r\n                <button [disabled]=\"billingDetailsForm.disabled\" (click)=\"triggerFileInput()\" class=\"btn btn-outline upload-btn\" type=\"button\" id=\"button-addon1\">\r\n                    <span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n                            viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <path\r\n                                d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n                                stroke=\"#667085\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                        </svg></span>\r\n                    Upload</button>\r\n            </div>\r\n            <input (change)=\"onFileSelect($event)\" accept=\".pdf\" class=\"d-none\" #gstFormInput type=\"file\">\r\n            <a *ngIf=\"gstForm && !gstFile\" [href]=\"gstForm\" target=\"_blank\" class=\"mt-3\">\r\n                <span class=\"uploaded-doc-text me-2\">GST Certificate</span>\r\n            </a>\r\n            <span *ngIf=\"gstFile\" class=\"mt-3 d-flex align-items-center\">\r\n                <span class=\"uploaded-doc-text me-2\">{{gstFile.name ? gstFile.name : ''}}</span>\r\n                <svg class=\"cursor-pointer\" (click)=\"gstFile = null\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                    <path d=\"M12.5003 7.50001L7.50033 12.5M7.50033 7.50001L12.5003 12.5M18.3337 10C18.3337 14.6024 14.6027 18.3333 10.0003 18.3333C5.39795 18.3333 1.66699 14.6024 1.66699 10C1.66699 5.39763 5.39795 1.66667 10.0003 1.66667C14.6027 1.66667 18.3337 5.39763 18.3337 10Z\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg>\r\n            </span>\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"invoiceAuthorityName\" class=\"form-label\">Invoice Authority Name <span\r\n                    class=\"alert-required\"></span></label>\r\n            <input formControlName=\"authorityName\" type=\"type\" class=\"form-control\" id=\"invoiceAuthorityName\"\r\n                autocomplete=\"off\">\r\n\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"invoiceAuthorityEmail\" class=\"form-label\">Invoice Authority Email <span\r\n                    class=\"alert-required\"></span></label>\r\n            <input formControlName=\"authorityEmail\" type=\"type\" class=\"form-control\" id=\"invoiceAuthorityEmail\"\r\n                autocomplete=\"off\">\r\n        </div>\r\n        <div class=\"col-12  mb-5\">\r\n            <label for=\"billingAddress\" class=\"form-label\">Billing Address <span class=\"alert-required\"></span></label>\r\n            <input formControlName=\"billingAddress\" type=\"type\" class=\"form-control\" id=\"billingAddress\" autocomplete=\"off\">\r\n        </div>\r\n    </div>\r\n\r\n    <div *ngIf=\"billingDetailsForm.enabled\">\r\n        <div class=\"mb-5 w-100 footer-seperator\"></div>\r\n        <div class=\"d-flex justify-content-end\">\r\n            <a (click)=\"onCancel()\" type=\"button\" class=\"btn btn-outline mt-1 me-4\">Cancel</a>\r\n            <a (click)=\"onSubmit()\" type=\"submit\" class=\"btn btn-primary px-4 \"><span>Save Changes</span></a>\r\n        </div>\r\n    </div>\r\n</form>", styles: [".form-control{display:block;height:45px;padding:.5rem 1rem;font-size:1.1rem;font-weight:400;color:var(--Gray-500, #667085);-webkit-appearance:none;appearance:none;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-label{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:400!important;line-height:20px;display:block;margin-top:6px}.cancel{border-radius:8px;border:1px solid #D0D5DD;background:#fff;color:#344054;font-family:Inter;font-size:14px;font-weight:600;line-height:20px;text-transform:capitalize}.apply{color:#fff;font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;text-transform:capitalize}input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{background-color:#f9fafb!important}.footer-seperator{border-top:1px solid #EAECF0}.upload-btn{box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-500, #667085);font-size:16px;font-weight:600}.uploaded-doc-text{color:var(--Primary-700, #009BF3);font-family:Inter;font-size:14px;font-weight:600;text-transform:capitalize;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: BillingDetailsComponent, deps: [{ token: i1.FormBuilder }, { token: i2.ClientApiService }, { token: i3.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: BillingDetailsComponent, selector: "lib-billing-details", viewQueries: [{ propertyName: "uploadInput", first: true, predicate: ["gstFormInput"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"billingDetailsForm\">\r\n    <div class=\"row\">\r\n        <ng-container *ngIf=\"(gs.userAccess | async)?.Global_Configuration_isEdit\">\r\n                <div *ngIf=\"billingDetailsForm.disabled\" class=\"col-12 mb-5\">\r\n            <div class=\" d-flex justify-content-end\">\r\n                <button (click)=\"billingDetailsForm.disabled ? billingDetailsForm.enable() : billingDetailsForm.disable()\" type=\"button\" class=\"btn btn-outline align-items-end\"><span class=\"me-2\"><svg\r\n                            xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <g clip-path=\"url(#clip0_2579_25125)\">\r\n                                <path\r\n                                    d=\"M14.167 2.49993C14.3859 2.28106 14.6457 2.10744 14.9317 1.98899C15.2176 1.87054 15.5241 1.80957 15.8337 1.80957C16.1432 1.80957 16.4497 1.87054 16.7357 1.98899C17.0216 2.10744 17.2815 2.28106 17.5003 2.49993C17.7192 2.7188 17.8928 2.97863 18.0113 3.2646C18.1297 3.55057 18.1907 3.85706 18.1907 4.16659C18.1907 4.47612 18.1297 4.78262 18.0113 5.06859C17.8928 5.35455 17.7192 5.61439 17.5003 5.83326L6.25033 17.0833L1.66699 18.3333L2.91699 13.7499L14.167 2.49993Z\"\r\n                                    stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n                                    stroke-linejoin=\"round\" />\r\n                            </g>\r\n                            <defs>\r\n                                <clipPath id=\"clip0_2579_25125\">\r\n                                    <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n                                </clipPath>\r\n                            </defs>\r\n                        </svg></span>Edit Details</button>\r\n            </div>\r\n        </div>    \r\n        </ng-container>\r\n\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"tradeName\" class=\"form-label\">Trade Name <span class=\"alert-required\"></span></label>\r\n            <input formControlName=\"tradeName\" type=\"type\" class=\"form-control\" id=\"tradeName\" autocomplete=\"off\">\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"gstNumber\" class=\"form-label\">GST Number <span class=\"alert-required\"></span></label>\r\n            <div class=\"input-group \">\r\n                <input formControlName=\"gstNumber\" type=\"text\" class=\"form-control\" placeholder=\"\" aria-label=\"Example text with button addon\"\r\n                    aria-describedby=\"button-addon1\" id=\"gstNumber\">\r\n                <button [disabled]=\"billingDetailsForm.disabled\" (click)=\"triggerFileInput()\" class=\"btn btn-outline upload-btn\" type=\"button\" id=\"button-addon1\">\r\n                    <span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n                            viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <path\r\n                                d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n                                stroke=\"#667085\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                        </svg></span>\r\n                    Upload</button>\r\n            </div>\r\n            <input (change)=\"onFileSelect($event)\" accept=\".pdf\" class=\"d-none\" #gstFormInput type=\"file\">\r\n            <a *ngIf=\"gstForm && !gstFile\" [href]=\"gstForm\" target=\"_blank\" class=\"mt-3\">\r\n                <span class=\"uploaded-doc-text me-2\">GST Certificate</span>\r\n            </a>\r\n            <span *ngIf=\"gstFile\" class=\"mt-3 d-flex align-items-center\">\r\n                <span class=\"uploaded-doc-text me-2\">{{gstFile.name ? gstFile.name : ''}}</span>\r\n                <svg class=\"cursor-pointer\" (click)=\"gstFile = null\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                    <path d=\"M12.5003 7.50001L7.50033 12.5M7.50033 7.50001L12.5003 12.5M18.3337 10C18.3337 14.6024 14.6027 18.3333 10.0003 18.3333C5.39795 18.3333 1.66699 14.6024 1.66699 10C1.66699 5.39763 5.39795 1.66667 10.0003 1.66667C14.6027 1.66667 18.3337 5.39763 18.3337 10Z\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg>\r\n            </span>\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"invoiceAuthorityName\" class=\"form-label\">Invoice Authority Name <span\r\n                    class=\"alert-required\"></span></label>\r\n            <input formControlName=\"authorityName\" type=\"type\" class=\"form-control\" id=\"invoiceAuthorityName\"\r\n                autocomplete=\"off\">\r\n\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"invoiceAuthorityEmail\" class=\"form-label\">Invoice Authority Email <span\r\n                    class=\"alert-required\"></span></label>\r\n            <input formControlName=\"authorityEmail\" type=\"type\" class=\"form-control\" id=\"invoiceAuthorityEmail\"\r\n                autocomplete=\"off\">\r\n        </div>\r\n        <div class=\"col-12  mb-5\">\r\n            <label for=\"billingAddress\" class=\"form-label\">Billing Address <span class=\"alert-required\"></span></label>\r\n            <input formControlName=\"billingAddress\" type=\"type\" class=\"form-control\" id=\"billingAddress\" autocomplete=\"off\">\r\n        </div>\r\n    </div>\r\n\r\n    <div *ngIf=\"billingDetailsForm.enabled\">\r\n        <div class=\"mb-5 w-100 footer-seperator\"></div>\r\n        <div class=\"d-flex justify-content-end\">\r\n            <a (click)=\"onCancel()\" type=\"button\" class=\"btn btn-outline mt-1 me-4\">Cancel</a>\r\n            <a (click)=\"onSubmit()\" type=\"submit\" class=\"btn btn-primary px-4 \"><span>Save Changes</span></a>\r\n        </div>\r\n    </div>\r\n</form>", styles: [".form-control{display:block;height:45px;padding:.5rem 1rem;font-size:1.1rem;font-weight:400;color:var(--Gray-500, #667085);-webkit-appearance:none;appearance:none;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-label{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:400!important;line-height:20px;display:block;margin-top:6px}.cancel{border-radius:8px;border:1px solid #D0D5DD;background:#fff;color:#344054;font-family:Inter;font-size:14px;font-weight:600;line-height:20px;text-transform:capitalize}.apply{color:#fff;font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;text-transform:capitalize}input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{background-color:#f9fafb!important}.footer-seperator{border-top:1px solid #EAECF0}.upload-btn{box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-500, #667085);font-size:16px;font-weight:600}.uploaded-doc-text{color:var(--Primary-700, #009BF3);font-family:Inter;font-size:14px;font-weight:600;text-transform:capitalize;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BillingDetailsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: BillingDetailsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-billing-details', template: "<form [formGroup]=\"billingDetailsForm\">\r\n    <div class=\"row\">\r\n        <ng-container *ngIf=\"(gs.userAccess | async)?.Global_Configuration_isEdit\">\r\n                <div *ngIf=\"billingDetailsForm.disabled\" class=\"col-12 mb-5\">\r\n            <div class=\" d-flex justify-content-end\">\r\n                <button (click)=\"billingDetailsForm.disabled ? billingDetailsForm.enable() : billingDetailsForm.disable()\" type=\"button\" class=\"btn btn-outline align-items-end\"><span class=\"me-2\"><svg\r\n                            xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <g clip-path=\"url(#clip0_2579_25125)\">\r\n                                <path\r\n                                    d=\"M14.167 2.49993C14.3859 2.28106 14.6457 2.10744 14.9317 1.98899C15.2176 1.87054 15.5241 1.80957 15.8337 1.80957C16.1432 1.80957 16.4497 1.87054 16.7357 1.98899C17.0216 2.10744 17.2815 2.28106 17.5003 2.49993C17.7192 2.7188 17.8928 2.97863 18.0113 3.2646C18.1297 3.55057 18.1907 3.85706 18.1907 4.16659C18.1907 4.47612 18.1297 4.78262 18.0113 5.06859C17.8928 5.35455 17.7192 5.61439 17.5003 5.83326L6.25033 17.0833L1.66699 18.3333L2.91699 13.7499L14.167 2.49993Z\"\r\n                                    stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n                                    stroke-linejoin=\"round\" />\r\n                            </g>\r\n                            <defs>\r\n                                <clipPath id=\"clip0_2579_25125\">\r\n                                    <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n                                </clipPath>\r\n                            </defs>\r\n                        </svg></span>Edit Details</button>\r\n            </div>\r\n        </div>    \r\n        </ng-container>\r\n\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"tradeName\" class=\"form-label\">Trade Name <span class=\"alert-required\"></span></label>\r\n            <input formControlName=\"tradeName\" type=\"type\" class=\"form-control\" id=\"tradeName\" autocomplete=\"off\">\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"gstNumber\" class=\"form-label\">GST Number <span class=\"alert-required\"></span></label>\r\n            <div class=\"input-group \">\r\n                <input formControlName=\"gstNumber\" type=\"text\" class=\"form-control\" placeholder=\"\" aria-label=\"Example text with button addon\"\r\n                    aria-describedby=\"button-addon1\" id=\"gstNumber\">\r\n                <button [disabled]=\"billingDetailsForm.disabled\" (click)=\"triggerFileInput()\" class=\"btn btn-outline upload-btn\" type=\"button\" id=\"button-addon1\">\r\n                    <span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n                            viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <path\r\n                                d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n                                stroke=\"#667085\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                        </svg></span>\r\n                    Upload</button>\r\n            </div>\r\n            <input (change)=\"onFileSelect($event)\" accept=\".pdf\" class=\"d-none\" #gstFormInput type=\"file\">\r\n            <a *ngIf=\"gstForm && !gstFile\" [href]=\"gstForm\" target=\"_blank\" class=\"mt-3\">\r\n                <span class=\"uploaded-doc-text me-2\">GST Certificate</span>\r\n            </a>\r\n            <span *ngIf=\"gstFile\" class=\"mt-3 d-flex align-items-center\">\r\n                <span class=\"uploaded-doc-text me-2\">{{gstFile.name ? gstFile.name : ''}}</span>\r\n                <svg class=\"cursor-pointer\" (click)=\"gstFile = null\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                    <path d=\"M12.5003 7.50001L7.50033 12.5M7.50033 7.50001L12.5003 12.5M18.3337 10C18.3337 14.6024 14.6027 18.3333 10.0003 18.3333C5.39795 18.3333 1.66699 14.6024 1.66699 10C1.66699 5.39763 5.39795 1.66667 10.0003 1.66667C14.6027 1.66667 18.3337 5.39763 18.3337 10Z\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg>\r\n            </span>\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"invoiceAuthorityName\" class=\"form-label\">Invoice Authority Name <span\r\n                    class=\"alert-required\"></span></label>\r\n            <input formControlName=\"authorityName\" type=\"type\" class=\"form-control\" id=\"invoiceAuthorityName\"\r\n                autocomplete=\"off\">\r\n\r\n        </div>\r\n        <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-5\">\r\n            <label for=\"invoiceAuthorityEmail\" class=\"form-label\">Invoice Authority Email <span\r\n                    class=\"alert-required\"></span></label>\r\n            <input formControlName=\"authorityEmail\" type=\"type\" class=\"form-control\" id=\"invoiceAuthorityEmail\"\r\n                autocomplete=\"off\">\r\n        </div>\r\n        <div class=\"col-12  mb-5\">\r\n            <label for=\"billingAddress\" class=\"form-label\">Billing Address <span class=\"alert-required\"></span></label>\r\n            <input formControlName=\"billingAddress\" type=\"type\" class=\"form-control\" id=\"billingAddress\" autocomplete=\"off\">\r\n        </div>\r\n    </div>\r\n\r\n    <div *ngIf=\"billingDetailsForm.enabled\">\r\n        <div class=\"mb-5 w-100 footer-seperator\"></div>\r\n        <div class=\"d-flex justify-content-end\">\r\n            <a (click)=\"onCancel()\" type=\"button\" class=\"btn btn-outline mt-1 me-4\">Cancel</a>\r\n            <a (click)=\"onSubmit()\" type=\"submit\" class=\"btn btn-primary px-4 \"><span>Save Changes</span></a>\r\n        </div>\r\n    </div>\r\n</form>", styles: [".form-control{display:block;height:45px;padding:.5rem 1rem;font-size:1.1rem;font-weight:400;color:var(--Gray-500, #667085);-webkit-appearance:none;appearance:none;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-label{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:400!important;line-height:20px;display:block;margin-top:6px}.cancel{border-radius:8px;border:1px solid #D0D5DD;background:#fff;color:#344054;font-family:Inter;font-size:14px;font-weight:600;line-height:20px;text-transform:capitalize}.apply{color:#fff;font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;text-transform:capitalize}input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{background-color:#f9fafb!important}.footer-seperator{border-top:1px solid #EAECF0}.upload-btn{box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-500, #667085);font-size:16px;font-weight:600}.uploaded-doc-text{color:var(--Primary-700, #009BF3);font-family:Inter;font-size:14px;font-weight:600;text-transform:capitalize;cursor:pointer}\n"] }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i2.ClientApiService }, { type: i3.GlobalStateService }], propDecorators: { uploadInput: [{

package/esm2022/lib/components/brand-details/brand-details.component.mjs CHANGED Viewed

@@ -163,10 +163,10 @@ export class BrandDetailsComponent {
         }
         return formData;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BrandDetailsComponent, deps: [{ token: i1.ClientApiService }, { token: i2.ToastService }, { token: i3.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: BrandDetailsComponent, selector: "lib-brand-details", viewQueries: [{ propertyName: "accordion", first: true, predicate: ["accordion"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"row\">\r\n    <div class=\"col-12\">\r\n        <div ngbAccordion #accordion=\"ngbAccordion\" [closeOthers]=\"true\" [destroyOnHide]=\"true\" (show)=\"openItem($event)\">\r\n            <div class=\"settings-accordian-card \"  ngbAccordionItem [collapsed]=\"false\">\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button type=\"button\" class=\"mainheading\" ngbAccordionButton >\r\n                        <div class=\"header-row\">\r\n                            <span >Brand Info</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-brand-info></lib-brand-info>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <!-- <div class=\"settings-accordian-card mt-6\" ngbAccordionItem>\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button class=\"mainheading\" ngbAccordionButton>\r\n                        <div class=\"header-row\">\r\n                            <span >Billing Details</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-billing-details></lib-billing-details>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"settings-accordian-card mt-6\" ngbAccordionItem>\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button class=\"mainheading\" ngbAccordionButton>\r\n                        <div class=\"header-row\">\r\n                            <span >Signatory Details</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-signatory-details></lib-signatory-details>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div> -->\r\n        </div>\r\n    </div>", styles: [".settings-accordian-card{border-radius:10px;background:var(#FFF)}\n"], dependencies: [{ kind: "directive", type: i4.NgbAccordionButton, selector: "button[ngbAccordionButton]" }, { kind: "directive", type: i4.NgbAccordionDirective, selector: "[ngbAccordion]", inputs: ["animation", "closeOthers", "destroyOnHide"], outputs: ["show", "shown", "hide", "hidden"], exportAs: ["ngbAccordion"] }, { kind: "directive", type: i4.NgbAccordionItem, selector: "[ngbAccordionItem]", inputs: ["ngbAccordionItem", "destroyOnHide", "disabled", "collapsed"], outputs: ["show", "shown", "hide", "hidden"], exportAs: ["ngbAccordionItem"] }, { kind: "directive", type: i4.NgbAccordionHeader, selector: "[ngbAccordionHeader]" }, { kind: "directive", type: i4.NgbAccordionBody, selector: "[ngbAccordionBody]" }, { kind: "directive", type: i4.NgbAccordionCollapse, selector: "[ngbAccordionCollapse]", exportAs: ["ngbAccordionCollapse"] }, { kind: "component", type: i5.BrandInfoComponent, selector: "lib-brand-info" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: BrandDetailsComponent, deps: [{ token: i1.ClientApiService }, { token: i2.ToastService }, { token: i3.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: BrandDetailsComponent, selector: "lib-brand-details", viewQueries: [{ propertyName: "accordion", first: true, predicate: ["accordion"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"row\">\r\n    <div class=\"col-12\">\r\n        <div ngbAccordion #accordion=\"ngbAccordion\" [closeOthers]=\"true\" [destroyOnHide]=\"true\" (show)=\"openItem($event)\">\r\n            <div class=\"settings-accordian-card \"  ngbAccordionItem [collapsed]=\"false\">\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button type=\"button\" class=\"mainheading\" ngbAccordionButton >\r\n                        <div class=\"header-row\">\r\n                            <span >Brand Info</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-brand-info></lib-brand-info>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <!-- <div class=\"settings-accordian-card mt-6\" ngbAccordionItem>\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button class=\"mainheading\" ngbAccordionButton>\r\n                        <div class=\"header-row\">\r\n                            <span >Billing Details</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-billing-details></lib-billing-details>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"settings-accordian-card mt-6\" ngbAccordionItem>\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button class=\"mainheading\" ngbAccordionButton>\r\n                        <div class=\"header-row\">\r\n                            <span >Signatory Details</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-signatory-details></lib-signatory-details>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div> -->\r\n        </div>\r\n    </div>", styles: [".settings-accordian-card{border-radius:10px;background:var(#FFF)}\n"], dependencies: [{ kind: "directive", type: i4.NgbAccordionButton, selector: "button[ngbAccordionButton]" }, { kind: "directive", type: i4.NgbAccordionDirective, selector: "[ngbAccordion]", inputs: ["animation", "closeOthers", "destroyOnHide"], outputs: ["show", "shown", "hide", "hidden"], exportAs: ["ngbAccordion"] }, { kind: "directive", type: i4.NgbAccordionItem, selector: "[ngbAccordionItem]", inputs: ["ngbAccordionItem", "destroyOnHide", "disabled", "collapsed"], outputs: ["show", "shown", "hide", "hidden"], exportAs: ["ngbAccordionItem"] }, { kind: "directive", type: i4.NgbAccordionHeader, selector: "[ngbAccordionHeader]" }, { kind: "directive", type: i4.NgbAccordionBody, selector: "[ngbAccordionBody]" }, { kind: "directive", type: i4.NgbAccordionCollapse, selector: "[ngbAccordionCollapse]", exportAs: ["ngbAccordionCollapse"] }, { kind: "component", type: i5.BrandInfoComponent, selector: "lib-brand-info" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BrandDetailsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: BrandDetailsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-brand-details', template: "<div class=\"row\">\r\n    <div class=\"col-12\">\r\n        <div ngbAccordion #accordion=\"ngbAccordion\" [closeOthers]=\"true\" [destroyOnHide]=\"true\" (show)=\"openItem($event)\">\r\n            <div class=\"settings-accordian-card \"  ngbAccordionItem [collapsed]=\"false\">\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button type=\"button\" class=\"mainheading\" ngbAccordionButton >\r\n                        <div class=\"header-row\">\r\n                            <span >Brand Info</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-brand-info></lib-brand-info>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <!-- <div class=\"settings-accordian-card mt-6\" ngbAccordionItem>\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button class=\"mainheading\" ngbAccordionButton>\r\n                        <div class=\"header-row\">\r\n                            <span >Billing Details</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-billing-details></lib-billing-details>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"settings-accordian-card mt-6\" ngbAccordionItem>\r\n                <div class=\"d-flex\" ngbAccordionHeader>\r\n                    <button class=\"mainheading\" ngbAccordionButton>\r\n                        <div class=\"header-row\">\r\n                            <span >Signatory Details</span>\r\n                            <span class=\"divider\"></span>\r\n                        </div>\r\n                    </button>\r\n                </div>\r\n                <div ngbAccordionCollapse>\r\n                    <div ngbAccordionBody>\r\n                        <ng-template>\r\n                            <lib-signatory-details></lib-signatory-details>\r\n                        </ng-template>\r\n                    </div>\r\n                </div>\r\n            </div> -->\r\n        </div>\r\n    </div>", styles: [".settings-accordian-card{border-radius:10px;background:var(#FFF)}\n"] }]
         }], ctorParameters: () => [{ type: i1.ClientApiService }, { type: i2.ToastService }, { type: i3.GlobalStateService }], propDecorators: { accordion: [{