@learncard/react 2.8.4 → 2.8.6

package/dist/cjs/index.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var AchievementCard = require('./AchievementCard-dd332f3f.js');
-var BoostGenericCard = require('./BoostGenericCard-1c2a8a3c.js');
+var BoostGenericCard = require('./BoostGenericCard-08a4e856.js');
 var BoostSmallCard = require('./BoostSmallCard-e51886cf.js');
 var Button = require('./Button-a7af702b.js');
 var CertDisplayCardSkillsCount = require('./CertDisplayCardSkillsCount-b1565a79.js');
-var CertificateDisplayCard = require('./CertificateDisplayCard-da900056.js');
+var CertificateDisplayCard = require('./CertificateDisplayCard-081fb157.js');
 var VerifierStateBadgeAndText = require('./VerifierStateBadgeAndText-215395cc.js');
 var CircleCheckButton = require('./CircleCheckButton-82d47ee2.js');
 var CircleIcon = require('./CircleIcon-617c38fa.js');
@@ -22,7 +22,7 @@ var LearnCardCreditCardFrontFace = require('./LearnCardCreditCardFrontFace-39eeb
 var LearnPill = require('./LearnPill-d80ba2e6.js');
 var Lightbox = require('./Lightbox-880f4672.js');
 var CircleSpinner = require('./CircleSpinner-093cce04.js');
-var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-377ad2c7.js');
+var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-3f8eb0fc.js');
 var MeritBadgeSkillsCount = require('./MeritBadgeSkillsCount-cf2c9c8c.js');
 var MiniVCThumbnail = require('./MiniVCThumbnail-a78e44f2.js');
 var Notification = require('./Notification-d212fa7b.js');
@@ -40,13 +40,14 @@ var SkillVerticalCard = require('./SkillVerticalCard-3eb3a8e9.js');
 var SkillsCard = require('./SkillsCard-4b6dbb4f.js');
 var SkillsStatsCard = require('./SkillsStatsCard-97a35a88.js');
 var SmallAchievementCard = require('./SmallAchievementCard-a1fa862b.js');
-var VCCard = require('./VCCard-b942b5dc.js');
+var VCCard = require('./VCCard-d0057020.js');
 var VCDisplayBackFace = require('./VCDisplayBackFace-6a495d04.js');
 var VCDisplayCard = require('./VCDisplayCard-2c4852e7.js');
-var VCDisplayCard2 = require('./VCDisplayCard2-353a27dd.js');
+var VCDisplayCard2 = require('./VCDisplayCard2-5c3d1475.js');
 var VCThumbnail = require('./VCThumbnail-6bf86bb2.js');
 var VCVerificationCheck = require('./VCVerificationCheck-46fa75d3.js');
 var VCVerificationPill = require('./VCVerificationPill-5459decc.js');
+var IDDisplayIcon = require('./IDDisplayIcon-62993df0.js');
 var QRCodeIcon = require('./QRCodeIcon-81c6e96b.js');
 var User = require('./User-301088ac.js');
 var Checkmark = require('./Checkmark-f611aa4d.js');
@@ -204,6 +205,11 @@ exports.VCVerificationCheck = VCVerificationCheck.VCVerificationCheck;
 exports.VCVerificationCheckWithSpinner = VCVerificationCheck.VCVerificationCheckWithSpinner;
 exports.VCVerificationCheckWithText = VCVerificationCheck.VCVerificationCheckWithText;
 exports.ValidationStateIndicator = VCVerificationPill.ValidationStateIndicator;
+exports.AwardDisplayIcon = IDDisplayIcon.AwardDisplayIcon;
+exports.BadgeDisplayIcon = IDDisplayIcon.BadgeDisplayIcon;
+exports.CertificateDisplayIcon = IDDisplayIcon.CertificateDisplayIcon;
+exports.CourseDisplayIcon = IDDisplayIcon.CourseDisplayIcon;
+exports.IDDisplayIcon = IDDisplayIcon.IDDisplayIcon;
 exports.AwardRibbon = QRCodeIcon.AwardRibbon;
 exports.IDIcon = QRCodeIcon.IDIcon;
 exports.QRCodeIcon = QRCodeIcon.QRCodeIcon;

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/index13.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var AchievementCard = require('./AchievementCard-dd332f3f.js');
-var BoostGenericCard = require('./BoostGenericCard-1c2a8a3c.js');
+var BoostGenericCard = require('./BoostGenericCard-08a4e856.js');
 var BoostSmallCard = require('./BoostSmallCard-e51886cf.js');
 var Button = require('./Button-a7af702b.js');
 var CertDisplayCardSkillsCount = require('./CertDisplayCardSkillsCount-b1565a79.js');
-var CertificateDisplayCard = require('./CertificateDisplayCard-da900056.js');
+var CertificateDisplayCard = require('./CertificateDisplayCard-081fb157.js');
 var VerifierStateBadgeAndText = require('./VerifierStateBadgeAndText-215395cc.js');
 var CircleCheckButton = require('./CircleCheckButton-82d47ee2.js');
 var CircleIcon = require('./CircleIcon-617c38fa.js');
@@ -22,7 +22,7 @@ var LearnCardCreditCardFrontFace = require('./LearnCardCreditCardFrontFace-39eeb
 var LearnPill = require('./LearnPill-d80ba2e6.js');
 var Lightbox = require('./Lightbox-880f4672.js');
 var CircleSpinner = require('./CircleSpinner-093cce04.js');
-var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-377ad2c7.js');
+var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-3f8eb0fc.js');
 var MeritBadgeSkillsCount = require('./MeritBadgeSkillsCount-cf2c9c8c.js');
 var MiniVCThumbnail = require('./MiniVCThumbnail-a78e44f2.js');
 var Notification = require('./Notification-d212fa7b.js');
@@ -40,13 +40,14 @@ var SkillVerticalCard = require('./SkillVerticalCard-3eb3a8e9.js');
 var SkillsCard = require('./SkillsCard-4b6dbb4f.js');
 var SkillsStatsCard = require('./SkillsStatsCard-97a35a88.js');
 var SmallAchievementCard = require('./SmallAchievementCard-a1fa862b.js');
-var VCCard = require('./VCCard-b942b5dc.js');
+var VCCard = require('./VCCard-d0057020.js');
 var VCDisplayBackFace = require('./VCDisplayBackFace-6a495d04.js');
 var VCDisplayCard = require('./VCDisplayCard-2c4852e7.js');
-var VCDisplayCard2 = require('./VCDisplayCard2-353a27dd.js');
+var VCDisplayCard2 = require('./VCDisplayCard2-5c3d1475.js');
 var VCThumbnail = require('./VCThumbnail-6bf86bb2.js');
 var VCVerificationCheck = require('./VCVerificationCheck-46fa75d3.js');
 var VCVerificationPill = require('./VCVerificationPill-5459decc.js');
+var IDDisplayIcon = require('./IDDisplayIcon-62993df0.js');
 var QRCodeIcon = require('./QRCodeIcon-81c6e96b.js');
 var User = require('./User-301088ac.js');
 var Checkmark = require('./Checkmark-f611aa4d.js');
@@ -204,6 +205,11 @@ exports.VCVerificationCheck = VCVerificationCheck.VCVerificationCheck;
 exports.VCVerificationCheckWithSpinner = VCVerificationCheck.VCVerificationCheckWithSpinner;
 exports.VCVerificationCheckWithText = VCVerificationCheck.VCVerificationCheckWithText;
 exports.ValidationStateIndicator = VCVerificationPill.ValidationStateIndicator;
+exports.AwardDisplayIcon = IDDisplayIcon.AwardDisplayIcon;
+exports.BadgeDisplayIcon = IDDisplayIcon.BadgeDisplayIcon;
+exports.CertificateDisplayIcon = IDDisplayIcon.CertificateDisplayIcon;
+exports.CourseDisplayIcon = IDDisplayIcon.CourseDisplayIcon;
+exports.IDDisplayIcon = IDDisplayIcon.IDDisplayIcon;
 exports.AwardRibbon = QRCodeIcon.AwardRibbon;
 exports.IDIcon = QRCodeIcon.IDIcon;
 exports.QRCodeIcon = QRCodeIcon.QRCodeIcon;

package/dist/cjs/index13.js.map

@@ -1 +1 @@
-{"version":3,"file":"index13.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index13.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/index21.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('react');
 require('./CaretRightFilled.svg');
-var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-377ad2c7.js');
+var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-3f8eb0fc.js');
 require('./index-a9e3ddf5.js');
 require('./types.esm-9e1f15fe.js');
 var MeritBadgeSkillsCount = require('./MeritBadgeSkillsCount-cf2c9c8c.js');

package/dist/cjs/index3.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var BoostGenericCard = require('./BoostGenericCard-1c2a8a3c.js');
+var BoostGenericCard = require('./BoostGenericCard-08a4e856.js');
 require('react');
 require('./index-5488badc.js');
 require('./index-08002ab6.js');
@@ -23,6 +23,7 @@ require('./minitrophycolored.svg');
 require('./minigradcapcolored.svg');
 require('./minipuzzlecolored.svg');
 require('./DotsThreeOutline.svg');
+require('./IDDisplayIcon-62993df0.js');
 require('./CertDisplayCardSkillsCount-b1565a79.js');
 require('./PuzzlePiece-937c216a.js');
 require('./credential.helpers-a6eb673d.js');

package/dist/cjs/index3.js.map

@@ -1 +1 @@
-{"version":3,"file":"index3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/index36.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('react');
+var IDDisplayIcon = require('./IDDisplayIcon-62993df0.js');
 var QRCodeIcon = require('./QRCodeIcon-81c6e96b.js');
 var User = require('./User-301088ac.js');
 var Checkmark = require('./Checkmark-f611aa4d.js');
@@ -13,6 +14,11 @@ var Trophy = require('./Trophy-3d323be3.js');
 
 
 
+exports.AwardDisplayIcon = IDDisplayIcon.AwardDisplayIcon;
+exports.BadgeDisplayIcon = IDDisplayIcon.BadgeDisplayIcon;
+exports.CertificateDisplayIcon = IDDisplayIcon.CertificateDisplayIcon;
+exports.CourseDisplayIcon = IDDisplayIcon.CourseDisplayIcon;
+exports.IDDisplayIcon = IDDisplayIcon.IDDisplayIcon;
 exports.AwardRibbon = QRCodeIcon.AwardRibbon;
 exports.IDIcon = QRCodeIcon.IDIcon;
 exports.QRCodeIcon = QRCodeIcon.QRCodeIcon;

package/dist/cjs/index36.js.map

@@ -1 +1 @@
-{"version":3,"file":"index36.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index36.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/index37.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var VCCard = require('./VCCard-b942b5dc.js');
+var VCCard = require('./VCCard-d0057020.js');
 require('react');
 require('@learncard/init');
 require('./VCDisplayCard-2c4852e7.js');
@@ -25,7 +25,7 @@ require('./RedXCircle.svg');
 require('./GreenCheckCircle.svg');
 require('./YellowWarningCircle.svg');
 require('./ArrowArcRight.svg');
-require('./VCDisplayCard2-353a27dd.js');
+require('./VCDisplayCard2-5c3d1475.js');
 require('./index-838fa72c.js');
 require('./VerifierStateBadgeAndText-215395cc.js');
 require('./athletics.png');
@@ -39,13 +39,13 @@ require('./stem.png');
 require('./trade.png');
 require('./Lightbox-880f4672.js');
 require('react-dom');
-require('./CertificateDisplayCard-da900056.js');
+require('./CertificateDisplayCard-081fb157.js');
 require('./CertDisplayCardSkillsCount-b1565a79.js');
 require('./CaretRightFilled.svg');
 require('./DotsThreeOutline.svg');
 require('./QRCodeIcon-81c6e96b.js');
 require('./id-sleeve.png');
-require('./MeritBadgeDisplayCard-377ad2c7.js');
+require('./MeritBadgeDisplayCard-3f8eb0fc.js');
 
 
 

package/dist/cjs/index40.js

@@ -15,7 +15,7 @@ require('./social.png');
 require('./stem.png');
 require('./trade.png');
 require('./index-a9e3ddf5.js');
-var VCDisplayCard2 = require('./VCDisplayCard2-353a27dd.js');
+var VCDisplayCard2 = require('./VCDisplayCard2-5c3d1475.js');
 require('./types.esm-9e1f15fe.js');
 require('./CaretRightFilled.svg');
 require('./id-sleeve.png');
@@ -30,11 +30,11 @@ require('./User-301088ac.js');
 require('./Trophy-3d323be3.js');
 require('./Lightbox-880f4672.js');
 require('react-dom');
-require('./CertificateDisplayCard-da900056.js');
+require('./CertificateDisplayCard-081fb157.js');
 require('./CertDisplayCardSkillsCount-b1565a79.js');
 require('./DotsThreeOutline.svg');
 require('./QRCodeIcon-81c6e96b.js');
-require('./MeritBadgeDisplayCard-377ad2c7.js');
+require('./MeritBadgeDisplayCard-3f8eb0fc.js');
 
 
 

package/dist/cjs/index6.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 require('react');
 require('./CaretRightFilled.svg');
 var CertDisplayCardSkillsCount = require('./CertDisplayCardSkillsCount-b1565a79.js');
-var CertificateDisplayCard = require('./CertificateDisplayCard-da900056.js');
+var CertificateDisplayCard = require('./CertificateDisplayCard-081fb157.js');
 require('./index-a9e3ddf5.js');
 require('./types.esm-9e1f15fe.js');
 var VerifierStateBadgeAndText = require('./VerifierStateBadgeAndText-215395cc.js');

package/dist/esm/{BoostGenericCard-b87d4600.js → BoostGenericCard-3a36ddf6.js}

@@ -2,9 +2,27 @@ import React from 'react';
 import { W as WalletCategoryTypes } from './index-28917993.js';
 import { a as TYPE_TO_IMG_SRC, b as TYPE_TO_WALLET_DARK_COLOR } from './index-b102febc.js';
 import ThreeDots from './DotsThreeOutline.svg';
+import { B as BadgeDisplayIcon, A as AwardDisplayIcon, a as CourseDisplayIcon, I as IDDisplayIcon, C as CertificateDisplayIcon } from './IDDisplayIcon-82a851e7.js';
 import { C as CertDisplayCardSkillsCount } from './CertDisplayCardSkillsCount-9cf487a7.js';
 import { C as CircleCheckButton } from './CircleCheckButton-5a97f071.js';
 
+const getDisplayIcon = (displayType) => {
+  switch (displayType) {
+    case "badge" /* Badge */:
+      return BadgeDisplayIcon;
+    case "certificate" /* Certificate */:
+      return CertificateDisplayIcon;
+    case "id" /* ID */:
+      return IDDisplayIcon;
+    case "course" /* Course */:
+      return CourseDisplayIcon;
+    case "award" /* Award */:
+      return AwardDisplayIcon;
+    default:
+      return BadgeDisplayIcon;
+  }
+};
+
 const BoostGenericCard = ({
   title,
   customTitle,
@@ -26,7 +44,10 @@ const BoostGenericCard = ({
   optionsTriggerOnClick,
   verifierBadge,
   credential,
-  isInSkillsModal
+  isInSkillsModal,
+  displayType,
+  linkedCredentialsCount = 0,
+  linkedCredentialsClassName = ""
 }) => {
   var _a;
   const thumbClass = TYPE_TO_WALLET_DARK_COLOR[type] ? `bg-${TYPE_TO_WALLET_DARK_COLOR[type]}` : "bg-grayscale-50";
@@ -41,8 +62,9 @@ const BoostGenericCard = ({
   const handleOptionsClick = () => {
     optionsTriggerOnClick == null ? void 0 : optionsTriggerOnClick();
   };
+  const DisplayIcon = getDisplayIcon(displayType);
   return /* @__PURE__ */ React.createElement("div", {
-    className: `flex generic-display-card-simple bg-white flex-col shadow-bottom relative $ py-[0px] px-[0px] w-[160px] h-[250px] rounded-[20px] overflow-hidden ${className}`
+    className: `flex generic-display-card-simple bg-white flex-col shadow-bottom relative py-[0px] px-[0px] w-[160px] h-[265px] min-h-[265px] rounded-[20px] overflow-hidden ${className}`
   }, optionsTriggerOnClick && /* @__PURE__ */ React.createElement("section", {
     className: "absolute cursor-pointer shadow-bottom h-[30px] w-[30px] top-[5px] right-[5px] rounded-full overflow-hidden z-20 bg-white flex items-center justify-center",
     onClick: handleOptionsClick
@@ -79,22 +101,26 @@ const BoostGenericCard = ({
   }, "by ", /* @__PURE__ */ React.createElement("span", {
     className: "font-bold whitespace-pre"
   }, " ", issuerName)), customDateDisplay && customDateDisplay, !customDateDisplay && /* @__PURE__ */ React.createElement("p", {
-    className: "small-generic-boost-date-display line-clamp-1 text-[12px] text-grayscale-700  px-[7px]"
-  }, dateDisplay), /* @__PURE__ */ React.createElement("div", {
-    className: "boost-verifier-badge-display"
-  }, verifierBadge), isInSkillsModal && /* @__PURE__ */ React.createElement(CertDisplayCardSkillsCount, {
+    className: "small-generic-boost-date-display line-clamp-1 flex items-center justify-center text-center text-[12px] text-grayscale-700  px-[7px]"
+  }, verifierBadge, dateDisplay), isInSkillsModal && /* @__PURE__ */ React.createElement(CertDisplayCardSkillsCount, {
     skills: (_a = credential == null ? void 0 : credential.skills) != null ? _a : [],
     onClick: handleInnerClick,
     className: "boost-generic",
     isInSkillsModal
-  })), showChecked && /* @__PURE__ */ React.createElement("div", {
+  }))), linkedCredentialsCount > 0 && /* @__PURE__ */ React.createElement("div", {
+    className: `absolute bottom-0 left-0 h-[20px] w-full rounded-b-[20px] flex items-center justify-center py-4 mt-1 ${linkedCredentialsClassName}`
+  }, /* @__PURE__ */ React.createElement(DisplayIcon, {
+    className: `h-[20px] w-[20px]`
+  }), " ", /* @__PURE__ */ React.createElement("span", {
+    className: "ml-2 font-poppins text-sm font-semibold text-white"
+  }, "+", linkedCredentialsCount, " Linked")), showChecked && /* @__PURE__ */ React.createElement("div", {
     className: "check-btn-overlay absolute top-[5px] left-[5px]"
   }, /* @__PURE__ */ React.createElement(CircleCheckButton, {
     checked: checkStatus,
     onClick: onCheckClick,
     className: checkBtnClass
-  }))));
+  })));
 };
 
 export { BoostGenericCard as B };
-//# sourceMappingURL=BoostGenericCard-b87d4600.js.map
+//# sourceMappingURL=BoostGenericCard-3a36ddf6.js.map

package/dist/esm/BoostGenericCard-3a36ddf6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BoostGenericCard-3a36ddf6.js","sources":["../../src/helpers/display.helpers.ts","../../src/components/BoostGenericCard/BoostGenericCard.tsx"],"sourcesContent":["import { LCCategoryEnum } from '../types';\n\nimport { BadgeDisplayIcon } from '../components/svgs/BadgeDisplayIcon';\nimport { CertificateDisplayIcon } from '../components/svgs/CertificateDisplayIcon';\nimport { IDDisplayIcon } from '../components/svgs/IDDisplayIcon';\nimport { CourseDisplayIcon } from '../components/svgs/CourseDisplayIcon';\nimport { AwardDisplayIcon } from '../components/svgs/AwardDisplayIcon';\n\nexport enum DisplayTypeEnum {\n    Badge = 'badge',\n    Certificate = 'certificate',\n    ID = 'id',\n    Course = 'course',\n    Award = 'award',\n}\n\nexport const getDefaultDisplayType = (category: string): DisplayTypeEnum => {\n    if (category === LCCategoryEnum.socialBadge || category === LCCategoryEnum.workHistory) {\n        return DisplayTypeEnum.Badge;\n    }\n\n    if (category === LCCategoryEnum.id || category === LCCategoryEnum.membership) {\n        return DisplayTypeEnum.ID;\n    }\n\n    if (\n        category === LCCategoryEnum.achievement ||\n        category === LCCategoryEnum.accommodations ||\n        category === LCCategoryEnum.accomplishments ||\n        category === LCCategoryEnum.learningHistory\n    ) {\n        return DisplayTypeEnum.Certificate;\n    }\n\n    return DisplayTypeEnum.Badge;\n};\n\nexport const getDisplayIcon = (displayType: DisplayTypeEnum): React.FC<{ className?: string }> => {\n    switch (displayType) {\n        case DisplayTypeEnum.Badge:\n            return BadgeDisplayIcon;\n        case DisplayTypeEnum.Certificate:\n            return CertificateDisplayIcon;\n        case DisplayTypeEnum.ID:\n            return IDDisplayIcon;\n        case DisplayTypeEnum.Course:\n            return CourseDisplayIcon;\n        case DisplayTypeEnum.Award:\n            return AwardDisplayIcon;\n        default:\n            return BadgeDisplayIcon;\n    }\n};\n","import React from 'react';\nimport { BoostGenericCardProps, WalletCategoryTypes } from '../../types';\nimport { TYPE_TO_IMG_SRC, TYPE_TO_WALLET_DARK_COLOR } from '../../constants';\nimport { CircleCheckButton } from '../CircleCheckButton';\nimport ThreeDots from '../../assets/images/DotsThreeOutline.svg';\nimport { DisplayTypeEnum, getDisplayIcon } from '../../helpers/display.helpers';\nimport { CertDisplayCardSkillsCount } from '../CertificateDisplayCard';\n\nexport const BoostGenericCard: React.FC<BoostGenericCardProps> = ({\n    title,\n    customTitle,\n    thumbImgSrc,\n    customThumbClass = '',\n    customHeaderClass = '',\n    type = WalletCategoryTypes.achievements,\n    className,\n    onCheckClick,\n    showChecked,\n    checkStatus,\n    customThumbComponent,\n    innerOnClick,\n    bgImgSrc,\n    issuerName,\n    customIssuerName,\n    dateDisplay,\n    customDateDisplay,\n    optionsTriggerOnClick,\n    verifierBadge,\n    credential,\n    isInSkillsModal,\n    displayType,\n    linkedCredentialsCount = 0,\n    linkedCredentialsClassName = '',\n}) => {\n    const thumbClass = TYPE_TO_WALLET_DARK_COLOR[type]\n        ? `bg-${TYPE_TO_WALLET_DARK_COLOR[type]}`\n        : 'bg-grayscale-50';\n    const defaultThumbClass = `small-boost-card-thumb flex h-[110px] w-[110px] my-[10px] mx-auto ${thumbClass} overflow-hidden flex-col justify-center items-center rounded-full ${customThumbClass}`;\n    const imgSrc = thumbImgSrc?.trim() !== '' ? thumbImgSrc : TYPE_TO_IMG_SRC[type];\n    const headerBgColor = TYPE_TO_WALLET_DARK_COLOR[type]\n        ? `bg-${TYPE_TO_WALLET_DARK_COLOR[type]}`\n        : 'bg-grayscale-900';\n    const checkBtnClass = checkStatus ? 'generic-vc-card checked' : 'generic-vc-card unchecked';\n    const defaultHeaderClass = `flex generic-card-title w-full justify-center ${customHeaderClass}`;\n\n    const handleInnerClick = () => {\n        innerOnClick?.();\n    };\n\n    const handleOptionsClick = () => {\n        optionsTriggerOnClick?.();\n    };\n\n    const DisplayIcon = getDisplayIcon(displayType as DisplayTypeEnum);\n\n    return (\n        <div\n            className={`flex generic-display-card-simple bg-white flex-col shadow-bottom relative py-[0px] px-[0px] w-[160px] h-[265px] min-h-[265px] rounded-[20px] overflow-hidden ${className}`}\n        >\n            {optionsTriggerOnClick && (\n                <section\n                    className=\"absolute cursor-pointer shadow-bottom h-[30px] w-[30px] top-[5px] right-[5px] rounded-full overflow-hidden z-20 bg-white flex items-center justify-center\"\n                    onClick={handleOptionsClick}\n                >\n                    <img\n                        alt=\"Menu dropdown icon\"\n                        className=\"h-[20px] w-[20px] object-cover overflow-hidden\"\n                        src={ThreeDots}\n                    />\n                </section>\n            )}\n\n            {bgImgSrc && (\n                <section className=\"absolute top-[-50px] shadow-bottom left-[0px] rounded-b-full overflow-hidden z-0 mt-3\">\n                    <img className=\"h-full w-full object-cover overflow-hidden\" src={bgImgSrc} />\n                </section>\n            )}\n            <button\n                type=\"button\"\n                className=\"boost-small-card inner-click-container z-10\"\n                onClick={handleInnerClick}\n            >\n                {customThumbComponent && customThumbComponent}\n                {!customThumbComponent && (\n                    <section className={defaultThumbClass}>\n                        {thumbImgSrc && thumbImgSrc?.trim() !== '' && (\n                            <img\n                                className=\"generic-display-card-img h-full w-full  w-[110px] h-[110px] rounded-full object-cover overflow-hidden\"\n                                src={thumbImgSrc ?? ''}\n                                alt=\"Credential Achievement Image\"\n                            />\n                        )}\n                        {(!thumbImgSrc || thumbImgSrc?.trim() === '') && (\n                            <img\n                                className=\"max-w-[110px] w-full h-full p-[0px] object-cover rounded-full\"\n                                src={imgSrc}\n                            />\n                        )}\n                    </section>\n                )}\n                <section className=\"boost-generic-info-section\">\n                    {!customTitle && (\n                        <div className={`${defaultHeaderClass} items-center`}>\n                            <p className=\"relative z-[100] small-boost-title text-[16px] leading-[130%] px-[0px] font-medium text-center text-grayscale-900 line-clamp-2 max-w-full\">\n                                {title}\n                            </p>\n                        </div>\n                    )}\n\n                    {customTitle && customTitle}\n\n                    {customIssuerName && customIssuerName}\n                    {!customIssuerName && (\n                        <span className=\"flex items-center justify-center small-generic-boost-issuer-name line-clamp-1 text-[12px] text-grayscale-700 px-[6px]\">\n                            by <span className=\"font-bold whitespace-pre\"> {issuerName}</span>\n                        </span>\n                    )}\n\n                    {customDateDisplay && customDateDisplay}\n                    {!customDateDisplay && (\n                        <p className=\"small-generic-boost-date-display line-clamp-1 flex items-center justify-center text-center text-[12px] text-grayscale-700  px-[7px]\">\n                            {verifierBadge}\n                            {dateDisplay}\n                        </p>\n                    )}\n\n                    {isInSkillsModal && (\n                        <CertDisplayCardSkillsCount\n                            skills={credential?.skills ?? []}\n                            onClick={handleInnerClick}\n                            className={'boost-generic'}\n                            isInSkillsModal={isInSkillsModal}\n                        />\n                    )}\n                </section>\n            </button>\n\n            {/* Linked Credentials */}\n            {linkedCredentialsCount > 0 && (\n                <div\n                    className={`absolute bottom-0 left-0 h-[20px] w-full rounded-b-[20px] flex items-center justify-center py-4 mt-1 ${linkedCredentialsClassName}`}\n                >\n                    <DisplayIcon className={`h-[20px] w-[20px]`} />{' '}\n                    <span className=\"ml-2 font-poppins text-sm font-semibold text-white\">\n                        +{linkedCredentialsCount} Linked\n                    </span>\n                </div>\n            )}\n\n            {showChecked && (\n                <div className=\"check-btn-overlay absolute top-[5px] left-[5px]\">\n                    <CircleCheckButton\n                        checked={checkStatus}\n                        onClick={onCheckClick}\n                        className={checkBtnClass}\n                    />\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport default BoostGenericCard;\n"],"names":[],"mappings":"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"}

package/dist/esm/{CertificateDisplayCard-a8eff954.js → CertificateDisplayCard-98ec793a.js}

@@ -418,7 +418,8 @@ const CertificateBackFace = ({
   onMediaAttachmentClick,
   enableLightbox,
   showBackButton,
-  handleViewFrontFace
+  handleViewFrontFace,
+  customLinkedCredentialsComponent
 }) => {
   var _a, _b, _c, _d, _e, _f, _g;
   const { createdAt, credentialSubject } = getInfoFromCredential(credential, "MMM dd, yyyy", {
@@ -456,7 +457,7 @@ const CertificateBackFace = ({
   }, "Awarded on ", createdAt)), criteria && /* @__PURE__ */ React.createElement(TruncateTextBox, {
     headerText: "Criteria",
     text: criteria
-  }), ((_f = (_e = credential.skills) == null ? void 0 : _e.length) != null ? _f : 0) > 0 && (customSkillsComponent ? customSkillsComponent : /* @__PURE__ */ React.createElement(SkillsBox, {
+  }), customLinkedCredentialsComponent && customLinkedCredentialsComponent, ((_f = (_e = credential.skills) == null ? void 0 : _e.length) != null ? _f : 0) > 0 && (customSkillsComponent ? customSkillsComponent : /* @__PURE__ */ React.createElement(SkillsBox, {
     skills: (_g = credential.skills) != null ? _g : []
   })), credential.attachments && credential.attachments.length > 0 && /* @__PURE__ */ React.createElement(MediaAttachmentsBox, {
     attachments: credential.attachments,
@@ -744,7 +745,8 @@ const CertificateDisplayCard = ({
   hideNavButtons,
   showBackButton = false,
   showDetailsBtn = false,
-  formattedDisplayType
+  formattedDisplayType,
+  customLinkedCredentialsComponent
 }) => {
   const [_isFront, _setIsFront] = useState(isFrontOverride != null ? isFrontOverride : true);
   const isFront = isFrontOverride != null ? isFrontOverride : _isFront;
@@ -776,7 +778,8 @@ const CertificateDisplayCard = ({
     onMediaAttachmentClick,
     enableLightbox,
     showBackButton: showBackButton && !hideNavButtons || showDetailsBtn,
-    handleViewFrontFace: () => setIsFront(!isFront)
+    handleViewFrontFace: () => setIsFront(!isFront),
+    customLinkedCredentialsComponent
   }), onDotsClick && /* @__PURE__ */ React.createElement("button", {
     className: "absolute right-[-20px] top-[-52px] bg-white rounded-full p-[10px] shadow-bottom",
     onClick: onDotsClick
@@ -803,4 +806,4 @@ const CertificateDisplayCard = ({
 };
 
 export { AlignmentsBox as A, CertificateBackFace as C, CertificateDisplayCard as a, CertificateFrontFace as b };
-//# sourceMappingURL=CertificateDisplayCard-a8eff954.js.map
+//# sourceMappingURL=CertificateDisplayCard-98ec793a.js.map