@learncard/react 2.10.0 → 2.10.1

package/dist/esm/{VerifierStateBadgeAndText-0db85894.js → VerifierStateBadgeAndText-f878973e.js}

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, forwardRef } from 'react';
 import Athletics from './athletics.png';
 import Business from './business.png';
 import Creative from './creative.png';
@@ -19562,14 +19562,28 @@ const VERIFIER_STATES = {
   appIssuer: "App Issuer",
   untrustedVerifier: "Untrusted Issuer"
 };
-const VerifierStateBadgeAndText = ({
-  verifierState,
-  className = "",
-  unknownVerifierTitle
-}) => {
-  const effectiveState = unknownVerifierTitle && verifierState !== VERIFIER_STATES.selfVerified && verifierState !== VERIFIER_STATES.untrustedVerifier && verifierState !== VERIFIER_STATES.appIssuer ? VERIFIER_STATES.trustedVerifier : verifierState;
-  return /* @__PURE__ */ React.createElement("div", { className: `flex justify-center ${className}` }, 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 VerifierStateBadgeAndText = forwardRef(
+  ({ verifierState, className = "", unknownVerifierTitle, onClick }, ref) => {
+    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")));
+    return /* @__PURE__ */ React.createElement("div", { className: `flex justify-center ${className}` }, onClick ? /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: "appearance-none bg-transparent p-0 text-left",
+        onClick: (event) => {
+          event.stopPropagation();
+          onClick(event);
+        },
+        onMouseDown: (event) => event.stopPropagation(),
+        "aria-haspopup": "dialog"
+      },
+      content
+    ) : /* @__PURE__ */ React.createElement("div", null, content));
+  }
+);
+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, VerifierStateBadgeAndText as a, isLearnCardNetworkDid as b, getAvatarColorFromString as c, capitalize as d, getBaseUrl as e, formatDidDisplayName as f, getAvatarLetterFromDid as g, VideoIcon as h, isDid as i, LeftArrow as j, SkillsBox as k, IssuerSeal as l, isAppDidWeb as m, VerifiedBadge as n, RedFlag as o, prettyBytes as p, resolveProfileDisplay as r };
-//# sourceMappingURL=VerifierStateBadgeAndText-0db85894.js.map
+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-f878973e.js.map