@sunbird-cb/consumption 0.0.10 → 0.0.12

package/bundles/sunbird-cb-consumption.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/router'), require('rxjs'), require('rxjs/operators'), require('@angular/material'), require('@sunbird-cb/resolver-v2'), require('@angular/common/http'), require('@sunbird-cb/utils-v2'), require('lodash'), require('moment'), require('@ngx-translate/core'), require('dayjs'), require('@ngx-translate/http-loader'), require('@angular/cdk/layout'), require('@angular/platform-browser'), require('hammerjs'), require('@angular/forms')) :
-    typeof define === 'function' && define.amd ? define('@sunbird-cb/consumption', ['exports', '@angular/core', '@angular/common', '@angular/router', 'rxjs', 'rxjs/operators', '@angular/material', '@sunbird-cb/resolver-v2', '@angular/common/http', '@sunbird-cb/utils-v2', 'lodash', 'moment', '@ngx-translate/core', 'dayjs', '@ngx-translate/http-loader', '@angular/cdk/layout', '@angular/platform-browser', 'hammerjs', '@angular/forms'], factory) :
-    (global = global || self, factory((global['sunbird-cb'] = global['sunbird-cb'] || {}, global['sunbird-cb'].consumption = {}), global.ng.core, global.ng.common, global.ng.router, global.rxjs, global.rxjs.operators, global.ng.material, global['@sunbird-cb/resolver-v2'], global.ng.common.http, global['@sunbird-cb/utils-v2'], global.lodash, global.moment, global.core$1, global.dayjs_, global.httpLoader, global.ng.cdk.layout, global.ng.platformBrowser, global.hammerjs, global.ng.forms));
-}(this, (function (exports, core, common, router, rxjs, operators, material, resolverV2, http, utilsV2, lodash, moment$1, core$1, dayjs_, httpLoader, layout, platformBrowser, Hammer, forms) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/router'), require('rxjs'), require('rxjs/operators'), require('@sunbird-cb/utils-v2'), require('@angular/material'), require('@sunbird-cb/resolver-v2'), require('@angular/common/http'), require('lodash'), require('moment'), require('@ngx-translate/core'), require('dayjs'), require('@ngx-translate/http-loader'), require('@angular/cdk/layout'), require('@angular/platform-browser'), require('hammerjs'), require('@angular/forms')) :
+    typeof define === 'function' && define.amd ? define('@sunbird-cb/consumption', ['exports', '@angular/core', '@angular/common', '@angular/router', 'rxjs', 'rxjs/operators', '@sunbird-cb/utils-v2', '@angular/material', '@sunbird-cb/resolver-v2', '@angular/common/http', 'lodash', 'moment', '@ngx-translate/core', 'dayjs', '@ngx-translate/http-loader', '@angular/cdk/layout', '@angular/platform-browser', 'hammerjs', '@angular/forms'], factory) :
+    (global = global || self, factory((global['sunbird-cb'] = global['sunbird-cb'] || {}, global['sunbird-cb'].consumption = {}), global.ng.core, global.ng.common, global.ng.router, global.rxjs, global.rxjs.operators, global['@sunbird-cb/utils-v2'], global.ng.material, global['@sunbird-cb/resolver-v2'], global.ng.common.http, global.lodash, global.moment, global.core$1, global.dayjs_, global.httpLoader, global.ng.cdk.layout, global.ng.platformBrowser, global.hammerjs, global.ng.forms));
+}(this, (function (exports, core, common, router, rxjs, operators, utilsV2, material, resolverV2, http, lodash, moment$1, core$1, dayjs_, httpLoader, layout, platformBrowser, Hammer, forms) { 'use strict';
 
     Hammer = Hammer && Hammer.hasOwnProperty('default') ? Hammer['default'] : Hammer;
 
@@ -274,8 +274,10 @@
      * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
     var HorizontalScrollerV2Component = /** @class */ (function () {
-        function HorizontalScrollerV2Component() {
+        function HorizontalScrollerV2Component(valueSvc) {
+            this.valueSvc = valueSvc;
             this.loadStatus = 'fetching';
+            this.id = '';
             this.onHover = false;
             this.sliderConfig = {
                 showNavs: true,
@@ -290,6 +292,9 @@
             this.cardSubType = 'standard';
             this.bottomDotsArray = [];
             this.scrollObserver = null;
+            this.isMobile = false;
+            this.defaultMenuSubscribe = null;
+            this.isLtMedium$ = this.valueSvc.isLtMedium$;
         }
         /**
          * @return {?}
@@ -313,8 +318,20 @@
                     _this.updateNavigationBtnStatus((/** @type {?} */ (horizontalScrollElem_1
                         .nativeElement)));
                 }));
-                this.getBottomDotsArray();
+                setTimeout((/**
+                 * @return {?}
+                 */
+                function () {
+                    _this.getBottomDotsArray();
+                }), 700);
             }
+            this.defaultMenuSubscribe = this.isLtMedium$.subscribe((/**
+             * @param {?} isLtMedium
+             * @return {?}
+             */
+            function (isLtMedium) {
+                _this.isMobile = isLtMedium;
+            }));
         };
         /**
          * @return {?}
@@ -333,7 +350,12 @@
                         .nativeElement)));
                 }
             }));
-            this.getBottomDotsArray();
+            setTimeout((/**
+             * @return {?}
+             */
+            function () {
+                _this.getBottomDotsArray();
+            }), 700);
         };
         /**
          * @return {?}
@@ -345,6 +367,9 @@
             if (this.scrollObserver) {
                 this.scrollObserver.unsubscribe();
             }
+            if (this.defaultMenuSubscribe) {
+                this.defaultMenuSubscribe.unsubscribe();
+            }
         };
         /**
          * @return {?}
@@ -400,7 +425,9 @@
             this.enablePrev = true;
             this.enableNext = true;
             if (elem.scrollLeft === 0) {
-                this.enablePrev = false;
+                if (!this.sliderConfig.arrowsAlwaysOn) {
+                    this.enablePrev = false;
+                }
                 this.activeNav = 0;
             }
             if (elem.scrollWidth === Math.round(elem.clientWidth + elem.scrollLeft)) {
@@ -408,7 +435,9 @@
                     this.loadNext.emit();
                 }
                 else {
-                    this.enableNext = false;
+                    if (!this.sliderConfig.arrowsAlwaysOn) {
+                        this.enableNext = false;
+                    }
                     if (this.bottomDotsArray.length) {
                         this.activeNav = this.bottomDotsArray.length - 1;
                     }
@@ -477,10 +506,9 @@
                         ((document.getElementsByClassName(this.cardSubType) &&
                             document.getElementsByClassName(this.cardSubType)[0] !== undefined)
                             ? document.getElementsByClassName(this.cardSubType)[0].clientWidth : 245);
-                    if (document.getElementsByClassName('horizontal-scroll-container') &&
-                        document.getElementsByClassName('horizontal-scroll-container')[0]) {
+                    if (document.getElementById("" + this.id)) {
                         /** @type {?} */
-                        var scrollerWidth = document.getElementsByClassName('horizontal-scroll-container')[0].clientWidth;
+                        var scrollerWidth = document.getElementById("" + this.id).clientWidth;
                         /** @type {?} */
                         var totalCardsLength = cardWidth * this.widgetsLength;
                         if (totalCardsLength > scrollerWidth) {
@@ -512,14 +540,17 @@
         HorizontalScrollerV2Component.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-horizontal-scroller-v2',
-                        template: "\n<section class=\"horizontal-scroll-container h-full\" [ngClass]=\"{'px-4': sliderConfig.showNavs, 'mt-5':sliderConfig.cerificateCardMargin}\">\n    <ng-container *ngIf=\"sliderConfig?.showNavs\">\n        <button i18n-aria-label aria-label=\"back\" name=\"content-backward-button\" mat-mini-fab color=\"\" \n            (click)=\"showPrev()\" class=\"prevBtn  mat-elevation-z\" [hidden]=\"!enablePrev\"\n            [ngClass]=\"{'prevBtnHover': onHover}\">\n            <mat-icon>navigate_before</mat-icon>\n        </button>\n    </ng-container>\n    <div name=\"horizontal-scroll-content-strip\" class=\"horizontal-scroll-content\" #horizontalScrollElem>\n        <ng-content></ng-content>\n    </div>\n    <ng-container *ngIf=\"sliderConfig?.showNavs\">\n        <button i18n-aria-label aria-label=\"next\" name=\"content-forward-button\" mat-mini-fab (click)=\"showNext()\"\n            color=\"\" class=\"nextBtn  mat-elevation-z\" [ngClass]=\"{'nextBtnHover': onHover}\"\n            [hidden]=\"!enableNext || loadStatus === 'fetching'\">\n            <mat-icon>navigate_next</mat-icon>\n        </button>\n    </ng-container>\n    <!-- <div class=\"nextLoading\" *ngIf=\"loadStatus === 'fetching'\">\n        <mat-spinner></mat-spinner>\n    </div> -->    \n</section>\n\n<div class=\"dots-container\" *ngIf=\"sliderConfig?.showDots\">\n    <!-- <span class=\"dot\" [ngClass]=\"{ active: j === currentIndex }\" -->\n    <span class=\"dot\" [ngClass]=\"{ active: j === activeNav }\" *ngFor=\"let slide of bottomDotsArray; let j = index\" (click)=\"slideTo(j)\"></span>\n</div>",
-                        styles: [".horizontal-scroll-container{position:relative;width:100%;width:inherit}.nextBtn,.nextLoading,.prevBtn{position:absolute;top:50%;transform:translateY(-50%);z-index:999;height:32px!important;width:32px!important;display:flex;align-items:center;justify-content:center}.nextBtn,.prevBtn{border-radius:50%;background-color:#1b2133!important;color:#fff!important}.border-radius-xs{border-radius:8px!important}.prevBtn{left:0}.nextBtn{right:0}.nextLoading{padding:0;right:0}.horizontal-scroll-content{overflow-y:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;height:100%;flex-wrap:nowrap;display:flex;align-items:stretch;-ms-overflow-style:none;scrollbar-width:none}.horizontal-scroll-content::-webkit-scrollbar{width:0;height:0}.dots-container{padding:8px;display:flex;align-items:center;justify-content:center}.dots-container .dot{cursor:pointer;height:6px;width:6px;margin:0 4px;background-color:rgba(0,0,0,.4);border-radius:50%;display:inline-block;transition:background-color .5s!important}.dots-container .dot.active{border-radius:4px;background-color:#f3962f;width:16px}"]
+                        template: "\n<section class=\"horizontal-scroll-container h-full\" [id]=\"id\"\n[ngClass]=\"{'px-4': sliderConfig.showNavs && sliderConfig.showNavsSpacing, 'mt-5':sliderConfig.cerificateCardMargin}\">\n    <div name=\"horizontal-scroll-content-strip\" class=\"horizontal-scroll-content\" #horizontalScrollElem>\n        <ng-content></ng-content>\n    </div>\n    <div class=\"navigation {{isMobile? sliderConfig?.responsive?.arrowsPlacement : sliderConfig?.arrowsPlacement}}\">\n        <ng-container *ngIf=\"sliderConfig?.showNavs\">\n            <button i18n-aria-label aria-label=\"back\" name=\"content-backward-button\" mat-mini-fab color=\"\" \n                (click)=\"showPrev()\" class=\"prevBtn  mat-elevation-z\" [hidden]=\"!enablePrev\"\n                [ngClass]=\"{'prevBtnHover': onHover}\">\n                <mat-icon>navigate_before</mat-icon>\n            </button>\n        </ng-container>\n        <ng-container *ngIf=\"sliderConfig?.showNavs\">\n            <button i18n-aria-label aria-label=\"next\" name=\"content-forward-button\" mat-mini-fab (click)=\"showNext()\"\n                color=\"\" class=\"nextBtn  mat-elevation-z\" [ngClass]=\"{'nextBtnHover': onHover}\"\n                [hidden]=\"!enableNext || loadStatus === 'fetching'\">\n                <mat-icon>navigate_next</mat-icon>\n            </button>\n        </ng-container>\n    </div>\n    <!-- <div class=\"nextLoading\" *ngIf=\"loadStatus === 'fetching'\">\n        <mat-spinner></mat-spinner>\n    </div> -->    \n</section>\n\n<div class=\"dots-container {{isMobile? sliderConfig?.responsive?.dotsAlign : sliderConfig?.dotsAlign}}\" \n*ngIf=\"(isMobile && sliderConfig?.responsive?.showDots) || (!isMobile && sliderConfig?.showDots)\">\n    <!-- <span class=\"dot\" [ngClass]=\"{ active: j === currentIndex }\" -->\n    <span class=\"dot\" [ngClass]=\"{ active: j === activeNav }\" *ngFor=\"let slide of bottomDotsArray; let j = index\" (click)=\"slideTo(j)\"></span>\n</div>",
+                        styles: [".horizontal-scroll-container{position:relative;width:100%;width:inherit}.nextBtn,.nextLoading,.prevBtn{position:absolute;top:50%;transform:translateY(-50%);z-index:999;height:32px!important;width:32px!important;display:flex;align-items:center;justify-content:center}.nextBtn,.prevBtn{border-radius:50%;background-color:#1b2133!important;color:#fff!important}.border-radius-xs{border-radius:8px!important}.prevBtn{left:0}.nextBtn{right:0}.nextLoading{padding:0;right:0}.navigation.bottom-right .prevBtn{left:unset;right:56px;bottom:-44px;top:unset}.navigation.bottom-right .nextBtn{left:unset;right:8px;bottom:-44px;top:unset}.navigation.bottom-center .prevBtn{left:calc(50% - 24px);right:unset;bottom:-44px;top:unset}.navigation.bottom-center .nextBtn{left:calc(50% + 24px);right:unset;bottom:-44px;top:unset}.navigation.bottom-left .prevBtn{left:8px;right:unset;bottom:-44px;top:unset}.navigation.bottom-left .nextBtn{left:62px;right:unset;bottom:-44px;top:unset}.navigation.middle-inline .prevBtn{left:30px}.navigation.middle-inline .nextBtn{right:30px}.horizontal-scroll-content{overflow-y:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;height:100%;flex-wrap:nowrap;display:flex;align-items:stretch;-ms-overflow-style:none;scrollbar-width:none}.horizontal-scroll-content::-webkit-scrollbar{width:0;height:0}.dots-container{padding:8px;display:flex;align-items:center;justify-content:center}.dots-container.left{align-items:start;justify-content:start}.dots-container.right{align-items:end;justify-content:end}.dots-container .dot{cursor:pointer;height:6px;width:6px;margin:0 4px;background-color:rgba(0,0,0,.4);border-radius:50%;display:inline-block;transition:background-color .5s!important}.dots-container .dot.active{border-radius:4px;background-color:#f3962f;width:16px}"]
                     }] }
         ];
         /** @nocollapse */
-        HorizontalScrollerV2Component.ctorParameters = function () { return []; };
+        HorizontalScrollerV2Component.ctorParameters = function () { return [
+            { type: utilsV2.ValueService }
+        ]; };
         HorizontalScrollerV2Component.propDecorators = {
             loadStatus: [{ type: core.Input }],
+            id: [{ type: core.Input }],
             onHover: [{ type: core.Input }],
             sliderConfig: [{ type: core.Input }],
             loadNext: [{ type: core.Output }],
@@ -534,6 +565,8 @@
         /** @type {?} */
         HorizontalScrollerV2Component.prototype.loadStatus;
         /** @type {?} */
+        HorizontalScrollerV2Component.prototype.id;
+        /** @type {?} */
         HorizontalScrollerV2Component.prototype.onHover;
         /** @type {?} */
         HorizontalScrollerV2Component.prototype.sliderConfig;
@@ -562,6 +595,20 @@
          * @private
          */
         HorizontalScrollerV2Component.prototype.scrollObserver;
+        /** @type {?} */
+        HorizontalScrollerV2Component.prototype.isMobile;
+        /**
+         * @type {?}
+         * @private
+         */
+        HorizontalScrollerV2Component.prototype.defaultMenuSubscribe;
+        /** @type {?} */
+        HorizontalScrollerV2Component.prototype.isLtMedium$;
+        /**
+         * @type {?}
+         * @private
+         */
+        HorizontalScrollerV2Component.prototype.valueSvc;
     }
 
     /**
@@ -5542,13 +5589,12 @@
                                 strip.request.featureContent.request &&
                                 strip.request.featureContent.request.filters) {
                                 originalFilters = strip.request.featureContent.request.filters;
-                                strip.request.featureContent.request.filters = this.checkForDateFilters(strip.request.featureContent.request.filters);
-                                strip.request.featureContent.request.filters = this.getFiltersFromArray(strip.request.featureContent.request.filters);
+                                strip.request.featureContent.request.filters = this.postMethodFilters(strip.request.featureContent.request.filters);
                             }
                             _a.label = 1;
                         case 1:
                             _a.trys.push([1, 3, , 4]);
-                            return [4 /*yield*/, this.postRequestMethod(strip, strip.request.featureContent.request, strip.request.featureContent.path, calculateParentStatus)];
+                            return [4 /*yield*/, this.postRequestMethod(strip, strip.request.featureContent, strip.request.apiUrl, calculateParentStatus)];
                         case 2:
                             response = _a.sent();
                             // console.log('calling  after - response, ', response)
@@ -5559,14 +5605,17 @@
                                 }
                                 else {
                                     this.processStrip(strip, [], 'error', calculateParentStatus, null);
+                                    this.emptyResponse.emit(true);
                                 }
                             }
                             else {
                                 this.processStrip(strip, [], 'error', calculateParentStatus, null);
+                                this.emptyResponse.emit(true);
                             }
                             return [3 /*break*/, 4];
                         case 3:
                             error_6 = _a.sent();
+                            this.emptyResponse.emit(true);
                             return [3 /*break*/, 4];
                         case 4: return [2 /*return*/];
                     }
@@ -5655,7 +5704,7 @@
         ContentStripWithTabsLibComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-content-strip-with-tabs',
-                        template: "<ng-container *ngIf=\"!contentAvailable; else otherTemplate\"></ng-container>\n<ng-template #otherTemplate>\n  <!-- <div *ngIf=\"showParentLoader\" class=\"text-center my-2\">\n    <mat-spinner class=\"inline-block\"></mat-spinner>\n  </div> -->\n  <ng-container *ngIf=\"showParentError\" [sbUiResolverWidget]=\"widgetData.errorWidget\"></ng-container>\n  <ng-container *ngIf=\"showParentNoData\" [sbUiResolverWidget]=\"widgetData.noDataWidget\"></ng-container>\n  <ng-container *ngFor=\"let key of stripsKeyOrder; let i = index; trackBy: identify\">\n    <ng-container *ngIf=\"isStripShowing(stripsResultDataMap[key])\">\n      <a name=\"{{stripsResultDataMap[key]?.stripTitle}}\" [class]=\"key\">\n        <div *ngIf=\"stripsResultDataMap && (getLength(stripsResultDataMap[key]) ||\n                    stripsResultDataMap[key]?.showOnNoData ||\n                    stripsResultDataMap[key]?.showOnLoader ||\n                    stripsResultDataMap[key]?.showOnError)\n                  \" [ngClass]=\"\n                    !widgetData?.isChannelStrip ? 'xs:px-8 sx:px-10ss' : i > 0 ? 'mt-12' : ''\n                  \" [id]=\"key\" [ngClass]=\"!widgetData?.isChannelStrip ? margin-bottom-custom : margin-bottom-xs\">\n          <div [ngClass]=\"{ pad: stripsResultDataMap[key]?.stripBackground }\"\n            [ngStyle]=\"{ 'background-color': stripsResultDataMap[key]?.stripBackground }\">\n            <div class=\"flex flex-col pl-4 pr-4 md:pr-0 md:pl-0 \" [ngClass]=\"\n                        !widgetData?.isChannelStrip\n                          ? ''\n                          : stripsResultDataMap[key]?.stripTitle\n                          ? 'mb-8'\n                          : ''\n                      \">\n              <div class=\"flex flex-1 items-center\">\n                <p class=\"mat-subheading-1 margin-remove inline-block \" *ngIf=\"stripsResultDataMap[key]?.stripTitle\">\n                  <span class=\"capitalize\" *ngIf=\"stripsResultDataMap[key]?.disableTranslate\">\n                    {{stripsResultDataMap[key]?.stripTitle}}\n                  </span>\n                  <span *ngIf=\"!stripsResultDataMap[key]?.disableTranslate\">\n                    {{ translateLabels(stripsResultDataMap[key]?.stripTitle, 'home') }}\n                  </span>\n                </p>\n\n                <button *ngIf=\"stripsResultDataMap[key]?.stripInfo?.icon\" type=\"button\" mat-icon-button\n                  (click)=\"toggleInfo(stripsResultDataMap[key])\" i18n-matTooltip matTooltip=\"info\"\n                  class=\"margin-left-xs\">\n                  <mat-icon>{{ stripsResultDataMap[key]?.stripInfo?.icon.icon }}</mat-icon>\n                </button>\n                <a *ngIf=\"stripsResultDataMap[key]?.stripTitleLink?.link\"\n                  [routerLink]=\"stripsResultDataMap[key]?.stripTitleLink?.link\"\n                  [queryParams]=\"stripsResultDataMap[key]?.stripTitleLink?.link?.queryParams\">\n                  <mat-icon class=\"ws-mat-primary-primary-text ws-mat-default-text\" [color]=\"'accent'\">{{\n                    stripsResultDataMap[key]?.stripTitleLink?.icon }}</mat-icon>\n                </a>\n                <span class=\"spacer\"></span>\n                <!-- viewAll start-->\n                <div *ngIf=\"checkCondition(widgetData , stripsResultDataMap[key])\"\n                  class=\"ml-4 view-more ws-mat-default-text\">\n                  <a class=\"flex ws-mat-default-text items-center justify-center mat-body-1\" [routerLink]=\"stripsResultDataMap[key]?.viewMoreUrl?.path\"\n                    [queryParams]=\"stripsResultDataMap[key]?.viewMoreUrl?.queryParams\">\n                    <span i18n class=\"ws-mat-default-text\">{{translateLabels(widgetData.strips[0].viewMoreUrl.viewMoreText,'home')  || 'See all'}}</span>\n                    <mat-icon class=\"ws-mat-default-text mat-icon notranslate material-icons mat-icon-no-color\" color=\"accent\">navigate_next</mat-icon>\n                  </a>\n                </div>\n                <!-- viewAll end-->\n              </div>\n              <button mat-icon-button (click)=\"setHiddenForStrip(key)\" *ngIf=\"stripsResultDataMap[key]?.canHideStrip\">\n                <mat-icon>close</mat-icon>\n              </button>\n              <mat-icon class=\"cursor-pointer\" *ngIf=\"stripsResultDataMap[key]?.mode === 'accordion' && isMobile\"\n                (click)=\"showAccordionData = !showAccordionData\">{{ showAccordionData ? 'expand_less' : 'expand_more' }}\n              </mat-icon>\n            </div>\n\n            <div class=\"mb-4\" *ngIf=\"checkVisible(stripsResultDataMap[key])\">\n              <ng-container [sbUiResolverWidget]=\"getdata(stripsResultDataMap[key])\">\n              </ng-container>\n            </div>\n\n            <ng-container *ngIf=\"stripsResultDataMap[key]?.showOnNoData\"\n              [sbUiResolverWidget]=\"stripsResultDataMap[key]?.noDataWidget\"></ng-container>\n            <ng-container *ngIf=\"stripsResultDataMap[key]?.showOnError\"\n              [sbUiResolverWidget]=\"stripsResultDataMap[key]?.errorWidget\"></ng-container>\n            <!-- IF no errors then proceed to show tabs or non tabs strip -->\n            <ng-container *ngIf=\"!stripsResultDataMap[key]?.showOnNoData && !stripsResultDataMap[key]?.showOnError\">\n              <ng-container *ngIf=\"stripsResultDataMap[key].tabs && stripsResultDataMap[key].tabs.length\">\n                <mat-tab-group animationDuration=\"0ms\" [selectedIndex]=\"getSelectedIndex(stripsResultDataMap[key], key)\"\n                class=\"mat-tab-labels w-full strips-tabgroup\" dynamicHeight\n                  (selectedTabChange)=\"tabClicked($event, stripsResultDataMap[key], key)\">\n                  <mat-tab label=\"{{tab?.label}}\" *ngFor=\"let tab of stripsResultDataMap[key].tabs; let last = last;\">\n                    <ng-template mat-tab-label>\n                      <span>{{ translateLabels(tab?.label, 'home') }} &nbsp;</span>\n                      <span *ngIf=\"tab?.showTabDataCount && tab?.widgets?.length\">({{tab?.widgets?.length}})</span>\n                    </ng-template>\n                    <div>\n                      <!-- <ng-container [ngTemplateOutlet]=\"loader\" *ngIf=\"stripsResultDataMap[key]?.showOnLoader\">\n                      </ng-container> -->\n                      <div *ngIf=\"stripsResultDataMap && stripsResultDataMap[key]?.showOnLoader ||\n                      !tab.fetchTabStatus\"\n                      class=\"text-center my-2\">\n                            <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\"\n                                    [loadStatus]=\"'fetching'\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                              <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.loaderWidgets; trackBy: tracker\">\n                                <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                              </ng-container>\n                            </sb-uic-horizontal-scroller-v2>\n                      </div>\n                      <div *ngIf=\"((tab?.fetchTabStatus && tab?.fetchTabStatus === 'done') &&\n                      (!tab?.widgets || !tab?.widgets?.length))\">\n                      <ng-container *ngIf=\"tab?.value === 'inprogress'; else msgTemp\">\n                        <div class=\"w-full flex flex-col items-center justify-center\">\n                          <img alt=\"\" class=\"mt-4 mb-4\" src=\"assets/icons/home/nodataDefault.svg\">\n                          <div class=\"mat-subheading-1 text-center info-content\">{{ 'contentstripmultiple.getReadyForLearningAdventure' | translate }} -\n                            <a class=\"click-here\" [routerLink]=\"'/page/learn'\">{{ 'contentstripmultiple.clickHere' | translate }}</a> {{ 'contentstripmultiple.toEnrollNextCourse' | translate }}</div>\n                        </div>\n                      </ng-container>\n                      <ng-template #msgTemp>\n                        <div class=\"w-full flex flex-col items-center justify-center\">\n                          <img alt=\"\" class=\"mt-4 mb-4\" src=\"assets/icons/home/nodataDefault.png\">\n                          <div class=\"mat-subheading-1 text-center\">{{ translateLabels(tab.nodataMsg, 'home') }}</div>\n                        </div>\n                      </ng-template>\n                      </div>\n                      <ng-container *ngIf=\"(tab?.fetchTabStatus === 'done' || tab?.widgets?.length)\">\n                        <ng-container  *ngIf=\"!tab?.tabLoading\">\n\n                          <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\" [widgetsLength]=\"tab?.widgets?.length\"\n                            *ngIf=\"getContineuLearningLenth(stripsResultDataMap[key]) && showAccordion(key)\"\n                            [loadStatus]=\"'done'\" [defaultMaxWidgets]=\"tab?.maxWidgets ||\n                            stripsResultDataMap[key]?.sliderConfig?.maxWidgets || defaultMaxWidgets\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                            <ng-container *ngFor=\"let widget of tab?.widgets| slice:0:(tab?.maxWidgets ||\n                            stripsResultDataMap[key]?.sliderConfig?.maxWidgets || defaultMaxWidgets); trackBy: tracker\">\n                                <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                            </ng-container>\n                          </sb-uic-horizontal-scroller-v2>\n                        </ng-container>\n                      </ng-container>\n                    </div>\n                  </mat-tab>\n                </mat-tab-group>\n              </ng-container>\n              <ng-container *ngIf=\"!stripsResultDataMap[key].tabs || !stripsResultDataMap[key].tabs.length\">\n                <div *ngIf=\"stripsResultDataMap && stripsResultDataMap[key]?.showOnLoader\" class=\"text-center my-2\">\n                      <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\"\n                              [loadStatus]=\"'fetching'\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                        <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.loaderWidgets; trackBy: tracker\">\n                          <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                        </ng-container>\n                      </sb-uic-horizontal-scroller-v2>\n                </div>\n                <div class=\"\">\n                    <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\"\n                    *ngIf=\"getContineuLearningLenth(stripsResultDataMap[key]) && showAccordion(key)\" [widgetsLength]=\"stripsResultDataMap[key]?.widgets?.length\" [loadStatus]=\"'done'\" [defaultMaxWidgets]=\"stripsResultDataMap[key].sliderConfig?.maxWidgets || defaultMaxWidgets\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                      <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.widgets| slice:0:(stripsResultDataMap[key].sliderConfig?.maxWidgets || defaultMaxWidgets); trackBy: tracker\">\n                      <!-- <ng-container *ngIf=\"widget.widgetData.context.pageSection === 'continueLearning' \"> -->\n                      <!-- <ng-container *ngIf=\"widget.widgetData.content.completionPercentage !== 100\"\n                        [sbUiResolverWidget]=\"widget\"></ng-container> -->\n                        <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                      <!-- </ng-container> -->\n                      </ng-container>\n                  </sb-uic-horizontal-scroller-v2>\n                </div>\n              </ng-container>\n            </ng-container>\n          </div>\n        </div>\n      </a>\n\n    </ng-container>\n  </ng-container>\n</ng-template>",
+                        template: "<ng-container *ngIf=\"!contentAvailable; else otherTemplate\"></ng-container>\n<ng-template #otherTemplate>\n  <!-- <div *ngIf=\"showParentLoader\" class=\"text-center my-2\">\n    <mat-spinner class=\"inline-block\"></mat-spinner>\n  </div> -->\n  <ng-container *ngIf=\"showParentError\" [sbUiResolverWidget]=\"widgetData.errorWidget\"></ng-container>\n  <ng-container *ngIf=\"showParentNoData\" [sbUiResolverWidget]=\"widgetData.noDataWidget\"></ng-container>\n  <ng-container *ngFor=\"let key of stripsKeyOrder; let i = index; trackBy: identify\">\n    <ng-container *ngIf=\"isStripShowing(stripsResultDataMap[key])\">\n      <a name=\"{{stripsResultDataMap[key]?.stripTitle}}\" [class]=\"key\">\n        <div *ngIf=\"stripsResultDataMap && (getLength(stripsResultDataMap[key]) ||\n                    stripsResultDataMap[key]?.showOnNoData ||\n                    stripsResultDataMap[key]?.showOnLoader ||\n                    stripsResultDataMap[key]?.showOnError)\n                  \" [ngClass]=\"\n                    !widgetData?.isChannelStrip ? 'xs:px-8 sx:px-10ss' : i > 0 ? 'mt-12' : ''\n                  \" [id]=\"key\" [ngClass]=\"!widgetData?.isChannelStrip ? margin-bottom-custom : margin-bottom-xs\">\n          <div [ngClass]=\"{ pad: stripsResultDataMap[key]?.stripBackground }\"\n            [ngStyle]=\"{ 'background-color': stripsResultDataMap[key]?.stripBackground }\">\n            <div class=\"flex flex-col pl-4 pr-4 md:pr-0 md:pl-0 \" [ngClass]=\"\n                        !widgetData?.isChannelStrip\n                          ? ''\n                          : stripsResultDataMap[key]?.stripTitle\n                          ? 'mb-8'\n                          : ''\n                      \">\n              <div class=\"flex flex-1 items-center\">\n                <p class=\"mat-subheading-1 margin-remove inline-block \" *ngIf=\"stripsResultDataMap[key]?.stripTitle\">\n                  <span class=\"capitalize\" *ngIf=\"stripsResultDataMap[key]?.disableTranslate\">\n                    {{stripsResultDataMap[key]?.stripTitle}}\n                  </span>\n                  <span *ngIf=\"!stripsResultDataMap[key]?.disableTranslate\">\n                    {{ translateLabels(stripsResultDataMap[key]?.stripTitle, 'home') }}\n                  </span>\n                </p>\n\n                <button *ngIf=\"stripsResultDataMap[key]?.stripInfo?.icon\" type=\"button\" mat-icon-button\n                  (click)=\"toggleInfo(stripsResultDataMap[key])\" i18n-matTooltip matTooltip=\"info\"\n                  class=\"margin-left-xs\">\n                  <mat-icon>{{ stripsResultDataMap[key]?.stripInfo?.icon.icon }}</mat-icon>\n                </button>\n                <a *ngIf=\"stripsResultDataMap[key]?.stripTitleLink?.link\"\n                  [routerLink]=\"stripsResultDataMap[key]?.stripTitleLink?.link\"\n                  [queryParams]=\"stripsResultDataMap[key]?.stripTitleLink?.link?.queryParams\">\n                  <mat-icon class=\"ws-mat-primary-primary-text ws-mat-default-text\" [color]=\"'accent'\">{{\n                    stripsResultDataMap[key]?.stripTitleLink?.icon }}</mat-icon>\n                </a>\n                <span class=\"spacer\"></span>\n                <!-- viewAll start-->\n                <div *ngIf=\"checkCondition(widgetData , stripsResultDataMap[key])\"\n                  class=\"ml-4 view-more ws-mat-default-text\">\n                  <a class=\"flex ws-mat-default-text items-center justify-center mat-body-1\" [routerLink]=\"stripsResultDataMap[key]?.viewMoreUrl?.path\"\n                    [queryParams]=\"stripsResultDataMap[key]?.viewMoreUrl?.queryParams\">\n                    <span i18n class=\"ws-mat-default-text\">{{translateLabels(widgetData.strips[0].viewMoreUrl.viewMoreText,'home')  || 'See all'}}</span>\n                    <mat-icon class=\"ws-mat-default-text mat-icon notranslate material-icons mat-icon-no-color\" color=\"accent\">navigate_next</mat-icon>\n                  </a>\n                </div>\n                <!-- viewAll end-->\n              </div>\n              <button mat-icon-button (click)=\"setHiddenForStrip(key)\" *ngIf=\"stripsResultDataMap[key]?.canHideStrip\">\n                <mat-icon>close</mat-icon>\n              </button>\n              <mat-icon class=\"cursor-pointer\" *ngIf=\"stripsResultDataMap[key]?.mode === 'accordion' && isMobile\"\n                (click)=\"showAccordionData = !showAccordionData\">{{ showAccordionData ? 'expand_less' : 'expand_more' }}\n              </mat-icon>\n            </div>\n\n            <div class=\"mb-4\" *ngIf=\"checkVisible(stripsResultDataMap[key])\">\n              <ng-container [sbUiResolverWidget]=\"getdata(stripsResultDataMap[key])\">\n              </ng-container>\n            </div>\n\n            <ng-container *ngIf=\"stripsResultDataMap[key]?.showOnNoData\"\n              [sbUiResolverWidget]=\"stripsResultDataMap[key]?.noDataWidget\"></ng-container>\n            <ng-container *ngIf=\"stripsResultDataMap[key]?.showOnError\"\n              [sbUiResolverWidget]=\"stripsResultDataMap[key]?.errorWidget\"></ng-container>\n            <!-- IF no errors then proceed to show tabs or non tabs strip -->\n            <ng-container *ngIf=\"!stripsResultDataMap[key]?.showOnNoData && !stripsResultDataMap[key]?.showOnError\">\n              <ng-container *ngIf=\"stripsResultDataMap[key].tabs && stripsResultDataMap[key].tabs.length\">\n                <mat-tab-group animationDuration=\"0ms\" [selectedIndex]=\"getSelectedIndex(stripsResultDataMap[key], key)\"\n                class=\"mat-tab-labels w-full strips-tabgroup\" dynamicHeight\n                  (selectedTabChange)=\"tabClicked($event, stripsResultDataMap[key], key)\">\n                  <mat-tab label=\"{{tab?.label}}\" *ngFor=\"let tab of stripsResultDataMap[key].tabs; let last = last;\">\n                    <ng-template mat-tab-label>\n                      <span>{{ translateLabels(tab?.label, 'home') }} &nbsp;</span>\n                      <span *ngIf=\"tab?.showTabDataCount && tab?.widgets?.length\">({{tab?.widgets?.length}})</span>\n                    </ng-template>\n                    <div>\n                      <!-- <ng-container [ngTemplateOutlet]=\"loader\" *ngIf=\"stripsResultDataMap[key]?.showOnLoader\">\n                      </ng-container> -->\n                      <div *ngIf=\"stripsResultDataMap && stripsResultDataMap[key]?.showOnLoader ||\n                      !tab.fetchTabStatus\"\n                      class=\"text-center my-2\">\n                            <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\" [id]=\"key+'-scroller'\"\n                                    [loadStatus]=\"'fetching'\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                              <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.loaderWidgets; trackBy: tracker\">\n                                <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                              </ng-container>\n                            </sb-uic-horizontal-scroller-v2>\n                      </div>\n                      <div *ngIf=\"((tab?.fetchTabStatus && tab?.fetchTabStatus === 'done') &&\n                      (!tab?.widgets || !tab?.widgets?.length))\">\n                      <ng-container *ngIf=\"tab?.value === 'inprogress'; else msgTemp\">\n                        <div class=\"w-full flex flex-col items-center justify-center\">\n                          <img alt=\"\" class=\"mt-4 mb-4\" src=\"assets/icons/home/nodataDefault.svg\">\n                          <div class=\"mat-subheading-1 text-center info-content\">{{ 'contentstripmultiple.getReadyForLearningAdventure' | translate }} -\n                            <a class=\"click-here\" [routerLink]=\"'/page/learn'\">{{ 'contentstripmultiple.clickHere' | translate }}</a> {{ 'contentstripmultiple.toEnrollNextCourse' | translate }}</div>\n                        </div>\n                      </ng-container>\n                      <ng-template #msgTemp>\n                        <div class=\"w-full flex flex-col items-center justify-center\">\n                          <img alt=\"\" class=\"mt-4 mb-4\" src=\"assets/icons/home/nodataDefault.png\">\n                          <div class=\"mat-subheading-1 text-center\">{{ translateLabels(tab.nodataMsg, 'home') }}</div>\n                        </div>\n                      </ng-template>\n                      </div>\n                      <ng-container *ngIf=\"(tab?.fetchTabStatus === 'done' || tab?.widgets?.length)\">\n                        <ng-container  *ngIf=\"!tab?.tabLoading\">\n\n                          <sb-uic-horizontal-scroller-v2 [id]=\"key+'-scroller'\" [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\" [widgetsLength]=\"tab?.widgets?.length\"\n                            *ngIf=\"getContineuLearningLenth(stripsResultDataMap[key]) && showAccordion(key)\"\n                            [loadStatus]=\"'done'\" [defaultMaxWidgets]=\"tab?.maxWidgets ||\n                            stripsResultDataMap[key]?.sliderConfig?.maxWidgets || defaultMaxWidgets\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                            <ng-container *ngFor=\"let widget of tab?.widgets| slice:0:(tab?.maxWidgets ||\n                            stripsResultDataMap[key]?.sliderConfig?.maxWidgets || defaultMaxWidgets); trackBy: tracker\">\n                                <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                            </ng-container>\n                          </sb-uic-horizontal-scroller-v2>\n                        </ng-container>\n                      </ng-container>\n                    </div>\n                  </mat-tab>\n                </mat-tab-group>\n              </ng-container>\n              <ng-container *ngIf=\"!stripsResultDataMap[key].tabs || !stripsResultDataMap[key].tabs.length\">\n                <div *ngIf=\"stripsResultDataMap && stripsResultDataMap[key]?.showOnLoader\" class=\"text-center my-2\">\n                      <sb-uic-horizontal-scroller-v2 [id]=\"key+'-scroller'\" [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\"\n                              [loadStatus]=\"'fetching'\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                        <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.loaderWidgets; trackBy: tracker\">\n                          <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                        </ng-container>\n                      </sb-uic-horizontal-scroller-v2>\n                </div>\n                <div class=\"\">\n                    <sb-uic-horizontal-scroller-v2 [id]=\"key+'-scroller'\" [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\"\n                    *ngIf=\"getContineuLearningLenth(stripsResultDataMap[key]) && showAccordion(key)\" [widgetsLength]=\"stripsResultDataMap[key]?.widgets?.length\" [loadStatus]=\"'done'\" [defaultMaxWidgets]=\"stripsResultDataMap[key].sliderConfig?.maxWidgets || defaultMaxWidgets\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                      <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.widgets| slice:0:(stripsResultDataMap[key].sliderConfig?.maxWidgets || defaultMaxWidgets); trackBy: tracker\">\n                      <!-- <ng-container *ngIf=\"widget.widgetData.context.pageSection === 'continueLearning' \"> -->\n                      <!-- <ng-container *ngIf=\"widget.widgetData.content.completionPercentage !== 100\"\n                        [sbUiResolverWidget]=\"widget\"></ng-container> -->\n                        <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                      <!-- </ng-container> -->\n                      </ng-container>\n                  </sb-uic-horizontal-scroller-v2>\n                </div>\n              </ng-container>\n            </ng-container>\n          </div>\n        </div>\n      </a>\n\n    </ng-container>\n  </ng-container>\n</ng-template>",
                         styles: [".view-more{display:flex;align-items:center;text-align:center;height:40px;justify-content:center}.view-more .icon{font-size:24px;width:24px;height:24px;border:1px solid;border-radius:50%;padding:8px;margin-bottom:8px}.margin-bottom-custom{margin-bottom:60px}.view-more:hover{background-color:#dcdfe5}::ng-deep.strips-tabgroup .mat-tab-header{border-bottom:2px solid rgba(0,0,0,.12)}::ng-deep.strips-tabgroup .mat-tab-body{padding:20px 0!important;box-sizing:border-box;overflow-y:initial!important}::ng-deep.strips-tabgroup .mat-tab-body-wrapper{overflow:inherit!important}::ng-deep.strips-tabgroup .mat-tab-label{border-bottom:0 solid rgba(0,0,0,.1);margin-right:0;opacity:1}::ng-deep.strips-tabgroup .mat-tab-label .mat-tab-label-content{text-transform:inherit;font:400 14px/20px Lato}::ng-deep.strips-tabgroup .mat-tab-label-active .mat-tab-label-content{font-weight:700!important}.click-here{color:#1b4ca1}.info-content{opacity:1;color:rgba(0,0,0,.87);font:700 14px/20px Lato-Bold;text-align:center}"]
                     }] }
         ];
@@ -5977,8 +6026,8 @@
         SlidersLibComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-sliders',
-                        template: "<div class=\"banner-container {{isMobile? styleData?.responsive?.bannerMetaClass : styleData?.bannerMetaClass}}\" (swipeleft)=\"slideTo(currentIndex + 1)\" (swiperight)=\"slideTo(currentIndex - 1)\"\n  *ngIf=\"widgetData?.length > 1\" [style.height]=\"isMobile? styleData?.responsive?.customHeight : styleData?.customHeight\"\n  [ngStyle]=\"{'border-radius': styleData?.borderRadius || '12px'}\">\n  <a (click)=\"raiseTelemetry(widgetData[currentIndex].redirectUrl)\"\n    [routerLink]=\" !isOpenInNewTab ? widgetData[currentIndex].redirectUrl : './'\" class=\"banner-overlay\"\n    [ngClass]=\"{'cursor-auto': !widgetData[currentIndex].redirectUrl}\">\n    <div class=\"banner WidgetInstanceId\" *ngFor=\"let slide of widgetData; let i = index\" [hidden]=\"i !== currentIndex\">\n      <img i18n-alt alt=\"Page Banner\" [src]=\"slide.banners\" wsUtilsImageResponsive class=\"banner-image\" />\n    </div>\n  </a>\n  <ng-container *ngIf=\"isMobile && styleData?.responsive?.dots !== 'hidden' || !isMobile && styleData?.dots !== 'hidden'\">\n    <div class=\"banner-meta {{isMobile? styleData?.responsive?.bannerMetaAlign : styleData?.bannerMetaAlign}}\">\n      <a [routerLink]=\" !isOpenInNewTab ? widgetData[currentIndex].redirectUrl : './'\" class=\"banner-title text-truncate\"\n        *ngIf=\"widgetData[currentIndex].title\" [title]=\"widgetData[currentIndex].title\">\n        {{ widgetData[currentIndex].title }}\n      </a>\n      <div class=\"dots-container\" *ngIf=\"widgetData?.length > 1\">\n        <span class=\"dot\" [ngClass]=\"{ active: j === currentIndex }\" *ngFor=\"let slide of widgetData; let j = index\"\n          (click)=\"slideTo(j)\"></span>\n      </div>\n    </div>\n  </ng-container>\n  <div class=\"navigation {{isMobile? styleData?.responsive?.arrowsPlacement : styleData?.bannerMetaAlign}}\" \n  *ngIf=\"isMobile && styleData?.responsive?.navigationArrows !== 'hidden' || !isMobile && styleData?.navigationArrows !== 'hidden'\">\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\" class=\"prev\" (click)=\"slideTo(currentIndex - 1)\">&#10094;</a>\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\" class=\"next\" (click)=\"slideTo(currentIndex + 1)\">&#10095;</a>\n  </div>\n</div>\n<div class=\"banner-container-solo margin-top-s\" *ngIf=\"widgetData?.length == 1\">\n  <img i18n-alt alt=\"Page Banner\" width=\"100%\" height=\"100%\" [src]=\"widgetData[0].banners\" wsUtilsImageResponsive class=\"banner-image-solo\" />\n</div>\n<!-- <div class=\"banner-container\" (swipeleft)=\"slideTo(currentIndex + 1)\" (swiperight)=\"slideTo(currentIndex - 1)\"\n  *ngIf=\"widgetData?.length\">\n  <a (click)=\"raiseTelemetry(widgetData[currentIndex].redirectUrl)\"\n    [queryParams]=\"widgetData[currentIndex].queryParams || {}\"\n    [routerLink]=\"!isOpenInNewTab ? widgetData[currentIndex].redirectUrl : './'\" class=\"banner-overlay\"\n    [ngClass]=\"{ 'cursor-auto': !widgetData[currentIndex].redirectUrl }\"></a>\n  <div class=\"banner WidgetInstanceId\" *ngFor=\"let slide of widgetData; let i = index\" [hidden]=\"i !== currentIndex\">\n    <img i18n-alt alt=\"Page Banner\" [src]=\"slide.banners\" wsUtilsImageResponsive class=\"banner-image\" />\n  </div>\n  <div class=\"banner-meta\">\n    <a [routerLink]=\"!isOpenInNewTab ? widgetData[currentIndex].redirectUrl : './'\" class=\"banner-title text-truncate\"\n      *ngIf=\"widgetData[currentIndex].title\" [title]=\"widgetData[currentIndex].title\">\n      {{ widgetData[currentIndex].title }}\n    </a>\n    <div class=\"dots-container\" *ngIf=\"widgetData?.length > 1\">\n      <span class=\"dot\" [ngClass]=\"{ active: j === currentIndex }\" *ngFor=\"let slide of widgetData; let j = index\"\n        (click)=\"slideTo(j)\"></span>\n    </div>\n  </div>\n  <button *ngIf=\"widgetData?.length > 1\" class=\"prev\" aria-label=\"Previous slide\" (click)=\"slideTo(currentIndex - 1)\">\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\">&#10094;</a>\n  </button>\n  <button *ngIf=\"widgetData?.length > 1\" class=\"next\" (click)=\"slideTo(currentIndex + 1)\" aria-label=\"Next slide\">\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\" class=\"next\">&#10095;</a>\n  </button>\n\n</div> -->\n<ng-container *ngIf=\"!widgetData?.length\">\n  <div class=\"slider default-slider h-full\">\n    <div class=\"relative h-full\">\n        <img class=\"h-full\" src=\"assets/icons/home/default-slider-image.svg\" alt=\"\">\n        <div class=\"default-title\">\n            <p>{{title}}</p>\n        </div>\n    </div>\n  </div>\n</ng-container>\n",
-                        styles: [".banner-container{min-height:243px;position:relative;margin:auto;padding-bottom:40px}.banner-container.inline-meta{padding-bottom:0!important}.banner-container.flat .banner .banner-image{border-radius:0!important}.banner-overlay{z-index:1;top:0;left:0;width:100%;height:100%;background:linear-gradient(to left,rgba(0,0,0,.25) 0,rgba(0,0,0,0) 15%,rgba(0,0,0,0) 85%,rgba(0,0,0,.25) 100%);border-radius:inherit}.banner{-webkit-animation-name:fade;-webkit-animation-duration:1.5s;animation-name:fade;animation-duration:1.5s;border-radius:inherit;height:inherit}.banner .banner-image{width:100%;min-height:243px;display:block;border-radius:inherit;height:inherit}.banner-meta{text-align:center;z-index:2;padding:8px 12px;position:absolute;bottom:0;left:50%;border-radius:12px;transform:translateX(-50%);box-sizing:border-box}.banner-meta.left{left:0;transform:translateX(0)}.banner-meta.right{left:100%;transform:translateX(-100%)}.banner-meta .banner-title{color:#f2f2f2;margin-bottom:8px;font-size:1.1rem}@media only screen and (max-width:599px){.banner-meta .banner-title{display:none}}.banner-meta .dots-container{padding:8px;display:flex;align-items:center;justify-content:center}.banner-meta .dots-container .dot{cursor:pointer;height:6px;width:6px;margin:0 4px;background-color:rgba(0,0,0,.4);border-radius:50%;display:inline-block;transition:background-color .5s!important}@media only screen and (max-width:599px){.banner-meta .dots-container .dot{height:8px;width:8px;margin:0 4px}}.banner-meta .dots-container .dot.active{border-radius:4px;background-color:#f3962f;width:16px}@keyframes fade{from{opacity:.25}to{opacity:1}}.next,.prev{cursor:pointer;position:absolute;top:50%;transform:translateY(-50%);color:#fff;font-weight:700;background-color:#1b2133!important;border-radius:50%;z-index:999;height:32px!important;width:32px!important;display:flex;align-items:center;margin-top:-16px;justify-content:center}.prev{left:0;margin-left:-16px}.next{right:0;margin-right:-16px}.navigation.bottom-right .prev{left:unset;right:45px;bottom:-15px;top:unset}.navigation.bottom-right .next{left:unset;right:15px;bottom:-15px;top:unset}.navigation.bottom-center .prev{left:calc(50% - 20px);right:unset;bottom:-15px;top:unset}.navigation.bottom-center .next{left:calc(50% + 20px);right:unset;bottom:-15px;top:unset}.navigation.bottom-left .prev{left:15px;right:unset;bottom:-15px;top:unset}.navigation.bottom-left .next{left:60px;right:unset;bottom:-15px;top:unset}.navigation.middle-inline .prev{left:30px}.navigation.middle-inline .next{right:30px}.banner-container-solo{overflow:hidden;margin:auto;border-radius:12px}.banner-image-solo{width:100%;display:block;border-radius:12px}.default-slider{height:100%;background:#d4e2fb}.default-slider .default-title{text-align:center;position:absolute;top:50%;left:0;right:0;margin:auto;transform:translateY(-50%);z-index:999;background:#e6efff;width:-moz-fit-content;width:fit-content;padding:16px;gap:8px;border-radius:40px}.default-slider .default-title p{margin:0!important}"]
+                        template: "<div class=\"banner-container {{isMobile? styleData?.responsive?.bannerMetaClass : styleData?.bannerMetaClass}}\" (swipeleft)=\"slideTo(currentIndex + 1)\" (swiperight)=\"slideTo(currentIndex - 1)\"\n  *ngIf=\"widgetData?.length > 1\" [style.height]=\"isMobile? styleData?.responsive?.customHeight : styleData?.customHeight\"\n  [ngStyle]=\"{'border-radius': styleData?.borderRadius || '12px'}\">\n  <a (click)=\"raiseTelemetry(widgetData[currentIndex].redirectUrl)\"\n    [routerLink]=\" !isOpenInNewTab && widgetData[currentIndex].redirectUrl? widgetData[currentIndex].redirectUrl : null\" class=\"banner-overlay\"\n    [ngClass]=\"{'cursor-auto': !widgetData[currentIndex].redirectUrl}\">\n    <div class=\"banner WidgetInstanceId\" *ngFor=\"let slide of widgetData; let i = index\" [hidden]=\"i !== currentIndex\">\n      <img i18n-alt alt=\"Page Banner\" [src]=\"slide.banners\" wsUtilsImageResponsive class=\"banner-image\" />\n    </div>\n  </a>\n  <ng-container *ngIf=\"isMobile && styleData?.responsive?.dots !== 'hidden' || !isMobile && styleData?.dots !== 'hidden'\">\n    <div class=\"banner-meta {{isMobile? styleData?.responsive?.bannerMetaAlign : styleData?.bannerMetaAlign}}\">\n      <a [routerLink]=\" !isOpenInNewTab && widgetData[currentIndex].redirectUrl? widgetData[currentIndex].redirectUrl : null\" class=\"banner-title text-truncate\"\n        *ngIf=\"widgetData[currentIndex].title\" [title]=\"widgetData[currentIndex].title\">\n        {{ widgetData[currentIndex].title }}\n      </a>\n      <div class=\"dots-container\" *ngIf=\"widgetData?.length > 1\">\n        <span class=\"dot\" [ngClass]=\"{ active: j === currentIndex }\" *ngFor=\"let slide of widgetData; let j = index\"\n          (click)=\"slideTo(j)\"></span>\n      </div>\n    </div>\n  </ng-container>\n  <div class=\"navigation {{isMobile? styleData?.responsive?.arrowsPlacement : styleData?.arrowsPlacement}}\" \n  *ngIf=\"isMobile && styleData?.responsive?.navigationArrows !== 'hidden' || !isMobile && styleData?.navigationArrows !== 'hidden'\">\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\" class=\"prev\" (click)=\"slideTo(currentIndex - 1)\">&#10094;</a>\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\" class=\"next\" (click)=\"slideTo(currentIndex + 1)\">&#10095;</a>\n  </div>\n</div>\n<div class=\"banner-container-solo margin-top-s\" *ngIf=\"widgetData?.length == 1\">\n  <img i18n-alt alt=\"Page Banner\" width=\"100%\" height=\"100%\" [src]=\"widgetData[0].banners\" wsUtilsImageResponsive class=\"banner-image-solo\" />\n</div>\n<!-- <div class=\"banner-container\" (swipeleft)=\"slideTo(currentIndex + 1)\" (swiperight)=\"slideTo(currentIndex - 1)\"\n  *ngIf=\"widgetData?.length\">\n  <a (click)=\"raiseTelemetry(widgetData[currentIndex].redirectUrl)\"\n    [queryParams]=\"widgetData[currentIndex].queryParams || {}\"\n    [routerLink]=\"!isOpenInNewTab ? widgetData[currentIndex].redirectUrl : './'\" class=\"banner-overlay\"\n    [ngClass]=\"{ 'cursor-auto': !widgetData[currentIndex].redirectUrl }\"></a>\n  <div class=\"banner WidgetInstanceId\" *ngFor=\"let slide of widgetData; let i = index\" [hidden]=\"i !== currentIndex\">\n    <img i18n-alt alt=\"Page Banner\" [src]=\"slide.banners\" wsUtilsImageResponsive class=\"banner-image\" />\n  </div>\n  <div class=\"banner-meta\">\n    <a [routerLink]=\"!isOpenInNewTab ? widgetData[currentIndex].redirectUrl : './'\" class=\"banner-title text-truncate\"\n      *ngIf=\"widgetData[currentIndex].title\" [title]=\"widgetData[currentIndex].title\">\n      {{ widgetData[currentIndex].title }}\n    </a>\n    <div class=\"dots-container\" *ngIf=\"widgetData?.length > 1\">\n      <span class=\"dot\" [ngClass]=\"{ active: j === currentIndex }\" *ngFor=\"let slide of widgetData; let j = index\"\n        (click)=\"slideTo(j)\"></span>\n    </div>\n  </div>\n  <button *ngIf=\"widgetData?.length > 1\" class=\"prev\" aria-label=\"Previous slide\" (click)=\"slideTo(currentIndex - 1)\">\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\">&#10094;</a>\n  </button>\n  <button *ngIf=\"widgetData?.length > 1\" class=\"next\" (click)=\"slideTo(currentIndex + 1)\" aria-label=\"Next slide\">\n    <a *ngIf=\"widgetData?.length > 1\" role=\"button\" class=\"next\">&#10095;</a>\n  </button>\n\n</div> -->\n<ng-container *ngIf=\"!widgetData?.length\">\n  <div class=\"slider default-slider h-full\">\n    <div class=\"relative h-full\">\n        <img class=\"h-full\" src=\"assets/icons/home/default-slider-image.svg\" alt=\"\">\n        <div class=\"default-title rounded-full\">\n            <p class=\"mat-h1\">{{title}}</p>\n        </div>\n    </div>\n  </div>\n</ng-container>\n",
+                        styles: [".banner-container{min-height:243px;position:relative;margin:auto;padding-bottom:40px}.banner-container.inline-meta{padding-bottom:0!important}.banner-container.flat .banner .banner-image{border-radius:0!important}.banner-overlay{z-index:1;top:0;left:0;width:100%;height:100%;background:linear-gradient(to left,rgba(0,0,0,.25) 0,rgba(0,0,0,0) 15%,rgba(0,0,0,0) 85%,rgba(0,0,0,.25) 100%);border-radius:inherit}.banner{-webkit-animation-name:fade;-webkit-animation-duration:1.5s;animation-name:fade;animation-duration:1.5s;border-radius:inherit;height:inherit}.banner .banner-image{width:100%;min-height:243px;display:block;border-radius:inherit;height:inherit}.banner-meta{text-align:center;z-index:2;padding:8px 12px;position:absolute;bottom:0;left:50%;border-radius:12px;transform:translateX(-50%);box-sizing:border-box}.banner-meta.left{left:0;transform:translateX(0)}.banner-meta.right{left:100%;transform:translateX(-100%)}.banner-meta .banner-title{color:#f2f2f2;margin-bottom:8px;font-size:1.1rem}@media only screen and (max-width:599px){.banner-meta .banner-title{display:none}}.banner-meta .dots-container{padding:8px;display:flex;align-items:center;justify-content:center}.banner-meta .dots-container .dot{cursor:pointer;height:6px;width:6px;margin:0 4px;background-color:rgba(0,0,0,.4);border-radius:50%;display:inline-block;transition:background-color .5s!important}@media only screen and (max-width:599px){.banner-meta .dots-container .dot{height:8px;width:8px;margin:0 4px}}.banner-meta .dots-container .dot.active{border-radius:4px;background-color:#f3962f;width:16px}@keyframes fade{from{opacity:.25}to{opacity:1}}.next,.prev{cursor:pointer;position:absolute;top:50%;transform:translateY(-50%);color:#fff;font-weight:700;background-color:#1b2133!important;border-radius:50%;z-index:999;height:32px!important;width:32px!important;display:flex;align-items:center;margin-top:-16px;justify-content:center}.prev{left:0;margin-left:-16px}.next{right:0;margin-right:-16px}.navigation.bottom-right .prev{left:unset;right:45px;bottom:-15px;top:unset}.navigation.bottom-right .next{left:unset;right:15px;bottom:-15px;top:unset}.navigation.bottom-center .prev{left:calc(50% - 20px);right:unset;bottom:-15px;top:unset}.navigation.bottom-center .next{left:calc(50% + 20px);right:unset;bottom:-15px;top:unset}.navigation.bottom-left .prev{left:15px;right:unset;bottom:-15px;top:unset}.navigation.bottom-left .next{left:60px;right:unset;bottom:-15px;top:unset}.navigation.middle-inline .prev{left:30px}.navigation.middle-inline .next{right:30px}.banner-container-solo{overflow:hidden;margin:auto;border-radius:12px}.banner-image-solo{width:100%;display:block;border-radius:12px}.default-slider{height:100%;background:#d4e2fb}.default-slider .default-title{text-align:center;position:absolute;top:50%;left:0;right:0;margin:auto;transform:translateY(-50%);z-index:999;background:#e6efff;padding:32px;width:500px}.default-slider .default-title p{word-break:break-word;margin:0!important;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;text-transform:uppercase}@media screen and (max-width:768px){.default-slider{height:384px;width:100%}.default-slider .default-title{width:unset!important}}"]
                     }] }
         ];
         /** @nocollapse */
@@ -6441,7 +6490,7 @@
         DataPointsComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-data-points',
-                        template: "<div class=\"w-full metrics-web\" *ngIf=\"layoutType === 'multipleRows' && !isDataLoading\">\n    <div *ngFor=\"let obj of objectData\" class=\"\">\n        <div class=\"element-div\" [ngClass]=\"{'linebreak': obj?.linebreak}\">\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\" >{{obj?.value | number: '1.1-2'}}</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\">\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\">{{obj?.value  | number: '1.1-2'}}</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\">{{item?.value}}</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\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>",
+                        template: "<div class=\"w-full metrics-web\" *ngIf=\"layoutType === 'multipleRows' && !isDataLoading\">\n    <div *ngFor=\"let obj of objectData\" class=\"\">\n        <div class=\"element-div\" [ngClass]=\"{'linebreak': obj?.linebreak}\">\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\" >{{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\">\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\">{{obj?.value  | number: '1.1-2'}}</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\">{{item?.value}}</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\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>",
                         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)}.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%}.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}}"]
                     }] }
         ];
@@ -6568,193 +6617,1117 @@
      * @fileoverview added by tsickle
      * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
-    var ConsumptionModule = /** @class */ (function () {
-        function ConsumptionModule() {
+    var CalenderComponent = /** @class */ (function () {
+        function CalenderComponent() {
+            this.toDay = new Date();
         }
-        ConsumptionModule.decorators = [
-            { type: core.NgModule, args: [{
-                        declarations: [ConsumptionComponent],
-                        imports: [
-                            ContentStripWithTabsLibModule,
-                            SlidersLibModule
-                        ],
-                        exports: [ConsumptionComponent,
-                            ContentStripWithTabsLibModule,
-                            SlidersLibModule,
-                            DataPointsModule
-                        ],
-                    },] }
+        /**
+         * @return {?}
+         */
+        CalenderComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+        function () {
+            console.log("data ===== ", this.objectData);
+            console.log("toDay ", this.toDay);
+        };
+        CalenderComponent.decorators = [
+            { type: core.Component, args: [{
+                        selector: 'sb-uic-calender',
+                        template: "<div class=\"w-full p-3 event-day my-3\" \n    *ngFor=\"let obj of objectData?.training\"\n    [style.backgroundColor]=\"obj?.backgroundColor\" \n    [style.borderColor]=\"objectData?.activeColor\">\n    <div class=\"flex item-top gap-8 {{ obj.events.length ? '' : 'aliginCenter'}}\">\n        <div class=\"event-date\">\n            <div class=\"currentDay\">{{obj.eventDate}}</div>\n        </div>\n        <div class=\"details w-full\" *ngIf=\"obj.events.length\">\n            <div class=\"flex p-4 item-center events-list mb-{{obj.events.length === (i+1) ? '0' : '2'}} gap-20\" [style.backgroundColor]=\"event?.backgroundColor\"\n                 *ngFor=\"let event of obj.events; let i = index\" >\n                <div>\n                    <div class=\"flex flex-row item-center gap-10 pb-2\">\n                        <div class=\"flex item-center gap-2 row1 col1\">\n                            <div><mat-icon class=\"icon-tour\">schedule</mat-icon> </div>\n                            <div>{{event.startTime}} to {{event.endTime}}</div>\n                        </div>\n                        <div class=\"flex item-center col1\">{{event.title}}</div>\n                    </div>\n                    <div class=\"flex flex-row item-center gap-10\">\n                        <div class=\"flex item-center gap-2 row1 col1\" *ngIf=\"event.startDate && event.endDate\">\n                            <div><mat-icon class=\"icon-tour\">date_range</mat-icon> </div>\n                            <div>{{event.startDate}} - {{event.endDate}}</div>\n                        </div>\n                        <div class=\"flex item-center gap-2 col1\">\n                            <div><mat-icon class=\"icon-tour\">location_on</mat-icon> </div>\n                            <div class=\"flex item-center\">{{event.location}}</div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"visit-link\">\n                    Visit\n                </div>\n            </div>\n        </div>\n        <div class=\"details w-full\" *ngIf=\"!obj.events.length\">\n            No trainings.\n        </div>\n    </div>\n</div>",
+                        styles: [".event-day{border:1px solid #c3c3c3;border-radius:15px}.event-date{font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;width:10%}.events-list{border:1px solid #c3c3c3;border-radius:15px;justify-content:space-between;align-items:center;font-family:Lato;font-size:14px;font-weight:400;line-height:16.8px}.row1{width:235px}.aliginCenter,.col1{align-items:center}.visit-link{opacity:.7;cursor:pointer}.currentDay{padding:5px;background:#1d8923;border-radius:20px;color:#fff}"]
+                    }] }
         ];
-        return ConsumptionModule;
+        CalenderComponent.propDecorators = {
+            objectData: [{ type: core.Input }]
+        };
+        return CalenderComponent;
     }());
+    if (false) {
+        /** @type {?} */
+        CalenderComponent.prototype.objectData;
+        /** @type {?} */
+        CalenderComponent.prototype.toDay;
+    }
 
     /**
      * @fileoverview added by tsickle
      * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
-    /** @type {?} */
-    var ROOT_WIDGET_CONFIG = {
-        card: {
-            _type: 'cardLib',
-            cardResource: 'cardContentLib'
-        },
-    };
-
-    /**
-     * @fileoverview added by tsickle
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var NsCardContent$1;
-    (function (NsCardContent) {
-        /**
-         * @record
-         */
-        function ICard() { }
-        NsCardContent.ICard = ICard;
-        if (false) {
-            /** @type {?} */
-            ICard.prototype.content;
-            /** @type {?} */
-            ICard.prototype.cardSubType;
-            /** @type {?} */
-            ICard.prototype.context;
-            /** @type {?|undefined} */
-            ICard.prototype.intranetMode;
-            /** @type {?|undefined} */
-            ICard.prototype.deletedMode;
-            /** @type {?|undefined} */
-            ICard.prototype.likes;
-            /** @type {?|undefined} */
-            ICard.prototype.contentTags;
-            /** @type {?} */
-            ICard.prototype.stateData;
-            /** @type {?|undefined} */
-            ICard.prototype.cardCustomeClass;
-        }
-        /**
-         * @record
-         */
-        function IContentTags() { }
-        NsCardContent.IContentTags = IContentTags;
-        if (false) {
-            /** @type {?|undefined} */
-            IContentTags.prototype.daysSpan;
-            /** @type {?|undefined} */
-            IContentTags.prototype.excludeContentType;
-            /** @type {?|undefined} */
-            IContentTags.prototype.excludeMimeType;
-            /** @type {?} */
-            IContentTags.prototype.tag;
-            /** @type {?|undefined} */
-            IContentTags.prototype.criteriaField;
+    var CalenderModule = /** @class */ (function () {
+        function CalenderModule() {
         }
-        var EContentStatus;
-        (function (EContentStatus) {
-            EContentStatus["LIVE"] = "Live";
-            EContentStatus["EXPIRED"] = "Expired";
-            EContentStatus["DELETED"] = "Deleted";
-            EContentStatus["MARK_FOR_DELETION"] = "MarkedForDeletion";
-        })(EContentStatus = NsCardContent.EContentStatus || (NsCardContent.EContentStatus = {}));
-        var ACBPConst;
-        (function (ACBPConst) {
-            ACBPConst["UPCOMING"] = "upcoming";
-            ACBPConst["ALL"] = "All";
-            ACBPConst["OVERDUE"] = "overdue";
-            ACBPConst["SUCCESS"] = "success";
-        })(ACBPConst = NsCardContent.ACBPConst || (NsCardContent.ACBPConst = {}));
-        var IGOTConst;
-        (function (IGOTConst) {
-            IGOTConst["COMPETENCIES"] = "competencies_v5";
-            IGOTConst["RETIRED"] = "Retired";
-        })(IGOTConst = NsCardContent.IGOTConst || (NsCardContent.IGOTConst = {}));
-    })(NsCardContent$1 || (NsCardContent$1 = {}));
+        CalenderModule.decorators = [
+            { type: core.NgModule, args: [{
+                        imports: [
+                            common.CommonModule,
+                            material.MatIconModule,
+                        ],
+                        declarations: [CalenderComponent],
+                        exports: [CalenderComponent],
+                    },] }
+        ];
+        return CalenderModule;
+    }());
 
     /**
      * @fileoverview added by tsickle
      * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
-    var CardsComponent = /** @class */ (function (_super) {
-        __extends(CardsComponent, _super);
-        function CardsComponent(utilitySvc, configSvc, contSvc, router) {
-            var _this = _super.call(this) || this;
-            _this.utilitySvc = utilitySvc;
-            _this.configSvc = configSvc;
-            _this.contSvc = contSvc;
-            _this.router = router;
-            _this.isIntranetAllowedSettings = false;
-            return _this;
+    var CommonMethodsService = /** @class */ (function () {
+        function CommonMethodsService() {
         }
         /**
+         * @param {?} contents
+         * @param {?} strip
          * @return {?}
          */
-        CardsComponent.prototype.ngOnInit = /**
+        CommonMethodsService.prototype.transformContentsToWidgets = /**
+         * @param {?} contents
+         * @param {?} strip
          * @return {?}
          */
-        function () {
-        };
-        Object.defineProperty(CardsComponent.prototype, "isLiveOrMarkForDeletion", {
-            get: /**
-             * @return {?}
-             */
-            function () {
-                if (!this.widgetData.content.status ||
-                    this.widgetData.content.status === 'Live' ||
-                    this.widgetData.content.status === 'MarkedForDeletion') {
-                    return true;
-                }
-                return false;
-            },
-            enumerable: true,
-            configurable: true
-        });
-        Object.defineProperty(CardsComponent.prototype, "showIntranetContent", {
-            get: /**
+        function (contents, strip) {
+            return (contents || []).map((/**
+             * @param {?} content
+             * @param {?} idx
              * @return {?}
              */
-            function () {
-                if (this.widgetData.content.isInIntranet && this.utilitySvc.isMobile) {
-                    return !this.isIntranetAllowedSettings;
-                }
-                return false;
-            },
-            enumerable: true,
-            configurable: true
-        });
+            function (content, idx) { return (content ? {
+                widgetType: 'cardLib',
+                widgetSubType: 'cardContentLib',
+                widgetHostClass: 'mb-2',
+                widgetData: __assign({ content: content }, (content.batch && { batch: content.batch }), { cardSubType: strip.stripConfig && strip.stripConfig.cardSubType, cardCustomeClass: strip.customeClass ? strip.customeClass : '', context: { pageSection: strip.key, position: idx }, intranetMode: strip.stripConfig && strip.stripConfig.intranetMode, deletedMode: strip.stripConfig && strip.stripConfig.deletedMode, contentTags: strip.stripConfig && strip.stripConfig.contentTags }),
+            } : {
+                widgetType: 'card',
+                widgetSubType: 'cardContent',
+                widgetHostClass: 'mb-2',
+                widgetData: {},
+            }); }));
+        };
         /**
-         * @param {?} content
+         * @param {?} strip
          * @return {?}
          */
-        CardsComponent.prototype.getRedirectUrlData = /**
-         * @param {?} content
+        CommonMethodsService.prototype.transformSkeletonToWidgets = /**
+         * @param {?} strip
          * @return {?}
          */
-        function (content) {
-            return __awaiter(this, void 0, void 0, function () {
-                var urlData;
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, this.contSvc.getResourseLink(content)];
-                        case 1:
-                            urlData = _a.sent();
-                            this.router.navigate([urlData.url], {
-                                queryParams: urlData.queryParams
-                            });
-                            return [2 /*return*/];
-                    }
-                });
-            });
+        function (strip) {
+            return [1, 2, 3, 4, 5, 6, 7, 7, 8, 9, 10].map((/**
+             * @param {?} _content
+             * @return {?}
+             */
+            function (_content) { return ({
+                widgetType: 'cardLib',
+                widgetSubType: 'cardContentLib',
+                widgetHostClass: 'mb-2',
+                widgetData: {
+                    cardSubType: strip.loaderConfig && strip.loaderConfig.cardSubType || 'card-standard-skeleton',
+                    cardCustomeClass: strip.customeClass ? strip.customeClass : '',
+                },
+            }); }));
         };
-        CardsComponent.decorators = [
-            { type: core.Component, args: [{
-                        selector: 'sb-uic-cards',
-                        template: "<div class=\"widget-card-content-new\">\n    <ng-container *ngIf=\"widgetData && (((widgetData?.deletedMode || 'none') === 'hide' && !!!isLiveOrMarkForDeletion)\n    ? false\n    : !((widgetData?.intranetMode || 'none') === 'hide' && !!showIntranetContent))\"\n      [ngSwitch]=\"( (widgetData && widgetData?.cardSubType) || 'cardPortraitLib')\">\n      <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'user-card'\" [ngTemplateOutlet]=\"cardUser\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib-skeleton'\" [ngTemplateOutlet]=\"cardPortraitLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib'\" [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib-skeleton'\" [ngTemplateOutlet]=\"cardLandscapeLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib'\" [ngTemplateOutlet]=\"cardLandscapeLib\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #cardPortraitLibSkeleton>\n  <sb-uic-card-portrait [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardPortraitLib>\n  <sb-uic-card-portrait [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardLandscapeLibSkeleton>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-landscape>\n</ng-template>\n<ng-template #cardLandscapeLib>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-landscape>\n</ng-template>\n\n\n  <ng-template #cardUser>\n    <sb-uic-card-user [widgetData]=\"widgetData\"></sb-uic-card-user>\n  </ng-template>\n",
-                        styles: [""]
-                    }] }
+        CommonMethodsService.decorators = [
+            { type: core.Injectable, args: [{
+                        providedIn: 'root'
+                    },] }
         ];
         /** @nocollapse */
-        CardsComponent.ctorParameters = function () { return [
-            { type: utilsV2.UtilityService },
-            { type: ConfigurationsService },
+        CommonMethodsService.ctorParameters = function () { return []; };
+        /** @nocollapse */ CommonMethodsService.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function CommonMethodsService_Factory() { return new CommonMethodsService(); }, token: CommonMethodsService, providedIn: "root" });
+        return CommonMethodsService;
+    }());
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    /**
+     * @record
+     */
+    function IStripUnitCommonData() { }
+    if (false) {
+        /** @type {?} */
+        IStripUnitCommonData.prototype.key;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.canHideStrip;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.mode;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.showStrip;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.disableTranslate;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.widgets;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.stripTitle;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.stripTitleLink;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.sliderConfig;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.stripConfig;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.tabs;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.stripName;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.stripLogo;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.description;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.stripInfo;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.noDataWidget;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.errorWidget;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.showOnNoData;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.showOnLoader;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.showOnError;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.loaderWidgets;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.stripBackground;
+        /** @type {?|undefined} */
+        IStripUnitCommonData.prototype.secondaryHeading;
+        /** @type {?} */
+        IStripUnitCommonData.prototype.viewMoreUrl;
+    }
+    var CommonStripComponent = /** @class */ (function (_super) {
+        __extends(CommonStripComponent, _super);
+        function CommonStripComponent(environment, contentSvc, loggerSvc, eventSvc, configSvc, utilitySvc, userSvc, translate, langtranslations, commonMethodsSvc) {
+            var _this = _super.call(this) || this;
+            _this.contentSvc = contentSvc;
+            _this.loggerSvc = loggerSvc;
+            _this.eventSvc = eventSvc;
+            _this.configSvc = configSvc;
+            _this.utilitySvc = utilitySvc;
+            _this.userSvc = userSvc;
+            _this.translate = translate;
+            _this.langtranslations = langtranslations;
+            _this.commonMethodsSvc = commonMethodsSvc;
+            _this.id = "ws-strip-miltiple_" + Math.random();
+            _this.stripsResultDataMap = {};
+            _this.stripsKeyOrder = [];
+            _this.showAccordionData = true;
+            _this.showParentLoader = false;
+            _this.showParentError = false;
+            _this.showParentNoData = false;
+            _this.errorDataCount = 0;
+            _this.noDataCount = 0;
+            _this.successDataCount = 0;
+            _this.contentAvailable = true;
+            _this.baseUrl = _this.configSvc.sitePath || '';
+            _this.veifiedKarmayogi = false;
+            _this.changeEventSubscription = null;
+            _this.defaultMaxWidgets = 12;
+            _this.todaysEvents = [];
+            _this.environment = environment;
+            return _this;
+        }
+        /**
+         * @return {?}
+         */
+        CommonStripComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+        function () {
+            // const url = window.location.href
+            this.initData();
+        };
+        /**
+         * @return {?}
+         */
+        CommonStripComponent.prototype.ngOnDestroy = /**
+         * @return {?}
+         */
+        function () {
+            if (this.changeEventSubscription) {
+                this.changeEventSubscription.unsubscribe();
+            }
+        };
+        /**
+         * @param {?} key
+         * @return {?}
+         */
+        CommonStripComponent.prototype.showAccordion = /**
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) {
+            if (this.utilitySvc.isMobile && this.stripsResultDataMap[key].mode === 'accordion') {
+                return this.showAccordionData;
+            }
+            return true;
+        };
+        /**
+         * @param {?} key
+         * @return {?}
+         */
+        CommonStripComponent.prototype.setHiddenForStrip = /**
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) {
+            this.stripsResultDataMap[key].showStrip = false;
+            sessionStorage.setItem("cstrip_" + key, '1');
+        };
+        /**
+         * @private
+         * @param {?} key
+         * @return {?}
+         */
+        CommonStripComponent.prototype.getIfStripHidden = /**
+         * @private
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) {
+            /** @type {?} */
+            var storageItem = sessionStorage.getItem("cstrip_" + key);
+            return Boolean(storageItem !== '1');
+        };
+        /**
+         * @private
+         * @return {?}
+         */
+        CommonStripComponent.prototype.initData = /**
+         * @private
+         * @return {?}
+         */
+        function () {
+            var e_1, _a;
+            var _this = this;
+            this.stripsKeyOrder = this.widgetData && this.widgetData.strips && this.widgetData.strips.map((/**
+             * @param {?} strip
+             * @return {?}
+             */
+            function (strip) { return strip.key; })) || [];
+            if (this.widgetData.loader && this.widgetData.strips.length) {
+                this.showParentLoader = true;
+            }
+            try {
+                // Fetch the data
+                for (var _b = __values(this.widgetData.strips), _c = _b.next(); !_c.done; _c = _b.next()) {
+                    var strip = _c.value;
+                    this.processStrip(strip, [], 'fetching', false, null);
+                    if (strip.dataType === 'in-hand' && this.widgetData[strip.dataKey]) {
+                        this.processStrip(strip, this.commonMethodsSvc.transformContentsToWidgets(this.widgetData[strip.dataKey], strip), 'done', true, strip.viewMoreUrl || '');
+                    }
+                    else {
+                        if (this.checkForEmptyWidget(strip)) {
+                            // this.fetchStripFromRequestData(strip, false);
+                        }
+                        else {
+                            this.processStrip(strip, [], 'done', true, null);
+                        }
+                    }
+                }
+            }
+            catch (e_1_1) { e_1 = { error: e_1_1 }; }
+            finally {
+                try {
+                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                }
+                finally { if (e_1) throw e_1.error; }
+            }
+            // Subscription for changes
+            /** @type {?} */
+            var keyAndEvent = this.widgetData.strips
+                .map((/**
+             * @param {?} strip
+             * @return {?}
+             */
+            function (strip) { return ({
+                key: strip.key,
+                type: (strip.refreshEvent && strip.refreshEvent.eventType) || '',
+                from: (strip.refreshEvent && strip.refreshEvent.from.toString()) || '',
+            }); }))
+                .filter((/**
+             * @param {?} __0
+             * @return {?}
+             */
+            function (_a) {
+                var key = _a.key, type = _a.type, from = _a.from;
+                return key && type && from;
+            }));
+            /** @type {?} */
+            var eventTypeSet = new Set(keyAndEvent.map((/**
+             * @param {?} e
+             * @return {?}
+             */
+            function (e) { return e.type; })));
+            this.changeEventSubscription = this.eventSvc.events$
+                .pipe(operators.filter((/**
+             * @param {?} event
+             * @return {?}
+             */
+            function (event) { return eventTypeSet.has(event.eventType); })))
+                .subscribe((/**
+             * @param {?} event
+             * @return {?}
+             */
+            function (event) {
+                keyAndEvent
+                    .filter((/**
+                 * @param {?} e
+                 * @return {?}
+                 */
+                function (e) { return e.type === event.eventType && e.from === event.from; }))
+                    .map((/**
+                 * @param {?} e
+                 * @return {?}
+                 */
+                function (e) { return e.key; }))
+                    .forEach((/**
+                 * @param {?} k
+                 * @return {?}
+                 */
+                function (k) { return _this.fetchStripFromKey(k, false); }));
+            }));
+        };
+        /**
+         * @private
+         * @param {?} key
+         * @param {?=} calculateParentStatus
+         * @return {?}
+         */
+        CommonStripComponent.prototype.fetchStripFromKey = /**
+         * @private
+         * @param {?} key
+         * @param {?=} calculateParentStatus
+         * @return {?}
+         */
+        function (key, calculateParentStatus) {
+            if (calculateParentStatus === void 0) { calculateParentStatus = true; }
+            /** @type {?} */
+            var stripData = this.widgetData.strips.find((/**
+             * @param {?} strip
+             * @return {?}
+             */
+            function (strip) { return strip.key === key; }));
+            if (stripData) {
+                // this.fetchStripFromRequestData(stripData, calculateParentStatus);
+            }
+        };
+        /**
+         * @param {?} data
+         * @return {?}
+         */
+        CommonStripComponent.prototype.isStripShowing = /**
+         * @param {?} data
+         * @return {?}
+         */
+        function (data) {
+            var _this = this;
+            /** @type {?} */
+            var count = 0;
+            if (data && data.key === this.environment.programStripKey && (!data.tabs || !data.tabs.length) &&
+                data.stripTitle === this.environment.programStripName && data.widgets.length > 0) {
+                data.widgets.forEach((/**
+                 * @param {?} key
+                 * @return {?}
+                 */
+                function (key) {
+                    if (key && key.widgetData.content.primaryCategory === _this.environment.programStripPrimaryCategory) {
+                        count = count + 1;
+                    }
+                }));
+                if (count > 0) {
+                    data.showStrip = true;
+                }
+                else {
+                    data.showStrip = false;
+                }
+            }
+            return data.showStrip;
+        };
+        Object.defineProperty(CommonStripComponent.prototype, "isMobile", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this.utilitySvc.isMobile || false;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        /**
+         * @param {?} data
+         * @return {?}
+         */
+        CommonStripComponent.prototype.getdata = /**
+         * @param {?} data
+         * @return {?}
+         */
+        function (data) {
+            if (data.stripInfo) {
+                return data.stripInfo.widget;
+            }
+            return {};
+        };
+        /**
+         * @param {?} wData
+         * @param {?} data
+         * @return {?}
+         */
+        CommonStripComponent.prototype.checkCondition = /**
+         * @param {?} wData
+         * @param {?} data
+         * @return {?}
+         */
+        function (wData, data) {
+            if (wData.strips[0].stripConfig && wData.strips[0].stripConfig.hideShowAll) {
+                return !wData.strips[0].stripConfig.hideShowAll;
+            }
+            return wData.strips[0].viewMoreUrl && data.widgets && data.widgets.length >= 4;
+        };
+        /**
+         * @param {?} data
+         * @return {?}
+         */
+        CommonStripComponent.prototype.checkVisible = /**
+         * @param {?} data
+         * @return {?}
+         */
+        function (data) {
+            return data.stripInfo && data.stripInfo.visibilityMode === 'visible';
+        };
+        /**
+         * @param {?} data
+         * @return {?}
+         */
+        CommonStripComponent.prototype.getContineuLearningLenth = /**
+         * @param {?} data
+         * @return {?}
+         */
+        function (data) {
+            return data.widgets ? data.widgets.length : 0;
+        };
+        /**
+         * @param {?} data
+         * @return {?}
+         */
+        CommonStripComponent.prototype.getLength = /**
+         * @param {?} data
+         * @return {?}
+         */
+        function (data) {
+            if (!data.tabs || !data.tabs.length) {
+                return data.widgets ? data.widgets.length : 0;
+            }
+            {
+                // if tabs are there check if each tab has widgets and get the tab with max widgets
+                /** @type {?} */
+                var tabWithMaxWidgets = data.tabs.reduce((/**
+                 * @param {?} prev
+                 * @param {?} current
+                 * @return {?}
+                 */
+                function (prev, current) {
+                    if (!prev.widgets && !current.widgets) {
+                        return current;
+                    }
+                    if (prev.widgets && current.widgets) {
+                        return (prev.widgets.length > current.widgets.length) ? prev : current;
+                    }
+                    if (current.widgets && !prev.widgets) {
+                        return current;
+                    }
+                    if (!current.widgets && prev.widgets) {
+                        return prev;
+                    }
+                    return current;
+                    // return (prev.widgets && current.widgets && (prev.widgets.length > current.widgets.length) ) ? prev : current
+                    // tslint:disable-next-line: align
+                }), data.tabs[0]);
+                // if tabs has atleast 1 widgets then strip will show or else not
+                return tabWithMaxWidgets.widgets ? tabWithMaxWidgets.widgets.length : 0;
+            }
+        };
+        /**
+         * @private
+         * @param {?} strip
+         * @param {?=} results
+         * @param {?=} fetchStatus
+         * @param {?=} calculateParentStatus
+         * @param {?=} _viewMoreUrl
+         * @param {?=} tabsResults
+         * @return {?}
+         */
+        CommonStripComponent.prototype.processStrip = /**
+         * @private
+         * @param {?} strip
+         * @param {?=} results
+         * @param {?=} fetchStatus
+         * @param {?=} calculateParentStatus
+         * @param {?=} _viewMoreUrl
+         * @param {?=} tabsResults
+         * @return {?}
+         */
+        function (strip, results, fetchStatus, calculateParentStatus, _viewMoreUrl, tabsResults) {
+            if (results === void 0) { results = []; }
+            if (calculateParentStatus === void 0) { calculateParentStatus = true; }
+            return __awaiter(this, void 0, void 0, function () {
+                var stripData;
+                var _a;
+                return __generator(this, function (_b) {
+                    stripData = {
+                        viewMoreUrl: strip.viewMoreUrl,
+                        key: strip.key,
+                        canHideStrip: Boolean(strip.canHideStrip),
+                        showStrip: this.getIfStripHidden(strip.key),
+                        noDataWidget: strip.noDataWidget,
+                        errorWidget: strip.errorWidget,
+                        stripInfo: strip.info,
+                        stripTitle: strip.title,
+                        stripTitleLink: strip.stripTitleLink,
+                        dataType: strip.dataType,
+                        dataKey: strip.dataKey,
+                        disableTranslate: strip.disableTranslate,
+                        sliderConfig: strip.sliderConfig,
+                        tabs: tabsResults ? tabsResults : strip.tabs,
+                        stripName: strip.name,
+                        mode: strip.mode,
+                        stripConfig: strip.stripConfig,
+                        stripBackground: strip.stripBackground,
+                        secondaryHeading: strip.secondaryHeading,
+                        loaderWidgets: strip.loaderWidgets || [],
+                        widgets: fetchStatus === 'done'
+                            ? __spread((strip.preWidgets || []).map((/**
+                             * @param {?} w
+                             * @return {?}
+                             */
+                            function (w) { return (__assign({}, w, { widgetHostClass: "mb-2 " + w.widgetHostClass })); })), results, (strip.postWidgets || []).map((/**
+                             * @param {?} w
+                             * @return {?}
+                             */
+                            function (w) { return (__assign({}, w, { widgetHostClass: "mb-2 " + w.widgetHostClass })); }))) : [],
+                        showOnNoData: Boolean(strip.noDataWidget &&
+                            !((strip.preWidgets || []).length + results.length + (strip.postWidgets || []).length) &&
+                            fetchStatus === 'done'),
+                        showOnLoader: Boolean(strip.loader && fetchStatus === 'fetching'),
+                        showOnError: Boolean(strip.errorWidget && fetchStatus === 'error'),
+                    };
+                    // const stripData = this.stripsResultDataMap[strip.key]
+                    this.stripsResultDataMap = __assign({}, this.stripsResultDataMap, (_a = {}, _a[strip.key] = stripData, _a));
+                    if (!tabsResults) {
+                        if (calculateParentStatus &&
+                            (fetchStatus === 'done' || fetchStatus === 'error') &&
+                            stripData.widgets) {
+                            this.checkParentStatus(fetchStatus, stripData.widgets.length);
+                        }
+                        if (calculateParentStatus && !(results && results.length > 0)) {
+                            this.contentAvailable = false;
+                        }
+                        else if (results && results.length > 0) {
+                            this.contentAvailable = true;
+                        }
+                    }
+                    else {
+                        this.contentAvailable = true;
+                    }
+                    return [2 /*return*/];
+                });
+            });
+        };
+        /**
+         * @param {?} stripsResultDataMap
+         * @param {?} key
+         * @return {?}
+         */
+        CommonStripComponent.prototype.getSelectedIndex = /**
+         * @param {?} stripsResultDataMap
+         * @param {?} key
+         * @return {?}
+         */
+        function (stripsResultDataMap, key) {
+            /** @type {?} */
+            var returnValue = 0;
+            if (key === 'cbpPlan') {
+                if (stripsResultDataMap.tabs.length) {
+                    /** @type {?} */
+                    var data = stripsResultDataMap.tabs.filter((/**
+                     * @param {?} ele
+                     * @return {?}
+                     */
+                    function (ele) { return ele.value === 'upcoming'; }));
+                    returnValue = data[0].widgets && data[0].widgets.length > 0 ? 1 : 0;
+                }
+            }
+            return returnValue;
+        };
+        /**
+         * @private
+         * @param {?} fetchStatus
+         * @param {?} stripWidgetsCount
+         * @return {?}
+         */
+        CommonStripComponent.prototype.checkParentStatus = /**
+         * @private
+         * @param {?} fetchStatus
+         * @param {?} stripWidgetsCount
+         * @return {?}
+         */
+        function (fetchStatus, stripWidgetsCount) {
+            if (fetchStatus === 'done' && !stripWidgetsCount) {
+                this.noDataCount += 1;
+            }
+            else if (fetchStatus === 'done' && stripWidgetsCount) {
+                this.successDataCount += 1;
+            }
+            else if (fetchStatus === 'error') {
+                this.errorDataCount += 1;
+            }
+            /** @type {?} */
+            var settledCount = this.noDataCount + this.successDataCount + this.errorDataCount;
+            /** @type {?} */
+            var totalCount = this.widgetData.strips.length;
+            if (this.successDataCount > 0 && settledCount < totalCount) {
+                return;
+            }
+            this.showParentLoader = settledCount !== totalCount;
+            this.showParentNoData =
+                this.noDataCount > 0 && this.noDataCount + this.errorDataCount === totalCount;
+            this.showParentError = this.errorDataCount === totalCount;
+        };
+        /**
+         * @param {?} strip
+         * @return {?}
+         */
+        CommonStripComponent.prototype.checkForEmptyWidget = /**
+         * @param {?} strip
+         * @return {?}
+         */
+        function (strip) {
+            if (strip.request &&
+                ((strip.request.api && Object.keys(strip.request.api).length) ||
+                    (strip.request.search && Object.keys(strip.request.search).length) ||
+                    (strip.request.searchRegionRecommendation &&
+                        Object.keys(strip.request.searchRegionRecommendation).length) ||
+                    (strip.request.searchV6 && Object.keys(strip.request.searchV6).length) ||
+                    (strip.request.enrollmentList && Object.keys(strip.request.enrollmentList).length) ||
+                    (strip.request.cbpList && Object.keys(strip.request.cbpList).length) ||
+                    (strip.request.trendingSearch && Object.keys(strip.request.trendingSearch).length))) {
+                return true;
+            }
+            return false;
+        };
+        /**
+         * @param {?} tabEvent
+         * @param {?} stripMap
+         * @param {?} stripKey
+         * @return {?}
+         */
+        CommonStripComponent.prototype.tabClicked = /**
+         * @param {?} tabEvent
+         * @param {?} stripMap
+         * @param {?} stripKey
+         * @return {?}
+         */
+        function (tabEvent, stripMap, stripKey) {
+        };
+        /**
+         * @param {?} label
+         * @param {?} type
+         * @return {?}
+         */
+        CommonStripComponent.prototype.translateLabels = /**
+         * @param {?} label
+         * @param {?} type
+         * @return {?}
+         */
+        function (label, type) {
+            return this.langtranslations.translateLabel(label, type, '');
+        };
+        /**
+         * @param {?} index
+         * @param {?} item
+         * @return {?}
+         */
+        CommonStripComponent.prototype.identify = /**
+         * @param {?} index
+         * @param {?} item
+         * @return {?}
+         */
+        function (index, item) {
+            if (index >= 0) { }
+            return item;
+        };
+        /**
+         * @param {?} index
+         * @param {?} item
+         * @return {?}
+         */
+        CommonStripComponent.prototype.tracker = /**
+         * @param {?} index
+         * @param {?} item
+         * @return {?}
+         */
+        function (index, item) {
+            if (index >= 0) { }
+            return lodash.get(item, 'widgetData.content.identifier');
+        };
+        CommonStripComponent.decorators = [
+            { type: core.Component, args: [{
+                        selector: 'sb-uic-common-strip',
+                        template: "<ng-container *ngIf=\"!contentAvailable; else otherTemplate\"></ng-container>\n<ng-template #otherTemplate>\n  <!-- <div *ngIf=\"showParentLoader\" class=\"text-center my-2\">\n    <mat-spinner class=\"inline-block\"></mat-spinner>\n  </div> -->\n  <ng-container *ngIf=\"showParentError\" [sbUiResolverWidget]=\"widgetData.errorWidget\"></ng-container>\n  <ng-container *ngIf=\"showParentNoData\" [sbUiResolverWidget]=\"widgetData.noDataWidget\"></ng-container>\n  <ng-container *ngFor=\"let key of stripsKeyOrder; let i = index; trackBy: identify\">\n    <ng-container *ngIf=\"isStripShowing(stripsResultDataMap[key])\">\n      <a name=\"{{stripsResultDataMap[key]?.stripTitle}}\" [class]=\"key\">\n        <div *ngIf=\"stripsResultDataMap && (getLength(stripsResultDataMap[key]) ||\n                    stripsResultDataMap[key]?.showOnNoData ||\n                    stripsResultDataMap[key]?.showOnLoader ||\n                    stripsResultDataMap[key]?.showOnError)\n                  \" [ngClass]=\"\n                    !widgetData?.isChannelStrip ? 'xs:px-8 sx:px-10ss' : i > 0 ? 'mt-12' : ''\n                  \" [id]=\"key\" [ngClass]=\"!widgetData?.isChannelStrip ? margin-bottom-custom : margin-bottom-xs\">\n          <div [ngClass]=\"{ pad: stripsResultDataMap[key]?.stripBackground }\"\n            [ngStyle]=\"{ 'background-color': stripsResultDataMap[key]?.stripBackground }\">\n            <div class=\"flex flex-col pl-4 pr-4 md:pr-0 md:pl-0 \" [ngClass]=\"\n                        !widgetData?.isChannelStrip\n                          ? ''\n                          : stripsResultDataMap[key]?.stripTitle\n                          ? 'mb-8'\n                          : ''\n                      \">\n              <div class=\"flex flex-1 items-center\">\n                <p class=\"mat-subheading-1 margin-remove inline-block \" *ngIf=\"stripsResultDataMap[key]?.stripTitle\">\n                  <span class=\"capitalize\" *ngIf=\"stripsResultDataMap[key]?.disableTranslate\">\n                    {{stripsResultDataMap[key]?.stripTitle}}\n                  </span>\n                  <span *ngIf=\"!stripsResultDataMap[key]?.disableTranslate\">\n                    {{ translateLabels(stripsResultDataMap[key]?.stripTitle, 'home') }}\n                  </span>\n                </p>\n\n                <a *ngIf=\"stripsResultDataMap[key]?.stripTitleLink?.link\"\n                  [routerLink]=\"stripsResultDataMap[key]?.stripTitleLink?.link\"\n                  [queryParams]=\"stripsResultDataMap[key]?.stripTitleLink?.link?.queryParams\">\n                  <mat-icon class=\"ws-mat-primary-primary-text ws-mat-default-text\" [color]=\"'accent'\">{{\n                    stripsResultDataMap[key]?.stripTitleLink?.icon }}</mat-icon>\n                </a>\n                <span class=\"spacer\"></span>\n                <!-- viewAll start-->\n                <div *ngIf=\"checkCondition(widgetData , stripsResultDataMap[key])\"\n                  class=\"ml-4 view-more ws-mat-default-text\">\n                  <a class=\"flex ws-mat-default-text items-center justify-center mat-body-1\" [routerLink]=\"stripsResultDataMap[key]?.viewMoreUrl?.path\"\n                    [queryParams]=\"stripsResultDataMap[key]?.viewMoreUrl?.queryParams\">\n                    <span i18n class=\"ws-mat-default-text\">{{translateLabels(widgetData.strips[0].viewMoreUrl.viewMoreText,'home')  || 'See all'}}</span>\n                    <mat-icon class=\"ws-mat-default-text mat-icon notranslate material-icons mat-icon-no-color\" color=\"accent\">navigate_next</mat-icon>\n                  </a>\n                </div>\n                <!-- viewAll end-->\n              </div>\n              <button mat-icon-button (click)=\"setHiddenForStrip(key)\" *ngIf=\"stripsResultDataMap[key]?.canHideStrip\">\n                <mat-icon>close</mat-icon>\n              </button>\n              <mat-icon class=\"cursor-pointer\" *ngIf=\"stripsResultDataMap[key]?.mode === 'accordion' && isMobile\"\n                (click)=\"showAccordionData = !showAccordionData\">{{ showAccordionData ? 'expand_less' : 'expand_more' }}\n              </mat-icon>\n            </div>\n\n            <div class=\"mb-4\" *ngIf=\"checkVisible(stripsResultDataMap[key])\">\n              <ng-container [sbUiResolverWidget]=\"getdata(stripsResultDataMap[key])\">\n              </ng-container>\n            </div>\n\n            <ng-container *ngIf=\"stripsResultDataMap[key]?.showOnNoData\"\n              [sbUiResolverWidget]=\"stripsResultDataMap[key]?.noDataWidget\"></ng-container>\n            <ng-container *ngIf=\"stripsResultDataMap[key]?.showOnError\"\n              [sbUiResolverWidget]=\"stripsResultDataMap[key]?.errorWidget\"></ng-container>\n            <!-- IF no errors then proceed to show tabs or non tabs strip -->\n            <ng-container *ngIf=\"!stripsResultDataMap[key]?.showOnNoData && !stripsResultDataMap[key]?.showOnError\">\n              <ng-container *ngIf=\"stripsResultDataMap[key].tabs && stripsResultDataMap[key].tabs.length\">\n                <mat-tab-group animationDuration=\"0ms\" [selectedIndex]=\"getSelectedIndex(stripsResultDataMap[key], key)\"\n                class=\"mat-tab-labels w-full strips-tabgroup\" dynamicHeight\n                  (selectedTabChange)=\"tabClicked($event, stripsResultDataMap[key], key)\">\n                  <mat-tab label=\"{{tab?.label}}\" *ngFor=\"let tab of stripsResultDataMap[key].tabs; let last = last;\">\n                    <ng-template mat-tab-label>\n                      <span>{{ translateLabels(tab?.label, 'home') }} &nbsp;</span>\n                      <span *ngIf=\"tab?.showTabDataCount && tab?.widgets?.length\">({{tab?.widgets?.length}})</span>\n                    </ng-template>\n                    <div>\n                      <!-- <ng-container [ngTemplateOutlet]=\"loader\" *ngIf=\"stripsResultDataMap[key]?.showOnLoader\">\n                      </ng-container> -->\n                      <div *ngIf=\"stripsResultDataMap && stripsResultDataMap[key]?.showOnLoader ||\n                      !tab.fetchTabStatus\"\n                      class=\"text-center my-2\">\n                            <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\"\n                                    [loadStatus]=\"'fetching'\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                              <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.loaderWidgets; trackBy: tracker\">\n                                <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                              </ng-container>\n                            </sb-uic-horizontal-scroller-v2>\n                      </div>\n                      <div *ngIf=\"((tab?.fetchTabStatus && tab?.fetchTabStatus === 'done') &&\n                      (!tab?.widgets || !tab?.widgets?.length))\">\n                      <ng-container *ngIf=\"tab?.value === 'inprogress'; else msgTemp\">\n                        <div class=\"w-full flex flex-col items-center justify-center\">\n                          <img alt=\"\" class=\"mt-4 mb-4\" src=\"assets/icons/home/nodataDefault.svg\">\n                          <div class=\"mat-subheading-1 text-center info-content\">{{ 'contentstripmultiple.getReadyForLearningAdventure' | translate }} -\n                            <a class=\"click-here\" [routerLink]=\"'/page/learn'\">{{ 'contentstripmultiple.clickHere' | translate }}</a> {{ 'contentstripmultiple.toEnrollNextCourse' | translate }}</div>\n                        </div>\n                      </ng-container>\n                      <ng-template #msgTemp>\n                        <div class=\"w-full flex flex-col items-center justify-center\">\n                          <img alt=\"\" class=\"mt-4 mb-4\" src=\"assets/icons/home/nodataDefault.png\">\n                          <div class=\"mat-subheading-1 text-center\">{{ translateLabels(tab.nodataMsg, 'home') }}</div>\n                        </div>\n                      </ng-template>\n                      </div>\n                      <ng-container *ngIf=\"(tab?.fetchTabStatus === 'done' || tab?.widgets?.length)\">\n                        <ng-container  *ngIf=\"!tab?.tabLoading\">\n\n                          <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\" [widgetsLength]=\"tab?.widgets?.length\"\n                            *ngIf=\"getContineuLearningLenth(stripsResultDataMap[key]) && showAccordion(key)\"\n                            [loadStatus]=\"'done'\" [defaultMaxWidgets]=\"tab?.maxWidgets ||\n                            stripsResultDataMap[key]?.sliderConfig?.maxWidgets || defaultMaxWidgets\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                            <ng-container *ngFor=\"let widget of tab?.widgets| slice:0:(tab?.maxWidgets ||\n                            stripsResultDataMap[key]?.sliderConfig?.maxWidgets || defaultMaxWidgets); trackBy: tracker\">\n                                <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                            </ng-container>\n                          </sb-uic-horizontal-scroller-v2>\n                        </ng-container>\n                      </ng-container>\n                    </div>\n                  </mat-tab>\n                </mat-tab-group>\n              </ng-container>\n              <ng-container *ngIf=\"!stripsResultDataMap[key].tabs || !stripsResultDataMap[key].tabs.length\">\n                <div *ngIf=\"stripsResultDataMap && stripsResultDataMap[key]?.showOnLoader\" class=\"text-center my-2\">\n                      <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\" [id]=\"key+'-scroller'\"\n                              [loadStatus]=\"'fetching'\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                        <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.loaderWidgets; trackBy: tracker\">\n                          <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                        </ng-container>\n                      </sb-uic-horizontal-scroller-v2>\n                </div>\n                <div class=\"\">\n                    <sb-uic-horizontal-scroller-v2 [sliderConfig]=\"stripsResultDataMap[key]?.sliderConfig\" [id]=\"key+'-scroller'\"\n                     [widgetsLength]=\"stripsResultDataMap[key]?.widgets?.length\" [loadStatus]=\"'done'\" [defaultMaxWidgets]=\"stripsResultDataMap[key].sliderConfig?.maxWidgets || defaultMaxWidgets\" [stripConfig]=\"stripsResultDataMap[key]?.stripConfig\">\n                      <ng-container *ngFor=\"let widget of stripsResultDataMap[key]?.widgets| slice:0:(stripsResultDataMap[key].sliderConfig?.maxWidgets || defaultMaxWidgets); trackBy: tracker\">\n                      <!-- <ng-container *ngIf=\"widget.widgetData.context.pageSection === 'continueLearning' \"> -->\n                      <!-- <ng-container *ngIf=\"widget.widgetData.content.completionPercentage !== 100\"\n                        [sbUiResolverWidget]=\"widget\"></ng-container> -->\n                        <ng-container [sbUiResolverWidget]=\"widget\"></ng-container>\n                      <!-- </ng-container> -->\n                      </ng-container>\n                  </sb-uic-horizontal-scroller-v2>\n                </div>\n              </ng-container>\n            </ng-container>\n          </div>\n        </div>\n      </a>\n\n    </ng-container>\n  </ng-container>\n</ng-template>",
+                        styles: [".view-more{display:flex;align-items:center;text-align:center;height:40px;justify-content:center}.view-more .icon{font-size:24px;width:24px;height:24px;border:1px solid;border-radius:50%;padding:8px;margin-bottom:8px}.margin-bottom-custom{margin-bottom:60px}.view-more:hover{background-color:#dcdfe5}::ng-deep.strips-tabgroup .mat-tab-header{border-bottom:2px solid rgba(0,0,0,.12)}::ng-deep.strips-tabgroup .mat-tab-body{padding:20px 0!important;box-sizing:border-box;overflow-y:initial!important}::ng-deep.strips-tabgroup .mat-tab-body-wrapper{overflow:inherit!important}::ng-deep.strips-tabgroup .mat-tab-label{border-bottom:0 solid rgba(0,0,0,.1);margin-right:0;opacity:1}::ng-deep.strips-tabgroup .mat-tab-label .mat-tab-label-content{text-transform:inherit;font:400 14px/20px Lato}::ng-deep.strips-tabgroup .mat-tab-label-active .mat-tab-label-content{font-weight:700!important}.click-here{color:#1b4ca1}.info-content{opacity:1;color:rgba(0,0,0,.87);font:700 14px/20px Lato-Bold;text-align:center}"]
+                    }] }
+        ];
+        /** @nocollapse */
+        CommonStripComponent.ctorParameters = function () { return [
+            { type: undefined, decorators: [{ type: core.Inject, args: ['environment',] }] },
+            { type: WidgetContentService },
+            { type: utilsV2.LoggerService },
+            { type: utilsV2.EventService },
+            { type: utilsV2.ConfigurationsService },
+            { type: utilsV2.UtilityService },
+            { type: WidgetUserService },
+            { type: core$1.TranslateService },
+            { type: MultilingualTranslationsService },
+            { type: CommonMethodsService }
+        ]; };
+        CommonStripComponent.propDecorators = {
+            widgetData: [{ type: core.Input }],
+            id: [{ type: core.HostBinding, args: ['id',] }]
+        };
+        return CommonStripComponent;
+    }(resolverV2.WidgetBaseComponent));
+    if (false) {
+        /** @type {?} */
+        CommonStripComponent.prototype.widgetData;
+        /** @type {?} */
+        CommonStripComponent.prototype.id;
+        /** @type {?} */
+        CommonStripComponent.prototype.stripsResultDataMap;
+        /** @type {?} */
+        CommonStripComponent.prototype.stripsKeyOrder;
+        /** @type {?} */
+        CommonStripComponent.prototype.showAccordionData;
+        /** @type {?} */
+        CommonStripComponent.prototype.showParentLoader;
+        /** @type {?} */
+        CommonStripComponent.prototype.showParentError;
+        /** @type {?} */
+        CommonStripComponent.prototype.showParentNoData;
+        /** @type {?} */
+        CommonStripComponent.prototype.errorDataCount;
+        /** @type {?} */
+        CommonStripComponent.prototype.noDataCount;
+        /** @type {?} */
+        CommonStripComponent.prototype.successDataCount;
+        /** @type {?} */
+        CommonStripComponent.prototype.contentAvailable;
+        /** @type {?} */
+        CommonStripComponent.prototype.baseUrl;
+        /** @type {?} */
+        CommonStripComponent.prototype.veifiedKarmayogi;
+        /** @type {?} */
+        CommonStripComponent.prototype.environment;
+        /** @type {?} */
+        CommonStripComponent.prototype.changeEventSubscription;
+        /** @type {?} */
+        CommonStripComponent.prototype.defaultMaxWidgets;
+        /** @type {?} */
+        CommonStripComponent.prototype.enrollInterval;
+        /** @type {?} */
+        CommonStripComponent.prototype.todaysEvents;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.contentSvc;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.loggerSvc;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.eventSvc;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.configSvc;
+        /** @type {?} */
+        CommonStripComponent.prototype.utilitySvc;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.userSvc;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.translate;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.langtranslations;
+        /**
+         * @type {?}
+         * @private
+         */
+        CommonStripComponent.prototype.commonMethodsSvc;
+    }
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var ɵ0$2 = HttpLoaderFactory;
+    var CommonStripModule = /** @class */ (function () {
+        function CommonStripModule() {
+        }
+        CommonStripModule.decorators = [
+            { type: core.NgModule, args: [{
+                        declarations: [CommonStripComponent],
+                        imports: [
+                            resolverV2.SbUiResolverModule,
+                            common.CommonModule,
+                            router.RouterModule,
+                            HorizontalScrollerV2Module,
+                            material.MatProgressSpinnerModule,
+                            material.MatToolbarModule,
+                            material.MatIconModule,
+                            material.MatButtonModule,
+                            material.MatTooltipModule,
+                            material.MatListModule,
+                            material.MatSidenavModule,
+                            material.MatCardModule,
+                            material.MatExpansionModule,
+                            material.MatRadioModule,
+                            material.MatChipsModule,
+                            material.MatInputModule,
+                            material.MatFormFieldModule,
+                            material.MatDialogModule,
+                            material.MatSnackBarModule,
+                            material.MatSelectModule,
+                            material.MatDatepickerModule,
+                            material.MatNativeDateModule,
+                            material.MatTableModule,
+                            material.MatCheckboxModule,
+                            material.MatProgressSpinnerModule,
+                            material.MatButtonToggleModule,
+                            material.MatTabsModule,
+                            material.MatAutocompleteModule,
+                            core$1.TranslateModule.forRoot({
+                                loader: {
+                                    provide: core$1.TranslateLoader,
+                                    useFactory: ɵ0$2,
+                                    deps: [http.HttpClient],
+                                },
+                            }),
+                        ],
+                        exports: [CommonStripComponent]
+                    },] }
+        ];
+        return CommonStripModule;
+    }());
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var ConsumptionModule = /** @class */ (function () {
+        function ConsumptionModule() {
+        }
+        ConsumptionModule.decorators = [
+            { type: core.NgModule, args: [{
+                        declarations: [ConsumptionComponent],
+                        imports: [
+                            ContentStripWithTabsLibModule,
+                            SlidersLibModule
+                        ],
+                        exports: [ConsumptionComponent,
+                            ContentStripWithTabsLibModule,
+                            SlidersLibModule,
+                            DataPointsModule,
+                            CalenderModule,
+                            CommonStripModule
+                        ],
+                    },] }
+        ];
+        return ConsumptionModule;
+    }());
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    /** @type {?} */
+    var ROOT_WIDGET_CONFIG = {
+        card: {
+            _type: 'cardLib',
+            cardResource: 'cardContentLib'
+        },
+    };
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var NsCardContent$1;
+    (function (NsCardContent) {
+        /**
+         * @record
+         */
+        function ICard() { }
+        NsCardContent.ICard = ICard;
+        if (false) {
+            /** @type {?} */
+            ICard.prototype.content;
+            /** @type {?} */
+            ICard.prototype.cardSubType;
+            /** @type {?} */
+            ICard.prototype.context;
+            /** @type {?|undefined} */
+            ICard.prototype.intranetMode;
+            /** @type {?|undefined} */
+            ICard.prototype.deletedMode;
+            /** @type {?|undefined} */
+            ICard.prototype.likes;
+            /** @type {?|undefined} */
+            ICard.prototype.contentTags;
+            /** @type {?} */
+            ICard.prototype.stateData;
+            /** @type {?|undefined} */
+            ICard.prototype.cardCustomeClass;
+        }
+        /**
+         * @record
+         */
+        function IContentTags() { }
+        NsCardContent.IContentTags = IContentTags;
+        if (false) {
+            /** @type {?|undefined} */
+            IContentTags.prototype.daysSpan;
+            /** @type {?|undefined} */
+            IContentTags.prototype.excludeContentType;
+            /** @type {?|undefined} */
+            IContentTags.prototype.excludeMimeType;
+            /** @type {?} */
+            IContentTags.prototype.tag;
+            /** @type {?|undefined} */
+            IContentTags.prototype.criteriaField;
+        }
+        var EContentStatus;
+        (function (EContentStatus) {
+            EContentStatus["LIVE"] = "Live";
+            EContentStatus["EXPIRED"] = "Expired";
+            EContentStatus["DELETED"] = "Deleted";
+            EContentStatus["MARK_FOR_DELETION"] = "MarkedForDeletion";
+        })(EContentStatus = NsCardContent.EContentStatus || (NsCardContent.EContentStatus = {}));
+        var ACBPConst;
+        (function (ACBPConst) {
+            ACBPConst["UPCOMING"] = "upcoming";
+            ACBPConst["ALL"] = "All";
+            ACBPConst["OVERDUE"] = "overdue";
+            ACBPConst["SUCCESS"] = "success";
+        })(ACBPConst = NsCardContent.ACBPConst || (NsCardContent.ACBPConst = {}));
+        var IGOTConst;
+        (function (IGOTConst) {
+            IGOTConst["COMPETENCIES"] = "competencies_v5";
+            IGOTConst["RETIRED"] = "Retired";
+        })(IGOTConst = NsCardContent.IGOTConst || (NsCardContent.IGOTConst = {}));
+    })(NsCardContent$1 || (NsCardContent$1 = {}));
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var CardsComponent = /** @class */ (function (_super) {
+        __extends(CardsComponent, _super);
+        function CardsComponent(utilitySvc, configSvc, contSvc, router) {
+            var _this = _super.call(this) || this;
+            _this.utilitySvc = utilitySvc;
+            _this.configSvc = configSvc;
+            _this.contSvc = contSvc;
+            _this.router = router;
+            _this.isIntranetAllowedSettings = false;
+            return _this;
+        }
+        /**
+         * @return {?}
+         */
+        CardsComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+        function () {
+        };
+        Object.defineProperty(CardsComponent.prototype, "isLiveOrMarkForDeletion", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                if (!this.widgetData.content.status ||
+                    this.widgetData.content.status === 'Live' ||
+                    this.widgetData.content.status === 'MarkedForDeletion') {
+                    return true;
+                }
+                return false;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        Object.defineProperty(CardsComponent.prototype, "showIntranetContent", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                if (this.widgetData.content.isInIntranet && this.utilitySvc.isMobile) {
+                    return !this.isIntranetAllowedSettings;
+                }
+                return false;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        /**
+         * @param {?} content
+         * @return {?}
+         */
+        CardsComponent.prototype.getRedirectUrlData = /**
+         * @param {?} content
+         * @return {?}
+         */
+        function (content) {
+            return __awaiter(this, void 0, void 0, function () {
+                var urlData;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, this.contSvc.getResourseLink(content)];
+                        case 1:
+                            urlData = _a.sent();
+                            this.router.navigate([urlData.url], {
+                                queryParams: urlData.queryParams
+                            });
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        CardsComponent.decorators = [
+            { type: core.Component, args: [{
+                        selector: 'sb-uic-cards',
+                        template: "<div class=\"widget-card-content-new\">\n    <ng-container *ngIf=\"widgetData && (((widgetData?.deletedMode || 'none') === 'hide' && !!!isLiveOrMarkForDeletion)\n    ? false\n    : !((widgetData?.intranetMode || 'none') === 'hide' && !!showIntranetContent))\"\n      [ngSwitch]=\"( (widgetData && widgetData?.cardSubType) || 'cardPortraitLib')\">\n      <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'user-card'\" [ngTemplateOutlet]=\"cardUser\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib-skeleton'\" [ngTemplateOutlet]=\"cardPortraitLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib'\" [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib-skeleton'\" [ngTemplateOutlet]=\"cardLandscapeLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib'\" [ngTemplateOutlet]=\"cardLandscapeLib\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #cardPortraitLibSkeleton>\n  <sb-uic-card-portrait [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardPortraitLib>\n  <sb-uic-card-portrait [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardLandscapeLibSkeleton>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-landscape>\n</ng-template>\n<ng-template #cardLandscapeLib>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-landscape>\n</ng-template>\n\n\n  <ng-template #cardUser>\n    <sb-uic-card-user [widgetData]=\"widgetData\"></sb-uic-card-user>\n  </ng-template>\n",
+                        styles: [""]
+                    }] }
+        ];
+        /** @nocollapse */
+        CardsComponent.ctorParameters = function () { return [
+            { type: utilsV2.UtilityService },
+            { type: ConfigurationsService },
             { type: WidgetContentService },
             { type: router.Router }
         ]; };
@@ -7433,9 +8406,9 @@
             this.events.raiseInteractTelemetry({
                 type: 'click',
                 subType: this.widgetType + "-" + this.widgetSubType,
-                id: lodash.camelCase(this.widgetData.user.userId) + "-card",
+                id: lodash.camelCase(this.widgetData.content.userId) + "-card",
             }, {
-                id: this.widgetData.user.userId,
+                id: this.widgetData.content.userId,
                 // type: this.widgetData.user.primaryCategory,
                 //context: this.widgetData.context,
                 rollup: {},
@@ -7447,8 +8420,8 @@
         CardUserComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-card-user',
-                        template: "<mat-card class=\"card-users-container mr-5 padding-remove cursor-pointer\">\n    <div class=\"display-contents\">\n        <ng-container *ngIf=\"widgetData.user\">\n            <a (click)=\"raiseTelemetry();$event.stopPropagation()\" role=\"link\"\n                i18n-aria-label>\n                <ng-container>\n                    <mat-card-content class=\"min-top\">\n                        <div style=\"position: relative; z-index: 1;\">\n                            <ng-container *ngIf=\"widgetData.user.profileImage\">\n                                <img mat-card-image [src]=\"widgetData.user.profileImage\"\n                                    loading=\"lazy\" class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                                    [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.user.firstName\" />\n                            </ng-container>\n                            <ng-container *ngIf=\"!widgetData.user.profileImage\">\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.user.firstName\" />\n                                </ng-template>\n                            </ng-container>\n                        </div>\n                        <div class=\"padding-m\">\n                            <div class=\"user_widget flex margin-remove\">\n                            </div>\n                            <div [id]=\"'m-c-'+ widgetData.user?.userId\"\n                                class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n                                {{ widgetData?.user?.firstName }}\n                            </div>\n                            <div class=\"flex w-full flex-wrap flex-middle\">\n                                <p>\n                                    {{ widgetData?.user?.description }}\n                                </p>\n                            </div>\n                        </div>\n                    </mat-card-content>\n                </ng-container>\n            </a>\n        </ng-container>\n    </div>\n</mat-card>",
-                        styles: [".card-users-container{position:relative;width:268px;min-height:346px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px rgba(153,153,153,.2);overflow:hidden;height:346px;margin:20px 8px}.card-users-container .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-users-container ::ng-deep .mat-progress-bar{height:8px!important}.card-users-container .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-users-container .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)}.card-users-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-users-container .course_logo_box p{display:inline-block;vertical-align:top}.card-users-container .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-users-container .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #dedfe0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-users-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-users-container mat-card-content{background:#fff}.card-users-container .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;-o-object-fit:fill;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-users-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-users-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-users-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-users-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-users-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-users-container .basic{margin:auto 0}.card-users-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:2;-webkit-box-orient:vertical;min-height:48px}.card-users-container .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.duration-box{background:#000;position:absolute;border:none;display:flex;align-items:center;padding:4px;border-radius:4px}.duration-box.right-corner{right:4px;bottom:4px}.duration-box .mat-icon{vertical-align:middle;color:#fff!important;height:14px!important;width:14px!important;font-size:14px}.duration-box .duration{font:700 12px/16px Lato;display:inline-block;margin:0;padding:0}"]
+                        template: "<mat-card class=\"user-card card-users-container mr-5 padding-remove cursor-pointer\">\n    <div class=\"display-contents\">\n        <ng-container *ngIf=\"widgetData.content\">\n            <a (click)=\"raiseTelemetry();$event.stopPropagation()\" role=\"link\"\n                i18n-aria-label>\n                <ng-container>\n                    <mat-card-content class=\"min-top\">\n                        <div style=\"position: relative; z-index: 1;\">\n                            <ng-container *ngIf=\"widgetData.content.image\">\n                                <img mat-card-image [src]=\"widgetData.content.image\"\n                                    loading=\"lazy\" class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                                    [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\" />\n                            </ng-container>\n                            <ng-container *ngIf=\"!widgetData.content.image\">\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=\"padding-m\">\n                            <div class=\"user_widget flex margin-remove\">\n                            </div>\n                            <div [id]=\"'m-c-'+ widgetData.content?.userId\"\n                                class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n                                {{ widgetData?.content?.name }}\n                            </div>\n                            <div class=\"flex w-full flex-wrap flex-middle\">\n                                <p class=\"whitespace-normal description-text\">\n                                    {{ widgetData?.content?.description }}\n                                </p>\n                            </div>\n                        </div>\n                    </mat-card-content>\n                </ng-container>\n            </a>\n        </ng-container>\n    </div>\n</mat-card>",
+                        styles: [".card-users-container{position:relative;width:282px;min-height:281px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px rgba(153,153,153,.2);overflow:hidden;height:281px;margin:16px 8px}.card-users-container .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)}.card-users-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-users-container .course_logo_box p{display:inline-block;vertical-align:top}.card-users-container .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-users-container mat-card-content{background:#fff}.card-users-container .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;-o-object-fit:fill;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-users-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-users-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-users-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-users-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-users-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-users-container .basic{margin:auto 0}.card-users-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}.card-users-container .description-text{position:relative;overflow:hidden;height:63px;white-space:normal;text-overflow:ellipsis}.duration-box{background:#000;position:absolute;border:none;display:flex;align-items:center;padding:4px;border-radius:4px}.duration-box.right-corner{right:4px;bottom:4px}.duration-box .mat-icon{vertical-align:middle;color:#fff!important;height:14px!important;width:14px!important;font-size:14px}.duration-box .duration{font:700 12px/16px Lato;display:inline-block;margin:0;padding:0}"]
                     }] }
         ];
         /** @nocollapse */
@@ -8152,8 +9125,8 @@
         CompetencyPassbookComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-competency-passbook',
-                        template: " <div class=\"competency-title\">{{objectData?.title}} \n    <span class=\"competency-count\">\n        ({{competencyStrength}})\n    </span>\n</div>\n<div class=\"flex items-center justify-center gap-8 mt-5 mb-5 competency-filters\">\n    <sb-uic-pills [pillsData]=\"competencyArea\" \n    [isLoading]=\"loadCompetencyArea\" (pillClick)=\"competencyChange($event)\" [selectedValue]=\"selectedValue\"></sb-uic-pills>\n</div>\n<div class=\"grid grid-cols-1 md:grid-cols-3 w-full grid-flow-row gap-5\" *ngIf=\"!loadCometency\">\n    <div *ngFor=\"let obj of competencyTheme| slice:0:competencyThemeLength\">\n        <div class=\"flex-1 flex-col\">\n            <div class=\"competency-theme\"></div>\n            <div class=\"details flex flex-col\">\n                <div class=\"flex flex-col p-4\">\n                    <div class=\"flex flex-row cursor-pointer\">\n                        <div class=\"flex flex-row gap-2 items-center\">\n                            <div class=\"name\">{{allcompetencyTheme[obj?.name]?.name}}</div>\n                            <!-- <div class=\"flex items-baseline\">\n                                <img src=\"assets/icons/competency/cp-arrow.svg\" class=\"arrow-img cursor-pointer\" alt=\"cp arrow img\" (click)=\"navigateToCompetency(obj)\" />\n                            </div> -->\n                        </div>\n                    </div>\n                    <div class=\"flex flex-row pt-3 pb-3 description\">\n                        {{ allcompetencyTheme[obj.name]?.description }} \n                    </div>\n                    <div class=\"flex flex-row gap-3 items-center\">\n                        <mat-icon class=\"content-icon\">school</mat-icon>\n                        <div class=\"no-of-contents\">{{obj.count}} Contents</div>\n                    </div>\n                    <div class=\"line mt-3 mt-2\"></div>\n                    <div class=\"flex flex-wrap gap-3 pt-4 chip-container\">\n                        <ng-container *ngFor=\"let child of allcompetencyTheme[obj.name]?.children| slice:0: allcompetencyTheme[obj.name]?.viewMore ? allcompetencyTheme[obj.name]?.children?.length : 3; let i = index\">\n                            <div class=\"chip rounded-full p-2 text-xs chip-ellipsis\" [title]=\"child?.name\" >\n                                {{ child.name }}\n                            </div>\n                        </ng-container>\n                        <div class=\"p-2 info-btn cursor-pointer\"\n                            *ngIf=\"allcompetencyTheme[obj.name]?.children.length > 3 && !allcompetencyTheme[obj.name]?.viewMore\" (click)=\"viewMoreChildren(allcompetencyTheme[obj.name])\">\n                            View more\n                        </div>\n                        <div class=\"p-2 info-btn cursor-pointer\"\n                            *ngIf=\"allcompetencyTheme[obj.name]?.children.length > 3 && allcompetencyTheme[obj.name]?.viewMore\" (click)=\"viewMoreChildren(allcompetencyTheme[obj.name])\">\n                            View less\n                        </div>\n                    </div>\n                </div>        \n            </div>\n        </div>\n    </div>\n</div>\n<ng-container *ngIf=\"competencyTheme.length > 6 && !loadCometency\">\n    <div class=\"flex items-center justify-center gap-8 mt-5 mb-5 competency-filters\">\n        <sb-uic-pills [pillsData]=\"showAllTheme\" (pillClick)=\"displayAllTheme($event)\"></sb-uic-pills>\n    </div>\n</ng-container> \n\n<ng-container *ngIf=\"loadCometency\">\n\n<div class=\"grid grid-cols-1 md:grid-cols-3 w-full grid-flow-row gap-5\">\n    <div *ngFor=\"let obj of [0,1,2,3,4,5]\">\n        <div class=\"flex-1 flex-col\">\n            <div class=\"competency-theme\"></div>\n            <div class=\"details flex flex-col\">\n                <div class=\"flex flex-col p-4\">\n                    <div class=\"flex flex-row cursor-pointer\">\n                        <div class=\"flex flex-row gap-2 items-center w-full\">\n                            <div class=\"name w-full\">\n                                <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded mb-2'\" [width]=\"'100%'\"\n                                [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                                <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded'\" [width]=\"'80%'\"\n                                [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"pt-3 pb-3 description\">\n                        <sb-uic-skeleton-loader class=\"w-full\" [bindingClass]=\"'flex rounded mb-2'\" [width]=\"'100%'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                        <sb-uic-skeleton-loader class=\"w-full\" [bindingClass]=\"'flex rounded'\" [width]=\"'80%'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                    </div>\n                    <div class=\"flex flex-row gap-3 items-center\">\n                        <mat-icon class=\"content-icon\"><sb-uic-skeleton-loader  [bindingClass]=\"'flex rounded mb-2'\" [width]=\"'24px'\"\n                            [height]=\"'24px'\"></sb-uic-skeleton-loader></mat-icon>\n                        <div class=\"no-of-contents\"><sb-uic-skeleton-loader  [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                            [height]=\"'24px'\"></sb-uic-skeleton-loader></div>\n                    </div>\n                    <div class=\"line mt-3 mt-2\"></div>\n                    <div class=\"flex flex-wrap gap-3 pt-4 chip-container\">\n                        <sb-uic-skeleton-loader class=\"w-2/5\" [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                        <sb-uic-skeleton-loader class=\"w-2/5\"  [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                        <sb-uic-skeleton-loader class=\"w-2/5\" [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                    </div>\n                </div>        \n            </div>\n        </div>\n    </div>\n</div>\n</ng-container>",
-                        styles: [".competencies-backgroud{background-color:#1b2133}.competency-title{font-family:Montserrat;font-size:16px;font-weight:600;line-height:19.5px;text-align:left;color:#fff}.competency-count{color:#f3962f}.filter-button{padding:12px 16px;border-radius:50px;border:1px solid #fff;font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;background-color:transparent;color:#fff;cursor:pointer}.filter-button.active{background:#1b4ca1}.banner-metrics{background:linear-gradient(180deg,#f9cb97 -107.59%,#ef951e 110.74%)}.infra-background{background:#1b4ca1}.competency-theme{height:16px;border-top-left-radius:12px;border-top-right-radius:12px;background-color:#f8b861}.details{background-color:#fff;border-radius:12px;position:relative;top:-8px;min-height:278px}.name{font-family:Montserrat;font-size:16px;font-weight:600;line-height:19.5px;text-align:left}.description{font-family:Lato;font-size:14px;font-weight:400;line-height:16.8px;text-align:left;height:42px;display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.no-of-contents{font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;color:#1b4ca1}.content-icon{color:#1b4ca1}.line{border-top:1px solid #e2dddd}.chip{padding:8px 16px;gap:8px;border-radius:50px;border:1px solid #1b4ca1;color:#1b4ca1;font-family:Lato;font-size:14px;font-weight:700;text-align:center}.chip-ellipsis{white-space:nowrap;max-width:110px;overflow:hidden;text-overflow:ellipsis}.info-btn{font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;opacity:.7;padding:12px 5px}.hide{display:none}.behavioral{background-color:#f8b861}.functional{background-color:#e24577}.domain{background-color:#7b47a4}"]
+                        template: " <div class=\"competency-title\">{{objectData?.title}} \n    <span class=\"competency-count\">\n        ({{competencyStrength}})\n    </span>\n</div>\n<div class=\"flex items-center justify-center gap-8 mt-5 mb-5 competency-filters\">\n    <sb-uic-pills [pillsData]=\"competencyArea\" \n    [isLoading]=\"loadCompetencyArea\" (pillClick)=\"competencyChange($event)\" [selectedValue]=\"selectedValue\"></sb-uic-pills>\n</div>\n<div class=\"grid grid-cols-1 md:grid-cols-3 w-full grid-flow-row gap-5\" *ngIf=\"!loadCometency\">\n    <div class=\"competency-card\" *ngFor=\"let obj of competencyTheme| slice:0:competencyThemeLength\">\n        <div class=\"flex-1 flex-col\">\n            <div class=\"competency-theme\"></div>\n            <div class=\"details flex flex-col\">\n                <div class=\"flex flex-col p-4\">\n                    <div class=\"flex flex-row cursor-pointer\">\n                        <div class=\"flex flex-row gap-2 items-center\">\n                            <div class=\"name\">{{allcompetencyTheme[obj?.name]?.name}}</div>\n                            <!-- <div class=\"flex items-baseline\">\n                                <img src=\"assets/icons/competency/cp-arrow.svg\" class=\"arrow-img cursor-pointer\" alt=\"cp arrow img\" (click)=\"navigateToCompetency(obj)\" />\n                            </div> -->\n                        </div>\n                    </div>\n                    <div class=\"flex flex-row pt-3 pb-3 description\">\n                        {{ allcompetencyTheme[obj.name]?.description }} \n                    </div>\n                    <div class=\"flex flex-row gap-3 items-center\">\n                        <mat-icon class=\"content-icon\">school</mat-icon>\n                        <div class=\"no-of-contents\">{{obj.count}} Contents</div>\n                    </div>\n                    <div class=\"line mt-3 mt-2\"></div>\n                    <div class=\"flex flex-wrap gap-3 pt-4 chip-container\">\n                        <ng-container *ngFor=\"let child of allcompetencyTheme[obj.name]?.children| slice:0: allcompetencyTheme[obj.name]?.viewMore ? allcompetencyTheme[obj.name]?.children?.length : 3; let i = index\">\n                            <div class=\"chip rounded-full p-2 text-xs chip-ellipsis\" [title]=\"child?.name\" >\n                                {{ child.name }}\n                            </div>\n                        </ng-container>\n                        <div class=\"p-2 info-btn cursor-pointer\"\n                            *ngIf=\"allcompetencyTheme[obj.name]?.children.length > 3 && !allcompetencyTheme[obj.name]?.viewMore\" (click)=\"viewMoreChildren(allcompetencyTheme[obj.name])\">\n                            View more\n                        </div>\n                        <div class=\"p-2 info-btn cursor-pointer\"\n                            *ngIf=\"allcompetencyTheme[obj.name]?.children.length > 3 && allcompetencyTheme[obj.name]?.viewMore\" (click)=\"viewMoreChildren(allcompetencyTheme[obj.name])\">\n                            View less\n                        </div>\n                    </div>\n                </div>        \n            </div>\n        </div>\n    </div>\n</div>\n<ng-container *ngIf=\"competencyTheme.length > 6 && !loadCometency\">\n    <div class=\"flex items-center justify-center gap-8 mt-5 mb-5 competency-filters\">\n        <sb-uic-pills [pillsData]=\"showAllTheme\" (pillClick)=\"displayAllTheme($event)\"></sb-uic-pills>\n    </div>\n</ng-container> \n\n<ng-container *ngIf=\"loadCometency\">\n\n<div class=\"grid grid-cols-1 md:grid-cols-3 w-full grid-flow-row gap-5\">\n    <div *ngFor=\"let obj of [0,1,2,3,4,5]\">\n        <div class=\"flex-1 flex-col\">\n            <div class=\"competency-theme\"></div>\n            <div class=\"details flex flex-col\">\n                <div class=\"flex flex-col p-4\">\n                    <div class=\"flex flex-row cursor-pointer\">\n                        <div class=\"flex flex-row gap-2 items-center w-full\">\n                            <div class=\"name w-full\">\n                                <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded mb-2'\" [width]=\"'100%'\"\n                                [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                                <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded'\" [width]=\"'80%'\"\n                                [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"pt-3 pb-3 description\">\n                        <sb-uic-skeleton-loader class=\"w-full\" [bindingClass]=\"'flex rounded mb-2'\" [width]=\"'100%'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                        <sb-uic-skeleton-loader class=\"w-full\" [bindingClass]=\"'flex rounded'\" [width]=\"'80%'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                    </div>\n                    <div class=\"flex flex-row gap-3 items-center\">\n                        <mat-icon class=\"content-icon\"><sb-uic-skeleton-loader  [bindingClass]=\"'flex rounded mb-2'\" [width]=\"'24px'\"\n                            [height]=\"'24px'\"></sb-uic-skeleton-loader></mat-icon>\n                        <div class=\"no-of-contents\"><sb-uic-skeleton-loader  [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                            [height]=\"'24px'\"></sb-uic-skeleton-loader></div>\n                    </div>\n                    <div class=\"line mt-3 mt-2\"></div>\n                    <div class=\"flex flex-wrap gap-3 pt-4 chip-container\">\n                        <sb-uic-skeleton-loader class=\"w-2/5\" [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                        <sb-uic-skeleton-loader class=\"w-2/5\"  [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                        <sb-uic-skeleton-loader class=\"w-2/5\" [bindingClass]=\"'flex rounded '\" [width]=\"'100px'\"\n                        [height]=\"'24px'\"></sb-uic-skeleton-loader>\n                    </div>\n                </div>        \n            </div>\n        </div>\n    </div>\n</div>\n</ng-container>",
+                        styles: [".competencies-backgroud{background-color:#1b2133}.competency-title{font-family:Montserrat;font-size:16px;font-weight:600;line-height:19.5px;text-align:left;color:#fff}.competency-count{color:#f3962f}.filter-button{padding:12px 16px;border-radius:50px;border:1px solid #fff;font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;background-color:transparent;color:#fff;cursor:pointer}.filter-button.active{background:#1b4ca1}.banner-metrics{background:linear-gradient(180deg,#f9cb97 -107.59%,#ef951e 110.74%)}.infra-background{background:#1b4ca1}.competency-theme{height:16px;border-top-left-radius:12px;border-top-right-radius:12px;background-color:#f8b861}.details{background-color:#fff;border-radius:12px;position:relative;top:-8px;min-height:278px}.name{font-family:Montserrat;font-size:16px;font-weight:600;line-height:19.5px;text-align:left}.description{font-family:Lato;font-size:14px;font-weight:400;line-height:16.8px;text-align:left;height:42px;display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.no-of-contents{font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;color:#1b4ca1}.content-icon{color:#1b4ca1}.line{border-top:1px solid #e2dddd}.chip{padding:8px 16px;gap:8px;border-radius:50px;border:1px solid #1b4ca1;color:#1b4ca1;font-family:Lato;font-size:14px;font-weight:700;text-align:center}.chip-ellipsis{white-space:nowrap;max-width:110px;overflow:hidden;text-overflow:ellipsis}.info-btn{font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;opacity:.7;padding:12px 5px}.hide{display:none}.behavioral{background-color:#f8b861}.functional{background-color:#e24577}.domain{background-color:#7b47a4}.competency-card{z-index:999}"]
                     }] }
         ];
         /** @nocollapse */
@@ -8238,7 +9211,7 @@
         PillsComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-pills',
-                        template: "<ng-container *ngIf=\"!isLoading\">\n    <mat-chip-list >\n        <ng-container *ngFor=\"let pill of pillsData\">\n            <mat-chip class=\"competency-chip\" (click)=\"selectedPill(pill)\" \n            [ngClass]=\"{'active': selectedValue === pill?.name}\">\n                <span class=\"pill-name\">{{pill?.name | titlecase}} <span>{{pill?.count}}</span></span>\n            </mat-chip>\n        </ng-container>\n    </mat-chip-list>\n</ng-container>\n<ng-container *ngIf=\"isLoading\">\n    <div class=\"flex gap-4\">\n        <ng-container *ngFor=\"let pill of [0,1,2]\">\n            <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded'\" [width]=\"'100px'\"\n            [height]=\"'24px'\"></sb-uic-skeleton-loader>\n        </ng-container>\n    </div>\n</ng-container>\n",
+                        template: "<ng-container *ngIf=\"!isLoading\">\n    <mat-chip-list >\n        <ng-container *ngFor=\"let pill of pillsData\">\n            <mat-chip class=\"competency-chip\" (click)=\"selectedPill(pill)\" \n            [ngClass]=\"{'active': selectedValue === pill?.name}\">\n                <span class=\"pill-name\">{{pill?.name | titlecase}} <span *ngIf=\"pill?.count\">({{pill?.count}})</span></span>\n            </mat-chip>\n        </ng-container>\n    </mat-chip-list>\n</ng-container>\n<ng-container *ngIf=\"isLoading\">\n    <div class=\"flex gap-4\">\n        <ng-container *ngFor=\"let pill of [0,1,2]\">\n            <sb-uic-skeleton-loader [bindingClass]=\"'flex rounded'\" [width]=\"'100px'\"\n            [height]=\"'24px'\"></sb-uic-skeleton-loader>\n        </ng-container>\n    </div>\n</ng-container>\n",
                         styles: [".competency-chip{padding:12px 16px;border-radius:50px;border:1px solid #fff;font-family:Lato;font-size:14px;font-weight:700;line-height:16.8px;text-align:center;background-color:transparent!important;cursor:pointer}.competency-chip .pill-name{color:#fff!important}.active{background-color:#1b4ca1!important}"]
                     }] }
         ];
@@ -8308,77 +9281,10 @@
         return CompetencyPassbookModule;
     }());
 
-    /**
-     * @fileoverview added by tsickle
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var CommonMethodsService = /** @class */ (function () {
-        function CommonMethodsService() {
-        }
-        /**
-         * @param {?} contents
-         * @param {?} strip
-         * @return {?}
-         */
-        CommonMethodsService.prototype.transformContentsToWidgets = /**
-         * @param {?} contents
-         * @param {?} strip
-         * @return {?}
-         */
-        function (contents, strip) {
-            return (contents || []).map((/**
-             * @param {?} content
-             * @param {?} idx
-             * @return {?}
-             */
-            function (content, idx) { return (content ? {
-                widgetType: 'cardLib',
-                widgetSubType: 'cardContentLib',
-                widgetHostClass: 'mb-2',
-                widgetData: __assign({ content: content }, (content.batch && { batch: content.batch }), { cardSubType: strip.stripConfig && strip.stripConfig.cardSubType, cardCustomeClass: strip.customeClass ? strip.customeClass : '', context: { pageSection: strip.key, position: idx }, intranetMode: strip.stripConfig && strip.stripConfig.intranetMode, deletedMode: strip.stripConfig && strip.stripConfig.deletedMode, contentTags: strip.stripConfig && strip.stripConfig.contentTags }),
-            } : {
-                widgetType: 'card',
-                widgetSubType: 'cardContent',
-                widgetHostClass: 'mb-2',
-                widgetData: {},
-            }); }));
-        };
-        /**
-         * @param {?} strip
-         * @return {?}
-         */
-        CommonMethodsService.prototype.transformSkeletonToWidgets = /**
-         * @param {?} strip
-         * @return {?}
-         */
-        function (strip) {
-            return [1, 2, 3, 4, 5, 6, 7, 7, 8, 9, 10].map((/**
-             * @param {?} _content
-             * @return {?}
-             */
-            function (_content) { return ({
-                widgetType: 'cardLib',
-                widgetSubType: 'cardContentLib',
-                widgetHostClass: 'mb-2',
-                widgetData: {
-                    cardSubType: strip.loaderConfig && strip.loaderConfig.cardSubType || 'card-standard-skeleton',
-                    cardCustomeClass: strip.customeClass ? strip.customeClass : '',
-                },
-            }); }));
-        };
-        CommonMethodsService.decorators = [
-            { type: core.Injectable, args: [{
-                        providedIn: 'root'
-                    },] }
-        ];
-        /** @nocollapse */
-        CommonMethodsService.ctorParameters = function () { return []; };
-        /** @nocollapse */ CommonMethodsService.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function CommonMethodsService_Factory() { return new CommonMethodsService(); }, token: CommonMethodsService, providedIn: "root" });
-        return CommonMethodsService;
-    }());
-
+    exports.CalenderModule = CalenderModule;
     exports.CardsModule = CardsModule;
     exports.CommonMethodsService = CommonMethodsService;
+    exports.CommonStripModule = CommonStripModule;
     exports.CompetencyPassbookModule = CompetencyPassbookModule;
     exports.ConsumptionComponent = ConsumptionComponent;
     exports.ConsumptionModule = ConsumptionModule;
@@ -8393,13 +9299,15 @@
     exports.WIDGET_REGISTRATION_LIB_CONFIG = WIDGET_REGISTRATION_LIB_CONFIG;
     exports.ɵa = ContentStripWithTabsLibComponent;
     exports.ɵb = WidgetContentService;
-    exports.ɵba = DefaultThumbnailDirective;
-    exports.ɵbb = PipeDurationTransformModule;
-    exports.ɵbc = PipeDurationTransformPipe;
-    exports.ɵbd = CompetencyPassbookComponent;
-    exports.ɵbe = CompetencyPassbookService;
-    exports.ɵbf = PillsModule;
-    exports.ɵbg = PillsComponent;
+    exports.ɵba = DisplayContentTypeLibComponent;
+    exports.ɵbb = DefaultThumbnailModule;
+    exports.ɵbc = DefaultThumbnailDirective;
+    exports.ɵbd = PipeDurationTransformModule;
+    exports.ɵbe = PipeDurationTransformPipe;
+    exports.ɵbf = CompetencyPassbookComponent;
+    exports.ɵbg = CompetencyPassbookService;
+    exports.ɵbh = PillsModule;
+    exports.ɵbi = PillsComponent;
     exports.ɵc = WidgetUserService;
     exports.ɵd = MultilingualTranslationsService;
     exports.ɵe = ConfigurationsService;
@@ -8414,16 +9322,16 @@
     exports.ɵn = InsiteDataService;
     exports.ɵo = SkeletonLoaderLibModule;
     exports.ɵp = SkeletonLoaderLibComponent;
-    exports.ɵq = CardResourceComponent;
-    exports.ɵr = CardsComponent;
-    exports.ɵs = CardPortraitComponent;
-    exports.ɵt = CardUserComponent;
-    exports.ɵu = CardLandscapeComponent;
-    exports.ɵv = PipePublicURLModule;
-    exports.ɵw = PipePublicURL;
-    exports.ɵx = DisplayContentTypeLibModule;
-    exports.ɵy = DisplayContentTypeLibComponent;
-    exports.ɵz = DefaultThumbnailModule;
+    exports.ɵq = CalenderComponent;
+    exports.ɵr = CommonStripComponent;
+    exports.ɵs = CardResourceComponent;
+    exports.ɵt = CardsComponent;
+    exports.ɵu = CardPortraitComponent;
+    exports.ɵv = CardUserComponent;
+    exports.ɵw = CardLandscapeComponent;
+    exports.ɵx = PipePublicURLModule;
+    exports.ɵy = PipePublicURL;
+    exports.ɵz = DisplayContentTypeLibModule;
 
     Object.defineProperty(exports, '__esModule', { value: true });