@sunbird-cb/consumption 0.0.21 → 0.0.22

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 (27) hide show
  1. package/bundles/sunbird-cb-consumption.umd.js +202 -28
  2. package/bundles/sunbird-cb-consumption.umd.js.map +1 -1
  3. package/bundles/sunbird-cb-consumption.umd.min.js +1 -1
  4. package/bundles/sunbird-cb-consumption.umd.min.js.map +1 -1
  5. package/esm2015/lib/_common/announcements/announcements.component.js +2 -2
  6. package/esm2015/lib/_common/cards/card-karma-programs/card-karma-programs.component.js +128 -0
  7. package/esm2015/lib/_common/cards/card-landscape/card-landscape.component.js +5 -1
  8. package/esm2015/lib/_common/cards/cards.module.js +6 -3
  9. package/esm2015/lib/_common/data-points/data-points.component.js +22 -4
  10. package/esm2015/lib/_common/horizontal-scroller-v2/horizontal-scroller-v2.component.js +24 -1
  11. package/esm2015/sunbird-cb-consumption.js +23 -22
  12. package/esm5/lib/_common/announcements/announcements.component.js +2 -2
  13. package/esm5/lib/_common/cards/card-karma-programs/card-karma-programs.component.js +131 -0
  14. package/esm5/lib/_common/cards/card-landscape/card-landscape.component.js +5 -1
  15. package/esm5/lib/_common/cards/cards.module.js +6 -3
  16. package/esm5/lib/_common/data-points/data-points.component.js +22 -4
  17. package/esm5/lib/_common/horizontal-scroller-v2/horizontal-scroller-v2.component.js +24 -1
  18. package/esm5/sunbird-cb-consumption.js +23 -22
  19. package/fesm2015/sunbird-cb-consumption.js +178 -7
  20. package/fesm2015/sunbird-cb-consumption.js.map +1 -1
  21. package/fesm5/sunbird-cb-consumption.js +180 -7
  22. package/fesm5/sunbird-cb-consumption.js.map +1 -1
  23. package/lib/_common/cards/card-karma-programs/card-karma-programs.component.d.ts +19 -0
  24. package/lib/_common/data-points/data-points.component.d.ts +1 -0
  25. package/package.json +1 -1
  26. package/sunbird-cb-consumption.d.ts +22 -21
  27. package/sunbird-cb-consumption.metadata.json +1 -1
@@ -187,6 +187,17 @@ var HorizontalScrollerV2Component = /** @class */ (function () {
187
187
  if (elem.scrollLeft !== 0 && (elem.scrollWidth !== elem.clientWidth + elem.scrollLeft)) {
188
188
  this.activeNav -= 1;
189
189
  }
190
+ else {
191
+ if (this.sliderConfig.arrowsAlwaysOn) {
192
+ if (this.horizontalScrollElem.nativeElement.scrollLeft === 0) {
193
+ this.horizontalScrollElem.nativeElement.scrollTo({
194
+ left: elem.scrollWidth,
195
+ behavior: 'smooth',
196
+ });
197
+ this.activeNav = this.bottomDotsArray.length - 1;
198
+ }
199
+ }
200
+ }
190
201
  }
191
202
  };
192
203
  /**
@@ -211,6 +222,17 @@ var HorizontalScrollerV2Component = /** @class */ (function () {
211
222
  if (elem.scrollLeft !== 0 && (elem.scrollWidth !== elem.clientWidth + elem.scrollLeft)) {
212
223
  this.activeNav += 1;
213
224
  }
225
+ else {
226
+ if (this.sliderConfig.arrowsAlwaysOn) {
227
+ if (this.horizontalScrollElem.nativeElement.scrollLeft !== 0 && elem.clientWidth + elem.scrollLeft >= elem.scrollWidth) {
228
+ this.horizontalScrollElem.nativeElement.scrollTo({
229
+ left: 0,
230
+ behavior: 'smooth',
231
+ });
232
+ this.activeNav = 0;
233
+ }
234
+ }
235
+ }
214
236
  }
215
237
  };
216
238
  /**
@@ -224,6 +246,7 @@ var HorizontalScrollerV2Component = /** @class */ (function () {
224
246
  * @return {?}
225
247
  */
226
248
  function (elem) {
249
+ debugger;
227
250
  this.enablePrev = true;
228
251
  this.enableNext = true;
229
252
  if (elem.scrollLeft === 0) {
@@ -6264,6 +6287,7 @@ var DataPointsComponent = /** @class */ (function () {
6264
6287
  this.layoutType = '';
6265
6288
  this.fetchDataFromApi = false;
6266
6289
  this.providerId = '';
6290
+ this.pageLayout = '';
6267
6291
  this.customArray = [];
6268
6292
  this.isDataLoading = false;
6269
6293
  }
@@ -6307,7 +6331,8 @@ var DataPointsComponent = /** @class */ (function () {
6307
6331
  function () {
6308
6332
  var _this = this;
6309
6333
  /** @type {?} */
6310
- var request = {
6334
+ var request = {};
6335
+ request = {
6311
6336
  "request": {
6312
6337
  "filters": {
6313
6338
  "organisations": [
@@ -6316,6 +6341,19 @@ var DataPointsComponent = /** @class */ (function () {
6316
6341
  }
6317
6342
  }
6318
6343
  };
6344
+ if (this.pageLayout && this.pageLayout === 'mdo') {
6345
+ request = {
6346
+ "request": {
6347
+ "filters": {
6348
+ "requestType": "MDO_INSIGHT",
6349
+ "organisations": [
6350
+ //this.providerId
6351
+ "123456"
6352
+ ]
6353
+ }
6354
+ }
6355
+ };
6356
+ }
6319
6357
  this.insightSvc.fetchSearchData(request).subscribe((/**
6320
6358
  * @param {?} res
6321
6359
  * @return {?}
@@ -6338,7 +6376,7 @@ var DataPointsComponent = /** @class */ (function () {
6338
6376
  DataPointsComponent.decorators = [
6339
6377
  { type: Component, args: [{
6340
6378
  selector: 'sb-uic-data-points',
6341
- template: "<div class=\"w-full metrics-web\" *ngIf=\"layoutType === 'multipleRows' && !isDataLoading\">\n <div *ngFor=\"let obj of objectData; let last = last\" class=\"\">\n <div class=\"element-div\" [ngClass]=\"{'linebreak': obj?.linebreak && !last}\">\n <div class=\"flex flex-row gap-3 items-top\">\n <div>\n <img class=\"objIcon\" [src]=\"obj.icon\" [style.color]=\"obj?.iconColor\">\n </div>\n <div>\n <div [style.color]=\"obj?.valueColor\" class=\"objHeader pb-1\" *ngIf=\"!(obj && obj.value)\">0</div>\n <div [style.color]=\"obj?.valueColor\" class=\"objHeader pb-1\" *ngIf=\"(obj && obj.value)\">\n {{obj.value | number: obj.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"objDescription\">{{obj?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'singleRow'\">\n <div class=\"flex gap-4\">\n <div *ngFor=\"let obj of objectData\" class=\"flex-container\">\n <div class=\"melement-div {{obj?.background}} flex-item\" [style.background]=\"obj?.background\" >\n <div class=\"flex flex-row gap-3\">\n <div>\n <img [style.color]=\"obj?.iconColor\" class=\"mobjIcon\" [src]=\"obj.icon\">\n </div>\n <div>\n <div [style.color]=\"obj?.valueColor\" class=\"mobjHeader pb-1\" *ngIf=\"!(obj && obj.value)\">0</div>\n <div [style.color]=\"obj?.valueColor\" class=\"mobjHeader pb-1\" *ngIf=\"(obj && obj.value)\">\n {{obj?.value | number: obj.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"mobjDescription\">{{obj?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n </div> \n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'gridLayout'\">\n <div class=\"w-full\" *ngIf=\"layoutType === 'gridLayout'\">\n <div class=\"top-container\">\n <div class=\"flex-container\" *ngFor=\"let chunk of customArray\">\n <div *ngFor=\"let item of chunk\">\n <div class=\"flex-item\">\n <div class=\"flex flex-row gap-5 infra-element-div\">\n <div>\n <div [style.color]=\"item?.valueColor\" class=\"infra-objHeader\" *ngIf=\"!(item && item.value)\">0</div>\n <div [style.color]=\"item?.valueColor\" class=\"infra-objHeader\" *ngIf=\"(item && item.value)\">\n {{item?.value | number: item.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"item?.labelColor\" class=\"custom-opacity infra-objDescription padding-top-s\">{{item?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n </div>\n </div> \n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'singleFlexeRow'\">\n <div class=\"flex\">\n <div *ngFor=\"let obj of objectData\" class=\"flex-container\">\n <div class=\"singleFlexeRow-div flex-item\">\n <div class=\"flex flex-row gap-3\">\n <div>\n <img [style.color]=\"obj?.iconColor\" class=\"singleFlexeRowIcon\" [src]=\"obj.icon\">\n </div>\n <div class=\"flex flex-col\">\n <div [style.color]=\"obj?.valueColor\" class=\"singleFlexeRowHeader pb-2\" *ngIf=\"!(obj && obj.value)\">0</div>\n <div [style.color]=\"obj?.valueColor\" class=\"singleFlexeRowHeader pb-2\" *ngIf=\"(obj && obj.value)\">\n {{obj?.value | number: obj.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"singleFlexeRowDescription\">{{obj?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<!-- skeleton loaders -->\n\n<ng-container>\n <div class=\"w-full metrics-web\" *ngIf=\"layoutType === 'multipleRows' && isDataLoading\">\n <div *ngFor=\"let obj of [0,1,2,3]\" class=\"\">\n <div class=\"element-div linebreak\" >\n <div class=\"flex flex-row gap-3 items-top\">\n <div>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'32px'\"\n [height]=\"'32px'\"></sb-uic-skeleton-loader>\n </div>\n <div>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded mb-1'\" [width]=\"'100px'\"\n [height]=\"'24px'\"></sb-uic-skeleton-loader>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded mb-1'\" [width]=\"'150px'\"\n [height]=\"'24px'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n",
6379
+ template: "<div class=\"w-full metrics-web\" *ngIf=\"layoutType === 'multipleRows' && !isDataLoading\">\n <div *ngFor=\"let obj of objectData; let last = last\" class=\"\">\n <div class=\"element-div\" [ngClass]=\"{'linebreak': obj?.linebreak && !last}\">\n <div class=\"flex flex-row gap-3 items-top\">\n <div>\n <img class=\"objIcon\" [src]=\"obj.icon\" [style.color]=\"obj?.iconColor\">\n </div>\n <div>\n <div [style.color]=\"obj?.valueColor\" class=\"objHeader pb-1\" *ngIf=\"!(obj && obj.value)\">0</div>\n <div [style.color]=\"obj?.valueColor\" class=\"objHeader pb-1\" *ngIf=\"(obj && obj.value)\">\n {{obj.value | number: obj.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"objDescription\">{{obj?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'singleRow' && !isDataLoading\">\n <div class=\"flex gap-4\">\n <div *ngFor=\"let obj of objectData\" class=\"flex-container\">\n <div class=\"melement-div {{obj?.background}} flex-item\" [style.background]=\"obj?.background\" >\n <div class=\"flex flex-row gap-3\">\n <div>\n <img [style.color]=\"obj?.iconColor\" class=\"mobjIcon\" [src]=\"obj.icon\">\n </div>\n <div>\n <div [style.color]=\"obj?.valueColor\" class=\"mobjHeader pb-1\" *ngIf=\"!(obj && obj.value)\">0</div>\n <div [style.color]=\"obj?.valueColor\" class=\"mobjHeader pb-1\" *ngIf=\"(obj && obj.value)\">\n {{obj?.value | number: obj.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"mobjDescription\">{{obj?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n </div> \n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'gridLayout'\">\n <div class=\"w-full\" *ngIf=\"layoutType === 'gridLayout'\">\n <div class=\"top-container\">\n <div class=\"flex-container\" *ngFor=\"let chunk of customArray\">\n <div *ngFor=\"let item of chunk\">\n <div class=\"flex-item\">\n <div class=\"flex flex-row gap-5 infra-element-div\">\n <div>\n <div [style.color]=\"item?.valueColor\" class=\"infra-objHeader\" *ngIf=\"!(item && item.value)\">0</div>\n <div [style.color]=\"item?.valueColor\" class=\"infra-objHeader\" *ngIf=\"(item && item.value)\">\n {{item?.value | number: item.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"item?.labelColor\" class=\"custom-opacity infra-objDescription padding-top-s\">{{item?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n </div>\n </div> \n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'singleFlexeRow' && !isDataLoading\">\n <div class=\"flex\">\n <div *ngFor=\"let obj of objectData\" class=\"flex-container\">\n <div class=\"singleFlexeRow-div flex-item\">\n <div class=\"flex flex-row gap-3\">\n <div>\n <img [style.color]=\"obj?.iconColor\" class=\"singleFlexeRowIcon\" [src]=\"obj.icon\">\n </div>\n <div class=\"flex flex-col\">\n <div [style.color]=\"obj?.valueColor\" class=\"singleFlexeRowHeader pb-2\" *ngIf=\"!(obj && obj.value)\">0</div>\n <div [style.color]=\"obj?.valueColor\" class=\"singleFlexeRowHeader pb-2\" *ngIf=\"(obj && obj.value)\">\n {{obj?.value | number: obj.value % 1 === 0 ? '1.0-0' : '1.1-2'}}\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"singleFlexeRowDescription\">{{obj?.label}}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<!-- skeleton loaders -->\n\n<ng-container>\n <div class=\"w-full metrics-web\" *ngIf=\"layoutType === 'multipleRows' && isDataLoading\">\n <div *ngFor=\"let obj of [0,1,2,3]\" class=\"\">\n <div class=\"element-div linebreak\" >\n <div class=\"flex flex-row gap-3 items-top\">\n <div>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'32px'\"\n [height]=\"'32px'\"></sb-uic-skeleton-loader>\n </div>\n <div>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded mb-1'\" [width]=\"'100px'\"\n [height]=\"'24px'\"></sb-uic-skeleton-loader>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded mb-1'\" [width]=\"'150px'\"\n [height]=\"'24px'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"w-full metrics-web\" *ngIf=\"layoutType === 'singleFlexeRow' && isDataLoading\">\n <div class=\"flex\">\n <div *ngFor=\"let obj of objectData\" class=\"flex-container\">\n <div class=\"singleFlexeRow-div flex-item\">\n <div class=\"flex flex-row gap-3\">\n <div>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'24px'\" [height]=\"'24px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div class=\"flex flex-col\">\n <div [style.color]=\"obj?.valueColor\" class=\"singleFlexeRowHeader pb-2\" *ngIf=\"!(obj && obj.value)\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'24px'\" [height]=\"'24px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div [style.color]=\"obj?.valueColor\" class=\"singleFlexeRowHeader pb-2\" *ngIf=\"(obj && obj.value)\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'24px'\" [height]=\"'24px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"singleFlexeRowDescription\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'100px'\" [height]=\"'20px'\">\n </sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"w-full\" *ngIf=\"layoutType === 'singleRow' && isDataLoading\">\n <div class=\"flex gap-4\">\n <div *ngFor=\"let obj of objectData\" class=\"flex-container\">\n <div class=\"melement-div {{obj?.background}} flex-item\" [style.background]=\"obj?.background\" >\n <div class=\"flex flex-row gap-3\">\n <div>\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'24px'\" [height]=\"'20px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div>\n <div [style.color]=\"obj?.valueColor\" class=\"mobjHeader pb-1\" *ngIf=\"!(obj && obj.value)\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'24px'\" [height]=\"'19px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div [style.color]=\"obj?.valueColor\" class=\"mobjHeader pb-1\" *ngIf=\"(obj && obj.value)\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'24px'\" [height]=\"'19px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div [style.color]=\"obj?.labelColor\" class=\"mobjDescription\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'100px'\" [height]=\"'18px'\">\n </sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n",
6342
6380
  styles: [".white{color:#fff}.custom-opacity{opacity:.7}.black{color:#000}.objIcon{width:32px;height:32px}.mobjIcon{width:24px;height:24px}.objHeader{font-family:Montserrat;font-size:24px;font-weight:600;line-height:29.26px;text-align:left}.mobjHeader{font-family:Montserrat;font-size:16px;font-weight:600;line-height:19.5px;text-align:left}.objDescription{font-family:Lato;font-size:16px;font-weight:400;line-height:19.2px;text-align:left}.mobjDescription{font-family:Lato;font-size:14px;font-weight:400;line-height:16.8px;text-align:left}.metrics-web{height:inherit;overflow-y:auto}.element-div{padding:25px 0;margin:0 25px}.linebreak{border-bottom:1px solid rgba(0,0,0,.16)}.singleFlexeRow-div{padding:16px;border-radius:15px}.singleFlexeRowHeader{font-family:Montserrat;font-size:20px;font-weight:600;line-height:24.38px;text-align:left}.singleFlexeRowDescription{font-family:Lato;font-size:14px;font-weight:400;line-height:16.8px;text-align:left}.singleFlexeRowIcon{width:24px;height:24px}.melement-div{padding:16px;border-radius:15px;width:249px}.banner-metrics{background:linear-gradient(180deg,#f9cb97 -107.59%,#ef951e 110.74%)}.infra-element-div{min-width:325px;padding:25px 0;align-items:baseline}.infra-objIcon{width:32px;height:32px}.infra-objHeader{font-family:Montserrat;font-size:36px;font-weight:600;line-height:29.26px;text-align:left}.infra-objDescription{font-family:Lato;font-size:16px;font-weight:400;line-height:19.2px;text-align:left}.flex-container{display:flex}.top-container{overflow-x:auto;width:100%}::-webkit-scrollbar{height:4px}::-webkit-scrollbar-track{border-radius:10px;background:#000}::-webkit-scrollbar-thumb{background:#cccc;border-radius:10px}.flex-item{flex:0 0 auto;white-space:nowrap;min-width:200px}@media screen and (max-width:768px){.infra-objIcon{width:24px;height:24px}.infra-objHeader{font-size:24px}.infra-element-div{min-width:250px;padding:15px 0 25px}}"]
6343
6381
  }] }
6344
6382
  ];
@@ -6350,7 +6388,8 @@ var DataPointsComponent = /** @class */ (function () {
6350
6388
  objectData: [{ type: Input }],
6351
6389
  layoutType: [{ type: Input }],
6352
6390
  fetchDataFromApi: [{ type: Input }],
6353
- providerId: [{ type: Input }]
6391
+ providerId: [{ type: Input }],
6392
+ pageLayout: [{ type: Input }]
6354
6393
  };
6355
6394
  return DataPointsComponent;
6356
6395
  }());
@@ -6364,6 +6403,8 @@ if (false) {
6364
6403
  /** @type {?} */
6365
6404
  DataPointsComponent.prototype.providerId;
6366
6405
  /** @type {?} */
6406
+ DataPointsComponent.prototype.pageLayout;
6407
+ /** @type {?} */
6367
6408
  DataPointsComponent.prototype.customArray;
6368
6409
  /** @type {?} */
6369
6410
  DataPointsComponent.prototype.isDataLoading;
@@ -7835,7 +7876,7 @@ var AnnouncementsComponent = /** @class */ (function () {
7835
7876
  AnnouncementsComponent.decorators = [
7836
7877
  { type: Component, args: [{
7837
7878
  selector: 'sb-uic-announcements',
7838
- template: "<div class=\"w-full\" *ngIf=\"layoutType === 'web' && !isLoading\">\n <div class=\"flex item-center key-logo\">\n <img class=\"\" [src]=\"objectData?.logoUrl\">\n </div>\n <div class=\"flex item-center key-logo \">\n <div class=\"key-heading\"\n [style.backgroundColor]=\"objectData?.header?.background\"\n [style.color]=\"objectData?.header?.color\">\n {{objectData?.title}}\n </div>\n </div>\n <div class=\"key-list-container\"\n [style.borderColor]=\"objectData?.panelborder\"\n [style.backgroundColor]=\"objectData?.panelBackground\">\n <div class=\"{{mobileHeight ? 'mob-key-list' : 'key-list'}}\" >\n <div *ngFor=\"let item of objectData?.list; let i = index\">\n <div class=\"key-list-item mb-{{ objectData?.list?.length === (i+1) ? '' : '4'}}\" \n [style.borderColor]=\"objectData?.listItem?.border\"\n [style.backgroundColor]=\"objectData?.listItem?.background\">\n <div class=\"key-list-item-content {{item?.value?.length > 152 && !item?.expanded ? 'expand' : 'un-expand'}}\" [innerHTML]=\"item?.value\"></div>\n <div class=\"more-or-less\" *ngIf=\"item?.value?.length > 152\" [style.color]=\"objectData?.panelborder\">\n <div class=\"cursor-pointer\" (click)=\"viewMoreOrLess(item)\" *ngIf=\"!item?.expanded\">View more</div>\n <div class=\"cursor-pointer\" (click)=\"viewMoreOrLess(item)\" *ngIf=\"item?.expanded\">View less</div>\n </div>\n </div>\n </div> \n </div> \n </div>\n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'mobile'\">\n <div class=\"flex item-center key-logo \">\n <div class=\"mob-key-heading\" (click)=\"openAnnouncements()\"\n [style.backgroundColor]=\"objectData?.header?.background\"\n [style.color]=\"objectData?.header?.color\">\n <div class=\"flex key-button gap-3\">\n <div>\n <img [src]=\"objectData?.mobileIcon\">\n </div>\n <div>{{objectData?.title}}</div> \n <div><mat-icon class=\"key-mob-icon\">arrow_forward_ios</mat-icon></div>\n </div> \n </div>\n </div>\n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'web' && isLoading\">\n <div class=\"flex item-center key-logo\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'50px'\" [height]=\"'35px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div class=\"flex item-center key-logo pt-1\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon'\" [width]=\"'200px'\" [height]=\"'32px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div class=\"key-list-container\"\n [style.borderColor]=\"objectData?.panelborder\"\n [style.backgroundColor]=\"objectData?.panelBackground\">\n <div class=\"{{mobileHeight ? 'mob-key-list' : 'key-list'}}\" > \n <div class=\"key-list-item mb-4\" \n *ngFor=\"let item of[0,1,2,3,4]; let i = index\"\n [style.borderColor]=\"objectData?.listItem?.border\"\n [style.backgroundColor]=\"objectData?.listItem?.background\">\n <div class=\"key-list-item-content un-expand\">\n <div class=\"py-1\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon '\" [width]=\"'350px'\" [height]=\"'24px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div class=\"py-1\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon '\" [width]=\"'350px'\" [height]=\"'24px'\">\n </sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </div> \n </div>\n</div>\n",
7879
+ template: "<div class=\"w-full\" *ngIf=\"layoutType === 'web' && !isLoading\">\n <div class=\"flex item-center key-logo\">\n <img class=\"\" [src]=\"objectData?.logoUrl\">\n </div>\n <div class=\"flex item-center key-logo\">\n <div class=\"key-heading\"\n [style.backgroundColor]=\"objectData?.header?.background\"\n [style.color]=\"objectData?.header?.color\">\n {{objectData?.title}}\n </div>\n </div>\n <div class=\"key-list-container\"\n [style.borderColor]=\"objectData?.panelborder\"\n [style.backgroundColor]=\"objectData?.panelBackground\">\n <div class=\"{{mobileHeight ? 'mob-key-list' : 'key-list'}}\" >\n <div *ngFor=\"let item of objectData?.list; let i = index\">\n <div class=\"key-list-item mb-{{ objectData?.list?.length === (i+1) ? '' : '4'}}\" \n [style.borderColor]=\"objectData?.listItem?.border\"\n [style.backgroundColor]=\"objectData?.listItem?.background\">\n <div class=\"key-list-item-content {{item?.value?.length > 152 && !item?.expanded ? 'expand' : 'un-expand'}}\" [innerHTML]=\"item?.value\"></div>\n <div class=\"more-or-less\" *ngIf=\"item?.value?.length > 152\" [style.color]=\"objectData?.panelborder\">\n <div class=\"cursor-pointer\" (click)=\"viewMoreOrLess(item)\" *ngIf=\"!item?.expanded\">View more</div>\n <div class=\"cursor-pointer\" (click)=\"viewMoreOrLess(item)\" *ngIf=\"item?.expanded\">View less</div>\n </div>\n </div>\n </div> \n </div> \n </div>\n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'mobile'\">\n <div class=\"flex item-center key-logo \">\n <div class=\"mob-key-heading\" (click)=\"openAnnouncements()\"\n [style.backgroundColor]=\"objectData?.header?.background\"\n [style.color]=\"objectData?.header?.color\">\n <div class=\"flex key-button gap-3\">\n <div>\n <img [src]=\"objectData?.mobileIcon\">\n </div>\n <div>{{objectData?.title}}</div> \n <div><mat-icon class=\"key-mob-icon\">arrow_forward_ios</mat-icon></div>\n </div> \n </div>\n </div>\n</div>\n\n<div class=\"w-full\" *ngIf=\"layoutType === 'web' && isLoading\">\n <div class=\"flex item-center key-logo\">\n <img class=\"\" [src]=\"objectData?.logoUrl\">\n </div>\n <div class=\"flex item-center key-logo pt-1\">\n <div class=\"key-heading\"\n [style.backgroundColor]=\"objectData?.header?.background\"\n [style.color]=\"objectData?.header?.color\">\n {{objectData?.title}}\n </div>\n </div>\n <div class=\"key-list-container\"\n [style.borderColor]=\"objectData?.panelborder\"\n [style.backgroundColor]=\"objectData?.panelBackground\">\n <div class=\"{{mobileHeight ? 'mob-key-list' : 'key-list'}}\" > \n <div class=\"key-list-item mb-4\" \n *ngFor=\"let item of[0,1,2,3,4]; let i = index\"\n [style.borderColor]=\"objectData?.listItem?.border\"\n [style.backgroundColor]=\"objectData?.listItem?.background\">\n <div class=\"key-list-item-content un-expand\">\n <div class=\"py-1\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon '\" [width]=\"'350px'\" [height]=\"'24px'\">\n </sb-uic-skeleton-loader>\n </div>\n <div class=\"py-1\">\n <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded objIcon '\" [width]=\"'350px'\" [height]=\"'24px'\">\n </sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </div> \n </div>\n</div>\n",
7839
7880
  styles: [".key-logo{align-items:center;justify-content:center}.key-list-container{border:1px solid #ccc;padding:45px 15px 15px;border-radius:12px;margin-top:-20px}.key-list{max-height:600px;overflow:auto}.mob-key-list{height:calc(100vh - 252px);overflow:auto}.key-list::-webkit-scrollbar{display:none}.key-list-item{padding:16px;border:1px solid #ccc;border-radius:12px;min-height:56px}::ng-deep .key-list-item-content a{color:#1b4ca1!important}.key-list-item-content{font-family:Lato;font-size:14px;font-weight:400;line-height:20px;text-align:left;white-space:initial;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}.expand{-webkit-line-clamp:3}.un-expand{-webkit-line-clamp:0}.more-or-less{font-family:Lato;font-size:14px;line-height:20px;font-weight:600}.mob-key-heading{font-family:Montserrat;font-size:16px;font-weight:600;line-height:19.5px;text-align:center;padding:7px 25px;border-radius:20px;animation:.9s infinite mobPaddingAnimation;cursor:pointer}.key-mob-icon{font-size:12px;width:12px;height:12px}.key-button{align-items:center;justify-content:center}.key-heading{font-family:Montserrat;font-size:16px;font-weight:600;line-height:19.5px;text-align:center;padding:10px 50px;border-radius:20px;margin-top:-3px;animation:.9s infinite paddingAnimation}@keyframes mobPaddingAnimation{0%,100%{padding:7px 25px}25%,75%{padding:7px 30px}50%{padding:7px 35px}}@keyframes paddingAnimation{0%,100%{padding:10px 50px}25%,75%{padding:10px 55px}50%{padding:10px 60px}}"]
7840
7881
  }] }
7841
7882
  ];
@@ -8916,6 +8957,10 @@ var CardLandscapeComponent = /** @class */ (function () {
8916
8957
  this.sourceLogos = instanceConfig.sources;
8917
8958
  this.defaultSLogo = instanceConfig.logos.defaultSourceLogo || '';
8918
8959
  }
8960
+ else {
8961
+ this.defaultThumbnail = '/assets/instances/eagle/app_logos/default.png';
8962
+ this.defaultSLogo = '/assets/instances/eagle/app_logos/KarmayogiBharat_Logo.svg';
8963
+ }
8919
8964
  this.cbPlanInterval = setInterval((/**
8920
8965
  * @return {?}
8921
8966
  */
@@ -9558,6 +9603,132 @@ if (false) {
9558
9603
  CardWideV2Component.prototype.configSvc;
9559
9604
  }
9560
9605
 
9606
+ /**
9607
+ * @fileoverview added by tsickle
9608
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
9609
+ */
9610
+ var CardKarmaProgramsComponent = /** @class */ (function () {
9611
+ function CardKarmaProgramsComponent(events, translate, langtranslations, configSvc) {
9612
+ var _this = this;
9613
+ this.events = events;
9614
+ this.translate = translate;
9615
+ this.langtranslations = langtranslations;
9616
+ this.configSvc = configSvc;
9617
+ this.userData = new EventEmitter();
9618
+ this.widgetType = '';
9619
+ this.widgetSubType = '';
9620
+ this.langtranslations.languageSelectedObservable.subscribe((/**
9621
+ * @return {?}
9622
+ */
9623
+ function () {
9624
+ if (localStorage.getItem('websiteLanguage')) {
9625
+ _this.translate.setDefaultLang('en');
9626
+ /** @type {?} */
9627
+ var lang = (/** @type {?} */ (localStorage.getItem('websiteLanguage')));
9628
+ _this.translate.use(lang);
9629
+ }
9630
+ }));
9631
+ }
9632
+ /**
9633
+ * @return {?}
9634
+ */
9635
+ CardKarmaProgramsComponent.prototype.ngOnInit = /**
9636
+ * @return {?}
9637
+ */
9638
+ function () {
9639
+ /** @type {?} */
9640
+ var instanceConfig = this.configSvc.instanceConfig;
9641
+ if (instanceConfig) {
9642
+ this.defaultThumbnail = instanceConfig.logos.defaultContent || '';
9643
+ this.sourceLogos = instanceConfig.sources;
9644
+ this.defaultSLogo = instanceConfig.logos.defaultSourceLogo || '';
9645
+ }
9646
+ else {
9647
+ this.defaultThumbnail = '/assets/instances/eagle/app_logos/default.png';
9648
+ this.defaultSLogo = '/assets/instances/eagle/app_logos/KarmayogiBharat_Logo.svg';
9649
+ }
9650
+ };
9651
+ /**
9652
+ * @return {?}
9653
+ */
9654
+ CardKarmaProgramsComponent.prototype.raiseTelemetry = /**
9655
+ * @return {?}
9656
+ */
9657
+ function () {
9658
+ // if(this.forPreview){
9659
+ // return
9660
+ // }
9661
+ this.events.raiseInteractTelemetry({
9662
+ type: 'click',
9663
+ subType: this.widgetType + "-" + this.widgetSubType,
9664
+ id: camelCase(this.widgetData.content.userId) + "-card",
9665
+ }, {
9666
+ id: this.widgetData.content.userId,
9667
+ // type: this.widgetData.user.primaryCategory,
9668
+ //context: this.widgetData.context,
9669
+ rollup: {},
9670
+ }, {
9671
+ pageIdExt: camelCase('user') + "-card",
9672
+ module: camelCase('user'),
9673
+ });
9674
+ };
9675
+ CardKarmaProgramsComponent.decorators = [
9676
+ { type: Component, args: [{
9677
+ selector: 'sb-uic-card-karma-programs',
9678
+ template: "<mat-card class=\"channels-card card-channels-container mr-5 padding-remove cursor-pointer\">\n <div class=\"display-contents\">\n <ng-container *ngIf=\"widgetData.content\">\n <a (click)=\"raiseTelemetry();$event.stopPropagation()\" \n [routerLink]=\"['/app/learn/karma-programs/asdfghj/123456/micro-sites']\" role=\"link\"\n i18n-aria-label>\n <ng-container>\n <mat-card-content class=\"min-top\">\n <div class=\"flex flex-col h-full\">\n <div class=\"image-container\">\n <ng-container *ngIf=\"widgetData.content.posterImage\">\n <img mat-card-image [src]=\"widgetData.content.posterImage | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"!widgetData.content.posterImage\">\n <ng-container *ngIf=\"widgetData.content.appIcon; else defaultImg\">\n <img mat-card-image [src]=\"widgetData.content.appIcon | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-template #defaultImg>\n <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\"\n [alt]=\"widgetData.content.name\" />\n </ng-template>\n </ng-container>\n </div>\n <div class=\"flex title-container px-2\">\n <div [id]=\"'m-c-'+ widgetData.content?.identifier\"\n class=\"flex-1 text-start mat-subheading-2 title-text ws-mat-white-text\">\n {{ widgetData?.content?.name }}\n </div>\n </div>\n <div class=\"flex title-container px-2\">\n <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n class=\"flex-1 text-start mat-subheading-2 title-text ws-mat-white-text\">\n {{ widgetData?.content?.programCount}} Programs\n </div>\n </div>\n </div>\n </mat-card-content>\n </ng-container>\n </a>\n </ng-container>\n </div>\n</mat-card>",
9679
+ styles: [".card-channels-container{position:relative;width:282px;box-sizing:border-box;box-shadow:0 10px 30px rgba(153,153,153,.2);overflow:hidden;min-height:208px;height:208px;max-height:208px;margin:0 8px;background:#1a4ca1!important;border-radius:12px;padding:4px!important}.card-channels-container .min-top{background:inherit;margin-bottom:0;height:inherit}.card-channels-container .image-container{background-color:#fff;width:inherit;height:124px;max-height:124px;overflow:hidden;display:flex;align-items:center;justify-content:center;border-radius:12px}.card-channels-container .card-img{max-height:62px;min-height:62px;display:block;-o-object-fit:fill;object-fit:contain}.card-channels-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-channels-container .title-container{background:inherit}.card-channels-container .description-text{position:relative;overflow:hidden;height:51px}.card-channels-container .title-text{word-break:break-all;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;min-height:24px}"]
9680
+ }] }
9681
+ ];
9682
+ /** @nocollapse */
9683
+ CardKarmaProgramsComponent.ctorParameters = function () { return [
9684
+ { type: EventService },
9685
+ { type: TranslateService },
9686
+ { type: MultilingualTranslationsService$1 },
9687
+ { type: ConfigurationsService$1 }
9688
+ ]; };
9689
+ CardKarmaProgramsComponent.propDecorators = {
9690
+ widgetData: [{ type: Input }],
9691
+ userData: [{ type: Output }]
9692
+ };
9693
+ return CardKarmaProgramsComponent;
9694
+ }());
9695
+ if (false) {
9696
+ /** @type {?} */
9697
+ CardKarmaProgramsComponent.prototype.widgetData;
9698
+ /** @type {?} */
9699
+ CardKarmaProgramsComponent.prototype.userData;
9700
+ /** @type {?} */
9701
+ CardKarmaProgramsComponent.prototype.defaultThumbnail;
9702
+ /** @type {?} */
9703
+ CardKarmaProgramsComponent.prototype.sourceLogos;
9704
+ /** @type {?} */
9705
+ CardKarmaProgramsComponent.prototype.defaultSLogo;
9706
+ /** @type {?} */
9707
+ CardKarmaProgramsComponent.prototype.widgetType;
9708
+ /** @type {?} */
9709
+ CardKarmaProgramsComponent.prototype.widgetSubType;
9710
+ /**
9711
+ * @type {?}
9712
+ * @private
9713
+ */
9714
+ CardKarmaProgramsComponent.prototype.events;
9715
+ /**
9716
+ * @type {?}
9717
+ * @private
9718
+ */
9719
+ CardKarmaProgramsComponent.prototype.translate;
9720
+ /**
9721
+ * @type {?}
9722
+ * @private
9723
+ */
9724
+ CardKarmaProgramsComponent.prototype.langtranslations;
9725
+ /**
9726
+ * @type {?}
9727
+ * @private
9728
+ */
9729
+ CardKarmaProgramsComponent.prototype.configSvc;
9730
+ }
9731
+
9561
9732
  /**
9562
9733
  * @fileoverview added by tsickle
9563
9734
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -9574,7 +9745,8 @@ var CardsModule = /** @class */ (function () {
9574
9745
  CardLandscapeComponent,
9575
9746
  CardWideComponent,
9576
9747
  CardMDOChannelComponent,
9577
- CardWideV2Component
9748
+ CardWideV2Component,
9749
+ CardKarmaProgramsComponent
9578
9750
  ],
9579
9751
  imports: [
9580
9752
  CommonModule,
@@ -9598,7 +9770,8 @@ var CardsModule = /** @class */ (function () {
9598
9770
  CardUserComponent,
9599
9771
  CardWideComponent,
9600
9772
  CardMDOChannelComponent,
9601
- CardWideV2Component
9773
+ CardWideV2Component,
9774
+ CardKarmaProgramsComponent
9602
9775
  ],
9603
9776
  },] }
9604
9777
  ];
@@ -11224,5 +11397,5 @@ var UserContentRatingLibModule = /** @class */ (function () {
11224
11397
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
11225
11398
  */
11226
11399
 
11227
- export { AnnouncementsModule, CalenderModule, CardsModule, CommonMethodsService, CommonStripModule, CompetencyPassbookModule, ConsumptionComponent, ConsumptionModule, ConsumptionService, ContentStripWithTabsLibModule, DataPointsModule, HttpLoaderFactory, MyHammerConfig, ROOT_WIDGET_CONFIG, SlidersLibModule, UserContentRatingLibModule, WIDGET_REGISTERED_LIB_MODULES, WIDGET_REGISTRATION_LIB_CONFIG, WidgetContentService, ContentStripWithTabsLibComponent as ɵa, WidgetUserService as ɵb, CardWideV2Component as ɵba, PipePublicURLModule as ɵbb, PipePublicURL as ɵbc, DisplayContentTypeLibModule as ɵbd, DisplayContentTypeLibComponent as ɵbe, DefaultThumbnailModule as ɵbf, DefaultThumbnailDirective as ɵbg, PipeDurationTransformModule as ɵbh, PipeDurationTransformPipe as ɵbi, CompetencyPassbookComponent as ɵbj, CompetencyPassbookService as ɵbk, PillsModule as ɵbl, PillsComponent as ɵbm, UserContentRatingLibComponent as ɵbn, ScrollableItemDirective as ɵbo, RatingService as ɵbp, UserContentRatingLibService as ɵbq, AvatarPhotoLibModule as ɵbr, AvatarPhotoLibComponent as ɵbs, MyHammerConfig$1 as ɵbt, SlidersNgContentLibModule as ɵbu, SlidersNgContentLibComponent as ɵbv, ScrollableItemModule as ɵbw, MultilingualTranslationsService as ɵc, ConfigurationsService as ɵd, HorizontalScrollerV2Module as ɵe, HorizontalScrollerV2Component as ɵf, SlidersLibComponent as ɵg, NavigationModule as ɵh, NavigationDirective as ɵi, ImageResponsiveModule as ɵj, ImageResponsiveDirective as ɵk, DataPointsComponent as ɵl, InsiteDataService as ɵm, SkeletonLoaderLibModule as ɵn, SkeletonLoaderLibComponent as ɵo, CalenderComponent as ɵp, CalenderDayComponent as ɵq, CommonStripComponent as ɵr, AnnouncementsComponent as ɵs, CardResourceComponent as ɵt, CardsComponent as ɵu, CardPortraitComponent as ɵv, CardUserComponent as ɵw, CardLandscapeComponent as ɵx, CardWideComponent as ɵy, CardMDOChannelComponent as ɵz };
11400
+ export { AnnouncementsModule, CalenderModule, CardsModule, CommonMethodsService, CommonStripModule, CompetencyPassbookModule, ConsumptionComponent, ConsumptionModule, ConsumptionService, ContentStripWithTabsLibModule, DataPointsModule, HttpLoaderFactory, MyHammerConfig, ROOT_WIDGET_CONFIG, SlidersLibModule, UserContentRatingLibModule, WIDGET_REGISTERED_LIB_MODULES, WIDGET_REGISTRATION_LIB_CONFIG, WidgetContentService, ContentStripWithTabsLibComponent as ɵa, WidgetUserService as ɵb, CardWideV2Component as ɵba, CardKarmaProgramsComponent as ɵbb, PipePublicURLModule as ɵbc, PipePublicURL as ɵbd, DisplayContentTypeLibModule as ɵbe, DisplayContentTypeLibComponent as ɵbf, DefaultThumbnailModule as ɵbg, DefaultThumbnailDirective as ɵbh, PipeDurationTransformModule as ɵbi, PipeDurationTransformPipe as ɵbj, CompetencyPassbookComponent as ɵbk, CompetencyPassbookService as ɵbl, PillsModule as ɵbm, PillsComponent as ɵbn, UserContentRatingLibComponent as ɵbo, ScrollableItemDirective as ɵbp, RatingService as ɵbq, UserContentRatingLibService as ɵbr, AvatarPhotoLibModule as ɵbs, AvatarPhotoLibComponent as ɵbt, MyHammerConfig$1 as ɵbu, SlidersNgContentLibModule as ɵbv, SlidersNgContentLibComponent as ɵbw, ScrollableItemModule as ɵbx, MultilingualTranslationsService as ɵc, ConfigurationsService as ɵd, HorizontalScrollerV2Module as ɵe, HorizontalScrollerV2Component as ɵf, SlidersLibComponent as ɵg, NavigationModule as ɵh, NavigationDirective as ɵi, ImageResponsiveModule as ɵj, ImageResponsiveDirective as ɵk, DataPointsComponent as ɵl, InsiteDataService as ɵm, SkeletonLoaderLibModule as ɵn, SkeletonLoaderLibComponent as ɵo, CalenderComponent as ɵp, CalenderDayComponent as ɵq, CommonStripComponent as ɵr, AnnouncementsComponent as ɵs, CardResourceComponent as ɵt, CardsComponent as ɵu, CardPortraitComponent as ɵv, CardUserComponent as ɵw, CardLandscapeComponent as ɵx, CardWideComponent as ɵy, CardMDOChannelComponent as ɵz };
11228
11401
  //# sourceMappingURL=sunbird-cb-consumption.js.map