@learncard/react 2.10.7 → 2.10.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{MeritBadgeDisplayCard-1de23221.js → MeritBadgeDisplayCard-15b85a79.js} +2 -2
- package/dist/cjs/{MeritBadgeDisplayCard-1de23221.js.map → MeritBadgeDisplayCard-15b85a79.js.map} +1 -1
- package/dist/cjs/{VCCard-b5d1ecb3.js → VCCard-4f02e2f4.js} +2 -2
- package/dist/cjs/{VCCard-b5d1ecb3.js.map → VCCard-4f02e2f4.js.map} +1 -1
- package/dist/cjs/{VCDisplayCard2-ede5a360.js → VCDisplayCard2-8517f419.js} +28 -13
- package/dist/cjs/VCDisplayCard2-8517f419.js.map +1 -0
- package/dist/cjs/i18n-cc7e34ec.js +55 -0
- package/dist/cjs/i18n-cc7e34ec.js.map +1 -0
- package/dist/cjs/index.js +7 -3
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/index14.js +4 -3
- package/dist/cjs/index14.js.map +1 -1
- package/dist/cjs/index22.js +2 -1
- package/dist/cjs/index22.js.map +1 -1
- package/dist/cjs/index39.js +4 -3
- package/dist/cjs/index39.js.map +1 -1
- package/dist/cjs/index42.js +3 -2
- package/dist/cjs/index42.js.map +1 -1
- package/dist/esm/{MeritBadgeDisplayCard-a7a504e0.js → MeritBadgeDisplayCard-2029a552.js} +2 -2
- package/dist/esm/{MeritBadgeDisplayCard-a7a504e0.js.map → MeritBadgeDisplayCard-2029a552.js.map} +1 -1
- package/dist/esm/{VCCard-f017f1ee.js → VCCard-c0f6dff3.js} +2 -2
- package/dist/esm/{VCCard-f017f1ee.js.map → VCCard-c0f6dff3.js.map} +1 -1
- package/dist/esm/{VCDisplayCard2-72bed598.js → VCDisplayCard2-fc5c4225.js} +28 -13
- package/dist/esm/VCDisplayCard2-fc5c4225.js.map +1 -0
- package/dist/esm/i18n-8454d6ea.js +47 -0
- package/dist/esm/i18n-8454d6ea.js.map +1 -0
- package/dist/esm/index.js +4 -3
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/index14.js +4 -3
- package/dist/esm/index14.js.map +1 -1
- package/dist/esm/index22.js +2 -1
- package/dist/esm/index22.js.map +1 -1
- package/dist/esm/index39.js +4 -3
- package/dist/esm/index39.js.map +1 -1
- package/dist/esm/index42.js +3 -2
- package/dist/esm/index42.js.map +1 -1
- package/dist/index.d.ts +37 -1
- package/package.json +2 -2
- package/src/components/MeritBadgeDisplayCard/MeritBadgeFrontFace.tsx +1 -1
- package/src/components/MeritBadgeDisplayCard/VerifierStateBadgeAndText.tsx +7 -5
- package/src/components/VCDisplayCard2/VerificationRow.tsx +27 -4
- package/src/components/VCDisplayCard2/VerificationsBox.tsx +4 -5
- package/src/i18n/index.tsx +87 -0
- package/src/index.ts +3 -0
- package/dist/cjs/VCDisplayCard2-ede5a360.js.map +0 -1
- package/dist/esm/VCDisplayCard2-72bed598.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VCCard-
|
|
1
|
+
{"version":3,"file":"VCCard-4f02e2f4.js","sources":["../../src/components/VCCard/VCCard.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { initLearnCard } from '@learncard/init';\nimport { VC, Profile, VerificationItem } from '@learncard/types';\n\nimport { VCDisplayCard } from '../VCDisplayCard';\nimport {\n VCDisplayCard2,\n CredentialIconType,\n} from '../VCDisplayCard2';\n\nimport { MediaMetadata, VideoMetadata } from '../../types';\n\nexport type VCCardProps = {\n credential: VC;\n issueeOverride?: Profile;\n className?: string;\n version?: '1' | '2';\n\n /* Only used for version 2 */\n subjectImageComponent?: React.ReactNode;\n // convertTagsToSkills?: (tags: string[]) => { [skill: string]: string[] };\n handleXClick?: () => void;\n getFileMetadata?: (url: string) => MediaMetadata;\n getVideoMetadata?: (url: string) => VideoMetadata;\n onMediaAttachmentClick?: (url: string) => void;\n bottomRightIcon?: CredentialIconType;\n};\n\nexport const VCCard: React.FC<VCCardProps> = ({\n credential,\n issueeOverride,\n className = '',\n version = '1',\n subjectImageComponent,\n // convertTagsToSkills,\n handleXClick,\n getFileMetadata,\n getVideoMetadata,\n onMediaAttachmentClick,\n bottomRightIcon,\n}) => {\n const [loading, setLoading] = useState(true);\n const [vcVerification, setVCVerification] = useState<VerificationItem[]>([]);\n\n useEffect(() => {\n const verify = async () => {\n const wallet = await initLearnCard();\n const verification = await wallet.invoke.verifyCredential(credential, {}, true);\n setVCVerification(verification);\n setLoading(false);\n };\n\n verify();\n }, [credential]);\n\n if (version === '1') {\n return (\n <VCDisplayCard\n credential={credential}\n issueeOverride={issueeOverride}\n className={className}\n loading={loading}\n verification={vcVerification}\n />\n );\n }\n return (\n <VCDisplayCard2\n credential={credential}\n issueeOverride={issueeOverride}\n verificationInProgress={loading}\n verificationItems={vcVerification}\n subjectImageComponent={subjectImageComponent}\n // convertTagsToSkills={convertTagsToSkills}\n handleXClick={handleXClick}\n getFileMetadata={getFileMetadata}\n getVideoMetadata={getVideoMetadata}\n onMediaAttachmentClick={onMediaAttachmentClick}\n bottomRightIcon={bottomRightIcon}\n />\n );\n};\n\nexport default VCCard;\n"],"names":["useState","useEffect","initLearnCard","React","VCDisplayCard","VCDisplayCard2"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,MAAM,SAAgC,CAAC;AAAA,EAC1C,UAAA;AAAA,EACA,cAAA;AAAA,EACA,SAAY,GAAA,EAAA;AAAA,EACZ,OAAU,GAAA,GAAA;AAAA,EACV,qBAAA;AAAA;AAAA,EAEA,YAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,sBAAA;AAAA,EACA,eAAA;AACJ,CAAM,KAAA;AACF,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIA,eAAS,IAAI,CAAA,CAAA;AAC3C,EAAA,MAAM,CAAC,cAAgB,EAAA,iBAAiB,CAAI,GAAAA,cAAA,CAA6B,EAAE,CAAA,CAAA;AAE3E,EAAAC,eAAA,CAAU,MAAM;AACZ,IAAA,MAAM,SAAS,MAAY,OAAA,CAAA,IAAA,EAAA,IAAA,EAAA,aAAA;AACvB,MAAM,MAAA,MAAA,GAAS,MAAMC,kBAAc,EAAA,CAAA;AACnC,MAAM,MAAA,YAAA,GAAe,MAAM,MAAO,CAAA,MAAA,CAAO,iBAAiB,UAAY,EAAA,IAAI,IAAI,CAAA,CAAA;AAC9E,MAAA,iBAAA,CAAkB,YAAY,CAAA,CAAA;AAC9B,MAAA,UAAA,CAAW,KAAK,CAAA,CAAA;AAAA,KACpB,CAAA,CAAA;AAEA,IAAO,MAAA,EAAA,CAAA;AAAA,GACX,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EAAA,IAAI,YAAY,GAAK,EAAA;AACjB,IACI,uBAAAC,yBAAA,CAAA,aAAA;AAAA,MAACC,2BAAA;AAAA,MAAA;AAAA,QACG,UAAA;AAAA,QACA,cAAA;AAAA,QACA,SAAA;AAAA,QACA,OAAA;AAAA,QACA,YAAc,EAAA,cAAA;AAAA,OAAA;AAAA,KAClB,CAAA;AAAA,GAER;AACA,EACI,uBAAAD,yBAAA,CAAA,aAAA;AAAA,IAACE,6BAAA;AAAA,IAAA;AAAA,MACG,UAAA;AAAA,MACA,cAAA;AAAA,MACA,sBAAwB,EAAA,OAAA;AAAA,MACxB,iBAAmB,EAAA,cAAA;AAAA,MACnB,qBAAA;AAAA,MAEA,YAAA;AAAA,MACA,eAAA;AAAA,MACA,gBAAA;AAAA,MACA,sBAAA;AAAA,MACA,eAAA;AAAA,KAAA;AAAA,GACJ,CAAA;AAER;;;;"}
|
|
@@ -8,12 +8,13 @@ var VerifierStateBadgeAndText = require('./VerifierStateBadgeAndText-c15064b2.js
|
|
|
8
8
|
require('./index-da255c9a.js');
|
|
9
9
|
var Lightbox = require('./Lightbox-d72e19ba.js');
|
|
10
10
|
var types_esm = require('./types.esm-f1680b31.js');
|
|
11
|
+
var i18n = require('./i18n-cc7e34ec.js');
|
|
11
12
|
var CertificateDisplayCard = require('./CertificateDisplayCard-b673e66d.js');
|
|
12
13
|
var QRCodeIcon = require('./QRCodeIcon-3021a53b.js');
|
|
13
14
|
var index = require('./index-5488badc.js');
|
|
14
15
|
var PuzzlePiece = require('./PuzzlePiece-e64f4596.js');
|
|
15
16
|
var IDSleeve = require('./id-sleeve.png');
|
|
16
|
-
var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-
|
|
17
|
+
var MeritBadgeDisplayCard = require('./MeritBadgeDisplayCard-15b85a79.js');
|
|
17
18
|
|
|
18
19
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
19
20
|
|
|
@@ -684,9 +685,21 @@ var e=function(t){return "number"==typeof t},i=function(t){return "function"==ty
|
|
|
684
685
|
|
|
685
686
|
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__*/React.createContext({}),u=/*#__PURE__*/React.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__default["default"].createElement(f.Provider,{value:this.flipCallbacks},/*#__PURE__*/React__default["default"].createElement(t.element,{className:t.className,ref:function(t){return e.el=t}},this.props.children));return r&&(n=/*#__PURE__*/React__default["default"].createElement(u.Provider,{value:r},n)),n},p}(React.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=React.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__*/React.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__default["default"].createElement(g,s({},I),t):/*#__PURE__*/React__default["default"].createElement(u.Consumer,null,function(e){return React__default["default"].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__default["default"].createElement(g,s({flipId:n},I,{portalKey:e}),t)})}):null};v.displayName="Flipped";
|
|
686
687
|
|
|
688
|
+
const MESSAGE_KEYS = {
|
|
689
|
+
Valid: "valid",
|
|
690
|
+
Invalid: "invalid",
|
|
691
|
+
"Not Revoked": "notRevoked",
|
|
692
|
+
Revoked: "revoked",
|
|
693
|
+
"Does Not Expire": "doesNotExpire",
|
|
694
|
+
Expired: "expired",
|
|
695
|
+
Active: "active",
|
|
696
|
+
"Boost Credential could not be verified.": "couldNotVerify",
|
|
697
|
+
"Boost Credential could not be verified": "couldNotVerify"
|
|
698
|
+
};
|
|
687
699
|
const VerificationRow = ({ verification }) => {
|
|
688
700
|
var _a, _b;
|
|
689
701
|
const [showInfo, setShowInfo] = React.useState(false);
|
|
702
|
+
const t = i18n.useT();
|
|
690
703
|
const statusColor = credential_helpers.getColorForVerificationStatus(verification.status);
|
|
691
704
|
const getIcon = () => {
|
|
692
705
|
switch (verification.status) {
|
|
@@ -698,9 +711,16 @@ const VerificationRow = ({ verification }) => {
|
|
|
698
711
|
return /* @__PURE__ */ React__default["default"].createElement(Lightbox.X, { className: "w-[15px] h-[15px]" });
|
|
699
712
|
}
|
|
700
713
|
};
|
|
701
|
-
|
|
714
|
+
const statusText = t(`verification.status.${String(verification.status).toLowerCase()}`);
|
|
715
|
+
const translateMessage = (msg) => {
|
|
716
|
+
if (!msg) return "";
|
|
717
|
+
const key = MESSAGE_KEYS[msg];
|
|
718
|
+
return key ? t(`verification.message.${key}`) : msg;
|
|
719
|
+
};
|
|
720
|
+
const checkLabel = verification.check ? t(`verification.check.${verification.check}`) : "";
|
|
721
|
+
let primaryText = verification.check ? `${checkLabel}: ${translateMessage(verification.message)}` : translateMessage(verification.message);
|
|
702
722
|
if (verification.status === types_esm.VerificationStatusEnum.Failed) {
|
|
703
|
-
primaryText = (_b = (_a = verification.message) != null ? _a : verification.details) != null ? _b : "";
|
|
723
|
+
primaryText = translateMessage((_b = (_a = verification.message) != null ? _a : verification.details) != null ? _b : "");
|
|
704
724
|
}
|
|
705
725
|
primaryText = VerifierStateBadgeAndText.capitalize(primaryText);
|
|
706
726
|
const infoText = "";
|
|
@@ -711,7 +731,7 @@ const VerificationRow = ({ verification }) => {
|
|
|
711
731
|
style: { color: statusColor }
|
|
712
732
|
},
|
|
713
733
|
getIcon(),
|
|
714
|
-
|
|
734
|
+
statusText,
|
|
715
735
|
infoText
|
|
716
736
|
), showInfo && infoText && /* @__PURE__ */ React__default["default"].createElement(
|
|
717
737
|
InfoBox,
|
|
@@ -725,7 +745,8 @@ const VerificationRow = ({ verification }) => {
|
|
|
725
745
|
|
|
726
746
|
const VerificationsBox = ({ verificationItems }) => {
|
|
727
747
|
const [showInfo, setShowInfo] = React.useState(false);
|
|
728
|
-
|
|
748
|
+
const t = i18n.useT();
|
|
749
|
+
return /* @__PURE__ */ React__default["default"].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__default["default"].createElement("h3", { className: "text-[20px] leading-[20px] text-grayscale-900" }, t("verification.title")), /* @__PURE__ */ React__default["default"].createElement(
|
|
729
750
|
"button",
|
|
730
751
|
{
|
|
731
752
|
className: "absolute top-[17px] right-[17px]",
|
|
@@ -735,13 +756,7 @@ const VerificationsBox = ({ verificationItems }) => {
|
|
|
735
756
|
}
|
|
736
757
|
},
|
|
737
758
|
/* @__PURE__ */ React__default["default"].createElement(VerifierStateBadgeAndText.InfoIcon, { color: showInfo ? "#6366F1" : void 0 })
|
|
738
|
-
), showInfo && /* @__PURE__ */ React__default["default"].createElement(
|
|
739
|
-
InfoBox,
|
|
740
|
-
{
|
|
741
|
-
text: "Credential verifications check the cryptographic proof of digital credentials to ensure their authenticity and accuracy.",
|
|
742
|
-
handleClose: () => setShowInfo(false)
|
|
743
|
-
}
|
|
744
|
-
), verificationItems.map((verification, index) => /* @__PURE__ */ React__default["default"].createElement(VerificationRow, { key: index, verification })));
|
|
759
|
+
), showInfo && /* @__PURE__ */ React__default["default"].createElement(InfoBox, { text: t("verification.infoText"), handleClose: () => setShowInfo(false) }), verificationItems.map((verification, index) => /* @__PURE__ */ React__default["default"].createElement(VerificationRow, { key: index, verification })));
|
|
745
760
|
};
|
|
746
761
|
|
|
747
762
|
const Flipped$4 = v;
|
|
@@ -1532,4 +1547,4 @@ const VCDisplayCard2 = ({
|
|
|
1532
1547
|
exports.VCDisplayCard2 = VCDisplayCard2;
|
|
1533
1548
|
exports.VCDisplayCardSkillsCount = VCDisplayCardSkillsCount;
|
|
1534
1549
|
exports.VCIDDisplayCard = VCIDDisplayCard;
|
|
1535
|
-
//# sourceMappingURL=VCDisplayCard2-
|
|
1550
|
+
//# sourceMappingURL=VCDisplayCard2-8517f419.js.map
|