tango-app-ui-shared 3.0.17-dev → 3.0.19-dev

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 (9) hide show
  1. package/esm2022/lib/interceptors/http-auth-interceptor.mjs +2 -2
  2. package/esm2022/lib/modules/common/custom-select/custom-select.component.mjs +2 -2
  3. package/esm2022/lib/modules/layout/toolbar/date-single-select/date-single-select.component.mjs +8 -8
  4. package/esm2022/lib/modules/layout/toolbar/single-store/single-store.component.mjs +15 -11
  5. package/esm2022/lib/modules/layout/toolbar/toolbar.component.mjs +27 -44
  6. package/fesm2022/tango-app-ui-shared.mjs +50 -63
  7. package/fesm2022/tango-app-ui-shared.mjs.map +1 -1
  8. package/lib/modules/layout/toolbar/toolbar.component.d.ts +4 -2
  9. package/package.json +1 -1
package/fesm2022/tango-app-ui-shared.mjs CHANGED
@@ -2025,11 +2025,11 @@ class CustomSelectComponent {
2025
2025
  return this.filteredValues.every((item) => item.isSelected);
2026
2026
  }
2027
2027
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomSelectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
2028
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: CustomSelectComponent, selector: "lib-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n {{selectedValues?.length}} {{label}} Selected \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi\">\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 Select All\r\n </label>\r\n </div>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" >\r\n <div [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField]\">\r\n <label class=\"form-check-label\" [for]=\"item[idField]\">\r\n {{item[searchField]}}\r\n </label>\r\n </div>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>\r\n ", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:45px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:200px;overflow-y:scroll;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul li{list-style:none;padding:10px 16px}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.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}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i4.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: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2028
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: CustomSelectComponent, selector: "lib-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n {{selectedValues?.length}} {{label}} Selected \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi\">\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 Select All\r\n </label>\r\n </div>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" >\r\n <div [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField]\">\r\n <label class=\"form-check-label\" [for]=\"item[idField]\">\r\n {{item[searchField]}}\r\n </label>\r\n </div>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>\r\n ", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:45px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:scroll;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul li{list-style:none;padding:10px 16px}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.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}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i4.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: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2029
2029
  }
2030
2030
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomSelectComponent, decorators: [{
2031
2031
  type: Component,
2032
- args: [{ selector: 'lib-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n {{selectedValues?.length}} {{label}} Selected \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi\">\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 Select All\r\n </label>\r\n </div>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" >\r\n <div [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField]\">\r\n <label class=\"form-check-label\" [for]=\"item[idField]\">\r\n {{item[searchField]}}\r\n </label>\r\n </div>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>\r\n ", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:45px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:200px;overflow-y:scroll;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul li{list-style:none;padding:10px 16px}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.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}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}\n"] }]
2032
+ args: [{ selector: 'lib-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n {{selectedValues?.length}} {{label}} Selected \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi\">\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 Select All\r\n </label>\r\n </div>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" >\r\n <div [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField]\">\r\n <label class=\"form-check-label\" [for]=\"item[idField]\">\r\n {{item[searchField]}}\r\n </label>\r\n </div>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>\r\n ", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:45px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:scroll;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul li{list-style:none;padding:10px 16px}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.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}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}\n"] }]
2033
2033
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { onClick: [{
2034
2034
  type: HostListener,
2035
2035
  args: ['document:click', ['$event']]
@@ -2239,15 +2239,15 @@ class DateSingleSelectComponent {
2239
2239
  this.clientList.find((obj) => {
2240
2240
  if (obj.clientId === headerFilters.client) {
2241
2241
  this.selectedClient = obj;
2242
- this.cd.detectChanges();
2243
2242
  }
2244
- this.selectedFilters.client = headerFilters.client;
2245
- this.selectedFilters.clients = [headerFilters.clients];
2246
- this.selectedFilters.date = headerFilters.date;
2247
- this.selectedDateRange.startDate = headerFilters.date.startDate;
2248
- this.selectedDateRange.endDate = headerFilters.date.endDate;
2249
- this.gs.dataRangeValue.next(this.selectedFilters);
2250
2243
  });
2244
+ this.selectedFilters.client = headerFilters.client;
2245
+ this.selectedFilters.clients = [headerFilters.clients];
2246
+ this.selectedFilters.date = headerFilters.date;
2247
+ this.selectedDateRange.startDate = headerFilters.date.startDate;
2248
+ this.selectedDateRange.endDate = headerFilters.date.endDate;
2249
+ this.gs.dataRangeValue.next(this.selectedFilters);
2250
+ this.cd.detectChanges();
2251
2251
  }
2252
2252
  else {
2253
2253
  this.selectedClient = this.clientList[0];
@@ -2366,17 +2366,19 @@ class SingleStoreComponent {
2366
2366
  this.storeList.find((obj) => {
2367
2367
  if (obj.storeId === headerFilters.store) {
2368
2368
  this.selectedClient = obj;
2369
- this.gs.dataRangeValue.next(this.selectedFilters);
2369
+ console.log("1111111111111");
2370
+ // this.gs.dataRangeValue.next(this.selectedFilters);
2370
2371
  }
2371
- this.gs.dataRangeValue.next(this.selectedFilters);
2372
- this.selectedFilters.store = headerFilters.store;
2373
- this.selectedFilters.client = headerFilters.client;
2374
- this.selectedFilters.clients = [headerFilters.clients];
2375
- this.selectedFilters.date = headerFilters.date;
2376
- this.selectedDateRange.startDate = headerFilters.date.startDate;
2377
- this.selectedDateRange.endDate = headerFilters.date.endDate;
2378
- this.cd.detectChanges();
2379
2372
  });
2373
+ // console.log("222222222222222");
2374
+ this.selectedFilters.store = headerFilters.store;
2375
+ this.selectedFilters.client = headerFilters.client;
2376
+ this.selectedFilters.clients = [headerFilters.clients];
2377
+ this.selectedFilters.date = headerFilters.date;
2378
+ this.selectedDateRange.startDate = headerFilters.date.startDate;
2379
+ this.selectedDateRange.endDate = headerFilters.date.endDate;
2380
+ this.gs.dataRangeValue.next(this.selectedFilters);
2381
+ this.cd.detectChanges();
2380
2382
  }
2381
2383
  else {
2382
2384
  this.selectedClient = this.storeList[0];
@@ -2384,6 +2386,7 @@ class SingleStoreComponent {
2384
2386
  this.selectedDateRange.startDate = this.dayjs().format('YYYY-MM-DD');
2385
2387
  this.selectedDateRange.endDate = this.dayjs().format('YYYY-MM-DD');
2386
2388
  this.selectedFilters.date = this.selectedDateRange;
2389
+ console.log("33333333333333");
2387
2390
  this.gs.dataRangeValue.next(this.selectedFilters);
2388
2391
  this.cd.detectChanges();
2389
2392
  }
@@ -2394,7 +2397,7 @@ class SingleStoreComponent {
2394
2397
  }
2395
2398
  onClientSelect(event) {
2396
2399
  this.selectedClient = event;
2397
- this.gs.selectedClient.next(this.selectedClient);
2400
+ // this.gs.selectedClient.next(this.selectedClient)
2398
2401
  }
2399
2402
  ranges = {
2400
2403
  'Today': [this.dayjs(), this.dayjs()],
@@ -2435,6 +2438,7 @@ class SingleStoreComponent {
2435
2438
  this.selectedFilters = headerFilters;
2436
2439
  this.selectedFilters.store = this.selectedClient.storeId;
2437
2440
  this.selectedFilters.date = this.selectedDateRange;
2441
+ console.log("4444444444444444");
2438
2442
  this.gs.dataRangeValue.next(this.selectedFilters);
2439
2443
  localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
2440
2444
  }
@@ -2451,6 +2455,7 @@ class ToolbarComponent {
2451
2455
  router;
2452
2456
  route;
2453
2457
  gs;
2458
+ pageInfo;
2454
2459
  unsubscribe = [];
2455
2460
  // Public props
2456
2461
  currentLayoutType;
@@ -2475,11 +2480,12 @@ class ToolbarComponent {
2475
2480
  singleStore;
2476
2481
  headervalue;
2477
2482
  storeId;
2478
- constructor(layout, router, route, gs) {
2483
+ constructor(layout, router, route, gs, pageInfo) {
2479
2484
  this.layout = layout;
2480
2485
  this.router = router;
2481
2486
  this.route = route;
2482
2487
  this.gs = gs;
2488
+ this.pageInfo = pageInfo;
2483
2489
  }
2484
2490
  ngOnInit() {
2485
2491
  // let data:any = JSON.parse(localStorage.getItem('header-filters') || '');
@@ -2532,69 +2538,50 @@ class ToolbarComponent {
2532
2538
  if ("header-filters" in localStorage) {
2533
2539
  const data = JSON.parse(localStorage.getItem("header-filters") || "{}");
2534
2540
  this.storeId = data.store;
2541
+ // this.setPageData(this.storeId)
2542
+ // Construct the new URL with the updated storeId
2543
+ const currentUrl = this.router.url;
2544
+ const updatedUrl = currentUrl.replace(/\/manage\/stores\/\d+-\d+\//, `/manage/stores/${this.storeId}/`);
2545
+ // Navigate to the updated URL
2546
+ this.router.navigateByUrl(updatedUrl);
2535
2547
  }
2536
- let url = this.router.url.split("/");
2548
+ const url = this.router.url.split("/");
2537
2549
  if (url[2] == 'settings') {
2538
- console.log(this.router.url);
2539
- this.singleSelect = true;
2540
- this.multiSelect = false;
2541
- this.datepicker = false;
2542
- this.singleStore = false;
2543
- this.singleSelectdatepicker = false;
2550
+ this.setUIProperties(true, false, false, false, false);
2544
2551
  }
2545
2552
  else if (this.router.url == "/manage/brands") {
2546
- this.singleSelect = false;
2547
- this.multiSelect = false;
2548
- this.datepicker = false;
2549
- this.singleStore = false;
2550
- this.singleSelectdatepicker = false;
2553
+ this.setUIProperties(false, false, false, false, false);
2551
2554
  }
2552
- else if (this.router.url == "/manage/users" || this.router.url == "/manage/stores" || this.router.url == "/manage/stores/addition-method" || this.router.url == "/manage/stores/add-single-store" || this.router.url == "manage/stores/edge-app/edge-email-journey") {
2553
- this.singleSelect = false;
2554
- this.multiSelect = false;
2555
- this.datepicker = false;
2556
- this.singleStore = false;
2557
- this.singleSelectdatepicker = true;
2555
+ else if (this.router.url == "/manage/users" || this.router.url == "/manage/stores" || this.router.url == "/manage/stores/addition-method") {
2556
+ this.setUIProperties(false, false, false, false, true);
2558
2557
  }
2559
2558
  else if (this.router.url == `/manage/stores/${this.storeId}/infra-ticket` || this.router.url == `/manage/stores/${this.storeId}/settings`) {
2560
- this.singleSelect = false;
2561
- this.multiSelect = false;
2562
- this.datepicker = false;
2563
- this.singleSelectdatepicker = false;
2564
- this.singleStore = true;
2559
+ this.setUIProperties(false, false, false, true, false);
2565
2560
  }
2566
2561
  else if (this.router.url == "/profile") {
2567
- this.singleSelect = false;
2568
- this.multiSelect = false;
2569
- this.datepicker = false;
2570
- this.singleStore = false;
2571
- this.singleSelectdatepicker = false;
2562
+ this.setUIProperties(false, false, false, false, false);
2572
2563
  }
2573
2564
  else {
2574
- this.singleSelect = false;
2575
- this.multiSelect = true;
2576
- this.datepicker = false;
2577
- this.singleSelectdatepicker = false;
2578
- this.singleStore = false;
2565
+ this.setUIProperties(false, true, false, false, false);
2579
2566
  }
2580
- // else if (this.router.url == "/manage/users") {
2581
- // this.singleSelect = false;
2582
- // this.multiSelect = false;
2583
- // this.datepicker = true;
2584
- // this.singleStore =false
2585
- // this.singleSelectdatepicker = false;
2586
- // }
2587
2567
  const viewsWithPageTitles = ["classic", "reports", "saas"];
2588
2568
  return (this.appPageTitleDisplay &&
2589
2569
  viewsWithPageTitles.some((t) => t === this.appToolbarLayout));
2590
2570
  }
2591
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
2571
+ setUIProperties(singleSelect, multiSelect, datepicker, singleStore, singleSelectdatepicker) {
2572
+ this.singleSelect = singleSelect;
2573
+ this.multiSelect = multiSelect;
2574
+ this.datepicker = datepicker;
2575
+ this.singleStore = singleStore;
2576
+ this.singleSelectdatepicker = singleSelectdatepicker;
2577
+ }
2578
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: GlobalStateService }, { token: i1.PageInfoService }], target: i0.ɵɵFactoryTarget.Component });
2592
2579
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ToolbarComponent, selector: "lib-toolbar", inputs: { currentLayoutType: "currentLayoutType", appToolbarLayout: "appToolbarLayout" }, ngImport: i0, template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"datepicker\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n </lib-reports>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n </ng-container> -->\r\n</div>\r\n<!--end::Toolbar container-->\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PageTitleComponent, selector: "lib-page-title", inputs: ["appPageTitleDirection", "appPageTitleBreadcrumb", "appPageTitleDescription"] }, { kind: "component", type: ClassicComponent, selector: "lib-classic" }, { kind: "component", type: ClientSettingsComponent, selector: "lib-client-settings" }, { kind: "component", type: DatepickerComponent, selector: "lib-datepicker" }, { kind: "component", type: DateSingleSelectComponent, selector: "lib-date-single-select" }, { kind: "component", type: SingleStoreComponent, selector: "lib-single-store" }] });
2593
2580
  }
2594
2581
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, decorators: [{
2595
2582
  type: Component,
2596
2583
  args: [{ selector: "lib-toolbar", template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"datepicker\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n </lib-reports>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n </ng-container> -->\r\n</div>\r\n<!--end::Toolbar container-->\r\n" }]
2597
- }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: GlobalStateService }], propDecorators: { currentLayoutType: [{
2584
+ }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: GlobalStateService }, { type: i1.PageInfoService }], propDecorators: { currentLayoutType: [{
2598
2585
  type: Input
2599
2586
  }], appToolbarLayout: [{
2600
2587
  type: Input
@@ -4598,7 +4585,7 @@ class HttpAuthInterceptor {
4598
4585
  const user = JSON.parse(localStorage.getItem(this.authlocalStorageToken) || '{}');
4599
4586
  request = request.clone({
4600
4587
  setHeaders: {
4601
- Authorization: 'Bearer ' + user.athenticationToken
4588
+ Authorization: 'Bearer ' + user.authenticationToken
4602
4589
  }
4603
4590
  });
4604
4591
  return next.handle(request);