@learncard/react 2.12.0 → 2.12.2

package/dist/esm/{VCVerificationPill-04ffdf56.js.map → VCVerificationPill-be1140c5.js.map}

@@ -1 +1 @@
-{"version":3,"file":"VCVerificationPill-04ffdf56.js","sources":["../../src/components/VCVerificationPill/VCVerificationPill.tsx"],"sourcesContent":["import React from 'react';\nimport { VerificationStatus, VerificationStatusEnum } from '@learncard/types';\n\nimport VerificationFailedIcon from '../../assets/images/RedXCircle.svg';\nimport VerificationPassedIcon from '../../assets/images/GreenCheckCircle.svg';\nimport VerificationWarningIcon from '../../assets/images/YellowWarningCircle.svg';\n\ntype VerificationDisplayItemProps = {\n    status?: VerificationStatus;\n    message?: string;\n    details?: string;\n};\n\ntype VerifiableStateIndicatorProps = {\n    status: VerificationStatus;\n};\n\nconst StatusToBgColor = {\n    [VerificationStatusEnum.Success]: 'bg-emerald-500',\n    [VerificationStatusEnum.Failed]: 'bg-yellow-400',\n    [VerificationStatusEnum.Error]: 'bg-rose-600',\n};\n\nconst StatusToTextColor = {\n    [VerificationStatusEnum.Success]: 'text-emerald-700',\n    [VerificationStatusEnum.Failed]: 'text-yellow-400',\n    [VerificationStatusEnum.Error]: 'text-rose-600',\n};\n\nconst StatusToIcon = {\n    [VerificationStatusEnum.Success]: VerificationPassedIcon,\n    [VerificationStatusEnum.Failed]: VerificationWarningIcon,\n    [VerificationStatusEnum.Error]: VerificationFailedIcon,\n};\n\nconst StatusToText = {\n    [VerificationStatusEnum.Success]: 'Verification Success',\n    [VerificationStatusEnum.Error]: 'Verification Error ',\n    [VerificationStatusEnum.Failed]: 'Verification Failed',\n};\n\nexport const ValidationStateIndicator: React.FC<VerifiableStateIndicatorProps> = ({ status }) => {\n    const bgColor = StatusToBgColor[status];\n    const source = StatusToIcon[status];\n\n    return (\n        <div className={`relative rounded-full w-[30px] h-[30px] ${bgColor}`}>\n            <div className=\"relative w-[100%] h-[100%] flex items-center justify-center rounded-[50%] bg-white rounded-full overflow-hidden\">\n                <img\n                    className=\"h-full w-full object-contain p-1\"\n                    src={source ?? ''}\n                    alt=\"Verification Status Icon\"\n                />\n            </div>\n        </div>\n    );\n};\n\nconst VCVerificationPill: React.FC<VerificationDisplayItemProps> = ({\n    message = '',\n    details,\n    status = VerificationStatusEnum.Success,\n}) => {\n    const statusColor = StatusToTextColor[status];\n    const statusInfoText = StatusToText[status];\n\n    return (\n        <section className=\"flex width-full bg-white p-2 px-5 my-3.5 justify-between items-center relative vc-verification-checklist-pill rounded-[22px]\">\n            <div className=\"vc-pill-left\">\n                <p className={`text-[10px] font-bold status-text uppercase ${statusColor}`}>\n                    {statusInfoText}\n                </p>\n\n                <p className=\"text-[12px] text-grayscale-900 vc-pill-text\">{message}</p>\n\n                {details && <p className=\"text-[12px] text-gray-600\"> {details}</p>}\n            </div>\n            <div className=\"vc-pill-right\">\n                <ValidationStateIndicator status={status} />\n            </div>\n        </section>\n    );\n};\n\nexport default VCVerificationPill;\n"],"names":[],"mappings":";;;;;;AAiBA,MAAM,eAAkB,GAAA;AAAA,EACpB,CAAC,sBAAuB,CAAA,OAAO,GAAG,gBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,MAAM,GAAG,eAAA;AAAA,EACjC,CAAC,sBAAuB,CAAA,KAAK,GAAG,aAAA;AACpC,CAAA,CAAA;AAEA,MAAM,iBAAoB,GAAA;AAAA,EACtB,CAAC,sBAAuB,CAAA,OAAO,GAAG,kBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,MAAM,GAAG,iBAAA;AAAA,EACjC,CAAC,sBAAuB,CAAA,KAAK,GAAG,eAAA;AACpC,CAAA,CAAA;AAEA,MAAM,YAAe,GAAA;AAAA,EACjB,CAAC,sBAAuB,CAAA,OAAO,GAAG,sBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,MAAM,GAAG,uBAAA;AAAA,EACjC,CAAC,sBAAuB,CAAA,KAAK,GAAG,sBAAA;AACpC,CAAA,CAAA;AAEA,MAAM,YAAe,GAAA;AAAA,EACjB,CAAC,sBAAuB,CAAA,OAAO,GAAG,sBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,KAAK,GAAG,qBAAA;AAAA,EAChC,CAAC,sBAAuB,CAAA,MAAM,GAAG,qBAAA;AACrC,CAAA,CAAA;AAEO,MAAM,wBAAoE,GAAA,CAAC,EAAE,MAAA,EAAa,KAAA;AAC7F,EAAM,MAAA,OAAA,GAAU,gBAAgB,MAAM,CAAA,CAAA;AACtC,EAAM,MAAA,MAAA,GAAS,aAAa,MAAM,CAAA,CAAA;AAElC,EACI,uBAAA,KAAA,CAAA,aAAA,CAAC,SAAI,SAAW,EAAA,CAAA,wCAAA,EAA2C,OAAO,CAC9D,CAAA,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,iHACX,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACG,SAAU,EAAA,kCAAA;AAAA,MACV,KAAK,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAA;AAAA,MACf,GAAI,EAAA,0BAAA;AAAA,KAAA;AAAA,GAEZ,CACJ,CAAA,CAAA;AAER,EAAA;AAEA,MAAM,qBAA6D,CAAC;AAAA,EAChE,OAAU,GAAA,EAAA;AAAA,EACV,OAAA;AAAA,EACA,SAAS,sBAAuB,CAAA,OAAA;AACpC,CAAM,KAAA;AACF,EAAM,MAAA,WAAA,GAAc,kBAAkB,MAAM,CAAA,CAAA;AAC5C,EAAM,MAAA,cAAA,GAAiB,aAAa,MAAM,CAAA,CAAA;AAE1C,EAAA,2CACK,SAAQ,EAAA,EAAA,SAAA,EAAU,8HACf,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,SAAI,SAAU,EAAA,cAAA,EAAA,kBACV,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAE,WAAW,CAA+C,4CAAA,EAAA,WAAW,MACnE,cACL,CAAA,sCAEC,GAAE,EAAA,EAAA,SAAA,EAAU,6CAA+C,EAAA,EAAA,OAAQ,GAEnE,OAAW,oBAAA,KAAA,CAAA,aAAA,CAAC,OAAE,SAAU,EAAA,2BAAA,EAAA,EAA4B,KAAE,OAAQ,CACnE,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,SAAI,SAAU,EAAA,eAAA,EAAA,sCACV,wBAAyB,EAAA,EAAA,MAAA,EAAgB,CAC9C,CACJ,CAAA,CAAA;AAER;;;;"}
+{"version":3,"file":"VCVerificationPill-be1140c5.js","sources":["../../src/components/VCVerificationPill/VCVerificationPill.tsx"],"sourcesContent":["import React from 'react';\nimport { VerificationStatus, VerificationStatusEnum } from '@learncard/types';\n\nimport VerificationFailedIcon from '../../assets/images/RedXCircle.svg';\nimport VerificationPassedIcon from '../../assets/images/GreenCheckCircle.svg';\nimport VerificationWarningIcon from '../../assets/images/YellowWarningCircle.svg';\n\ntype VerificationDisplayItemProps = {\n    status?: VerificationStatus;\n    message?: string;\n    details?: string;\n};\n\ntype VerifiableStateIndicatorProps = {\n    status: VerificationStatus;\n};\n\nconst StatusToBgColor = {\n    [VerificationStatusEnum.Success]: 'bg-emerald-500',\n    [VerificationStatusEnum.Failed]: 'bg-yellow-400',\n    [VerificationStatusEnum.Error]: 'bg-rose-600',\n};\n\nconst StatusToTextColor = {\n    [VerificationStatusEnum.Success]: 'text-emerald-700',\n    [VerificationStatusEnum.Failed]: 'text-yellow-400',\n    [VerificationStatusEnum.Error]: 'text-rose-600',\n};\n\nconst StatusToIcon = {\n    [VerificationStatusEnum.Success]: VerificationPassedIcon,\n    [VerificationStatusEnum.Failed]: VerificationWarningIcon,\n    [VerificationStatusEnum.Error]: VerificationFailedIcon,\n};\n\nconst StatusToText = {\n    [VerificationStatusEnum.Success]: 'Verification Success',\n    [VerificationStatusEnum.Error]: 'Verification Error ',\n    [VerificationStatusEnum.Failed]: 'Verification Failed',\n};\n\nexport const ValidationStateIndicator: React.FC<VerifiableStateIndicatorProps> = ({ status }) => {\n    const bgColor = StatusToBgColor[status];\n    const source = StatusToIcon[status];\n\n    return (\n        <div className={`relative rounded-full w-[30px] h-[30px] ${bgColor}`}>\n            <div className=\"relative w-[100%] h-[100%] flex items-center justify-center rounded-[50%] bg-white rounded-full overflow-hidden\">\n                <img\n                    className=\"h-full w-full object-contain p-1\"\n                    src={source ?? ''}\n                    alt=\"Verification Status Icon\"\n                />\n            </div>\n        </div>\n    );\n};\n\nconst VCVerificationPill: React.FC<VerificationDisplayItemProps> = ({\n    message = '',\n    details,\n    status = VerificationStatusEnum.Success,\n}) => {\n    const statusColor = StatusToTextColor[status];\n    const statusInfoText = StatusToText[status];\n\n    return (\n        <section className=\"flex width-full bg-white p-2 px-5 my-3.5 justify-between items-center relative vc-verification-checklist-pill rounded-[22px]\">\n            <div className=\"vc-pill-left\">\n                <p className={`text-[10px] font-bold status-text uppercase ${statusColor}`}>\n                    {statusInfoText}\n                </p>\n\n                <p className=\"text-[12px] text-grayscale-900 vc-pill-text\">{message}</p>\n\n                {details && <p className=\"text-[12px] text-gray-600\"> {details}</p>}\n            </div>\n            <div className=\"vc-pill-right\">\n                <ValidationStateIndicator status={status} />\n            </div>\n        </section>\n    );\n};\n\nexport default VCVerificationPill;\n"],"names":[],"mappings":";;;;;;AAiBA,MAAM,eAAkB,GAAA;AAAA,EACpB,CAAC,sBAAuB,CAAA,OAAO,GAAG,gBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,MAAM,GAAG,eAAA;AAAA,EACjC,CAAC,sBAAuB,CAAA,KAAK,GAAG,aAAA;AACpC,CAAA,CAAA;AAEA,MAAM,iBAAoB,GAAA;AAAA,EACtB,CAAC,sBAAuB,CAAA,OAAO,GAAG,kBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,MAAM,GAAG,iBAAA;AAAA,EACjC,CAAC,sBAAuB,CAAA,KAAK,GAAG,eAAA;AACpC,CAAA,CAAA;AAEA,MAAM,YAAe,GAAA;AAAA,EACjB,CAAC,sBAAuB,CAAA,OAAO,GAAG,sBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,MAAM,GAAG,uBAAA;AAAA,EACjC,CAAC,sBAAuB,CAAA,KAAK,GAAG,sBAAA;AACpC,CAAA,CAAA;AAEA,MAAM,YAAe,GAAA;AAAA,EACjB,CAAC,sBAAuB,CAAA,OAAO,GAAG,sBAAA;AAAA,EAClC,CAAC,sBAAuB,CAAA,KAAK,GAAG,qBAAA;AAAA,EAChC,CAAC,sBAAuB,CAAA,MAAM,GAAG,qBAAA;AACrC,CAAA,CAAA;AAEO,MAAM,wBAAoE,GAAA,CAAC,EAAE,MAAA,EAAa,KAAA;AAC7F,EAAM,MAAA,OAAA,GAAU,gBAAgB,MAAM,CAAA,CAAA;AACtC,EAAM,MAAA,MAAA,GAAS,aAAa,MAAM,CAAA,CAAA;AAElC,EACI,uBAAA,KAAA,CAAA,aAAA,CAAC,SAAI,SAAW,EAAA,CAAA,wCAAA,EAA2C,OAAO,CAC9D,CAAA,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,iHACX,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACG,SAAU,EAAA,kCAAA;AAAA,MACV,KAAK,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAA;AAAA,MACf,GAAI,EAAA,0BAAA;AAAA,KAAA;AAAA,GAEZ,CACJ,CAAA,CAAA;AAER,EAAA;AAEA,MAAM,qBAA6D,CAAC;AAAA,EAChE,OAAU,GAAA,EAAA;AAAA,EACV,OAAA;AAAA,EACA,SAAS,sBAAuB,CAAA,OAAA;AACpC,CAAM,KAAA;AACF,EAAM,MAAA,WAAA,GAAc,kBAAkB,MAAM,CAAA,CAAA;AAC5C,EAAM,MAAA,cAAA,GAAiB,aAAa,MAAM,CAAA,CAAA;AAE1C,EAAA,2CACK,SAAQ,EAAA,EAAA,SAAA,EAAU,8HACf,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,SAAI,SAAU,EAAA,cAAA,EAAA,kBACV,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAE,WAAW,CAA+C,4CAAA,EAAA,WAAW,MACnE,cACL,CAAA,sCAEC,GAAE,EAAA,EAAA,SAAA,EAAU,6CAA+C,EAAA,EAAA,OAAQ,GAEnE,OAAW,oBAAA,KAAA,CAAA,aAAA,CAAC,OAAE,SAAU,EAAA,2BAAA,EAAA,EAA4B,KAAE,OAAQ,CACnE,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,SAAI,SAAU,EAAA,eAAA,EAAA,sCACV,wBAAyB,EAAA,EAAA,MAAA,EAAgB,CAC9C,CACJ,CAAA,CAAA;AAER;;;;"}

package/dist/esm/{VerifierStateBadgeAndText-750a6c24.js → VerifierStateBadgeAndText-97117c5d.js}

@@ -9,7 +9,8 @@ import Social from './social.png';
 import Stem from './stem.png';
 import Trade from './trade.png';
 import { P as PuzzlePiece } from './PuzzlePiece-a3d9cc62.js';
-import { o as object, l as literal, n as number, s as string, u as union } from './types.esm-5f75bd4a.js';
+import { o as object, l as literal, n as number, s as string, u as union } from './types.esm-a67e86b1.js';
+import { u as useT } from './i18n-35209bfa.js';
 
 const AcuteCheckmark = ({ className = "" }) => {
   return /* @__PURE__ */ React.createElement(
@@ -3663,6 +3664,12 @@ var require_types_cjs_development = __commonJS({
       LCNBoostClaimLinkSigningAuthorityValidator: /* @__PURE__ */ __name(() => LCNBoostClaimLinkSigningAuthorityValidator, "LCNBoostClaimLinkSigningAuthorityValidator"),
       LCNBoostStatus: /* @__PURE__ */ __name(() => LCNBoostStatus, "LCNBoostStatus"),
       LCNConnectionProfileValidator: /* @__PURE__ */ __name(() => LCNConnectionProfileValidator, "LCNConnectionProfileValidator"),
+      LCNConnectionPromptActionResultValidator: /* @__PURE__ */ __name(() => LCNConnectionPromptActionResultValidator, "LCNConnectionPromptActionResultValidator"),
+      LCNConnectionPromptActionStatusValidator: /* @__PURE__ */ __name(() => LCNConnectionPromptActionStatusValidator, "LCNConnectionPromptActionStatusValidator"),
+      LCNConnectionPromptMetadataValidator: /* @__PURE__ */ __name(() => LCNConnectionPromptMetadataValidator, "LCNConnectionPromptMetadataValidator"),
+      LCNConnectionPromptStatusValidator: /* @__PURE__ */ __name(() => LCNConnectionPromptStatusValidator, "LCNConnectionPromptStatusValidator"),
+      LCNConnectionPromptSurfaceValidator: /* @__PURE__ */ __name(() => LCNConnectionPromptSurfaceValidator, "LCNConnectionPromptSurfaceValidator"),
+      LCNConnectionPromptValidator: /* @__PURE__ */ __name(() => LCNConnectionPromptValidator, "LCNConnectionPromptValidator"),
       LCNDomainOrOriginValidator: /* @__PURE__ */ __name(() => LCNDomainOrOriginValidator, "LCNDomainOrOriginValidator"),
       LCNInboxContactMethodValidator: /* @__PURE__ */ __name(() => LCNInboxContactMethodValidator, "LCNInboxContactMethodValidator"),
       LCNInboxStatusEnumValidator: /* @__PURE__ */ __name(() => LCNInboxStatusEnumValidator, "LCNInboxStatusEnumValidator"),
@@ -3674,6 +3681,7 @@ var require_types_cjs_development = __commonJS({
       LCNNotificationDataValidator: /* @__PURE__ */ __name(() => LCNNotificationDataValidator, "LCNNotificationDataValidator"),
       LCNNotificationInboxValidator: /* @__PURE__ */ __name(() => LCNNotificationInboxValidator, "LCNNotificationInboxValidator"),
       LCNNotificationMessageValidator: /* @__PURE__ */ __name(() => LCNNotificationMessageValidator, "LCNNotificationMessageValidator"),
+      LCNNotificationMetadataValidator: /* @__PURE__ */ __name(() => LCNNotificationMetadataValidator, "LCNNotificationMetadataValidator"),
       LCNNotificationTypeEnumValidator: /* @__PURE__ */ __name(() => LCNNotificationTypeEnumValidator, "LCNNotificationTypeEnumValidator"),
       LCNNotificationValidator: /* @__PURE__ */ __name(() => LCNNotificationValidator, "LCNNotificationValidator"),
       LCNProfileConnectionStatusEnum: /* @__PURE__ */ __name(() => LCNProfileConnectionStatusEnum, "LCNProfileConnectionStatusEnum"),
@@ -19765,6 +19773,31 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       isServiceProfile: true,
       display: true
     });
+    var LCNConnectionPromptStatusValidator = external_exports.enum(["PENDING", "SKIPPED", "CONNECTED"]);
+    var LCNConnectionPromptSurfaceValidator = external_exports.enum(["POST_CLAIM", "NOTIFICATION"]);
+    var LCNConnectionPromptActionStatusValidator = external_exports.enum([
+      "PENDING",
+      "SKIPPED",
+      "CONNECTED",
+      "STALE"
+    ]);
+    var LCNConnectionPromptValidator = external_exports.object({
+      promptId: external_exports.string().uuid(),
+      status: LCNConnectionPromptStatusValidator,
+      surface: LCNConnectionPromptSurfaceValidator,
+      triggerId: external_exports.string(),
+      triggeredAt: external_exports.iso.datetime(),
+      updatedAt: external_exports.iso.datetime(),
+      counterpart: LCNPublicProfileValidator
+    });
+    var LCNConnectionPromptActionResultValidator = external_exports.object({
+      promptId: external_exports.string().uuid(),
+      status: LCNConnectionPromptActionStatusValidator
+    });
+    var LCNConnectionPromptMetadataValidator = external_exports.object({
+      promptId: external_exports.string().uuid(),
+      counterpartProfileId: external_exports.string()
+    });
     var LCNAuthedProfileValidator = LCNPublicProfileValidator.extend({
       bio: LCNProfileValidator.shape.bio,
       websiteLink: LCNProfileValidator.shape.websiteLink,
@@ -20330,12 +20363,15 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       }),
       timestamp: external_exports.iso.datetime().optional()
     });
+    var LCNNotificationMetadataValidator = external_exports.object({
+      connectionPrompt: LCNConnectionPromptMetadataValidator.optional()
+    }).catchall(external_exports.unknown());
     var LCNNotificationDataValidator = external_exports.object({
       vcUris: external_exports.array(external_exports.string()).optional(),
       vpUris: external_exports.array(external_exports.string()).optional(),
       transaction: ConsentFlowTransactionValidator.optional(),
       inbox: LCNNotificationInboxValidator.optional(),
-      metadata: external_exports.record(external_exports.string(), external_exports.unknown()).optional()
+      metadata: LCNNotificationMetadataValidator.optional()
     }).loose();
     var LCNNotificationValidator = external_exports.object({
       type: LCNNotificationTypeEnumValidator,
@@ -21608,8 +21644,9 @@ const VERIFIER_STATES = {
 };
 const VerifierStateBadgeAndText = forwardRef(
   ({ verifierState, className = "", unknownVerifierTitle, onClick }, ref) => {
+    const t = useT();
     const effectiveState = unknownVerifierTitle && verifierState !== VERIFIER_STATES.selfVerified && verifierState !== VERIFIER_STATES.untrustedVerifier && verifierState !== VERIFIER_STATES.appIssuer ? VERIFIER_STATES.trustedVerifier : verifierState;
-    const content = /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveState === VERIFIER_STATES.selfVerified && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-green-dark" }, /* @__PURE__ */ React.createElement(PersonBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, "Self Issued")), effectiveState === VERIFIER_STATES.trustedVerifier && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-green-600" }, /* @__PURE__ */ React.createElement(VerifiedBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, unknownVerifierTitle != null ? unknownVerifierTitle : "Trusted Issuer")), effectiveState === VERIFIER_STATES.unknownVerifier && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-orange-500" }, /* @__PURE__ */ React.createElement(UnknownVerifierBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, unknownVerifierTitle != null ? unknownVerifierTitle : VERIFIER_STATES.unknownVerifier)), effectiveState === VERIFIER_STATES.appIssuer && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-cyan-600" }, /* @__PURE__ */ React.createElement(VerifiedBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, "App Issuer")), effectiveState === VERIFIER_STATES.untrustedVerifier && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-red-mastercard" }, /* @__PURE__ */ React.createElement(RedFlag, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, "Untrusted Issuer")));
+    const content = /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveState === VERIFIER_STATES.selfVerified && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-green-dark" }, /* @__PURE__ */ React.createElement(PersonBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, t("verification.selfIssued"))), effectiveState === VERIFIER_STATES.trustedVerifier && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-green-600" }, /* @__PURE__ */ React.createElement(VerifiedBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, unknownVerifierTitle != null ? unknownVerifierTitle : t("verification.trustedIssuer"))), effectiveState === VERIFIER_STATES.unknownVerifier && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-orange-800" }, /* @__PURE__ */ React.createElement(UnknownVerifierBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, unknownVerifierTitle != null ? unknownVerifierTitle : t("verification.unknownIssuer"))), effectiveState === VERIFIER_STATES.appIssuer && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-cyan-600" }, /* @__PURE__ */ React.createElement(VerifiedBadge, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, t("verification.appIssuer"))), effectiveState === VERIFIER_STATES.untrustedVerifier && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 font-poppins font-[500] text-[12px] leading-tight text-red-mastercard" }, /* @__PURE__ */ React.createElement(RedFlag, null), /* @__PURE__ */ React.createElement("span", { className: "whitespace-nowrap" }, t("verification.untrustedIssuer"))));
     return /* @__PURE__ */ React.createElement("div", { className: `flex justify-center ${className}` }, onClick ? /* @__PURE__ */ React.createElement(
       "button",
       {
@@ -21630,4 +21667,4 @@ const VerifierStateBadgeAndText = forwardRef(
 VerifierStateBadgeAndText.displayName = "VerifierStateBadgeAndText";
 
 export { AcuteCheckmark as A, Camera as C, ExclamationPoint as E, FatArrow as F, GenericDocumentIcon as G, InfoIcon as I, LinkIcon as L, PersonBadge as P, RoundedCorner as R, SelectedSkills as S, UnknownVerifierBadge as U, VERIFIER_STATES as V, isLearnCardNetworkDid as a, getAvatarColorFromString as b, capitalize as c, getBaseUrl as d, VideoIcon as e, formatDidDisplayName as f, getAvatarLetterFromDid as g, LeftArrow as h, isDid as i, SkillsBox as j, IssuerSeal as k, isAppDidWeb as l, VerifierStateBadgeAndText as m, VerifiedBadge as n, RedFlag as o, prettyBytes as p, resolveProfileDisplay as r };
-//# sourceMappingURL=VerifierStateBadgeAndText-750a6c24.js.map
+//# sourceMappingURL=VerifierStateBadgeAndText-97117c5d.js.map