@learncard/react 2.5.14 → 2.5.16

package/dist/cjs/index32.js

@@ -2,21 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var VCDisplayBackFace = require('./VCDisplayBackFace-ecbdb75a.js');
+var SmallAchievementCard = require('./SmallAchievementCard-c76701ce.js');
 require('react');
-require('./VCVerificationCheck-08011d1a.js');
-require('./vc.check.svg');
-require('./CircleSpinner-093cce04.js');
-require('./VCVerificationPill-b1d50716.js');
-require('./types.esm-a0c2e427.js');
-require('./RedXCircle.svg');
-require('./GreenCheckCircle.svg');
-require('./YellowWarningCircle.svg');
-require('./ArrowArcRight.svg');
-require('./credential.helpers-ede99a07.js');
-require('./index-a961acab.js');
+require('./Trophy-9ede7f2b.js');
 
 
 
-exports.VCDisplayBackFace = VCDisplayBackFace.VCDisplayBackFace;
+exports.SmallAchievementCard = SmallAchievementCard.SmallAchievementCard;
 //# sourceMappingURL=index32.js.map

package/dist/cjs/index32.js.map

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

package/dist/cjs/index33.js

@@ -2,25 +2,23 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var VCDisplayCard = require('./VCDisplayCard-8de5bb09.js');
 require('react');
-require('./FlippyCard-209549c5.js');
-require('./icon.green.fat-arrow.png');
-require('./default-face.jpeg');
-require('./VCVerificationCheck-08011d1a.js');
-require('./vc.check.svg');
-require('./CircleSpinner-093cce04.js');
-require('./credential.helpers-ede99a07.js');
-require('./types.esm-a0c2e427.js');
-require('./index-a961acab.js');
-require('./VCDisplayBackFace-ecbdb75a.js');
-require('./VCVerificationPill-b1d50716.js');
-require('./RedXCircle.svg');
-require('./GreenCheckCircle.svg');
-require('./YellowWarningCircle.svg');
-require('./ArrowArcRight.svg');
+var AwardRibbon = require('./AwardRibbon-14ba45fb.js');
+var User = require('./User-92f9cf40.js');
+var Checkmark = require('./Checkmark-f611aa4d.js');
+var GenericArrow = require('./GenericArrow-8dfb261d.js');
+var Lightbulb = require('./Lightbulb-1c28af02.js');
+var Trophy = require('./Trophy-9ede7f2b.js');
 
 
 
-exports.VCDisplayCard = VCDisplayCard.VCDisplayCard;
+exports.AwardRibbon = AwardRibbon.AwardRibbon;
+exports.Briefcase = User.Briefcase;
+exports.Coins = User.Coins;
+exports.Graduation = User.Graduation;
+exports.User = User.User;
+exports.Checkmark = Checkmark.Checkmark;
+exports.GenericArrow = GenericArrow.GenericArrow;
+exports.Lightbulb = Lightbulb.Lightbulb;
+exports.Trophy = Trophy.Trophy;
 //# sourceMappingURL=index33.js.map

package/dist/cjs/index33.js.map

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

package/dist/cjs/index34.js

@@ -2,19 +2,30 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var VCCard = require('./VCCard-c82aadc9.js');
 require('react');
-var VCDisplayCard2 = require('./VCDisplayCard2-7b58036f.js');
+require('@learncard/core');
+require('./VCDisplayCard-043dc048.js');
+require('./FlippyCard-209549c5.js');
+require('./icon.green.fat-arrow.png');
 require('./default-face.jpeg');
-require('./index-a961acab.js');
-require('./types.esm-a0c2e427.js');
-require('./VCVerificationCheck-08011d1a.js');
+require('./VCVerificationCheck-46fa75d3.js');
 require('./vc.check.svg');
 require('./CircleSpinner-093cce04.js');
-require('./credential.helpers-ede99a07.js');
+require('./credential.helpers-86774cc9.js');
+require('./types.esm-6fa436eb.js');
+require('./index-a961acab.js');
+require('./VCDisplayBackFace-7000dc04.js');
+require('./VCVerificationPill-f270da3c.js');
+require('./RedXCircle.svg');
+require('./GreenCheckCircle.svg');
+require('./YellowWarningCircle.svg');
+require('./ArrowArcRight.svg');
+require('./VCDisplayCard2-2227e05c.js');
 require('./AwardRibbon-14ba45fb.js');
 require('./index-d836b84d.js');
 
 
 
-exports.VCDisplayCard2 = VCDisplayCard2.VCDisplayCard2;
+exports.VCCard = VCCard.VCCard;
 //# sourceMappingURL=index34.js.map

package/dist/cjs/index34.js.map

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

package/dist/cjs/index35.js

@@ -1,10 +1,22 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var VCDisplayBackFace = require('./VCDisplayBackFace-7000dc04.js');
 require('react');
-require('./icon.green.fat-arrow.png');
-require('./default-face.jpeg');
+require('./VCVerificationCheck-46fa75d3.js');
 require('./vc.check.svg');
-require('./types.esm-a0c2e427.js');
+require('./CircleSpinner-093cce04.js');
+require('./VCVerificationPill-f270da3c.js');
+require('./types.esm-6fa436eb.js');
+require('./RedXCircle.svg');
+require('./GreenCheckCircle.svg');
+require('./YellowWarningCircle.svg');
+require('./ArrowArcRight.svg');
+require('./credential.helpers-86774cc9.js');
 require('./index-a961acab.js');
 
+
+
+exports.VCDisplayBackFace = VCDisplayBackFace.VCDisplayBackFace;
 //# sourceMappingURL=index35.js.map

package/dist/cjs/index35.js.map

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

package/dist/cjs/index36.js

@@ -2,12 +2,25 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var VCThumbnail = require('./VCThumbnail-6bf86bb2.js');
+var VCDisplayCard = require('./VCDisplayCard-043dc048.js');
 require('react');
+require('./FlippyCard-209549c5.js');
 require('./icon.green.fat-arrow.png');
-require('./verified-check.png');
+require('./default-face.jpeg');
+require('./VCVerificationCheck-46fa75d3.js');
+require('./vc.check.svg');
+require('./CircleSpinner-093cce04.js');
+require('./credential.helpers-86774cc9.js');
+require('./types.esm-6fa436eb.js');
+require('./index-a961acab.js');
+require('./VCDisplayBackFace-7000dc04.js');
+require('./VCVerificationPill-f270da3c.js');
+require('./RedXCircle.svg');
+require('./GreenCheckCircle.svg');
+require('./YellowWarningCircle.svg');
+require('./ArrowArcRight.svg');
 
 
 
-exports.VCThumbnail = VCThumbnail.VCThumbnail;
+exports.VCDisplayCard = VCDisplayCard.VCDisplayCard;
 //# sourceMappingURL=index36.js.map

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,14 +2,19 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var VCVerificationCheck = require('./VCVerificationCheck-08011d1a.js');
 require('react');
+var VCDisplayCard2 = require('./VCDisplayCard2-2227e05c.js');
+require('./default-face.jpeg');
+require('./index-a961acab.js');
+require('./types.esm-6fa436eb.js');
+require('./VCVerificationCheck-46fa75d3.js');
 require('./vc.check.svg');
 require('./CircleSpinner-093cce04.js');
+require('./credential.helpers-86774cc9.js');
+require('./AwardRibbon-14ba45fb.js');
+require('./index-d836b84d.js');
 
 
 
-exports.VCVerificationCheck = VCVerificationCheck.VCVerificationCheck;
-exports.VCVerificationCheckWithSpinner = VCVerificationCheck.VCVerificationCheckWithSpinner;
-exports.VCVerificationCheckWithText = VCVerificationCheck.VCVerificationCheckWithText;
+exports.VCDisplayCard2 = VCDisplayCard2.VCDisplayCard2;
 //# sourceMappingURL=index37.js.map

package/dist/cjs/index37.js.map

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

package/dist/cjs/index38.js

@@ -1,15 +1,10 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var VCVerificationPill = require('./VCVerificationPill-b1d50716.js');
 require('react');
-require('./types.esm-a0c2e427.js');
-require('./RedXCircle.svg');
-require('./GreenCheckCircle.svg');
-require('./YellowWarningCircle.svg');
-
-
+require('./icon.green.fat-arrow.png');
+require('./default-face.jpeg');
+require('./vc.check.svg');
+require('./types.esm-6fa436eb.js');
+require('./index-a961acab.js');
 
-exports.ValidationStateIndicator = VCVerificationPill.ValidationStateIndicator;
 //# sourceMappingURL=index38.js.map

package/dist/cjs/index38.js.map

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

package/dist/cjs/index39.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var VCThumbnail = require('./VCThumbnail-6bf86bb2.js');
+require('react');
+require('./icon.green.fat-arrow.png');
+require('./verified-check.png');
+
+
+
+exports.VCThumbnail = VCThumbnail.VCThumbnail;
+//# sourceMappingURL=index39.js.map

package/dist/cjs/index39.js.map

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

package/dist/cjs/index40.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var VCVerificationCheck = require('./VCVerificationCheck-46fa75d3.js');
+require('react');
+require('./vc.check.svg');
+require('./CircleSpinner-093cce04.js');
+
+
+
+exports.VCVerificationCheck = VCVerificationCheck.VCVerificationCheck;
+exports.VCVerificationCheckWithSpinner = VCVerificationCheck.VCVerificationCheckWithSpinner;
+exports.VCVerificationCheckWithText = VCVerificationCheck.VCVerificationCheckWithText;
+//# sourceMappingURL=index40.js.map

package/dist/cjs/index40.js.map

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

package/dist/cjs/index41.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var VCVerificationPill = require('./VCVerificationPill-f270da3c.js');
+require('react');
+require('./types.esm-6fa436eb.js');
+require('./RedXCircle.svg');
+require('./GreenCheckCircle.svg');
+require('./YellowWarningCircle.svg');
+
+
+
+exports.ValidationStateIndicator = VCVerificationPill.ValidationStateIndicator;
+//# sourceMappingURL=index41.js.map

package/dist/cjs/index41.js.map

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

package/dist/cjs/notifications-56c6fc94.js

@@ -0,0 +1,21 @@
+'use strict';
+
+var NotificationTypeEnum = /* @__PURE__ */ ((NotificationTypeEnum2) => {
+  NotificationTypeEnum2["Currency"] = "currency";
+  NotificationTypeEnum2["ID"] = "id";
+  NotificationTypeEnum2["Achievement"] = "achievement";
+  NotificationTypeEnum2["Skill"] = "skill";
+  NotificationTypeEnum2["Job"] = "job";
+  NotificationTypeEnum2["Learning"] = "learning";
+  NotificationTypeEnum2["SocialBadges"] = "socialBadge";
+  return NotificationTypeEnum2;
+})(NotificationTypeEnum || {});
+var UserNotificationTypeEnum = /* @__PURE__ */ ((UserNotificationTypeEnum2) => {
+  UserNotificationTypeEnum2["ConnectionRequest"] = "connection";
+  UserNotificationTypeEnum2["AcceptedBoost"] = "acceptedBoost";
+  return UserNotificationTypeEnum2;
+})(UserNotificationTypeEnum || {});
+
+exports.NotificationTypeEnum = NotificationTypeEnum;
+exports.UserNotificationTypeEnum = UserNotificationTypeEnum;
+//# sourceMappingURL=notifications-56c6fc94.js.map

package/dist/cjs/notifications-56c6fc94.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"notifications-56c6fc94.js","sources":["../../src/constants/notifications.ts"],"sourcesContent":["export enum NotificationTypeEnum {\n    Currency = 'currency',\n    ID = 'id',\n    Achievement = 'achievement',\n    Skill = 'skill',\n    Job = 'job',\n    Learning = 'learning',\n    SocialBadges = 'socialBadge',\n}\n\nexport enum UserNotificationTypeEnum {\n    ConnectionRequest = 'connection',\n    AcceptedBoost = 'acceptedBoost',\n}\n"],"names":["NotificationTypeEnum","UserNotificationTypeEnum"],"mappings":";;AAAY,IAAA,oBAAA,qBAAAA,qBAAL,KAAA;AACH,EAAAA,sBAAA,UAAW,CAAA,GAAA,UAAA,CAAA;AACX,EAAAA,sBAAA,IAAK,CAAA,GAAA,IAAA,CAAA;AACL,EAAAA,sBAAA,aAAc,CAAA,GAAA,aAAA,CAAA;AACd,EAAAA,sBAAA,OAAQ,CAAA,GAAA,OAAA,CAAA;AACR,EAAAA,sBAAA,KAAM,CAAA,GAAA,KAAA,CAAA;AACN,EAAAA,sBAAA,UAAW,CAAA,GAAA,UAAA,CAAA;AACX,EAAAA,sBAAA,cAAe,CAAA,GAAA,aAAA,CAAA;AAPP,EAAAA,OAAAA,qBAAAA,CAAAA;AAAA,CAAA,EAAA,oBAAA,IAAA,EAAA,EAAA;AAUA,IAAA,wBAAA,qBAAAC,yBAAL,KAAA;AACH,EAAAA,0BAAA,mBAAoB,CAAA,GAAA,YAAA,CAAA;AACpB,EAAAA,0BAAA,eAAgB,CAAA,GAAA,eAAA,CAAA;AAFR,EAAAA,OAAAA,yBAAAA,CAAAA;AAAA,CAAA,EAAA,wBAAA,IAAA,EAAA;;;;;"}

package/dist/cjs/{Notification-cd651569.js → types-c83b33ec.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-var React = require('react');
+var notifications = require('./notifications-56c6fc94.js');
 var Trophy = require('./Trophy-9ede7f2b.js');
-var User = require('./User-7408bdf0.js');
-var AwardRibbon = require('./AwardRibbon-14ba45fb.js');
+var User = require('./User-92f9cf40.js');
+var React = require('react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -24,75 +24,85 @@ const PuzzlePiece = ({ className = "" }) => {
   }));
 };
 
-var NotificationTypeEnum = /* @__PURE__ */ ((NotificationTypeEnum2) => {
-  NotificationTypeEnum2["Currency"] = "currency";
-  NotificationTypeEnum2["ID"] = "id";
-  NotificationTypeEnum2["Achievement"] = "achievement";
-  NotificationTypeEnum2["Skill"] = "skill";
-  NotificationTypeEnum2["Job"] = "job";
-  NotificationTypeEnum2["Learning"] = "learning";
-  NotificationTypeEnum2["SocialBadges"] = "socialBadge";
-  return NotificationTypeEnum2;
-})(NotificationTypeEnum || {});
+const ShieldChevron = ({ className }) => {
+  return /* @__PURE__ */ React__default["default"].createElement("svg", {
+    viewBox: "0 0 46 46",
+    fill: "none",
+    className,
+    "data-testid": "socialBadge-icon"
+  }, /* @__PURE__ */ React__default["default"].createElement("path", {
+    d: "M7.53125 19.25V8.9375C7.53125 8.56454 7.67941 8.20685 7.94313 7.94313C8.20685 7.67941 8.56454 7.53125 8.9375 7.53125H37.0625C37.4355 7.53125 37.7931 7.67941 38.0569 7.94313C38.3206 8.20685 38.4688 8.56454 38.4688 8.9375V19.25C38.4688 34.0183 25.9345 38.9112 23.4318 39.7409C23.152 39.8372 22.848 39.8372 22.5682 39.7409C20.0655 38.9112 7.53125 34.0183 7.53125 19.25Z",
+    stroke: "currentColor",
+    strokeWidth: "4",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React__default["default"].createElement("path", {
+    d: "M36.0785 29.3425L23 20.1875L9.92139 29.3425",
+    stroke: "currentColor",
+    strokeWidth: "4",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+};
 
 const NotificationTypeStyles = {
-  [NotificationTypeEnum.Currency]: {
+  [notifications.NotificationTypeEnum.Currency]: {
     viewButtonStyles: "border-cyan-400 text-cyan-400",
-    unclaimedButtonStyles: "text-white bg-cyan-400 border-cyan-400",
+    unclaimedButtonStyles: "text-white bg-cyan-400 border-cyan-400 shadow-bottom",
     claimedButtonStyles: "text-cyan-400 bg-cyan-50 border-cyan-50",
     textStyles: "text-cyan-400 capitalize",
     iconCircleStyles: "bg-cyan-400",
     IconComponent: User.Coins,
     typeText: "Currency"
   },
-  [NotificationTypeEnum.SocialBadges]: {
+  [notifications.NotificationTypeEnum.SocialBadges]: {
     viewButtonStyles: "border-cyan-400 text-cyan-400",
-    unclaimedButtonStyles: "text-white bg-cyan-400 border-cyan-400",
+    unclaimedButtonStyles: "text-white bg-cyan-400 border-cyan-400 shadow-bottom",
     claimedButtonStyles: "text-cyan-400 bg-cyan-50 border-cyan-50",
     textStyles: "text-cyan-400 capitalize",
     iconCircleStyles: "bg-cyan-400",
-    IconComponent: AwardRibbon.AwardRibbon,
+    IconComponent: ShieldChevron,
     typeText: "Social Badge"
   },
-  [NotificationTypeEnum.ID]: {
+  [notifications.NotificationTypeEnum.ID]: {
     viewButtonStyles: "border-yellow-400 text-yellow-400",
-    unclaimedButtonStyles: "text-white bg-yellow-400 border-yellow-400",
+    unclaimedButtonStyles: "text-white bg-yellow-400 border-yellow-400 shadow-bottom",
     claimedButtonStyles: "text-yellow-400 bg-yellow-50 border-yellow-50",
     textStyles: "text-yellow-400 uppercase",
     iconCircleStyles: "bg-yellow-400",
     IconComponent: User.User,
     typeText: "ID"
   },
-  [NotificationTypeEnum.Achievement]: {
+  [notifications.NotificationTypeEnum.Achievement]: {
     viewButtonStyles: "border-spice-600 text-spice-400",
-    unclaimedButtonStyles: "text-white bg-spice-400 border-spice-400",
+    unclaimedButtonStyles: "text-white bg-spice-400 border-spice-400 shadow-bottom",
     claimedButtonStyles: "text-spice-400 bg-spice-50 border-spice-50",
     textStyles: "text-spice-400 capitalize",
     iconCircleStyles: "bg-spice-400",
     IconComponent: Trophy.Trophy,
     typeText: "Achievement"
   },
-  [NotificationTypeEnum.Skill]: {
+  [notifications.NotificationTypeEnum.Skill]: {
     viewButtonStyles: "border-indigo-400 text-indigo-400",
-    unclaimedButtonStyles: "text-white bg-indigo-400 border-indigo-400",
+    unclaimedButtonStyles: "text-white bg-indigo-400 border-indigo-400 shadow-bottom",
     claimedButtonStyles: "text-indigo-400 bg-indigo-50 border-indigo-50",
     textStyles: "text-indigo-400 capitalize",
     iconCircleStyles: "bg-indigo-400",
     IconComponent: PuzzlePiece,
     typeText: "Skill"
   },
-  [NotificationTypeEnum.Job]: {
+  [notifications.NotificationTypeEnum.Job]: {
     viewButtonStyles: "border-rose-400 text-rose-400",
-    unclaimedButtonStyles: "text-white bg-rose-400 border-rose-400",
+    unclaimedButtonStyles: "text-white bg-rose-400 border-rose-400 shadow-bottom",
     claimedButtonStyles: "text-rose-400 bg-rose-50 border-rose-50",
     textStyles: "text-rose-400 capitalize",
     iconCircleStyles: "bg-rose-400",
     IconComponent: User.Briefcase,
     typeText: "Work History"
   },
-  [NotificationTypeEnum.Learning]: {
+  [notifications.NotificationTypeEnum.Learning]: {
     viewButtonStyles: "border-emerald-500 text-emerald-500",
-    unclaimedButtonStyles: "text-white bg-emerald-500 border-emerald-500",
+    unclaimedButtonStyles: "text-white bg-emerald-500 border-emerald-500 shadow-bottom",
     claimedButtonStyles: "text-emerald-500 bg-emerald-50 border-emerald-50",
     textStyles: "text-emerald-500 capitalize",
     iconCircleStyles: "bg-emerald-500",
@@ -101,87 +111,5 @@ const NotificationTypeStyles = {
   }
 };
 
-const Notification = ({
-  title,
-  issuerImage,
-  issueDate,
-  className,
-  notificationType = NotificationTypeEnum.Achievement,
-  handleViewOnClick = () => {
-  },
-  claimStatus = false,
-  handleClaimOnClick = () => {
-  },
-  loadingState = false
-}) => {
-  const [isClaimed, setIsClaimed] = React.useState(claimStatus || false);
-  const [isLoading, setIsLoading] = React.useState(loadingState || false);
-  React.useEffect(() => {
-    setIsClaimed(claimStatus);
-  }, [claimStatus]);
-  React.useEffect(() => {
-    setIsLoading(loadingState);
-  }, [loadingState]);
-  const {
-    IconComponent,
-    iconCircleStyles,
-    textStyles,
-    viewButtonStyles,
-    claimedButtonStyles,
-    unclaimedButtonStyles,
-    typeText
-  } = NotificationTypeStyles[notificationType];
-  const claimButtonStyles = isClaimed ? claimedButtonStyles : unclaimedButtonStyles;
-  let buttonText = "";
-  if (isClaimed) {
-    buttonText = "Claimed";
-  } else if (!isClaimed) {
-    buttonText = "Claim";
-  }
-  return /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: `flex justify-center items-center relative w-full rounded-3xl shadow-2xl py-3 bg-white ${className}`
-  }, /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: `absolute flex items-center justify-center top-2 right-2 h-8 w-8 overflow-hidden rounded-full z-10 ${iconCircleStyles}`
-  }, /* @__PURE__ */ React__default["default"].createElement(IconComponent, {
-    className: "h-4/5 text-white"
-  })), /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: "flex flex-col justify-center items-center relative w-11/12"
-  }, /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: "flex flex-row items-center justify-start w-full"
-  }, /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: `h-12 w-12 max-h-12 max-w-[48px] min-h-[48px] min-w-[48px] overflow-hidden rounded-full ${iconCircleStyles}`
-  }, /* @__PURE__ */ React__default["default"].createElement("img", {
-    src: issuerImage,
-    alt: "issuer image",
-    className: "w-full h-full object-cover"
-  })), /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: "text-left ml-3"
-  }, /* @__PURE__ */ React__default["default"].createElement("h4", {
-    className: "font-bold tracking-wide line-clamp-1 text-black",
-    "data-testid": "notification-title"
-  }, title), /* @__PURE__ */ React__default["default"].createElement("p", {
-    className: `font-semibold p-0 m-0 leading-none tracking-wide line-clamp-1 ${textStyles}`,
-    "data-testid": "notification-type"
-  }, typeText, " ", /* @__PURE__ */ React__default["default"].createElement("span", {
-    className: "text-grayscale-600 normal-case font-normal text-sm",
-    "data-testid": "notification-cred-issue-date"
-  }, "\u2022 ", issueDate)))), /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: "flex items-center justify-between w-full mt-3"
-  }, /* @__PURE__ */ React__default["default"].createElement("button", {
-    onClick: handleViewOnClick,
-    className: `flex-1 rounded-[24px] border-solid border-2 bg-white font-semibold mr-2 py-2 px-3 tracking-wide ${viewButtonStyles}`,
-    role: "button",
-    name: "notification-view-button"
-  }, "View"), /* @__PURE__ */ React__default["default"].createElement("button", {
-    className: `flex items-center justify-center flex-1 rounded-[24px] border-2 border-solid font-semibold py-2 px-3 tracking-wide ${claimButtonStyles}`,
-    onClick: handleClaimOnClick,
-    role: "button",
-    name: "notification-claim-button"
-  }, isClaimed && /* @__PURE__ */ React__default["default"].createElement(User.Checkmark, {
-    className: "h-[24px] p-0 m-0"
-  }), " ", isLoading ? "Loading..." : buttonText))));
-};
-
-exports.Notification = Notification;
 exports.NotificationTypeStyles = NotificationTypeStyles;
-//# sourceMappingURL=Notification-cd651569.js.map
+//# sourceMappingURL=types-c83b33ec.js.map

package/dist/cjs/types-c83b33ec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types-c83b33ec.js","sources":["../../src/components/svgs/PuzzlePiece.tsx","../../src/components/svgs/ShieldChevron.tsx","../../src/components/Notification/types.ts"],"sourcesContent":["import React from 'react';\n\nconst PuzzlePiece: React.FC<{ className?: string }> = ({ className = '' }) => {\n    return (\n        <svg viewBox=\"0 0 26 26\" fill=\"none\" className={className} data-testid=\"skill-icon\">\n            <path\n                d=\"M6.49991 21.9374C6.39321 21.9374 6.28756 21.9164 6.18898 21.8756C6.0904 21.8347 6.00083 21.7749 5.92538 21.6994C5.84994 21.624 5.79009 21.5344 5.74926 21.4358C5.70843 21.3372 5.68741 21.2316 5.68741 21.1249L5.68747 16.7887C5.25402 16.994 4.7757 17.0863 4.29699 17.0571C3.81827 17.0279 3.35473 16.8781 2.94947 16.6216C2.5442 16.3651 2.21039 16.0103 1.97908 15.5902C1.74776 15.1701 1.62646 14.6983 1.62646 14.2187C1.62646 13.7391 1.74776 13.2672 1.97908 12.8471C2.21039 12.427 2.5442 12.0722 2.94947 11.8157C3.35473 11.5592 3.81827 11.4094 4.29699 11.3802C4.7757 11.351 5.25402 11.4433 5.68747 11.6486L5.68741 7.31241C5.68741 7.20571 5.70843 7.10005 5.74926 7.00148C5.79009 6.9029 5.84994 6.81333 5.92539 6.73788C6.00084 6.66243 6.09041 6.60258 6.18899 6.56175C6.28757 6.52092 6.39322 6.4999 6.49993 6.4999L11.2423 6.49996C11.0371 6.06651 10.9447 5.58819 10.9739 5.10948C11.0031 4.63077 11.153 4.16722 11.4094 3.76196C11.6659 3.3567 12.0207 3.02289 12.4409 2.79158C12.861 2.56026 13.3328 2.43896 13.8124 2.43896C14.292 2.43896 14.7638 2.56026 15.1839 2.79158C15.6041 3.02289 15.9589 3.3567 16.2154 3.76196C16.4718 4.16722 16.6216 4.63077 16.6509 5.10948C16.6801 5.58819 16.5877 6.06651 16.3825 6.49996L21.1249 6.4999C21.3404 6.4999 21.547 6.5855 21.6994 6.73787C21.8518 6.89024 21.9374 7.0969 21.9374 7.31239L21.9374 11.6486C21.504 11.4433 21.0257 11.351 20.5469 11.3802C20.0682 11.4094 19.6047 11.5592 19.1994 11.8157C18.7942 12.0722 18.4604 12.427 18.229 12.8471C17.9977 13.2672 17.8764 13.739 17.8764 14.2187C17.8764 14.6983 17.9977 15.1701 18.229 15.5902C18.4604 16.0103 18.7942 16.3651 19.1994 16.6216C19.6047 16.8781 20.0682 17.0279 20.5469 17.0571C21.0257 17.0863 21.504 16.994 21.9374 16.7887L21.9374 21.1249C21.9374 21.3404 21.8518 21.5471 21.6994 21.6994C21.547 21.8518 21.3404 21.9374 21.1249 21.9374L6.49991 21.9374Z\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n        </svg>\n    );\n};\n\nexport default PuzzlePiece;\n","import React from 'react';\n\nconst ShieldChevron: React.FC<{ className?: string }> = ({ className }) => {\n    return (\n        <svg viewBox=\"0 0 46 46\" fill=\"none\" className={className} data-testid=\"socialBadge-icon\">\n            <path\n                d=\"M7.53125 19.25V8.9375C7.53125 8.56454 7.67941 8.20685 7.94313 7.94313C8.20685 7.67941 8.56454 7.53125 8.9375 7.53125H37.0625C37.4355 7.53125 37.7931 7.67941 38.0569 7.94313C38.3206 8.20685 38.4688 8.56454 38.4688 8.9375V19.25C38.4688 34.0183 25.9345 38.9112 23.4318 39.7409C23.152 39.8372 22.848 39.8372 22.5682 39.7409C20.0655 38.9112 7.53125 34.0183 7.53125 19.25Z\"\n                stroke=\"currentColor\"\n                strokeWidth=\"4\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M36.0785 29.3425L23 20.1875L9.92139 29.3425\"\n                stroke=\"currentColor\"\n                strokeWidth=\"4\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n        </svg>\n    );\n};\n\nexport default ShieldChevron;\n","import { NotificationTypeEnum } from '../../constants/notifications';\n\nimport Trophy from '../svgs/Trophy';\nimport Coins from '../svgs/Coins';\nimport User from '../svgs/User';\nimport Briefcase from '../svgs/Briefcase';\nimport PuzzlePiece from '../svgs/PuzzlePiece';\nimport Graduation from '../svgs/Graduation';\nimport ShieldChevron from '../svgs/ShieldChevron';\n\nexport type NotificationProps = {\n    notificationType: NotificationTypeEnum;\n    title: string;\n    issuerImage?: string;\n    issueDate: string;\n    className?: string;\n    handleViewOnClick: () => void;\n    claimStatus: boolean;\n    handleClaimOnClick: () => void;\n    loadingState: boolean;\n};\n\nexport const NotificationTypeStyles: {\n    [key: NotificationTypeEnum | string]: {\n        viewButtonStyles: string;\n        unclaimedButtonStyles: string;\n        claimedButtonStyles: string;\n        textStyles: string;\n        iconCircleStyles: string;\n        IconComponent: any;\n        typeText: string;\n    };\n} = {\n    [NotificationTypeEnum.Currency]: {\n        viewButtonStyles: 'border-cyan-400 text-cyan-400',\n        unclaimedButtonStyles: 'text-white bg-cyan-400 border-cyan-400 shadow-bottom',\n        claimedButtonStyles: 'text-cyan-400 bg-cyan-50 border-cyan-50',\n        textStyles: 'text-cyan-400 capitalize',\n        iconCircleStyles: 'bg-cyan-400',\n        IconComponent: Coins,\n        typeText: 'Currency',\n    },\n    [NotificationTypeEnum.SocialBadges]: {\n        viewButtonStyles: 'border-cyan-400 text-cyan-400',\n        unclaimedButtonStyles: 'text-white bg-cyan-400 border-cyan-400 shadow-bottom',\n        claimedButtonStyles: 'text-cyan-400 bg-cyan-50 border-cyan-50',\n        textStyles: 'text-cyan-400 capitalize',\n        iconCircleStyles: 'bg-cyan-400',\n        IconComponent: ShieldChevron,\n        typeText: 'Social Badge',\n    },\n    [NotificationTypeEnum.ID]: {\n        viewButtonStyles: 'border-yellow-400 text-yellow-400',\n        unclaimedButtonStyles: 'text-white bg-yellow-400 border-yellow-400 shadow-bottom',\n        claimedButtonStyles: 'text-yellow-400 bg-yellow-50 border-yellow-50',\n        textStyles: 'text-yellow-400 uppercase',\n        iconCircleStyles: 'bg-yellow-400',\n        IconComponent: User,\n        typeText: 'ID',\n    },\n    [NotificationTypeEnum.Achievement]: {\n        viewButtonStyles: 'border-spice-600 text-spice-400',\n        unclaimedButtonStyles: 'text-white bg-spice-400 border-spice-400 shadow-bottom',\n        claimedButtonStyles: 'text-spice-400 bg-spice-50 border-spice-50',\n        textStyles: 'text-spice-400 capitalize',\n        iconCircleStyles: 'bg-spice-400',\n        IconComponent: Trophy,\n        typeText: 'Achievement',\n    },\n    [NotificationTypeEnum.Skill]: {\n        viewButtonStyles: 'border-indigo-400 text-indigo-400',\n        unclaimedButtonStyles: 'text-white bg-indigo-400 border-indigo-400 shadow-bottom',\n        claimedButtonStyles: 'text-indigo-400 bg-indigo-50 border-indigo-50',\n        textStyles: 'text-indigo-400 capitalize',\n        iconCircleStyles: 'bg-indigo-400',\n        IconComponent: PuzzlePiece,\n        typeText: 'Skill',\n    },\n    [NotificationTypeEnum.Job]: {\n        viewButtonStyles: 'border-rose-400 text-rose-400',\n        unclaimedButtonStyles: 'text-white bg-rose-400 border-rose-400 shadow-bottom',\n        claimedButtonStyles: 'text-rose-400 bg-rose-50 border-rose-50',\n        textStyles: 'text-rose-400 capitalize',\n        iconCircleStyles: 'bg-rose-400',\n        IconComponent: Briefcase,\n        typeText: 'Work History',\n    },\n    [NotificationTypeEnum.Learning]: {\n        viewButtonStyles: 'border-emerald-500 text-emerald-500',\n        unclaimedButtonStyles: 'text-white bg-emerald-500 border-emerald-500 shadow-bottom',\n        claimedButtonStyles: 'text-emerald-500 bg-emerald-50 border-emerald-50',\n        textStyles: 'text-emerald-500 capitalize',\n        iconCircleStyles: 'bg-emerald-500',\n        IconComponent: Graduation,\n        typeText: 'Learning History',\n    },\n};\n"],"names":["React","NotificationTypeEnum","Coins","User","Trophy","Briefcase","Graduation"],"mappings":"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"}

package/dist/cjs/types-e4d9a257.js

@@ -0,0 +1,25 @@
+'use strict';
+
+var notifications = require('./notifications-56c6fc94.js');
+
+const UserNotificationTypeStyles = {
+  [notifications.UserNotificationTypeEnum.ConnectionRequest]: {
+    viewButtonStyles: "border-indigo-600 text-indigo-400",
+    unclaimedButtonStyles: "text-white bg-indigo-600 border-indigo-600 shadow-bottom",
+    claimedButtonStyles: "text-indigo-600 bg-indigo-50 border-indigo-50",
+    textStyles: "text-indigo-600 capitalize",
+    iconCircleStyles: "bg-indigo-600",
+    typeText: "Invitation"
+  },
+  [notifications.UserNotificationTypeEnum.AcceptedBoost]: {
+    viewButtonStyles: "border-indigo-600 text-indigo-400",
+    unclaimedButtonStyles: "text-white bg-indigo-600 border-indigo-600 shadow-bottom",
+    claimedButtonStyles: "text-indigo-600 bg-indigo-50 border-indigo-50",
+    textStyles: "text-indigo-600 capitalize",
+    iconCircleStyles: "bg-indigo-600",
+    typeText: "Boost"
+  }
+};
+
+exports.UserNotificationTypeStyles = UserNotificationTypeStyles;
+//# sourceMappingURL=types-e4d9a257.js.map

package/dist/cjs/types-e4d9a257.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types-e4d9a257.js","sources":["../../src/components/NotificationUserCard/types.ts"],"sourcesContent":["import { UserNotificationTypeEnum } from '../../constants/notifications';\n\nexport type NotificationUserCardProps = {\n    className?: string;\n    thumbImage?: string;\n    customThumbComponent?: React.ReactNode;\n    issueDate?: string;\n    handleButtonClick?: () => void;\n    handleCancelClick?: () => void;\n    handleCardClick?: () => void;\n    acceptStatus: boolean;\n    loadingState?: boolean;\n    title?: string;\n    isArchived?: boolean;\n};\n\nexport const UserNotificationTypeStyles: {\n    [key: UserNotificationTypeEnum | string]: {\n        viewButtonStyles: string;\n        unclaimedButtonStyles: string;\n        claimedButtonStyles: string;\n        textStyles: string;\n        iconCircleStyles: string;\n        typeText?: string;\n    };\n} = {\n    [UserNotificationTypeEnum.ConnectionRequest]: {\n        viewButtonStyles: 'border-indigo-600 text-indigo-400',\n        unclaimedButtonStyles: 'text-white bg-indigo-600 border-indigo-600 shadow-bottom',\n        claimedButtonStyles: 'text-indigo-600 bg-indigo-50 border-indigo-50',\n        textStyles: 'text-indigo-600 capitalize',\n        iconCircleStyles: 'bg-indigo-600',\n        typeText: 'Invitation',\n    },\n    [UserNotificationTypeEnum.AcceptedBoost]: {\n        viewButtonStyles: 'border-indigo-600 text-indigo-400',\n        unclaimedButtonStyles: 'text-white bg-indigo-600 border-indigo-600 shadow-bottom',\n        claimedButtonStyles: 'text-indigo-600 bg-indigo-50 border-indigo-50',\n        textStyles: 'text-indigo-600 capitalize',\n        iconCircleStyles: 'bg-indigo-600',\n        typeText: 'Boost',\n    },\n};\n"],"names":["UserNotificationTypeEnum"],"mappings":";;;;AAgBO,MAAM,0BAST,GAAA;AAAA,EACA,CAACA,uCAAyB,iBAAoB,GAAA;AAAA,IAC1C,gBAAkB,EAAA,mCAAA;AAAA,IAClB,qBAAuB,EAAA,0DAAA;AAAA,IACvB,mBAAqB,EAAA,+CAAA;AAAA,IACrB,UAAY,EAAA,4BAAA;AAAA,IACZ,gBAAkB,EAAA,eAAA;AAAA,IAClB,QAAU,EAAA,YAAA;AAAA,GACd;AAAA,EACA,CAACA,uCAAyB,aAAgB,GAAA;AAAA,IACtC,gBAAkB,EAAA,mCAAA;AAAA,IAClB,qBAAuB,EAAA,0DAAA;AAAA,IACvB,mBAAqB,EAAA,+CAAA;AAAA,IACrB,UAAY,EAAA,4BAAA;AAAA,IACZ,gBAAkB,EAAA,eAAA;AAAA,IAClB,QAAU,EAAA,OAAA;AAAA,GACd;AACJ;;;;"}