@learncard/react 2.10.6 → 2.10.8

package/dist/esm/i18n-8454d6ea.js

@@ -0,0 +1,47 @@
+import React, { createContext, useMemo, useContext, useCallback } from 'react';
+
+const I18nContext = createContext(null);
+const EN_DEFAULTS = {
+  "verification.selfIssued": "Self Issued",
+  "verification.trustedIssuer": "Trusted Issuer",
+  "verification.unknownIssuer": "Unknown Issuer",
+  "verification.appIssuer": "Trusted App",
+  "verification.untrustedIssuer": "Untrusted Issuer",
+  "credential.by": "By",
+  "verification.title": "Credential Verifications",
+  "verification.infoText": "Credential verifications check the cryptographic proof of digital credentials to ensure their authenticity and accuracy.",
+  "verification.status.success": "Success",
+  "verification.status.error": "Error",
+  "verification.status.failed": "Failed",
+  "verification.check.proof": "Proof",
+  "verification.check.status": "Status",
+  "verification.check.expiration": "Expiration",
+  "verification.message.valid": "Valid",
+  "verification.message.invalid": "Invalid",
+  "verification.message.notRevoked": "Not Revoked",
+  "verification.message.revoked": "Revoked",
+  "verification.message.doesNotExpire": "Does Not Expire",
+  "verification.message.expired": "Expired",
+  "verification.message.active": "Active",
+  "verification.message.couldNotVerify": "Boost Credential could not be verified."
+};
+const interpolate = (str, params) => params ? str.replace(/\{(\w+)\}/g, (_, k) => params[k] != null ? String(params[k]) : `{${k}}`) : str;
+const I18nProvider = ({ resolve, locale, children }) => {
+  const value = useMemo(() => ({ resolve, locale }), [resolve, locale]);
+  return /* @__PURE__ */ React.createElement(I18nContext.Provider, { value }, children);
+};
+const useT = () => {
+  const ctx = useContext(I18nContext);
+  return useCallback(
+    (key, params) => {
+      const fromHost = ctx == null ? void 0 : ctx.resolve(key, params);
+      if (fromHost != null) return fromHost;
+      const def = EN_DEFAULTS[key];
+      return def != null ? interpolate(def, params) : key;
+    },
+    [ctx]
+  );
+};
+
+export { EN_DEFAULTS as E, I18nProvider as I, useT as u };
+//# sourceMappingURL=i18n-8454d6ea.js.map

package/dist/esm/i18n-8454d6ea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n-8454d6ea.js","sources":["../../src/i18n/index.tsx"],"sourcesContent":["/**\n * Lightweight i18n adapter for `@learncard/react`.\n *\n * This is a PUBLISHED SDK consumed by external third parties who have no\n * Paraglide, no app providers, and no catalog. So the rule is: render English\n * with zero configuration, and only *optionally* accept translations.\n *\n * Components call `useT()`. With no provider mounted, `useT()` returns the\n * co-located English default (zero-config English for every consumer). A\n * consumer that wants localization mounts `<I18nProvider resolve={fn} locale={l}>`\n * where `fn` maps a key to a translated string using whatever i18n they use\n * (Paraglide, i18next, a static map — the SDK doesn't care).\n *\n * Kept intentionally dependency-free and self-contained (a ~40-line copy also\n * lives in learn-card-base) so the SDK pulls in no i18n runtime.\n */\nimport React, { createContext, useCallback, useContext, useMemo } from 'react';\n\nexport type I18nResolver = (key: string, params?: Record<string, unknown>) => string | undefined;\n\ntype I18nContextValue = { resolve: I18nResolver; locale: string };\n\nconst I18nContext = createContext<I18nContextValue | null>(null);\n\n/**\n * English defaults co-located with the SDK. One entry per extracted string.\n * Keys are unprefixed; a host app namespaces them (e.g. `sdk.`) in its catalog.\n */\nexport const EN_DEFAULTS: Record<string, string> = {\n    'verification.selfIssued': 'Self Issued',\n    'verification.trustedIssuer': 'Trusted Issuer',\n    'verification.unknownIssuer': 'Unknown Issuer',\n    'verification.appIssuer': 'Trusted App',\n    'verification.untrustedIssuer': 'Untrusted Issuer',\n    'credential.by': 'By',\n    'verification.title': 'Credential Verifications',\n    'verification.infoText':\n        'Credential verifications check the cryptographic proof of digital credentials to ensure their authenticity and accuracy.',\n    'verification.status.success': 'Success',\n    'verification.status.error': 'Error',\n    'verification.status.failed': 'Failed',\n    'verification.check.proof': 'Proof',\n    'verification.check.status': 'Status',\n    'verification.check.expiration': 'Expiration',\n    'verification.message.valid': 'Valid',\n    'verification.message.invalid': 'Invalid',\n    'verification.message.notRevoked': 'Not Revoked',\n    'verification.message.revoked': 'Revoked',\n    'verification.message.doesNotExpire': 'Does Not Expire',\n    'verification.message.expired': 'Expired',\n    'verification.message.active': 'Active',\n    'verification.message.couldNotVerify': 'Boost Credential could not be verified.',\n};\n\n/** Minimal `{var}` interpolation — no dependency. */\nconst interpolate = (str: string, params?: Record<string, unknown>): string =>\n    params\n        ? str.replace(/\\{(\\w+)\\}/g, (_, k) => (params[k] != null ? String(params[k]) : `{${k}}`))\n        : str;\n\nexport const I18nProvider: React.FC<{\n    resolve: I18nResolver;\n    locale: string;\n    children: React.ReactNode;\n}> = ({ resolve, locale, children }) => {\n    const value = useMemo<I18nContextValue>(() => ({ resolve, locale }), [resolve, locale]);\n    return <I18nContext.Provider value={value}>{children}</I18nContext.Provider>;\n};\n\n/**\n * Returns a translate function. Resolution order:\n *   1. host resolver (consumer catalog) if a provider is mounted and has the key\n *   2. co-located English default (interpolated)\n *   3. the key itself (last-resort)\n */\nexport const useT = (): ((key: string, params?: Record<string, unknown>) => string) => {\n    const ctx = useContext(I18nContext);\n    return useCallback(\n        (key: string, params?: Record<string, unknown>) => {\n            const fromHost = ctx?.resolve(key, params);\n            if (fromHost != null) return fromHost;\n            const def = EN_DEFAULTS[key];\n            return def != null ? interpolate(def, params) : key;\n        },\n        [ctx]\n    );\n};\n"],"names":[],"mappings":";;AAsBA,MAAM,WAAA,GAAc,cAAuC,IAAI,CAAA,CAAA;AAMxD,MAAM,WAAsC,GAAA;AAAA,EAC/C,yBAA2B,EAAA,aAAA;AAAA,EAC3B,4BAA8B,EAAA,gBAAA;AAAA,EAC9B,4BAA8B,EAAA,gBAAA;AAAA,EAC9B,wBAA0B,EAAA,aAAA;AAAA,EAC1B,8BAAgC,EAAA,kBAAA;AAAA,EAChC,eAAiB,EAAA,IAAA;AAAA,EACjB,oBAAsB,EAAA,0BAAA;AAAA,EACtB,uBACI,EAAA,0HAAA;AAAA,EACJ,6BAA+B,EAAA,SAAA;AAAA,EAC/B,2BAA6B,EAAA,OAAA;AAAA,EAC7B,4BAA8B,EAAA,QAAA;AAAA,EAC9B,0BAA4B,EAAA,OAAA;AAAA,EAC5B,2BAA6B,EAAA,QAAA;AAAA,EAC7B,+BAAiC,EAAA,YAAA;AAAA,EACjC,4BAA8B,EAAA,OAAA;AAAA,EAC9B,8BAAgC,EAAA,SAAA;AAAA,EAChC,iCAAmC,EAAA,aAAA;AAAA,EACnC,8BAAgC,EAAA,SAAA;AAAA,EAChC,oCAAsC,EAAA,iBAAA;AAAA,EACtC,8BAAgC,EAAA,SAAA;AAAA,EAChC,6BAA+B,EAAA,QAAA;AAAA,EAC/B,qCAAuC,EAAA,yCAAA;AAC3C,EAAA;AAGA,MAAM,WAAA,GAAc,CAAC,GAAa,EAAA,MAAA,KAC9B,SACM,GAAI,CAAA,OAAA,CAAQ,YAAc,EAAA,CAAC,CAAG,EAAA,CAAA,KAAO,OAAO,CAAC,CAAA,IAAK,IAAO,GAAA,MAAA,CAAO,MAAO,CAAA,CAAC,CAAC,CAAI,GAAA,CAAA,CAAA,EAAI,CAAC,CAAA,CAAA,CAAI,CACtF,GAAA,GAAA,CAAA;AAEH,MAAM,eAIR,CAAC,EAAE,OAAS,EAAA,MAAA,EAAQ,UAAe,KAAA;AACpC,EAAM,MAAA,KAAA,GAAQ,OAA0B,CAAA,OAAO,EAAE,OAAA,EAAS,QAAW,CAAA,EAAA,CAAC,OAAS,EAAA,MAAM,CAAC,CAAA,CAAA;AACtF,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,WAAA,CAAY,QAAZ,EAAA,EAAqB,SAAe,QAAS,CAAA,CAAA;AACzD,EAAA;AAQO,MAAM,OAAO,MAAmE;AACnF,EAAM,MAAA,GAAA,GAAM,WAAW,WAAW,CAAA,CAAA;AAClC,EAAO,OAAA,WAAA;AAAA,IACH,CAAC,KAAa,MAAqC,KAAA;AAC/C,MAAM,MAAA,QAAA,GAAW,GAAK,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,GAAA,CAAA,OAAA,CAAQ,GAAK,EAAA,MAAA,CAAA,CAAA;AACnC,MAAI,IAAA,QAAA,IAAY,MAAa,OAAA,QAAA,CAAA;AAC7B,MAAM,MAAA,GAAA,GAAM,YAAY,GAAG,CAAA,CAAA;AAC3B,MAAA,OAAO,GAAO,IAAA,IAAA,GAAO,WAAY,CAAA,GAAA,EAAK,MAAM,CAAI,GAAA,GAAA,CAAA;AAAA,KACpD;AAAA,IACA,CAAC,GAAG,CAAA;AAAA,GACR,CAAA;AACJ;;;;"}

package/dist/esm/index.js

@@ -1,5 +1,6 @@
 import React, { useRef, useEffect, useMemo, useState } from 'react';
 export { S as SelectedSkills, V as VERIFIER_STATES, f as formatDidDisplayName, b as getAvatarColorFromString, g as getAvatarLetterFromDid, i as isDid, a as isLearnCardNetworkDid, r as resolveProfileDisplay } from './VerifierStateBadgeAndText-60b98d25.js';
+export { E as EN_DEFAULTS, I as I18nProvider, u as useT } from './i18n-8454d6ea.js';
 export { A as AchievementCard } from './AchievementCard-c600788a.js';
 export { B as BoostGenericCard } from './BoostGenericCard-7dfcc887.js';
 export { B as BoostSmallCard } from './BoostSmallCard-a73b6800.js';
@@ -18,7 +19,7 @@ export { L as LearnCardCreditCardFrontFace } from './LearnCardCreditCardFrontFac
 export { L as LearnPill } from './LearnPill-e0720485.js';
 export { L as Lightbox } from './Lightbox-f0338a0c.js';
 export { C as CircleLoadingState } from './CircleSpinner-03a329fc.js';
-export { M as MeritBadgeBackFace, a as MeritBadgeDisplayCard, b as MeritBadgeFrontFace } from './MeritBadgeDisplayCard-a7a504e0.js';
+export { M as MeritBadgeBackFace, a as MeritBadgeDisplayCard, b as MeritBadgeFrontFace } from './MeritBadgeDisplayCard-2029a552.js';
 export { M as MeritBadgeSkillsCount } from './MeritBadgeSkillsCount-c5271d7f.js';
 export { M as MiniVCThumbnail } from './MiniVCThumbnail-cc05e1f8.js';
 export { N as Notification } from './Notification-279ba207.js';
@@ -30,17 +31,17 @@ export { U as UserNotificationTypeStyles } from './types-b32d28d5.js';
 export { Q as QRCodeCard } from './QRCodeCard-3abf9f33.js';
 export { C as CheckmarkSvg, R as RoundedPill } from './RoundedPill-50279e5d.js';
 export { R as RoundedSquare, a as TYPE_TO_IMG_SRC, T as TYPE_TO_MINI_ICON, b as TYPE_TO_WALLET_COLOR, W as WALLET_SUBTYPES } from './constants-f1ed610c.js';
-export { S as SchoolIDCard } from './SchoolIDCard-fbd1cf6c.js';
+export { S as SchoolIDCard } from './SchoolIDCard-f82e40bc.js';
 export { S as SkillTabCard } from './SkillTabCard-f2edb3fc.js';
 export { S as SkillVerticalCard } from './SkillVerticalCard-045169f9.js';
 export { a as SkillsCard, S as SkillsMeterSegment } from './SkillsCard-5279aac9.js';
 export { S as SkillsStatsCard } from './SkillsStatsCard-e0cd6137.js';
 export { S as SmallAchievementCard } from './SmallAchievementCard-24dfa453.js';
 export { U as UserProfilePicture } from './UserProfilePicture-50c34186.js';
-export { V as VCCard } from './VCCard-d07dfdc7.js';
+export { V as VCCard } from './VCCard-c0f6dff3.js';
 export { V as VCDisplayBackFace } from './VCDisplayBackFace-bb60a881.js';
 export { V as VCDisplayCard } from './VCDisplayCard-9905d9d3.js';
-export { V as VCDisplayCard2, a as VCDisplayCardSkillsCount, b as VCIDDisplayCard } from './VCDisplayCard2-a3f671bc.js';
+export { V as VCDisplayCard2, a as VCDisplayCardSkillsCount, b as VCIDDisplayCard } from './VCDisplayCard2-fc5c4225.js';
 export { V as VCThumbnail } from './VCThumbnail-835921dd.js';
 export { V as VCVerificationCheck, a as VCVerificationCheckWithSpinner, b as VCVerificationCheckWithText } from './VCVerificationCheck-8b8b7a76.js';
 export { V as ValidationStateIndicator } from './VCVerificationPill-83eb61f4.js';
@@ -125,7 +126,6 @@ import './X.svg';
 import './ArrowArcLeft.svg';
 import './walletids.webp';
 import './membership-graphic.png';
-import './index-cbd2e9db.js';
 import './skillplaceholder.png';
 import './skillgraph.svg';
 import '@learncard/init';

package/dist/esm/index14.js

@@ -17,7 +17,7 @@ export { L as LearnCardCreditCardFrontFace } from './LearnCardCreditCardFrontFac
 export { L as LearnPill } from './LearnPill-e0720485.js';
 export { L as Lightbox } from './Lightbox-f0338a0c.js';
 export { C as CircleLoadingState } from './CircleSpinner-03a329fc.js';
-export { M as MeritBadgeBackFace, a as MeritBadgeDisplayCard, b as MeritBadgeFrontFace } from './MeritBadgeDisplayCard-a7a504e0.js';
+export { M as MeritBadgeBackFace, a as MeritBadgeDisplayCard, b as MeritBadgeFrontFace } from './MeritBadgeDisplayCard-2029a552.js';
 export { M as MeritBadgeSkillsCount } from './MeritBadgeSkillsCount-c5271d7f.js';
 export { M as MiniVCThumbnail } from './MiniVCThumbnail-cc05e1f8.js';
 export { N as Notification } from './Notification-279ba207.js';
@@ -29,17 +29,17 @@ export { U as UserNotificationTypeStyles } from './types-b32d28d5.js';
 export { Q as QRCodeCard } from './QRCodeCard-3abf9f33.js';
 export { C as CheckmarkSvg, R as RoundedPill } from './RoundedPill-50279e5d.js';
 export { R as RoundedSquare, a as TYPE_TO_IMG_SRC, T as TYPE_TO_MINI_ICON, b as TYPE_TO_WALLET_COLOR, W as WALLET_SUBTYPES } from './constants-f1ed610c.js';
-export { S as SchoolIDCard } from './SchoolIDCard-fbd1cf6c.js';
+export { S as SchoolIDCard } from './SchoolIDCard-f82e40bc.js';
 export { S as SkillTabCard } from './SkillTabCard-f2edb3fc.js';
 export { S as SkillVerticalCard } from './SkillVerticalCard-045169f9.js';
 export { a as SkillsCard, S as SkillsMeterSegment } from './SkillsCard-5279aac9.js';
 export { S as SkillsStatsCard } from './SkillsStatsCard-e0cd6137.js';
 export { S as SmallAchievementCard } from './SmallAchievementCard-24dfa453.js';
 export { U as UserProfilePicture } from './UserProfilePicture-50c34186.js';
-export { V as VCCard } from './VCCard-d07dfdc7.js';
+export { V as VCCard } from './VCCard-c0f6dff3.js';
 export { V as VCDisplayBackFace } from './VCDisplayBackFace-bb60a881.js';
 export { V as VCDisplayCard } from './VCDisplayCard-9905d9d3.js';
-export { V as VCDisplayCard2, a as VCDisplayCardSkillsCount, b as VCIDDisplayCard } from './VCDisplayCard2-a3f671bc.js';
+export { V as VCDisplayCard2, a as VCDisplayCardSkillsCount, b as VCIDDisplayCard } from './VCDisplayCard2-fc5c4225.js';
 export { V as VCThumbnail } from './VCThumbnail-835921dd.js';
 export { V as VCVerificationCheck, a as VCVerificationCheckWithSpinner, b as VCVerificationCheckWithText } from './VCVerificationCheck-8b8b7a76.js';
 export { V as ValidationStateIndicator } from './VCVerificationPill-83eb61f4.js';
@@ -125,12 +125,12 @@ import './X.svg';
 import './ArrowArcLeft.svg';
 import './walletids.webp';
 import './membership-graphic.png';
-import './index-cbd2e9db.js';
 import './skillplaceholder.png';
 import './skillgraph.svg';
 import '@learncard/init';
 import './ArrowArcRight.svg';
 import './icon.green.fat-arrow.png';
+import './i18n-8454d6ea.js';
 import './id-sleeve.png';
 import './vc.check.svg';
 import './RedXCircle.svg';

package/dist/esm/index22.js

@@ -1,8 +1,9 @@
 import 'react';
-export { M as MeritBadgeBackFace, a as MeritBadgeDisplayCard, b as MeritBadgeFrontFace } from './MeritBadgeDisplayCard-a7a504e0.js';
+export { M as MeritBadgeBackFace, a as MeritBadgeDisplayCard, b as MeritBadgeFrontFace } from './MeritBadgeDisplayCard-2029a552.js';
 import './index-cb3a593b.js';
 import './types.esm-d6b48609.js';
 export { M as MeritBadgeSkillsCount } from './MeritBadgeSkillsCount-c5271d7f.js';
+import './i18n-8454d6ea.js';
 import './VerifierStateBadgeAndText-60b98d25.js';
 import './athletics.png';
 import './business.png';

package/dist/esm/index22.js.map

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

package/dist/esm/index31.js

@@ -1,4 +1,3 @@
-export { S as SchoolIDCard } from './SchoolIDCard-fbd1cf6c.js';
+export { S as SchoolIDCard } from './SchoolIDCard-f82e40bc.js';
 import 'react';
-import './index-cbd2e9db.js';
 //# sourceMappingURL=index31.js.map

package/dist/esm/index31.js.map

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

package/dist/esm/index39.js

@@ -1,4 +1,4 @@
-export { V as VCCard } from './VCCard-d07dfdc7.js';
+export { V as VCCard } from './VCCard-c0f6dff3.js';
 import 'react';
 import '@learncard/init';
 import './VCDisplayCard-9905d9d3.js';
@@ -21,8 +21,7 @@ import './RedXCircle.svg';
 import './GreenCheckCircle.svg';
 import './YellowWarningCircle.svg';
 import './ArrowArcRight.svg';
-import './VCDisplayCard2-a3f671bc.js';
-import './index-cbd2e9db.js';
+import './VCDisplayCard2-fc5c4225.js';
 import './VerifierStateBadgeAndText-60b98d25.js';
 import './athletics.png';
 import './business.png';
@@ -35,9 +34,10 @@ import './stem.png';
 import './trade.png';
 import './Lightbox-f0338a0c.js';
 import 'react-dom';
+import './i18n-8454d6ea.js';
 import './CertificateDisplayCard-4e9254e0.js';
 import './DotsThreeOutline.svg';
 import './QRCodeIcon-8eef4f7c.js';
 import './id-sleeve.png';
-import './MeritBadgeDisplayCard-a7a504e0.js';
+import './MeritBadgeDisplayCard-2029a552.js';
 //# sourceMappingURL=index39.js.map

package/dist/esm/index42.js

@@ -10,11 +10,11 @@ import './social.png';
 import './stem.png';
 import './trade.png';
 import './index-cb3a593b.js';
-export { V as VCDisplayCard2, a as VCDisplayCardSkillsCount, b as VCIDDisplayCard } from './VCDisplayCard2-a3f671bc.js';
+export { V as VCDisplayCard2, a as VCDisplayCardSkillsCount, b as VCIDDisplayCard } from './VCDisplayCard2-fc5c4225.js';
 import './types.esm-d6b48609.js';
+import './i18n-8454d6ea.js';
 import './id-sleeve.png';
 import './PuzzlePiece-a3d9cc62.js';
-import './index-cbd2e9db.js';
 import './VCVerificationCheck-8b8b7a76.js';
 import './vc.check.svg';
 import './CircleSpinner-03a329fc.js';
@@ -28,5 +28,5 @@ import 'react-dom';
 import './CertificateDisplayCard-4e9254e0.js';
 import './DotsThreeOutline.svg';
 import './QRCodeIcon-8eef4f7c.js';
-import './MeritBadgeDisplayCard-a7a504e0.js';
+import './MeritBadgeDisplayCard-2029a552.js';
 //# sourceMappingURL=index42.js.map

package/dist/index.d.ts

@@ -1614,4 +1614,40 @@ declare const useParsedSdJwtVc: (learnCard: LearnCard | undefined, compact: stri
 declare const humanizeClaimLabel: (key: string) => string;
 declare const formatClaimValue: (value: unknown) => string;
 
-export { AchievementCard, AwardDisplayIcon, AwardRibbon, BadgeDisplayIcon, BoostGenericCard, BoostSmallCard, Briefcase, Button, ButtonProps, CertDisplayCardSkillsCount, CertificateBackFace, CertificateDisplayCard, CertificateDisplayIcon, CertificateFrontFace, Checkmark, CheckmarkSvg, CircleCheckButton, CircleIcon, CircleIconProps, CircleLoadingState, CircleSpinnerProps, Coins, CountCircle, CountCircleProps, CourseCard, CourseDisplayIcon, CourseVerticalCard, CredentialFormat, CredentialIconType, FlippyCard, FlippyCardProps, GenericArrow, GenericCard, Graduation, IDDisplayIcon, IDIcon, IDSleeve, JobHistoryCard, JobListCard, JobListingBubble, LearnCardCreditCardBackFace, LearnCardCreditCardBackFaceProps, LearnCardCreditCardFrontFace, LearnCardCreditCardFrontFaceProps, LearnCardCreditCardProps, LearnCardCreditCardUserProps, LearnPill, Lightbox, LightboxImage, LightboxItem, LightboxItemType, LightboxProps, LightboxVideo, Lightbulb, MeritBadgeBackFace, MeritBadgeDisplayCard, MeritBadgeFrontFace, MeritBadgeSkillsCount, MiniVCThumbnail, MiniVCThumbnailProps, Notification, NotificationBoostCard, NotificationBoostCardProps, NotificationIssuerMeta, NotificationProps, NotificationTypeStyles, NotificationUserAcceptedBoostCard, NotificationUserAcceptedBoostCardProps, NotificationUserCard, NotificationUserCardProps, ParsedSdJwtVc, QRCodeCard, QRCodeCardProps, QRCodeIcon, RoundedPill, RoundedSquare, RoundedSquareProps, SchoolIDCard, SchoolIDCardProps, SelectedSkills, SkillTabCard, SkillVerticalCard, SkillsCard, SkillsMeterSegment, SkillsStatsCard, SmallAchievementCard, TYPE_TO_IMG_SRC, TYPE_TO_MINI_ICON, TYPE_TO_WALLET_COLOR, ThreeDotVertical, Trophy, User, UserNotificationTypeStyles, UserProfilePicture, VCCard, VCCardProps, VCDisplayBackFace, VCDisplayCard, VCDisplayCard2, VCDisplayCard2Props, VCDisplayCardPropsReal, VCDisplayCardSkillsCount, VCIDDisplayCard, VCIDDisplayCardProps, VCThumbnail, VCThumbnailProps, VCVerificationCheck, VCVerificationCheckProps, VCVerificationCheckWithSpinner, VCVerificationCheckWithText, VERIFIER_STATES, ValidationStateIndicator, VerifierState, VerifierStateBadgeAndTextProps, WALLET_SUBTYPES, formatClaimValue, formatDidDisplayName, getAvatarColorFromString, getAvatarLetterFromDid, humanizeClaimLabel, isDid, isLearnCardNetworkDid, resolveProfileDisplay, useCredentialFormat, useOnMomentumScrollEnd, useParsedSdJwtVc, useScrollBorders };
+/**
+ * Lightweight i18n adapter for `@learncard/react`.
+ *
+ * This is a PUBLISHED SDK consumed by external third parties who have no
+ * Paraglide, no app providers, and no catalog. So the rule is: render English
+ * with zero configuration, and only *optionally* accept translations.
+ *
+ * Components call `useT()`. With no provider mounted, `useT()` returns the
+ * co-located English default (zero-config English for every consumer). A
+ * consumer that wants localization mounts `<I18nProvider resolve={fn} locale={l}>`
+ * where `fn` maps a key to a translated string using whatever i18n they use
+ * (Paraglide, i18next, a static map — the SDK doesn't care).
+ *
+ * Kept intentionally dependency-free and self-contained (a ~40-line copy also
+ * lives in learn-card-base) so the SDK pulls in no i18n runtime.
+ */
+
+type I18nResolver = (key: string, params?: Record<string, unknown>) => string | undefined;
+/**
+ * English defaults co-located with the SDK. One entry per extracted string.
+ * Keys are unprefixed; a host app namespaces them (e.g. `sdk.`) in its catalog.
+ */
+declare const EN_DEFAULTS: Record<string, string>;
+declare const I18nProvider: React$1.FC<{
+    resolve: I18nResolver;
+    locale: string;
+    children: React$1.ReactNode;
+}>;
+/**
+ * Returns a translate function. Resolution order:
+ *   1. host resolver (consumer catalog) if a provider is mounted and has the key
+ *   2. co-located English default (interpolated)
+ *   3. the key itself (last-resort)
+ */
+declare const useT: () => ((key: string, params?: Record<string, unknown>) => string);
+
+export { AchievementCard, AwardDisplayIcon, AwardRibbon, BadgeDisplayIcon, BoostGenericCard, BoostSmallCard, Briefcase, Button, ButtonProps, CertDisplayCardSkillsCount, CertificateBackFace, CertificateDisplayCard, CertificateDisplayIcon, CertificateFrontFace, Checkmark, CheckmarkSvg, CircleCheckButton, CircleIcon, CircleIconProps, CircleLoadingState, CircleSpinnerProps, Coins, CountCircle, CountCircleProps, CourseCard, CourseDisplayIcon, CourseVerticalCard, CredentialFormat, CredentialIconType, EN_DEFAULTS, FlippyCard, FlippyCardProps, GenericArrow, GenericCard, Graduation, I18nProvider, I18nResolver, IDDisplayIcon, IDIcon, IDSleeve, JobHistoryCard, JobListCard, JobListingBubble, LearnCardCreditCardBackFace, LearnCardCreditCardBackFaceProps, LearnCardCreditCardFrontFace, LearnCardCreditCardFrontFaceProps, LearnCardCreditCardProps, LearnCardCreditCardUserProps, LearnPill, Lightbox, LightboxImage, LightboxItem, LightboxItemType, LightboxProps, LightboxVideo, Lightbulb, MeritBadgeBackFace, MeritBadgeDisplayCard, MeritBadgeFrontFace, MeritBadgeSkillsCount, MiniVCThumbnail, MiniVCThumbnailProps, Notification, NotificationBoostCard, NotificationBoostCardProps, NotificationIssuerMeta, NotificationProps, NotificationTypeStyles, NotificationUserAcceptedBoostCard, NotificationUserAcceptedBoostCardProps, NotificationUserCard, NotificationUserCardProps, ParsedSdJwtVc, QRCodeCard, QRCodeCardProps, QRCodeIcon, RoundedPill, RoundedSquare, RoundedSquareProps, SchoolIDCard, SchoolIDCardProps, SelectedSkills, SkillTabCard, SkillVerticalCard, SkillsCard, SkillsMeterSegment, SkillsStatsCard, SmallAchievementCard, TYPE_TO_IMG_SRC, TYPE_TO_MINI_ICON, TYPE_TO_WALLET_COLOR, ThreeDotVertical, Trophy, User, UserNotificationTypeStyles, UserProfilePicture, VCCard, VCCardProps, VCDisplayBackFace, VCDisplayCard, VCDisplayCard2, VCDisplayCard2Props, VCDisplayCardPropsReal, VCDisplayCardSkillsCount, VCIDDisplayCard, VCIDDisplayCardProps, VCThumbnail, VCThumbnailProps, VCVerificationCheck, VCVerificationCheckProps, VCVerificationCheckWithSpinner, VCVerificationCheckWithText, VERIFIER_STATES, ValidationStateIndicator, VerifierState, VerifierStateBadgeAndTextProps, WALLET_SUBTYPES, formatClaimValue, formatDidDisplayName, getAvatarColorFromString, getAvatarLetterFromDid, humanizeClaimLabel, isDid, isLearnCardNetworkDid, resolveProfileDisplay, useCredentialFormat, useOnMomentumScrollEnd, useParsedSdJwtVc, useScrollBorders, useT };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@learncard/react",
-    "version": "2.10.6",
+    "version": "2.10.8",
     "description": "",
     "main": "dist/cjs",
     "module": "dist/esm",
@@ -66,7 +66,7 @@
         "vite": "^6.4.2"
     },
     "dependencies": {
-        "@learncard/init": "2.4.6",
+        "@learncard/init": "2.4.8",
         "date-fns": "^2.28.0",
         "numeral": "^2.0.6",
         "pretty-bytes": "^6.0.0",

package/src/components/MeritBadgeDisplayCard/MeritBadgeFrontFace.tsx

@@ -159,7 +159,7 @@ export const MeritBadgeFrontFace: React.FC<MeritBadgeFrontFaceProps> = ({
             >
                 <div className="flex flex-col gap-[5px] w-full">
                     <div className="flex flex-col items-center text-grayscale-900">
-                        {issueeName && (
+                        {issueeName && !customBodyCardComponent && (
                             <>
                                 <span className="flex flex-wrap items-baseline justify-center gap-1 text-[16px] leading-[150%] font-jacques max-w-full overflow-hidden text-ellipsis whitespace-nowrap">
                                     {!issueeDisplay.isMissing && issueeDisplay.isDidValue ? (

package/src/components/MeritBadgeDisplayCard/VerifierStateBadgeAndText.tsx

@@ -3,6 +3,7 @@ import UnknownVerifierBadge from '../svgs/UnknownVerifierBadge';
 import VerifiedBadge from '../svgs/VerifiedBadge';
 import PersonBadge from '../svgs/PersonBadge';
 import RedFlag from '../svgs/RedFlag';
+import { useT } from '../../i18n';
 
 const VERIFIER_STATES = {
     selfVerified: 'Self Issued',
@@ -18,36 +19,37 @@ type VerifierStateBadgeAndTextProps = {
 };
 
 const VerifierStateBadgeAndText: React.FC<VerifierStateBadgeAndTextProps> = ({ verifierState }) => {
+    const t = useT();
     return (
         <div className="flex justify-center">
             {verifierState === VERIFIER_STATES.selfVerified && (
                 <span className="uppercase font-poppins text-[12px] font-[500] text-green-dark flex gap-[3px] items-center">
                     <PersonBadge />
-                    Self Issued
+                    {t('verification.selfIssued')}
                 </span>
             )}
             {verifierState === VERIFIER_STATES.trustedVerifier && (
                 <span className="uppercase font-poppins text-[12px] font-[500] text-blue-light flex gap-[3px] items-center">
                     <VerifiedBadge />
-                    Trusted Issuer
+                    {t('verification.trustedIssuer')}
                 </span>
             )}
             {verifierState === VERIFIER_STATES.unknownVerifier && (
                 <span className="uppercase font-poppins text-[12px] font-[500] text-orange-500 flex gap-[3px] items-center">
                     <UnknownVerifierBadge />
-                    Unknown Issuer
+                    {t('verification.unknownIssuer')}
                 </span>
             )}
             {verifierState === VERIFIER_STATES.appIssuer && (
                 <span className="uppercase font-poppins text-[12px] font-[500] text-cyan-600 flex gap-[3px] items-center">
                     <UnknownVerifierBadge />
-                    Trusted App
+                    {t('verification.appIssuer')}
                 </span>
             )}
             {verifierState === VERIFIER_STATES.untrustedVerifier && (
                 <span className="uppercase font-poppins text-[12px] font-[500] text-red-mastercard flex gap-[3px] items-center">
                     <RedFlag />
-                    Untrusted Issuer
+                    {t('verification.untrustedIssuer')}
                 </span>
             )}
         </div>

package/src/components/VCDisplayCard2/VerificationRow.tsx

@@ -8,13 +8,28 @@ import AcuteCheckmark from '../svgs/AcuteCheckmark';
 import ExclamationPoint from '../svgs/ExclamationPoint';
 import X from '../svgs/X';
 import { capitalize } from '../../helpers/string.helpers';
+import { useT } from '../../i18n';
 
 type VerificationRowProps = {
     verification: VerificationItem;
 };
 
+/** Map the SDK's English verification messages to i18n keys; unknown messages pass through. */
+const MESSAGE_KEYS: Record<string, string> = {
+    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: React.FC<VerificationRowProps> = ({ verification }) => {
     const [showInfo, setShowInfo] = useState(false);
+    const t = useT();
     const statusColor = getColorForVerificationStatus(verification.status);
 
     const getIcon = () => {
@@ -28,11 +43,19 @@ const VerificationRow: React.FC<VerificationRowProps> = ({ verification }) => {
         }
     };
 
+    const statusText = t(`verification.status.${String(verification.status).toLowerCase()}`);
+    const translateMessage = (msg?: string): string => {
+        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
-        ? `${verification.check}: ${verification.message}`
-        : verification.message;
+        ? `${checkLabel}: ${translateMessage(verification.message)}`
+        : translateMessage(verification.message);
     if (verification.status === VerificationStatusEnum.Failed) {
-        primaryText = verification.message ?? verification.details ?? '';
+        primaryText = translateMessage(verification.message ?? verification.details ?? '');
     }
     primaryText = capitalize(primaryText);
 
@@ -45,7 +68,7 @@ const VerificationRow: React.FC<VerificationRowProps> = ({ verification }) => {
                 style={{ color: statusColor }}
             >
                 {getIcon()}
-                {verification.status}
+                {statusText}
                 {infoText && (
                     <button className="ml-auto" onClick={() => setShowInfo(!showInfo)}>
                         <InfoIcon color={statusColor} />

package/src/components/VCDisplayCard2/VerificationsBox.tsx

@@ -5,6 +5,7 @@ import InfoIcon from '../svgs/InfoIcon';
 import InfoBox from './InfoBox';
 
 import { VerificationItem } from '@learncard/types';
+import { useT } from '../../i18n';
 
 type VerificationsBoxProps = {
     verificationItems: VerificationItem[];
@@ -12,11 +13,12 @@ type VerificationsBoxProps = {
 
 const VerificationsBox: React.FC<VerificationsBoxProps> = ({ verificationItems }) => {
     const [showInfo, setShowInfo] = useState(false);
+    const t = useT();
 
     return (
         <div className="verifications-box bg-white flex flex-col items-start gap-[10px] rounded-[20px] shadow-bottom px-[15px] py-[20px] w-full relative">
             <h3 className="text-[20px] leading-[20px] text-grayscale-900">
-                Credential Verifications
+                {t('verification.title')}
             </h3>
             <button
                 className="absolute top-[17px] right-[17px]"
@@ -28,10 +30,7 @@ const VerificationsBox: React.FC<VerificationsBoxProps> = ({ verificationItems }
                 <InfoIcon color={showInfo ? '#6366F1' : undefined} />
             </button>
             {showInfo && (
-                <InfoBox
-                    text="Credential verifications check the cryptographic proof of digital credentials to ensure their authenticity and accuracy."
-                    handleClose={() => setShowInfo(false)}
-                />
+                <InfoBox text={t('verification.infoText')} handleClose={() => setShowInfo(false)} />
             )}
 
             {verificationItems.map((verification, index) => (

package/src/i18n/index.tsx

@@ -0,0 +1,87 @@
+/**
+ * Lightweight i18n adapter for `@learncard/react`.
+ *
+ * This is a PUBLISHED SDK consumed by external third parties who have no
+ * Paraglide, no app providers, and no catalog. So the rule is: render English
+ * with zero configuration, and only *optionally* accept translations.
+ *
+ * Components call `useT()`. With no provider mounted, `useT()` returns the
+ * co-located English default (zero-config English for every consumer). A
+ * consumer that wants localization mounts `<I18nProvider resolve={fn} locale={l}>`
+ * where `fn` maps a key to a translated string using whatever i18n they use
+ * (Paraglide, i18next, a static map — the SDK doesn't care).
+ *
+ * Kept intentionally dependency-free and self-contained (a ~40-line copy also
+ * lives in learn-card-base) so the SDK pulls in no i18n runtime.
+ */
+import React, { createContext, useCallback, useContext, useMemo } from 'react';
+
+export type I18nResolver = (key: string, params?: Record<string, unknown>) => string | undefined;
+
+type I18nContextValue = { resolve: I18nResolver; locale: string };
+
+const I18nContext = createContext<I18nContextValue | null>(null);
+
+/**
+ * English defaults co-located with the SDK. One entry per extracted string.
+ * Keys are unprefixed; a host app namespaces them (e.g. `sdk.`) in its catalog.
+ */
+export const EN_DEFAULTS: Record<string, string> = {
+    'verification.selfIssued': 'Self Issued',
+    'verification.trustedIssuer': 'Trusted Issuer',
+    'verification.unknownIssuer': 'Unknown Issuer',
+    'verification.appIssuer': 'Trusted App',
+    'verification.untrustedIssuer': 'Untrusted Issuer',
+    'credential.by': 'By',
+    'verification.title': 'Credential Verifications',
+    'verification.infoText':
+        'Credential verifications check the cryptographic proof of digital credentials to ensure their authenticity and accuracy.',
+    'verification.status.success': 'Success',
+    'verification.status.error': 'Error',
+    'verification.status.failed': 'Failed',
+    'verification.check.proof': 'Proof',
+    'verification.check.status': 'Status',
+    'verification.check.expiration': 'Expiration',
+    'verification.message.valid': 'Valid',
+    'verification.message.invalid': 'Invalid',
+    'verification.message.notRevoked': 'Not Revoked',
+    'verification.message.revoked': 'Revoked',
+    'verification.message.doesNotExpire': 'Does Not Expire',
+    'verification.message.expired': 'Expired',
+    'verification.message.active': 'Active',
+    'verification.message.couldNotVerify': 'Boost Credential could not be verified.',
+};
+
+/** Minimal `{var}` interpolation — no dependency. */
+const interpolate = (str: string, params?: Record<string, unknown>): string =>
+    params
+        ? str.replace(/\{(\w+)\}/g, (_, k) => (params[k] != null ? String(params[k]) : `{${k}}`))
+        : str;
+
+export const I18nProvider: React.FC<{
+    resolve: I18nResolver;
+    locale: string;
+    children: React.ReactNode;
+}> = ({ resolve, locale, children }) => {
+    const value = useMemo<I18nContextValue>(() => ({ resolve, locale }), [resolve, locale]);
+    return <I18nContext.Provider value={value}>{children}</I18nContext.Provider>;
+};
+
+/**
+ * Returns a translate function. Resolution order:
+ *   1. host resolver (consumer catalog) if a provider is mounted and has the key
+ *   2. co-located English default (interpolated)
+ *   3. the key itself (last-resort)
+ */
+export const useT = (): ((key: string, params?: Record<string, unknown>) => string) => {
+    const ctx = useContext(I18nContext);
+    return useCallback(
+        (key: string, params?: Record<string, unknown>) => {
+            const fromHost = ctx?.resolve(key, params);
+            if (fromHost != null) return fromHost;
+            const def = EN_DEFAULTS[key];
+            return def != null ? interpolate(def, params) : key;
+        },
+        [ctx]
+    );
+};

package/src/index.ts

@@ -14,3 +14,6 @@ export * from './helpers/did-display.helpers';
 export * from './hooks/useCredentialFormat';
 export * from './hooks/useParsedSdJwtVc';
 export * from './helpers/credentialFormat.helpers';
+
+// Optional i18n adapter (English by default; consumers may inject a resolver)
+export * from './i18n';