@sunbird-cb/consumption 0.0.35 → 0.0.37

package/fesm2015/sunbird-cb-consumption.js

@@ -3706,6 +3706,7 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
         this.fetchAllBookMarkData(strip, calculateParentStatus);
         this.fetchAllPlaylistSearch(strip, calculateParentStatus);
         this.fetchPlaylistReadData(strip, calculateParentStatus);
+        this.fetchCiosContentData(strip, calculateParentStatus);
         // this.enrollInterval = setInterval(() => {
         //   this.fetchAllCbpPlans(strip, calculateParentStatus)
         // },                                1000)
@@ -4346,7 +4347,8 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
                 (strip.request.featureContent && Object.keys(strip.request.featureContent).length) ||
                 (strip.request.bookmarkRead && Object.keys(strip.request.bookmarkRead).length) ||
                 (strip.request.playlistSearch && Object.keys(strip.request.playlistSearch).length) ||
-                (strip.request.playlistRead && Object.keys(strip.request.playlistRead).length))) {
+                (strip.request.playlistRead && Object.keys(strip.request.playlistRead).length) ||
+                (strip.request.ciosContent && Object.keys(strip.request.ciosContent).length))) {
             return true;
         }
         return false;
@@ -4855,8 +4857,6 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
      */
     postRequestMethod(strip, request, apiUrl, calculateParentStatus) {
         return __awaiter(this, void 0, void 0, function* () {
-            /** @type {?} */
-            const originalFilters = [];
             return new Promise((/**
              * @param {?} resolve
              * @param {?} reject
@@ -4869,25 +4869,53 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
                      * @return {?}
                      */
                     results => {
-                        /** @type {?} */
-                        const showViewMore = Boolean(results.result.content && results.result.content.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
-                        /** @type {?} */
-                        const viewMoreUrl = showViewMore
-                            ? {
+                        debugger;
+                        if (results.result && results.result.content) {
+                            /** @type {?} */
+                            const showViewMore = Boolean(results.result.content && results.result.content.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                            /** @type {?} */
+                            const viewMoreUrl = showViewMore
+                                ? {
+                                    path: strip.viewMoreUrl && strip.viewMoreUrl.path || '',
+                                    queryParams: {
+                                        tab: 'Learn',
+                                        q: strip.viewMoreUrl && strip.viewMoreUrl.queryParams,
+                                        f: {},
+                                    },
+                                }
+                                : null;
+                            resolve({ results, viewMoreUrl });
+                        }
+                        else if (results && results.data) {
+                            /** @type {?} */
+                            const showViewMore = Boolean(results.data && results.data.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                            /** @type {?} */
+                            const viewMoreUrl = showViewMore ? {
                                 path: strip.viewMoreUrl && strip.viewMoreUrl.path || '',
                                 queryParams: {
                                     tab: 'Learn',
                                     q: strip.viewMoreUrl && strip.viewMoreUrl.queryParams,
-                                    f: request &&
-                                        request.searchV6 &&
-                                        request.searchV6.request &&
-                                        request.searchV6.request.filters
-                                        ? JSON.stringify(this.transformSearchV6FiltersV2(originalFilters))
-                                        : {},
+                                    f: {},
                                 },
                             }
-                            : null;
-                        resolve({ results, viewMoreUrl });
+                                : null;
+                            resolve({ results, viewMoreUrl });
+                        }
+                        else if (results.result && results.result.data) {
+                            /** @type {?} */
+                            const showViewMore = Boolean(results.data && results.result.data && results.result.data.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                            /** @type {?} */
+                            const viewMoreUrl = showViewMore ? {
+                                path: strip.viewMoreUrl && strip.viewMoreUrl.path || '',
+                                queryParams: {
+                                    tab: 'Learn',
+                                    q: strip.viewMoreUrl && strip.viewMoreUrl.queryParams,
+                                    f: {},
+                                },
+                            }
+                                : null;
+                            resolve({ results, viewMoreUrl });
+                        }
                     }), (/**
                      * @param {?} error
                      * @return {?}
@@ -4923,7 +4951,6 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
                      * @return {?}
                      */
                     results => {
-                        console.log(results, 'results=========');
                         /** @type {?} */
                         const showViewMore = Boolean(results.result.data && results.result.data.orgList.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
                         /** @type {?} */
@@ -5005,7 +5032,6 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
                 try {
                     /** @type {?} */
                     const response = yield this.getRequestMethod(strip, strip.request.bookmarkRead, strip.request.apiUrl, calculateParentStatus);
-                    console.log('calling  after - response, ', response);
                     /** @type {?} */
                     let content = response.results.result.data.orgList;
                     if (response) {
@@ -5128,7 +5154,6 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
                 try {
                     /** @type {?} */
                     const response = yield this.getRequestMethod(strip, strip.request.playlistRead, strip.request.apiUrl, calculateParentStatus);
-                    console.log('calling  after - response, ', response);
                     if (response && response.results.result.content) {
                         /** @type {?} */
                         let content = response.results.result.content;
@@ -5147,6 +5172,56 @@ class ContentStripWithTabsLibComponent extends WidgetBaseComponent {
             }
         });
     }
+    /**
+     * @param {?} strip
+     * @param {?=} calculateParentStatus
+     * @return {?}
+     */
+    fetchCiosContentData(strip, calculateParentStatus = true) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (strip.request && strip.request.ciosContent && Object.keys(strip.request.ciosContent).length) {
+                /** @type {?} */
+                let originalFilters = [];
+                if (strip.request &&
+                    strip.request.ciosContent &&
+                    strip.request.ciosContent.filterCriteriaMap) {
+                    originalFilters = strip.request.ciosContent.filterCriteriaMap;
+                    strip.request.ciosContent.filterCriteriaMap = this.postMethodFilters(strip.request.ciosContent.filterCriteriaMap);
+                }
+                try {
+                    /** @type {?} */
+                    const response = yield this.postRequestMethod(strip, strip.request.ciosContent, strip.request.apiUrl, calculateParentStatus);
+                    // console.log('calling  after - response, ', response)
+                    if (response && response.results) {
+                        // console.log('calling  after-- ')
+                        if (response.results.data && response.results.data.length) {
+                            /** @type {?} */
+                            let extContentData = response.results.data;
+                            if (extContentData.length) {
+                                this.processStrip(strip, this.transformContentsToWidgets(extContentData, strip), 'done', calculateParentStatus, response.viewMoreUrl);
+                            }
+                            else {
+                                this.emptyResponse.emit(true);
+                            }
+                        }
+                        else {
+                            this.processStrip(strip, [], 'error', calculateParentStatus, null);
+                            this.emptyResponse.emit(true);
+                        }
+                    }
+                    else {
+                        this.processStrip(strip, [], 'error', calculateParentStatus, null);
+                        this.emptyResponse.emit(true);
+                    }
+                }
+                catch (error) {
+                    this.emptyResponse.emit(true);
+                    // Handle errors
+                    // console.error('Error:', error);
+                }
+            }
+        });
+    }
 }
 ContentStripWithTabsLibComponent.decorators = [
     { type: Component, args: [{
@@ -6473,6 +6548,30 @@ class CommonMethodsService {
             },
         })));
     }
+    /**
+     * @param {?} str
+     * @param {?=} type
+     * @return {?}
+     */
+    handleCapitalize(str, type) {
+        /** @type {?} */
+        let returnValue = '';
+        if (str) {
+            if (type === 'name') {
+                returnValue = str.split(' ').map((/**
+                 * @param {?} _str
+                 * @return {?}
+                 */
+                _str => {
+                    return _str.charAt(0).toUpperCase() + _str.slice(1);
+                })).join(' ');
+            }
+            else {
+                returnValue = str && (str.charAt(0).toUpperCase() + str.slice(1));
+            }
+        }
+        return returnValue;
+    }
 }
 CommonMethodsService.decorators = [
     { type: Injectable, args: [{
@@ -7480,10 +7579,28 @@ class CardsComponent extends WidgetBaseComponent {
     getRedirectUrlData(content) {
         return __awaiter(this, void 0, void 0, function* () {
             /** @type {?} */
-            let urlData = yield this.contSvc.getResourseLink(content);
-            this.router.navigate([urlData.url], {
-                queryParams: urlData.queryParams
-            });
+            const userProfile = this.configSvc.userProfile;
+            if (content.externalId) {
+                /** @type {?} */
+                let extUrl = content.redirectUrl.replace('<username>', userProfile.userId)
+                // const url = this.router.serializeUrl(
+                //   this.router.createUrlTree([extUrl])
+                // );
+                ;
+                // const url = this.router.serializeUrl(
+                //   this.router.createUrlTree([extUrl])
+                // );
+                this.router.navigate([`app/toc/ext/${content.contentId}`]);
+                // window.open(extUrl, '_blank');
+                // window.open(content.redirectUrl)
+            }
+            else {
+                /** @type {?} */
+                let urlData = yield this.contSvc.getResourseLink(content);
+                this.router.navigate([urlData.url], {
+                    queryParams: urlData.queryParams
+                });
+            }
         });
     }
     /**
@@ -7520,14 +7637,14 @@ class CardsComponent extends WidgetBaseComponent {
 CardsComponent.decorators = [
     { type: 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 *ngSwitchCase=\"'card-wide-lib-skeleton'\" [ngTemplateOutlet]=\"cardWideLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-lib'\" [ngTemplateOutlet]=\"cardWideLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2'\" [ngTemplateOutlet]=\"cardWideV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2-skeleton'\" [ngTemplateOutlet]=\"cardWideV2Skeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib'\" [ngTemplateOutlet]=\"cardMdo\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib-skeleton'\" [ngTemplateOutlet]=\"cardMdoSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib'\" [ngTemplateOutlet]=\"cardKarmaProgram\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgram\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></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 \n  [cbPlanMapData]=\"cbPlanMapData\"\n  (contentData)=\"getRedirectUrlData($event)\" [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardLandscapeLibSkeleton>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" \n  [cbPlanMapData]=\"cbPlanMapData\" [isCardLoading]=\"true\"></sb-uic-card-landscape>\n</ng-template>\n<ng-template #cardLandscapeLib>\n  <sb-uic-card-landscape\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [widgetData]=\"widgetData\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\">\n  </sb-uic-card-landscape>\n</ng-template>\n\n<ng-template #cardWideLib>\n  <sb-uic-card-wide (contentData)=\"getRedirectUrlData($event)\"  [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n<ng-template #cardWideLibSkeleton>\n  <sb-uic-card-wide [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n\n<ng-template #cardWideV2Skeleton>\n  <sb-uic-card-wide-v2 [widgetData]=\"widgetData\" [isCardLoading]=\"true\" ></sb-uic-card-wide-v2>\n</ng-template>\n<ng-template #cardWideV2>\n  <sb-uic-card-wide-v2\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\"\n    [widgetData]=\"widgetData\">\n  </sb-uic-card-wide-v2>\n</ng-template>\n\n<ng-template #cardUser>\n  <sb-uic-card-user [widgetData]=\"widgetData\"></sb-uic-card-user>\n</ng-template>\n<ng-template #cardMdo>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardMdoSkeleton>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardKarmaProgram>\n  <sb-uic-card-karma-programs [randomColorApply]=\"true\" [widgetData]=\"widgetData\"></sb-uic-card-karma-programs>\n</ng-template>\n<ng-template #cardKarmaProgramV2>\n  <!-- <sb-uic-card-karma-programs-v2 [widgetData]=\"widgetData\"><sb-uic-card-karma-programs-v2> -->\n</ng-template>",
+                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 *ngSwitchCase=\"'card-wide-lib-skeleton'\" [ngTemplateOutlet]=\"cardWideLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-lib'\" [ngTemplateOutlet]=\"cardWideLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2'\" [ngTemplateOutlet]=\"cardWideV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2-skeleton'\" [ngTemplateOutlet]=\"cardWideV2Skeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib'\" [ngTemplateOutlet]=\"cardMdo\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib-skeleton'\" [ngTemplateOutlet]=\"cardMdoSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib'\" [ngTemplateOutlet]=\"cardKarmaProgram\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgramSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-ext-lib-skeleton'\" [ngTemplateOutlet]=\"cardPortraitExtLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-ext-lib'\" [ngTemplateOutlet]=\"cardPortraitExtLib\"></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 \n  [cbPlanMapData]=\"cbPlanMapData\"\n  (contentData)=\"getRedirectUrlData($event)\" [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardLandscapeLibSkeleton>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" \n  [cbPlanMapData]=\"cbPlanMapData\" [isCardLoading]=\"true\"></sb-uic-card-landscape>\n</ng-template>\n<ng-template #cardLandscapeLib>\n  <sb-uic-card-landscape\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [widgetData]=\"widgetData\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\">\n  </sb-uic-card-landscape>\n</ng-template>\n\n<ng-template #cardWideLib>\n  <sb-uic-card-wide (contentData)=\"getRedirectUrlData($event)\"  [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n<ng-template #cardWideLibSkeleton>\n  <sb-uic-card-wide [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n\n<ng-template #cardWideV2Skeleton>\n  <sb-uic-card-wide-v2 [widgetData]=\"widgetData\" [isCardLoading]=\"true\" ></sb-uic-card-wide-v2>\n</ng-template>\n<ng-template #cardWideV2>\n  <sb-uic-card-wide-v2\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\"\n    [widgetData]=\"widgetData\">\n  </sb-uic-card-wide-v2>\n</ng-template>\n\n<ng-template #cardUser>\n  <sb-uic-card-user [widgetData]=\"widgetData\"></sb-uic-card-user>\n</ng-template>\n<ng-template #cardMdo>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardMdoSkeleton>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardKarmaProgramSkeleton>\n  <sb-uic-card-karma-programs [randomColorApply]=\"true\" \n  [isCardLoading]=\"true\" [widgetData]=\"widgetData\"></sb-uic-card-karma-programs>\n</ng-template>\n<ng-template #cardKarmaProgram>\n  <sb-uic-card-karma-programs [randomColorApply]=\"true\" \n  [isCardLoading]=\"false\" [widgetData]=\"widgetData\"></sb-uic-card-karma-programs>\n</ng-template>\n<ng-template #cardKarmaProgramV2>\n  <!-- <sb-uic-card-karma-programs-v2 [widgetData]=\"widgetData\"><sb-uic-card-karma-programs-v2> -->\n</ng-template>\n\n<!-- cios card -->\n<ng-template #cardPortraitExtLibSkeleton>\n  <sb-uic-card-portrait-ext [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-portrait-ext>\n</ng-template>\n<ng-template #cardPortraitExtLib>\n  <sb-uic-card-portrait-ext \n  [cbPlanMapData]=\"cbPlanMapData\"\n  (contentData)=\"getRedirectUrlData($event)\" [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait-ext>\n</ng-template>",
                 styles: [""]
             }] }
 ];
 /** @nocollapse */
 CardsComponent.ctorParameters = () => [
     { type: UtilityService },
-    { type: ConfigurationsService },
+    { type: ConfigurationsService$1 },
     { type: WidgetContentService },
     { type: Router }
 ];
@@ -8903,6 +9020,7 @@ class CardKarmaProgramsComponent {
         this.router = router;
         this.randomColorApply = false;
         this.userData = new EventEmitter();
+        this.isCardLoading = false;
         this.widgetType = '';
         this.widgetSubType = '';
         this.randomColors = [
@@ -8981,7 +9099,7 @@ class CardKarmaProgramsComponent {
 CardKarmaProgramsComponent.decorators = [
     { type: Component, args: [{
                 selector: 'sb-uic-card-karma-programs',
-                template: "<mat-card class=\"channels-card card-channels-container mr-5 padding-remove cursor-pointer\" [ngStyle]=\"{'background': widgetData?.content?.bgColor}\">\n    <div class=\"display-contents\">\n        <ng-container *ngIf=\"widgetData?.content\">\n            <a (click)=\"redirectTo(widgetData?.content);$event.stopPropagation();\">\n                <ng-container>\n                    <mat-card-content class=\"min-top\">\n                        <div class=\"flex flex-col h-full\">\n                            <div class=\"image-container\">\n                                <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n                                    <img mat-card-image [src]=\"widgetData?.content?.posterImage | pipePublicURL\" loading=\"lazy\"\n                                    class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                    [alt]=\"widgetData?.content?.title\" />\n                                  </ng-container>\n                                  <ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n                                    <ng-container *ngIf=\"widgetData?.content?.imgSource && widgetData?.content?.imgSource?.length; else defaultImg\">\n                                      <img mat-card-image [src]=\"widgetData?.content?.imgSource[0] | pipePublicURL\" loading=\"lazy\"\n                                      class=\"card-img ws-mat-primary-lite-background margin-remove\"  [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                      [alt]=\"widgetData?.content?.title\" />\n                                    </ng-container>\n                                    <ng-template #defaultImg>\n                                      <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n                                      class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                                      [alt]=\"widgetData?.content?.title\" />\n                                    </ng-template>\n                                  </ng-container>\n                            </div>\n                            <div class=\"title-container\">\n                                <div class=\"flex   px-2\">\n                                    <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                        class=\"flex-1 text-start  mat-subheading-2 title-text ws-mat-white-text\">\n                                        {{ widgetData?.content?.title }}\n                                    </div>\n                                </div>\n                                <div class=\"flex  px-2\">\n                                    <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                        class=\"flex-1 text-start margin-remove  margin-top-xxs mat-subheading-2 title-text ws-mat-white-text\">\n                                        {{ widgetData?.content?.children?.length}} Programs\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </mat-card-content>\n                </ng-container>\n            </a>\n        </ng-container>\n    </div>\n</mat-card>",
+                template: "<ng-container *ngIf=\"!isCardLoading\">\n    <mat-card class=\"channels-card card-channels-container mr-5 padding-remove cursor-pointer\" [ngStyle]=\"{'background': widgetData?.content?.bgColor}\">\n        <div class=\"display-contents\">\n            <ng-container *ngIf=\"widgetData?.content\">\n                <a (click)=\"redirectTo(widgetData?.content);$event.stopPropagation();\">\n                    <ng-container>\n                        <mat-card-content class=\"min-top\">\n                            <div class=\"flex flex-col h-full\">\n                                <div class=\"image-container\">\n                                    <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n                                        <img mat-card-image [src]=\"widgetData?.content?.posterImage | pipePublicURL\" loading=\"lazy\"\n                                        class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                        [alt]=\"widgetData?.content?.title\" />\n                                      </ng-container>\n                                      <ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n                                        <ng-container *ngIf=\"widgetData?.content?.imgSource && widgetData?.content?.imgSource?.length; else defaultImg\">\n                                          <img mat-card-image [src]=\"widgetData?.content?.imgSource[0] | pipePublicURL\" loading=\"lazy\"\n                                          class=\"card-img ws-mat-primary-lite-background margin-remove\"  [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                          [alt]=\"widgetData?.content?.title\" />\n                                        </ng-container>\n                                        <ng-template #defaultImg>\n                                          <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n                                          class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                                          [alt]=\"widgetData?.content?.title\" />\n                                        </ng-template>\n                                      </ng-container>\n                                </div>\n                                <div class=\"title-container\">\n                                    <div class=\"flex   px-2\">\n                                        <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                            class=\"flex-1 text-start  mat-subheading-2 title-text ws-mat-white-text\">\n                                            {{ widgetData?.content?.title }}\n                                        </div>\n                                    </div>\n                                    <div class=\"flex  px-2\">\n                                        <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                            class=\"flex-1 text-start margin-remove  margin-top-xxs mat-subheading-2 title-text ws-mat-white-text\">\n                                            {{ widgetData?.content?.children?.length}} Programs\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </mat-card-content>\n                    </ng-container>\n                </a>\n            </ng-container>\n        </div>\n    </mat-card>\n</ng-container>\n<ng-container *ngIf=\"isCardLoading\">\n    <mat-card class=\"channels-card card-channels-container mr-5 padding-remove cursor-pointer\" >\n        <div class=\"display-contents\">\n            <ng-container >\n                <a >\n                    <ng-container>\n                        <mat-card-content class=\"min-top\">\n                            <div class=\"flex flex-col h-full\">\n                                <div class=\"image-container\">\n                                    <ng-container >\n                                        <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'100%'\" class=\"w-full h-full\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                                    </ng-container>\n                                </div>\n                                <div class=\"title-container\">\n                                    <div class=\"flex   px-2\">\n                                        <div class=\"flex-1 text-start  mat-subheading-2 title-text ws-mat-white-text\">\n                                            <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'100%'\" class=\"w-full h-full\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                                        </div>\n                                    </div>\n                                    <div class=\"flex  px-2\">\n                                        <div class=\"flex-1 text-start margin-remove  margin-top-xxs mat-subheading-2 title-text ws-mat-white-text\">\n                                              <sb-uic-skeleton-loader [width]=\"'120px'\" [height]=\"'100%'\" class=\"w-full h-full\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </mat-card-content>\n                    </ng-container>\n                </a>\n            </ng-container>\n        </div>\n    </mat-card>\n</ng-container>",
                 styles: [".card-channels-container{position:relative;width:245px;box-sizing:border-box;box-shadow:0 10px 30px rgba(153,153,153,.2);overflow:hidden;min-height:217px;height:217px;max-height:217px;margin:20px 8px;background:#1a4ca1;border-radius:12px}.card-channels-container .min-top{background:inherit;margin-bottom:0;height:inherit}.card-channels-container .image-container{background-color:#fff;width:inherit;height:139px;max-height:139px;overflow:hidden;display:flex;align-items:center;justify-content:center;border-top-left-radius:12px;border-top-right-radius:12px}.card-channels-container .card-img{max-height:100%;min-height:100%;display:block;-o-object-fit:fill;object-fit:fill}.card-channels-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-channels-container .title-container{background:inherit}.card-channels-container .description-text{position:relative;overflow:hidden;height:51px}.card-channels-container .title-text{word-break:break-all;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;min-height:24px}"]
             }] }
 ];
@@ -8997,7 +9115,8 @@ CardKarmaProgramsComponent.ctorParameters = () => [
 CardKarmaProgramsComponent.propDecorators = {
     widgetData: [{ type: Input }],
     randomColorApply: [{ type: Input }],
-    userData: [{ type: Output }]
+    userData: [{ type: Output }],
+    isCardLoading: [{ type: Input }]
 };
 if (false) {
     /** @type {?} */
@@ -9007,6 +9126,8 @@ if (false) {
     /** @type {?} */
     CardKarmaProgramsComponent.prototype.userData;
     /** @type {?} */
+    CardKarmaProgramsComponent.prototype.isCardLoading;
+    /** @type {?} */
     CardKarmaProgramsComponent.prototype.defaultThumbnail;
     /** @type {?} */
     CardKarmaProgramsComponent.prototype.sourceLogos;
@@ -9212,6 +9333,166 @@ if (false) {
     CardKarmaProgramsV2Component.prototype.router;
 }
 
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class CardPortraitExtComponent {
+    /**
+     * @param {?} snackBar
+     * @param {?} translate
+     * @param {?} langtranslations
+     * @param {?} configSvc
+     * @param {?} contSvc
+     */
+    constructor(snackBar, translate, langtranslations, configSvc, contSvc) {
+        this.snackBar = snackBar;
+        this.translate = translate;
+        this.langtranslations = langtranslations;
+        this.configSvc = configSvc;
+        this.contSvc = contSvc;
+        this.isCardLoading = false;
+        this.contentData = new EventEmitter();
+        this.isCardFlipped = false;
+        this.acbpConstants = NsCardContent$1.ACBPConst;
+        this.showFlip = false;
+        this.widgetType = 'df';
+        this.widgetSubType = 'sdf';
+        this.langtranslations.languageSelectedObservable.subscribe((/**
+         * @return {?}
+         */
+        () => {
+            if (localStorage.getItem('websiteLanguage')) {
+                this.translate.setDefaultLang('en');
+                /** @type {?} */
+                const lang = (/** @type {?} */ (localStorage.getItem('websiteLanguage')));
+                this.translate.use(lang);
+            }
+        }));
+    }
+    /**
+     * @return {?}
+     */
+    ngOnInit() {
+        /** @type {?} */
+        const instanceConfig = this.configSvc.instanceConfig;
+        if (instanceConfig) {
+            this.defaultThumbnail = instanceConfig.logos.defaultContent || '';
+            this.sourceLogos = instanceConfig.sources;
+            this.defaultSLogo = instanceConfig.logos.defaultSourceLogo || '';
+        }
+        else {
+            this.defaultThumbnail = '/assets/instances/eagle/app_logos/default.png';
+            this.defaultSLogo = '/assets/instances/eagle/app_logos/KarmayogiBharat_Logo.svg';
+        }
+    }
+    /**
+     * @return {?}
+     */
+    showSnackbar() {
+        if (this.showIntranetContent) {
+            this.snackBar.open('Content is only available in intranet', 'X', { duration: 2000 });
+        }
+        else if (!this.isLiveOrMarkForDeletion) {
+            this.snackBar.open('Content may be expired or deleted', 'X', { duration: 2000 });
+        }
+    }
+    /**
+     * @param {?} contentData
+     * @return {?}
+     */
+    getRedirectUrlData(contentData) {
+        // for telemetry
+        if (this.widgetData && this.widgetData.context && this.widgetData.context.pageSection) {
+            contentData['typeOfTelemetry'] = this.widgetData.context.pageSection;
+        }
+        this.contSvc.changeTelemetryData(contentData);
+        // for redirection
+        this.contentData.emit(contentData);
+    }
+}
+CardPortraitExtComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'sb-uic-card-portrait-ext',
+                template: "<ng-container *ngIf=\"!isCardLoading\">\n    <mat-card class=\"card-standard-container mr-5 padding-remove cursor-pointer  {{widgetData?.cardCustomeClass}}\" [ngClass]=\"{\n      greyOut:\n        widgetData?.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n          ? true\n          : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n    }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\n    <div class=\"display-contents\" [ngClass]=\"{\n        disableClick:\n          widgetData?.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n            ? true\n            : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n      }\">\n      <ng-container *ngIf=\"widgetData?.content\">\n        <a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\"\n            role=\"link\" i18n-aria-label>\n      <ng-container *ngIf=\"!isCardFlipped\">\n        <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\n          matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\n        <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\n          matTooltip=\"Available only in Company's network\"\n          *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\n        <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\n          (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\n          <mat-icon>flip_to_back</mat-icon>\n        </button>\n        <mat-card-content class=\"min-top\">\n          <div style=\"position: relative; z-index: 1;\">\n            <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n              <img mat-card-image [src]=\"widgetData.content.posterImage | pipePublicURL\" loading=\"lazy\"\n              class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n              [alt]=\"widgetData.content.name\" />\n            </ng-container>\n            <ng-container *ngIf=\"!widgetData.content.posterImage\">\n              <ng-container *ngIf=\"widgetData.content.appIcon; else defaultImg\">\n                <img mat-card-image [src]=\"widgetData.content.appIcon \" loading=\"lazy\"\n                class=\"card-img ws-mat-primary-lite-background margin-remove\"  [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                [alt]=\"widgetData?.content?.name\" />\n              </ng-container>\n              <ng-template #defaultImg>\n                <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n                class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                [alt]=\"widgetData?.content?.name\" />\n              </ng-template>\n            </ng-container>\n            <div class=\"source-div\" style=\"display: none;\">\n              <img [src]=\"widgetData?.content.creatorLogo\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n                [alt]=\"(widgetData?.content?.sourceName + '_' + widgetData.content?.contentId)\" />\n            </div>\n            <ng-container *ngIf=\"widgetData?.content?.cbPlanEndDate\">\n              <div class=\"cbp-mark\">\n                <span>{{widgetData?.content?.cbPlanEndDate | date: 'd MMM, y'}}</span>\n              </div>\n            </ng-container>\n            <ng-container *ngIf=\"cbPlanMapData && cbPlanMapData[widgetData?.content?.contentId]\">\n              <ng-container [ngTemplateOutlet]=\"cbpPlan\" [ngTemplateOutletContext]=\"{data: {\n                cbpData: cbPlanMapData[widgetData?.content?.contentId]\n              }}\"></ng-container>\n            </ng-container>\n            <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.duration > 0\">\n              <mat-icon class=\"mat-icon main_icon mr-1\">access_time</mat-icon>\n              <span class=\" ws-mat-white-text duration\">\n                {{ (widgetData?.content?.duration || 120)| pipeDurationTransform: 'hms' }}\n              </span>\n            </div>\n            <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.programDuration > 0\">\n              <mat-icon class=\"mat-icon main_icon mr-1\">access_time</mat-icon>\n              <span class=\" ws-mat-white-text duration\">\n                {{widgetData?.content?.programDuration}} {{widgetData?.content?.programDuration === 1 ? 'day' : 'days'}}\n              </span>\n            </div>\n          </div>\n          <div class=\"padding-m\">\n            <div class=\"course_widget flex margin-remove\">\n              <div class=\"flex flex-end course_v2\">\n                <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs\">video_library</mat-icon>\n                <sb-uic-display-content-type [useTranslation]=\"false\" i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.topic\"\n                  class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData?.content?.primaryCategory==='Course Unit'\n                  ?'Module'\n                  :widgetData?.content?.primaryCategory? widgetData?.content?.primaryCategory : 'Course'\">\n  \n                </sb-uic-display-content-type>\n              </div>\n            </div>\n            <div [id]=\"'m-c-'+ widgetData.content?.contentId\"\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              <div class=\"course_logo_box\">\n                <img [src]=\"widgetData.content.creatorLogo | pipePublicURL \" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n                [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.contentId)\" />\n              </div>\n              <!-- <span class=\"org-text\">{{'cardcontentv2.by' | translate}} -->\n                <span class=\"org-text\">By&nbsp; {{ (widgetData?.content?.organisation && widgetData?.content?.organisation[0]) ? widgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}</span>\n            </div>\n            <div class=\"flex flex-middle rating-session margin-top-m\">\n              <div class=\"flex flex-middle\" *ngIf=\"widgetData?.content?.avgRating\">\n                <mat-icon class=\"mr-1\">star</mat-icon>\n                <span>{{widgetData.content.avgRating}}</span>\n              </div>\n              <!-- <span class=\"most-enrolled-text margin-left-m\">{{ 'cardcontentv2.mostEnrolled' | translate }}</span> -->\n              <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostEnrolled')\">\n                <span class=\"most-enrolled-text margin-left-xs\">\n                  <!-- {{ 'cardcontentv2.mostEnrolled' | translate }} -->\n              </span>\n              </ng-container>\n              <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostTrending')\">\n                <span class=\"most-enrolled-text margin-left-xs\">\n                  <!-- {{ 'cardcontentv2.mostTrending' | translate }} -->\n              </span>\n              </ng-container>\n            </div>\n          </div>\n        </mat-card-content>\n      </ng-container>\n      <ng-container *ngIf=\"isCardFlipped\">\n        <div class=\"flex items-center\">\n          <!-- <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>{{'cardcontentv2.reason' | translate}}</h2> -->\n          <button mat-icon-button (click)=\"isCardFlipped = false\">\n            <mat-icon>close</mat-icon>\n          </button>\n        </div>\n        <p class=\"text-justify mat-body-1\">\n          {{ widgetData.content.reason }}\n        </p>\n      </ng-container>\n        </a>\n      </ng-container>\n    </div>\n  </mat-card>\n  </ng-container>\n  \n  <ng-container *ngIf=\"isCardLoading\">\n    <mat-card class=\"card-standard-container mr-5 padding-remove\" >\n      <div class=\"display-contents\" >\n        <ng-container *ngIf=\"!isCardFlipped\">\n          <mat-card-content class=\"min-top\">\n            <div style=\"position: relative; z-index: 1;\">\n              <ng-container>\n                <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'140px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n              </ng-container>\n            </div>\n            <div class=\"padding-m\">\n              <div class=\"course_widget flex margin-remove\">\n                <div class=\"flex flex-end\">\n                  <sb-uic-skeleton-loader [width]=\"'65px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n                </div>\n              </div>\n              <div class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n                <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded margin-top-s'\"></sb-uic-skeleton-loader>\n              </div>\n              <div class=\"flex w-full flex-wrap flex-middle margin-top-m\">\n                <div class=\"\">\n                  <sb-uic-skeleton-loader [width]=\"'28px'\" [height]=\"'28px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                </div>\n                <span class=\"org-text\"> <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader></span>\n              </div>\n              <div class=\"flex flex-middle rating-session margin-top-m\">\n                <div class=\"flex flex-middle\">\n                  <sb-uic-skeleton-loader [width]=\"'45px'\" [height]=\"'12px'\" [bindingClass]=\"'flex rounded margin-top-m'\"></sb-uic-skeleton-loader>\n                </div>\n              </div>\n            </div>\n          </mat-card-content>\n        </ng-container>\n      </div>\n    </mat-card>\n  </ng-container>\n  \n  <ng-template #cbpPlan  let-data=\"data\">\n    <div class=\"cbp-mark left-0 border-top-radius\">\n      <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.UPCOMING\"  class=\"cbp-warning\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n      <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.SUCCESS\"  class=\"cbp-success\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n      <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger\">{{'OverDue' }}</p>\n    </div>\n  </ng-template>",
+                styles: [".course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #ef951e;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}.rating-session mat-icon{font-size:16px;height:16px;width:12px;padding-right:3px;color:#ef951e}.rating-session span{font-size:11px}.rating-session .most-enrolled-text{padding:0 8px;background:#ffea9e;border-radius:4px}.card-standard-container{position:relative;width:245px;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-standard-container .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-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-standard-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-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-standard-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-standard-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container mat-card-content{background:#fff}.card-standard-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-standard-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container .basic{margin:auto 0}.card-standard-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-standard-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}.width-238{width:238px!important}.cbp-mark{border-radius:12px 0;opacity:1;background-image:linear-gradient(90deg,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 100%);position:absolute;top:0;padding:8px}.cbp-mark p{opacity:1;background-color:#fff;padding:4px;opacity:1;color:#1b2133;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:Regular;letter-spacing:.5px;text-align:left;line-height:12px;margin-bottom:0}.cbpwidth{width:340px}.cbp-plan{border-radius:4px;opacity:1;background-color:#1b4ca1;top:4px;left:4px;opacity:1;color:rgba(255,255,255,.95);font-family:Lato-Bold;font-size:12px;font-weight:700;font-style:normal;letter-spacing:.25px;text-align:center;line-height:16px;padding:4px}.cbp-info{opacity:1;color:#fff;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:normal;letter-spacing:.5px;text-align:left;line-height:12px;padding:2px}.cbp-danger{border-radius:2px;border:1px solid rgba(0,0,0,.08);background-color:#d13924!important;color:#fff!important;opacity:1}.cbp-success{border-radius:2px;border:1px solid #1d8922;background-color:#1d8922!important;color:#fff!important;opacity:1}.cbp-warning{border-radius:2px;border:1px solid #ef951e;background-color:#ef951e!important;color:#fff!important;opacity:1}"]
+            }] }
+];
+/** @nocollapse */
+CardPortraitExtComponent.ctorParameters = () => [
+    { type: MatSnackBar },
+    { type: TranslateService },
+    { type: MultilingualTranslationsService },
+    { type: ConfigurationsService$1 },
+    { type: WidgetContentService }
+];
+CardPortraitExtComponent.propDecorators = {
+    widgetData: [{ type: Input }],
+    isLiveOrMarkForDeletion: [{ type: Input }],
+    showIntranetContent: [{ type: Input }],
+    isIntranetAllowedSettings: [{ type: Input }],
+    isCardLoading: [{ type: Input }],
+    contentData: [{ type: Output }],
+    cbPlanMapData: [{ type: Input }]
+};
+if (false) {
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.widgetData;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isLiveOrMarkForDeletion;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.showIntranetContent;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isIntranetAllowedSettings;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isCardLoading;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.contentData;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.cbPlanMapData;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isCardFlipped;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.acbpConstants;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.defaultThumbnail;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.sourceLogos;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.defaultSLogo;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.showFlip;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.widgetType;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.widgetSubType;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.snackBar;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.translate;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.langtranslations;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.configSvc;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.contSvc;
+}
+
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -9229,7 +9510,8 @@ CardsModule.decorators = [
                     CardMDOChannelComponent,
                     CardWideV2Component,
                     CardKarmaProgramsComponent,
-                    CardKarmaProgramsV2Component
+                    CardKarmaProgramsV2Component,
+                    CardPortraitExtComponent
                 ],
                 imports: [
                     CommonModule,
@@ -9386,7 +9668,7 @@ class CompetencyPassbookComponent {
             let addfilter = {};
             if (this.providerId) {
                 addfilter = {
-                    "channel": [
+                    "createdFor": [
                         this.providerId
                     ],
                 };
@@ -9425,7 +9707,7 @@ class CompetencyPassbookComponent {
                         this.selectedValue = this.competencyArea[0].name.toLowerCase();
                         /** @type {?} */
                         let addFilter = {
-                            "channel": [
+                            "createdFor": [
                                 this.providerId
                             ]
                         };
@@ -9482,7 +9764,7 @@ class CompetencyPassbookComponent {
         let addfilter = {};
         if (this.providerId) {
             addfilter = {
-                "channel": [
+                "createdFor": [
                     this.providerId
                 ],
             };
@@ -10665,5 +10947,5 @@ UserContentRatingLibModule.decorators = [
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
-export { AnnouncementsModule, CalenderModule, CardsModule, CommonMethodsService, CommonStripModule, CompetencyPassbookModule, ConsumptionComponent, ConsumptionModule, ConsumptionService, ContentStripWithTabsLibModule, DataPointsModule, HttpLoaderFactory, MyHammerConfig, ROOT_WIDGET_CONFIG, SlidersLibModule, UserContentRatingLibModule, WIDGET_REGISTERED_LIB_MODULES, WIDGET_REGISTRATION_LIB_CONFIG, WidgetContentService, ContentStripWithTabsLibComponent as ɵa, WidgetUserService as ɵb, CardWideV2Component as ɵba, CardKarmaProgramsComponent as ɵbb, CardKarmaProgramsV2Component as ɵbc, PipePublicURLModule as ɵbd, PipePublicURL as ɵbe, DisplayContentTypeLibModule as ɵbf, DisplayContentTypeLibComponent as ɵbg, DefaultThumbnailModule as ɵbh, DefaultThumbnailDirective as ɵbi, PipeDurationTransformModule as ɵbj, PipeDurationTransformPipe as ɵbk, CompetencyPassbookComponent as ɵbl, CompetencyPassbookService as ɵbm, PillsModule as ɵbn, PillsComponent as ɵbo, UserContentRatingLibComponent as ɵbp, ScrollableItemDirective as ɵbq, RatingService as ɵbr, UserContentRatingLibService as ɵbs, AvatarPhotoLibModule as ɵbt, AvatarPhotoLibComponent as ɵbu, MyHammerConfig$1 as ɵbv, SlidersNgContentLibModule as ɵbw, SlidersNgContentLibComponent as ɵbx, ScrollableItemModule as ɵby, MultilingualTranslationsService as ɵc, ConfigurationsService as ɵd, HorizontalScrollerV2Module as ɵe, HorizontalScrollerV2Component as ɵf, SlidersLibComponent as ɵg, NavigationModule as ɵh, NavigationDirective as ɵi, ImageResponsiveModule as ɵj, ImageResponsiveDirective as ɵk, DataPointsComponent as ɵl, InsiteDataService as ɵm, SkeletonLoaderLibModule as ɵn, SkeletonLoaderLibComponent as ɵo, CalenderComponent as ɵp, CalenderDayComponent as ɵq, CommonStripComponent as ɵr, AnnouncementsComponent as ɵs, CardResourceComponent as ɵt, CardsComponent as ɵu, CardPortraitComponent as ɵv, CardUserComponent as ɵw, CardLandscapeComponent as ɵx, CardWideComponent as ɵy, CardMDOChannelComponent as ɵz };
+export { AnnouncementsModule, CalenderModule, CardsModule, CommonMethodsService, CommonStripModule, CompetencyPassbookModule, ConsumptionComponent, ConsumptionModule, ConsumptionService, ContentStripWithTabsLibModule, DataPointsModule, HttpLoaderFactory, MyHammerConfig, ROOT_WIDGET_CONFIG, SlidersLibModule, UserContentRatingLibModule, WIDGET_REGISTERED_LIB_MODULES, WIDGET_REGISTRATION_LIB_CONFIG, WidgetContentService, ContentStripWithTabsLibComponent as ɵa, WidgetUserService as ɵb, CardWideV2Component as ɵba, CardKarmaProgramsComponent as ɵbb, CardKarmaProgramsV2Component as ɵbc, CardPortraitExtComponent as ɵbd, PipePublicURLModule as ɵbe, PipePublicURL as ɵbf, DisplayContentTypeLibModule as ɵbg, DisplayContentTypeLibComponent as ɵbh, DefaultThumbnailModule as ɵbi, DefaultThumbnailDirective as ɵbj, PipeDurationTransformModule as ɵbk, PipeDurationTransformPipe as ɵbl, CompetencyPassbookComponent as ɵbm, CompetencyPassbookService as ɵbn, PillsModule as ɵbo, PillsComponent as ɵbp, UserContentRatingLibComponent as ɵbq, ScrollableItemDirective as ɵbr, RatingService as ɵbs, UserContentRatingLibService as ɵbt, AvatarPhotoLibModule as ɵbu, AvatarPhotoLibComponent as ɵbv, MyHammerConfig$1 as ɵbw, SlidersNgContentLibModule as ɵbx, SlidersNgContentLibComponent as ɵby, ScrollableItemModule as ɵbz, MultilingualTranslationsService as ɵc, ConfigurationsService as ɵd, HorizontalScrollerV2Module as ɵe, HorizontalScrollerV2Component as ɵf, SlidersLibComponent as ɵg, NavigationModule as ɵh, NavigationDirective as ɵi, ImageResponsiveModule as ɵj, ImageResponsiveDirective as ɵk, DataPointsComponent as ɵl, InsiteDataService as ɵm, SkeletonLoaderLibModule as ɵn, SkeletonLoaderLibComponent as ɵo, CalenderComponent as ɵp, CalenderDayComponent as ɵq, CommonStripComponent as ɵr, AnnouncementsComponent as ɵs, CardResourceComponent as ɵt, CardsComponent as ɵu, CardPortraitComponent as ɵv, CardUserComponent as ɵw, CardLandscapeComponent as ɵx, CardWideComponent as ɵy, CardMDOChannelComponent as ɵz };
 //# sourceMappingURL=sunbird-cb-consumption.js.map