@sunbird-cb/consumption 0.0.34 → 0.0.36

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

@@ -4391,6 +4391,7 @@
             this.fetchAllBookMarkData(strip, calculateParentStatus);
             this.fetchAllPlaylistSearch(strip, calculateParentStatus);
             this.fetchPlaylistReadData(strip, calculateParentStatus);
+            this.fetchCiosContentData(strip, calculateParentStatus);
             // this.enrollInterval = setInterval(() => {
             //   this.fetchAllCbpPlans(strip, calculateParentStatus)
             // },                                1000)
@@ -5127,7 +5128,8 @@
                     (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;
@@ -5755,10 +5757,8 @@
          */
         function (strip, request, apiUrl, calculateParentStatus) {
             return __awaiter(this, void 0, void 0, function () {
-                var originalFilters;
                 var _this = this;
                 return __generator(this, function (_a) {
-                    originalFilters = [];
                     return [2 /*return*/, new Promise((/**
                          * @param {?} resolve
                          * @param {?} reject
@@ -5771,25 +5771,37 @@
                                  * @return {?}
                                  */
                                 function (results) {
-                                    /** @type {?} */
-                                    var showViewMore = Boolean(results.result.content && results.result.content.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
-                                    /** @type {?} */
-                                    var viewMoreUrl = showViewMore
-                                        ? {
+                                    if (results.result && results.result.content) {
+                                        /** @type {?} */
+                                        var showViewMore = Boolean(results.result.content && results.result.content.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                                        /** @type {?} */
+                                        var viewMoreUrl = showViewMore
+                                            ? {
+                                                path: strip.viewMoreUrl && strip.viewMoreUrl.path || '',
+                                                queryParams: {
+                                                    tab: 'Learn',
+                                                    q: strip.viewMoreUrl && strip.viewMoreUrl.queryParams,
+                                                    f: {},
+                                                },
+                                            }
+                                            : null;
+                                        resolve({ results: results, viewMoreUrl: viewMoreUrl });
+                                    }
+                                    else if (results && results.data) {
+                                        /** @type {?} */
+                                        var showViewMore = Boolean(results.data && results.data.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                                        /** @type {?} */
+                                        var 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: results, viewMoreUrl: viewMoreUrl });
+                                            : null;
+                                        resolve({ results: results, viewMoreUrl: viewMoreUrl });
+                                    }
                                 }), (/**
                                  * @param {?} error
                                  * @return {?}
@@ -6007,7 +6019,7 @@
         function (strip, calculateParentStatus) {
             if (calculateParentStatus === void 0) { calculateParentStatus = true; }
             return __awaiter(this, void 0, void 0, function () {
-                var originalFilters, response, error_8;
+                var originalFilters, response, finalPlaylistData_1, programData, error_8;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0:
@@ -6030,7 +6042,23 @@
                             if (response && response.results) {
                                 // console.log('calling  after-- ')
                                 if (response.results.result.data && response.results.result.data.length) {
-                                    this.processStrip(strip, this.transformContentsToWidgets(response.results.result.data, strip), 'done', calculateParentStatus, response.viewMoreUrl);
+                                    finalPlaylistData_1 = [];
+                                    programData = response.results.result.data;
+                                    programData.forEach((/**
+                                     * @param {?} prgData
+                                     * @return {?}
+                                     */
+                                    function (prgData) {
+                                        if (prgData.children && prgData.children.length) {
+                                            finalPlaylistData_1.push(prgData);
+                                        }
+                                    }));
+                                    if (finalPlaylistData_1.length) {
+                                        this.processStrip(strip, this.transformContentsToWidgets(finalPlaylistData_1, strip), 'done', calculateParentStatus, response.viewMoreUrl);
+                                    }
+                                    else {
+                                        this.emptyResponse.emit(true);
+                                    }
                                 }
                                 else {
                                     this.processStrip(strip, [], 'error', calculateParentStatus, null);
@@ -6100,6 +6128,68 @@
                 });
             });
         };
+        /**
+         * @param {?} strip
+         * @param {?=} calculateParentStatus
+         * @return {?}
+         */
+        ContentStripWithTabsLibComponent.prototype.fetchCiosContentData = /**
+         * @param {?} strip
+         * @param {?=} calculateParentStatus
+         * @return {?}
+         */
+        function (strip, calculateParentStatus) {
+            if (calculateParentStatus === void 0) { calculateParentStatus = true; }
+            return __awaiter(this, void 0, void 0, function () {
+                var originalFilters, response, extContentData, error_10;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            if (!(strip.request && strip.request.ciosContent && Object.keys(strip.request.ciosContent).length)) return [3 /*break*/, 4];
+                            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);
+                            }
+                            _a.label = 1;
+                        case 1:
+                            _a.trys.push([1, 3, , 4]);
+                            return [4 /*yield*/, this.postRequestMethod(strip, strip.request.ciosContent, strip.request.apiUrl, calculateParentStatus)];
+                        case 2:
+                            response = _a.sent();
+                            // console.log('calling  after - response, ', response)
+                            if (response && response.results) {
+                                // console.log('calling  after-- ')
+                                if (response.results.data && response.results.data.length) {
+                                    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);
+                            }
+                            return [3 /*break*/, 4];
+                        case 3:
+                            error_10 = _a.sent();
+                            this.emptyResponse.emit(true);
+                            return [3 /*break*/, 4];
+                        case 4: return [2 /*return*/];
+                    }
+                });
+            });
+        };
         ContentStripWithTabsLibComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-content-strip-with-tabs',
@@ -8730,16 +8820,28 @@
          */
         function (content) {
             return __awaiter(this, void 0, void 0, function () {
-                var urlData;
+                var userProfile, extUrl, urlData;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
-                        case 0: return [4 /*yield*/, this.contSvc.getResourseLink(content)];
-                        case 1:
+                        case 0:
+                            userProfile = this.configSvc.userProfile;
+                            debugger;
+                            if (!content.externalId) return [3 /*break*/, 1];
+                            extUrl = content.redirectUrl.replace('<username>', userProfile.userId);
+                            // const url = this.router.serializeUrl(
+                            //   this.router.createUrlTree([extUrl])
+                            // );
+                            window.open(extUrl, '_blank');
+                            window.open(content.redirectUrl);
+                            return [3 /*break*/, 3];
+                        case 1: return [4 /*yield*/, this.contSvc.getResourseLink(content)];
+                        case 2:
                             urlData = _a.sent();
                             this.router.navigate([urlData.url], {
                                 queryParams: urlData.queryParams
                             });
-                            return [2 /*return*/];
+                            _a.label = 3;
+                        case 3: return [2 /*return*/];
                     }
                 });
             });
@@ -8784,14 +8886,14 @@
         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 *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]=\"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 *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 #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>\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 = function () { return [
             { type: utilsV2.UtilityService },
-            { type: ConfigurationsService },
+            { type: utilsV2.ConfigurationsService },
             { type: WidgetContentService },
             { type: router.Router }
         ]; };
@@ -9843,8 +9945,8 @@
         CardWideComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'sb-uic-card-wide',
-                        template: "<mat-card class=\"card-wide-lib\">\n    <a (click)=\"raiseTelemetry();getRedirectUrlData(widgetData?.content); $event.stopPropagation()\" \n    role=\"link\" i18n-aria-label>\n    <div class=\"flex\">\n        <div>\n            <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n                <img mat-card-image [src]=\"widgetData?.content?.posterImage | pipePublicURL\" loading=\"lazy\"\n                class=\"card-wide-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                [alt]=\"widgetData?.content?.name\" />\n              </ng-container>\n              <ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n                <ng-container *ngIf=\"widgetData?.content?.appIcon; else defaultImg\">\n                  <img mat-card-image [src]=\"widgetData?.content?.appIcon | pipePublicURL\" loading=\"lazy\"\n                  class=\"card-wide-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-wide-img ws-mat-primary-lite-background margin-remove\"\n                  [alt]=\"widgetData?.content?.name\" />\n                </ng-template>\n              </ng-container>\n        </div>\n        <div>\n            <div class=\"pl-4 pr-4 w-full\">\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 i18n-title title=\"Content Type\" *ngIf=\"widgetData?.content?.primaryCategory\"\n                      class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData?.content?.primaryCategory==='Course Unit'\n                      ?'Module'\n                      :widgetData?.content?.primaryCategory\">\n                    </sb-uic-display-content-type>\n                  </div>\n                </div>\n                <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                  class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n                  {{ widgetData?.content?.name }}\n                </div>\n\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?.identifier)\" />\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>\n        </div>\n    </div>\n    </a>\n</mat-card>\n",
-                        styles: [".card-wide-lib{width:inherit;padding:16px;border-radius:12px;background:#fff;border:1px solid rgba(0,0,0,.16)}.card-wide-lib .card-wide-img{width:190px;height:107px;border-radius:12px}.card-wide-lib .course_widget{margin-top:10px}.card-wide-lib .course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.card-wide-lib .course_widget .course_v2{border:1px solid #ef951e;padding:4px 8px;align-items:end;border-radius:16px}.card-wide-lib .course_widget .main_icon{font-size:16px;width:16px;height:16px}.card-wide-lib .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-wide-lib .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-wide-lib .course_logo_box p{display:inline-block;vertical-align:top}.card-wide-lib .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}@media screen and (max-width:768px){.card-wide-img{width:147px;height:117px;border-radius:12px}}"]
+                        template: "<mat-card class=\"card-wide-lib\">\n    <a (click)=\"raiseTelemetry();getRedirectUrlData(widgetData?.content); $event.stopPropagation()\" \n    role=\"link\" i18n-aria-label>\n    <div class=\"flex\">\n        <div>\n            <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n                <img mat-card-image [src]=\"widgetData?.content?.posterImage | pipePublicURL\" loading=\"lazy\"\n                class=\"card-wide-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                [alt]=\"widgetData?.content?.name\" />\n              </ng-container>\n              <ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n                <ng-container *ngIf=\"widgetData?.content?.appIcon; else defaultImg\">\n                  <img mat-card-image [src]=\"widgetData?.content?.appIcon | pipePublicURL\" loading=\"lazy\"\n                  class=\"card-wide-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-wide-img ws-mat-primary-lite-background margin-remove\"\n                  [alt]=\"widgetData?.content?.name\" />\n                </ng-template>\n              </ng-container>\n        </div>\n        <div>\n            <div class=\"pl-4 pr-4 w-full\">\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 i18n-title title=\"Content Type\" *ngIf=\"widgetData?.content?.primaryCategory\"\n                      class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData?.content?.primaryCategory==='Course Unit'\n                      ?'Module'\n                      :widgetData?.content?.primaryCategory\">\n                    </sb-uic-display-content-type>\n                  </div>\n                </div>\n                <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                  class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n                  {{ widgetData?.content?.name }}\n                </div>\n\n            <div class=\"flex w-full  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?.identifier)\" />\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>\n        </div>\n    </div>\n    </a>\n</mat-card>\n",
+                        styles: [".card-wide-lib{width:inherit;padding:16px;border-radius:12px;background:#fff;border:1px solid rgba(0,0,0,.16)}.card-wide-lib .card-wide-img{width:190px;height:107px;border-radius:12px}.card-wide-lib .course_widget{margin-top:10px}.card-wide-lib .course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.card-wide-lib .course_widget .course_v2{border:1px solid #ef951e;padding:4px 8px;align-items:end;border-radius:16px}.card-wide-lib .course_widget .main_icon{font-size:16px;width:16px;height:16px}.card-wide-lib .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-wide-lib .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-wide-lib .course_logo_box p{display:inline-block;vertical-align:top}.card-wide-lib .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}@media screen and (max-width:768px){.card-wide-img{width:147px!important;height:117px!important;border-radius:12px!important}}"]
                     }] }
         ];
         /** @nocollapse */
@@ -10595,6 +10697,171 @@
         CardKarmaProgramsV2Component.prototype.router;
     }
 
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var CardPortraitExtComponent = /** @class */ (function () {
+        function CardPortraitExtComponent(snackBar, translate, langtranslations, configSvc, contSvc) {
+            var _this = this;
+            this.snackBar = snackBar;
+            this.translate = translate;
+            this.langtranslations = langtranslations;
+            this.configSvc = configSvc;
+            this.contSvc = contSvc;
+            this.isCardLoading = false;
+            this.contentData = new core.EventEmitter();
+            this.isCardFlipped = false;
+            this.acbpConstants = NsCardContent$1.ACBPConst;
+            this.showFlip = false;
+            this.widgetType = 'df';
+            this.widgetSubType = 'sdf';
+            this.langtranslations.languageSelectedObservable.subscribe((/**
+             * @return {?}
+             */
+            function () {
+                if (localStorage.getItem('websiteLanguage')) {
+                    _this.translate.setDefaultLang('en');
+                    /** @type {?} */
+                    var lang = (/** @type {?} */ (localStorage.getItem('websiteLanguage')));
+                    _this.translate.use(lang);
+                }
+            }));
+        }
+        /**
+         * @return {?}
+         */
+        CardPortraitExtComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+        function () {
+            /** @type {?} */
+            var 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 {?}
+         */
+        CardPortraitExtComponent.prototype.showSnackbar = /**
+         * @return {?}
+         */
+        function () {
+            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 {?}
+         */
+        CardPortraitExtComponent.prototype.getRedirectUrlData = /**
+         * @param {?} contentData
+         * @return {?}
+         */
+        function (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: core.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 = function () { return [
+            { type: material.MatSnackBar },
+            { type: core$1.TranslateService },
+            { type: MultilingualTranslationsService },
+            { type: utilsV2.ConfigurationsService },
+            { type: WidgetContentService }
+        ]; };
+        CardPortraitExtComponent.propDecorators = {
+            widgetData: [{ type: core.Input }],
+            isLiveOrMarkForDeletion: [{ type: core.Input }],
+            showIntranetContent: [{ type: core.Input }],
+            isIntranetAllowedSettings: [{ type: core.Input }],
+            isCardLoading: [{ type: core.Input }],
+            contentData: [{ type: core.Output }],
+            cbPlanMapData: [{ type: core.Input }]
+        };
+        return CardPortraitExtComponent;
+    }());
+    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
@@ -10613,7 +10880,8 @@
                             CardMDOChannelComponent,
                             CardWideV2Component,
                             CardKarmaProgramsComponent,
-                            CardKarmaProgramsV2Component
+                            CardKarmaProgramsV2Component,
+                            CardPortraitExtComponent
                         ],
                         imports: [
                             common.CommonModule,
@@ -12285,28 +12553,29 @@
     exports.ɵba = CardWideV2Component;
     exports.ɵbb = CardKarmaProgramsComponent;
     exports.ɵbc = CardKarmaProgramsV2Component;
-    exports.ɵbd = PipePublicURLModule;
-    exports.ɵbe = PipePublicURL;
-    exports.ɵbf = DisplayContentTypeLibModule;
-    exports.ɵbg = DisplayContentTypeLibComponent;
-    exports.ɵbh = DefaultThumbnailModule;
-    exports.ɵbi = DefaultThumbnailDirective;
-    exports.ɵbj = PipeDurationTransformModule;
-    exports.ɵbk = PipeDurationTransformPipe;
-    exports.ɵbl = CompetencyPassbookComponent;
-    exports.ɵbm = CompetencyPassbookService;
-    exports.ɵbn = PillsModule;
-    exports.ɵbo = PillsComponent;
-    exports.ɵbp = UserContentRatingLibComponent;
-    exports.ɵbq = ScrollableItemDirective;
-    exports.ɵbr = RatingService;
-    exports.ɵbs = UserContentRatingLibService;
-    exports.ɵbt = AvatarPhotoLibModule;
-    exports.ɵbu = AvatarPhotoLibComponent;
-    exports.ɵbv = MyHammerConfig$1;
-    exports.ɵbw = SlidersNgContentLibModule;
-    exports.ɵbx = SlidersNgContentLibComponent;
-    exports.ɵby = ScrollableItemModule;
+    exports.ɵbd = CardPortraitExtComponent;
+    exports.ɵbe = PipePublicURLModule;
+    exports.ɵbf = PipePublicURL;
+    exports.ɵbg = DisplayContentTypeLibModule;
+    exports.ɵbh = DisplayContentTypeLibComponent;
+    exports.ɵbi = DefaultThumbnailModule;
+    exports.ɵbj = DefaultThumbnailDirective;
+    exports.ɵbk = PipeDurationTransformModule;
+    exports.ɵbl = PipeDurationTransformPipe;
+    exports.ɵbm = CompetencyPassbookComponent;
+    exports.ɵbn = CompetencyPassbookService;
+    exports.ɵbo = PillsModule;
+    exports.ɵbp = PillsComponent;
+    exports.ɵbq = UserContentRatingLibComponent;
+    exports.ɵbr = ScrollableItemDirective;
+    exports.ɵbs = RatingService;
+    exports.ɵbt = UserContentRatingLibService;
+    exports.ɵbu = AvatarPhotoLibModule;
+    exports.ɵbv = AvatarPhotoLibComponent;
+    exports.ɵbw = MyHammerConfig$1;
+    exports.ɵbx = SlidersNgContentLibModule;
+    exports.ɵby = SlidersNgContentLibComponent;
+    exports.ɵbz = ScrollableItemModule;
     exports.ɵc = MultilingualTranslationsService;
     exports.ɵd = ConfigurationsService;
     exports.ɵe = HorizontalScrollerV2Module;