@learncard/react 2.10.7 → 2.10.8

package/dist/esm/{VCDisplayCard2-72bed598.js → VCDisplayCard2-fc5c4225.js}

@@ -6,12 +6,13 @@ import { d as getBaseUrl, e as VideoIcon, C as Camera, G as GenericDocumentIcon,
 import './index-cb3a593b.js';
 import { L as Lightbox, X } from './Lightbox-f0338a0c.js';
 import { V as VerificationStatusEnum } from './types.esm-d6b48609.js';
+import { u as useT } from './i18n-8454d6ea.js';
 import { A as AlignmentsBox, b as CertificateDisplayCard } from './CertificateDisplayCard-4e9254e0.js';
 import { I as IDIcon, Q as QRCodeIcon, A as AwardRibbon } from './QRCodeIcon-8eef4f7c.js';
 import { a as LCCategoryEnum } from './index-28917993.js';
 import { P as PuzzlePiece } from './PuzzlePiece-a3d9cc62.js';
 import IDSleeve from './id-sleeve.png';
-import { a as MeritBadgeDisplayCard } from './MeritBadgeDisplayCard-a7a504e0.js';
+import { a as MeritBadgeDisplayCard } from './MeritBadgeDisplayCard-2029a552.js';
 
 const RoundedX = ({ className = "" }) => {
   return /* @__PURE__ */ React.createElement(
@@ -677,9 +678,21 @@ var e=function(t){return "number"==typeof t},i=function(t){return "function"==ty
 
 function s(){return s=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n]);}return e},s.apply(this,arguments)}function c(e,t){return c=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},c(e,t)}function d(e,t){if(null==e)return {};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)t.indexOf(r=o[n])>=0||(i[r]=e[r]);return i}var f=/*#__PURE__*/createContext({}),u=/*#__PURE__*/createContext("portal"),h=/*#__PURE__*/function(r){var n,o;function p(){for(var e,t=arguments.length,n=new Array(t),i=0;i<t;i++)n[i]=arguments[i];return (e=r.call.apply(r,[this].concat(n))||this).inProgressAnimations={},e.flipCallbacks={},e.el=void 0,e}o=r,(n=p).prototype=Object.create(o.prototype),n.prototype.constructor=n,c(n,o);var l=p.prototype;return l.getSnapshotBeforeUpdate=function(t){return t.flipKey!==this.props.flipKey&&this.el?q({element:this.el,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations,portalKey:this.props.portalKey}):null},l.componentDidUpdate=function(e,r,n){this.props.flipKey!==e.flipKey&&this.el&&L({flippedElementPositionsBeforeUpdate:n.flippedElementPositions,cachedOrderedFlipIds:n.cachedOrderedFlipIds,containerEl:this.el,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.props.applyTransformOrigin,spring:this.props.spring,debug:this.props.debug,portalKey:this.props.portalKey,staggerConfig:this.props.staggerConfig,handleEnterUpdateDelete:this.props.handleEnterUpdateDelete,decisionData:{previous:e.decisionData,current:this.props.decisionData},onComplete:this.props.onComplete,onStart:this.props.onStart});},l.render=function(){var e=this,t=this.props,r=t.portalKey,n=/*#__PURE__*/React.createElement(f.Provider,{value:this.flipCallbacks},/*#__PURE__*/React.createElement(t.element,{className:t.className,ref:function(t){return e.el=t}},this.props.children));return r&&(n=/*#__PURE__*/React.createElement(u.Provider,{value:r},n)),n},p}(Component);h.defaultProps={applyTransformOrigin:!0,element:"div"};var m=["children","flipId","inverseFlipId","portalKey"],y=["children","flipId","shouldFlip","shouldInvert","onAppear","onStart","onStartImmediate","onComplete","onExit","onSpringUpdate"],g=function(e){var t,i=e.children,o=e.flipId,p$1=e.inverseFlipId,s=e.portalKey,c=d(e,m),f=i,u=function(e){return "function"==typeof e}(f);if(!u)try{f=Children.only(i);}catch(e){throw new Error("Each Flipped component must wrap a single child")}c.scale||c.translate||c.opacity||p.assign(c,{translate:!0,scale:!0,opacity:!0});var h=((t={})[h$1.DATA_FLIP_CONFIG]=JSON.stringify(c),t);return void 0!==o?h[h$1.DATA_FLIP_ID]=String(o):p$1&&(h[h$1.DATA_INVERSE_FLIP_ID]=String(p$1)),void 0!==s&&(h[h$1.DATA_PORTAL_KEY]=s),u?f(h):/*#__PURE__*/cloneElement(f,h)},v=function(e){var t=e.children,n=e.flipId,o=e.shouldFlip,p$1=e.shouldInvert,l=e.onAppear,a=e.onStart,c=e.onStartImmediate,h=e.onComplete,m=e.onExit,v=e.onSpringUpdate,I=d(e,y);return t?I.inverseFlipId?/*#__PURE__*/React.createElement(g,s({},I),t):/*#__PURE__*/React.createElement(u.Consumer,null,function(e){return React.createElement(f.Consumer,null,function(d){return p.isObject(d)&&n&&(d[n]={shouldFlip:o,shouldInvert:p$1,onAppear:l,onStart:a,onStartImmediate:c,onComplete:h,onExit:m,onSpringUpdate:v}),/*#__PURE__*/React.createElement(g,s({flipId:n},I,{portalKey:e}),t)})}):null};v.displayName="Flipped";
 
+const MESSAGE_KEYS = {
+  Valid: "valid",
+  Invalid: "invalid",
+  "Not Revoked": "notRevoked",
+  Revoked: "revoked",
+  "Does Not Expire": "doesNotExpire",
+  Expired: "expired",
+  Active: "active",
+  "Boost Credential could not be verified.": "couldNotVerify",
+  "Boost Credential could not be verified": "couldNotVerify"
+};
 const VerificationRow = ({ verification }) => {
   var _a, _b;
   const [showInfo, setShowInfo] = useState(false);
+  const t = useT();
   const statusColor = getColorForVerificationStatus(verification.status);
   const getIcon = () => {
     switch (verification.status) {
@@ -691,9 +704,16 @@ const VerificationRow = ({ verification }) => {
         return /* @__PURE__ */ React.createElement(X, { className: "w-[15px] h-[15px]" });
     }
   };
-  let primaryText = verification.check ? `${verification.check}: ${verification.message}` : verification.message;
+  const statusText = t(`verification.status.${String(verification.status).toLowerCase()}`);
+  const translateMessage = (msg) => {
+    if (!msg) return "";
+    const key = MESSAGE_KEYS[msg];
+    return key ? t(`verification.message.${key}`) : msg;
+  };
+  const checkLabel = verification.check ? t(`verification.check.${verification.check}`) : "";
+  let primaryText = verification.check ? `${checkLabel}: ${translateMessage(verification.message)}` : translateMessage(verification.message);
   if (verification.status === VerificationStatusEnum.Failed) {
-    primaryText = (_b = (_a = verification.message) != null ? _a : verification.details) != null ? _b : "";
+    primaryText = translateMessage((_b = (_a = verification.message) != null ? _a : verification.details) != null ? _b : "");
   }
   primaryText = capitalize(primaryText);
   const infoText = "";
@@ -704,7 +724,7 @@ const VerificationRow = ({ verification }) => {
       style: { color: statusColor }
     },
     getIcon(),
-    verification.status,
+    statusText,
     infoText 
   ), showInfo && infoText && /* @__PURE__ */ React.createElement(
     InfoBox,
@@ -718,7 +738,8 @@ const VerificationRow = ({ verification }) => {
 
 const VerificationsBox = ({ verificationItems }) => {
   const [showInfo, setShowInfo] = useState(false);
-  return /* @__PURE__ */ React.createElement("div", { className: "verifications-box bg-white flex flex-col items-start gap-[10px] rounded-[20px] shadow-bottom px-[15px] py-[20px] w-full relative" }, /* @__PURE__ */ React.createElement("h3", { className: "text-[20px] leading-[20px] text-grayscale-900" }, "Credential Verifications"), /* @__PURE__ */ React.createElement(
+  const t = useT();
+  return /* @__PURE__ */ React.createElement("div", { className: "verifications-box bg-white flex flex-col items-start gap-[10px] rounded-[20px] shadow-bottom px-[15px] py-[20px] w-full relative" }, /* @__PURE__ */ React.createElement("h3", { className: "text-[20px] leading-[20px] text-grayscale-900" }, t("verification.title")), /* @__PURE__ */ React.createElement(
     "button",
     {
       className: "absolute top-[17px] right-[17px]",
@@ -728,13 +749,7 @@ const VerificationsBox = ({ verificationItems }) => {
       }
     },
     /* @__PURE__ */ React.createElement(InfoIcon, { color: showInfo ? "#6366F1" : void 0 })
-  ), showInfo && /* @__PURE__ */ React.createElement(
-    InfoBox,
-    {
-      text: "Credential verifications check the cryptographic proof of digital credentials to ensure their authenticity and accuracy.",
-      handleClose: () => setShowInfo(false)
-    }
-  ), verificationItems.map((verification, index) => /* @__PURE__ */ React.createElement(VerificationRow, { key: index, verification })));
+  ), showInfo && /* @__PURE__ */ React.createElement(InfoBox, { text: t("verification.infoText"), handleClose: () => setShowInfo(false) }), verificationItems.map((verification, index) => /* @__PURE__ */ React.createElement(VerificationRow, { key: index, verification })));
 };
 
 const Flipped$4 = v;
@@ -1523,4 +1538,4 @@ const VCDisplayCard2 = ({
 };
 
 export { VCDisplayCard2 as V, VCDisplayCardSkillsCount as a, VCIDDisplayCard as b };
-//# sourceMappingURL=VCDisplayCard2-72bed598.js.map
+//# sourceMappingURL=VCDisplayCard2-fc5c4225.js.map