@learncard/react 2.3.46 → 2.3.48

package/dist/cjs/constants-678d0aa9.js

@@ -0,0 +1,106 @@
+'use strict';
+
+var React = require('react');
+var index$1 = require('./index-63ee021e.js');
+var icons = require('./icons-cf98ef88.js');
+var CircleIcon = require('./CircleIcon-41b3fa88.js');
+var index = require('./index-6cab6d37.js');
+var coinsGraphic = require('./walletcurrency.webp');
+var idsGraphic = require('./walletids.webp');
+var jobhistoryGraphic = require('./walletjobhistory.webp');
+var learningHistoryGraphic = require('./walletlearninghistory.webp');
+var skillsGraphic = require('./walletskills.webp');
+var achievementsGraphic = require('./walletTrophy.webp');
+var MiniTrophyIcon = require('./minitrophycolored.svg');
+var MiniGradIcon = require('./minigradcapcolored.svg');
+var MiniPuzzleIcon = require('./minipuzzlecolored.svg');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var coinsGraphic__default = /*#__PURE__*/_interopDefaultLegacy(coinsGraphic);
+var idsGraphic__default = /*#__PURE__*/_interopDefaultLegacy(idsGraphic);
+var jobhistoryGraphic__default = /*#__PURE__*/_interopDefaultLegacy(jobhistoryGraphic);
+var learningHistoryGraphic__default = /*#__PURE__*/_interopDefaultLegacy(learningHistoryGraphic);
+var skillsGraphic__default = /*#__PURE__*/_interopDefaultLegacy(skillsGraphic);
+var achievementsGraphic__default = /*#__PURE__*/_interopDefaultLegacy(achievementsGraphic);
+var MiniTrophyIcon__default = /*#__PURE__*/_interopDefaultLegacy(MiniTrophyIcon);
+var MiniGradIcon__default = /*#__PURE__*/_interopDefaultLegacy(MiniGradIcon);
+var MiniPuzzleIcon__default = /*#__PURE__*/_interopDefaultLegacy(MiniPuzzleIcon);
+
+const RoundedSquare = ({
+  title = "Currencies",
+  description = "Lorem ipsum sit dalor amet",
+  iconSrc = icons.ICONS_TO_SOURCE[index$1.Icons.trophyIcon],
+  imgSrc,
+  type = index$1.WalletCategoryTypes.achievements,
+  count = "28",
+  onClick = () => {
+  },
+  bgColor
+}) => {
+  const imgSource = imgSrc || index.TYPE_TO_IMG_SRC[type];
+  const backgroundColor = bgColor != null ? bgColor : `bg-${index.TYPE_TO_WALLET_COLOR[type]}`;
+  const circleClass = `flex w-full justify-end icon-display absolute right-[15px] bottom-[10px] max-h-[40px] max-w-[40px]`;
+  return /* @__PURE__ */ React__default["default"].createElement("button", {
+    onClick,
+    className: `flex relative ${backgroundColor} py-[15px] px-[15px] w-[170px] h-[170px] rounded-[40px] rounded-square-card-container`
+  }, /* @__PURE__ */ React__default["default"].createElement("div", {
+    className: "w-full relative"
+  }, /* @__PURE__ */ React__default["default"].createElement("section", {
+    className: "title-headline-container flex items-center"
+  }, /* @__PURE__ */ React__default["default"].createElement(CircleIcon.CountCircle, {
+    count,
+    className: "solo-counter-circle right-[0px] top-[0px] relative"
+  }), /* @__PURE__ */ React__default["default"].createElement("h3", {
+    className: "line-clamp-2 font-bold text-[13px] text-grayscale-900 ml-[5px]"
+  }, title)), /* @__PURE__ */ React__default["default"].createElement("div", {
+    className: "graphic-background relative flex justify-center"
+  }, /* @__PURE__ */ React__default["default"].createElement("img", {
+    className: "max-w-[130px]",
+    src: imgSource
+  }))), /* @__PURE__ */ React__default["default"].createElement("div", {
+    className: circleClass
+  }, /* @__PURE__ */ React__default["default"].createElement(CircleIcon.CircleIcon, {
+    iconSrc,
+    count,
+    size: "40"
+  })));
+};
+
+const TYPE_TO_MINI_ICON = {
+  [index$1.LCSubtypes.course]: MiniGradIcon__default["default"],
+  [index$1.LCSubtypes.achievement]: MiniTrophyIcon__default["default"],
+  [index$1.LCSubtypes.skill]: MiniPuzzleIcon__default["default"]
+};
+const WALLET_SUBTYPES = {
+  ACHIEVEMENTS: "achievements",
+  IDS: "ids",
+  JOB_HISTORY: "jobHistory",
+  CURRENCIES: "currency",
+  LEARNING_HISTORY: "learningHistory",
+  SKILLS: "skills"
+};
+const TYPE_TO_IMG_SRC = {
+  [WALLET_SUBTYPES.ACHIEVEMENTS]: achievementsGraphic__default["default"],
+  [WALLET_SUBTYPES.IDS]: idsGraphic__default["default"],
+  [WALLET_SUBTYPES.JOB_HISTORY]: jobhistoryGraphic__default["default"],
+  [WALLET_SUBTYPES.LEARNING_HISTORY]: learningHistoryGraphic__default["default"],
+  [WALLET_SUBTYPES.CURRENCIES]: coinsGraphic__default["default"],
+  [WALLET_SUBTYPES.SKILLS]: skillsGraphic__default["default"]
+};
+const TYPE_TO_WALLET_COLOR = {
+  [WALLET_SUBTYPES.ACHIEVEMENTS]: "spice-300",
+  [WALLET_SUBTYPES.IDS]: "yellow-300",
+  [WALLET_SUBTYPES.JOB_HISTORY]: "rose-300",
+  [WALLET_SUBTYPES.LEARNING_HISTORY]: "emerald-300",
+  [WALLET_SUBTYPES.CURRENCIES]: "cyan-200",
+  [WALLET_SUBTYPES.SKILLS]: "indigo-300"
+};
+
+exports.RoundedSquare = RoundedSquare;
+exports.TYPE_TO_IMG_SRC = TYPE_TO_IMG_SRC;
+exports.TYPE_TO_MINI_ICON = TYPE_TO_MINI_ICON;
+exports.TYPE_TO_WALLET_COLOR = TYPE_TO_WALLET_COLOR;
+exports.WALLET_SUBTYPES = WALLET_SUBTYPES;
+//# sourceMappingURL=constants-678d0aa9.js.map

package/dist/cjs/constants-678d0aa9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants-678d0aa9.js","sources":["../../src/components/RoundedSquare/RoundedSquare.tsx","../../src/components/RoundedSquare/constants.ts"],"sourcesContent":["import React from 'react';\nimport { Icons, WalletCategoryTypes } from '../../types';\nimport { ICONS_TO_SOURCE } from '../../constants/icons';\nimport CircleIcon from '../CircleIcon/CircleIcon';\nimport { CountCircle } from '../CircleIcon';\nimport { TYPE_TO_IMG_SRC, TYPE_TO_WALLET_COLOR } from '../../constants';\n\nexport type RoundedSquareProps = {\n    title?: string;\n    description?: string;\n    type?: WalletCategoryTypes;\n    iconSrc?: string;\n    imgSrc?: string;\n    count?: string | number;\n    onClick?: () => void;\n    bgColor?: string;\n};\n\nexport const RoundedSquare: React.FC<RoundedSquareProps> = ({\n    title = 'Currencies',\n    description = 'Lorem ipsum sit dalor amet',\n    iconSrc = ICONS_TO_SOURCE[Icons.trophyIcon],\n    imgSrc,\n    type = WalletCategoryTypes.achievements,\n    count = '28',\n    onClick = () => {},\n    bgColor,\n}) => {\n    const imgSource = imgSrc || TYPE_TO_IMG_SRC[type];\n    const backgroundColor = bgColor ?? `bg-${TYPE_TO_WALLET_COLOR[type]}`;\n    const circleClass = `flex w-full justify-end icon-display absolute right-[15px] bottom-[10px] max-h-[40px] max-w-[40px]`;\n\n    return (\n        <button\n            onClick={onClick}\n            className={`flex relative ${backgroundColor} py-[15px] px-[15px] w-[170px] h-[170px] rounded-[40px] rounded-square-card-container`}\n        >\n            <div className=\"w-full relative\">\n                <section className=\"title-headline-container flex items-center\">\n                    <CountCircle\n                        count={count}\n                        className=\"solo-counter-circle right-[0px] top-[0px] relative\"\n                    />\n                    <h3 className=\"line-clamp-2 font-bold text-[13px] text-grayscale-900 ml-[5px]\">\n                        {title}\n                    </h3>\n                </section>\n\n                <div className=\"graphic-background relative flex justify-center\">\n                    <img className=\"max-w-[130px]\" src={imgSource} />\n                </div>\n            </div>\n\n            <div className={circleClass}>\n                <CircleIcon iconSrc={iconSrc} count={count} size=\"40\" />\n            </div>\n        </button>\n    );\n};\n\nexport default RoundedSquare;\n","import coinsGraphic from '../../assets/images/walletcurrency.webp';\nimport idsGraphic from '../../assets/images/walletids.webp';\nimport jobhistoryGraphic from '../../assets/images/walletjobhistory.webp';\nimport learningHistoryGraphic from '../../assets/images/walletlearninghistory.webp';\nimport skillsGraphic from '../../assets/images/walletskills.webp';\nimport achievementsGraphic from '../../assets/images/walletTrophy.webp';\n\nimport MiniTrophyIcon from '../../assets/images/minitrophycolored.svg';\nimport MiniGradIcon from '../../assets/images/minigradcapcolored.svg';\nimport MiniPuzzleIcon from '../../assets/images/minipuzzlecolored.svg';\nimport { LCSubtypes } from '../../types';\n\nexport const TYPE_TO_MINI_ICON: any = {\n    [LCSubtypes.course]: MiniGradIcon,\n    [LCSubtypes.achievement]: MiniTrophyIcon,\n    [LCSubtypes.skill]: MiniPuzzleIcon,\n};\n\nexport const WALLET_SUBTYPES = {\n    ACHIEVEMENTS: 'achievements',\n    IDS: 'ids',\n    JOB_HISTORY: 'jobHistory',\n    CURRENCIES: 'currency',\n    LEARNING_HISTORY: 'learningHistory',\n    SKILLS: 'skills',\n};\n\nexport const TYPE_TO_IMG_SRC = {\n    [WALLET_SUBTYPES.ACHIEVEMENTS]: achievementsGraphic,\n    [WALLET_SUBTYPES.IDS]: idsGraphic,\n    [WALLET_SUBTYPES.JOB_HISTORY]: jobhistoryGraphic,\n    [WALLET_SUBTYPES.LEARNING_HISTORY]: learningHistoryGraphic,\n    [WALLET_SUBTYPES.CURRENCIES]: coinsGraphic,\n    [WALLET_SUBTYPES.SKILLS]: skillsGraphic,\n};\n\nexport const TYPE_TO_WALLET_COLOR = {\n    [WALLET_SUBTYPES.ACHIEVEMENTS]: 'spice-300',\n    [WALLET_SUBTYPES.IDS]: 'yellow-300',\n    [WALLET_SUBTYPES.JOB_HISTORY]: 'rose-300',\n    [WALLET_SUBTYPES.LEARNING_HISTORY]: 'emerald-300',\n    [WALLET_SUBTYPES.CURRENCIES]: 'cyan-200',\n    [WALLET_SUBTYPES.SKILLS]: 'indigo-300',\n};"],"names":["ICONS_TO_SOURCE","Icons","WalletCategoryTypes","TYPE_TO_IMG_SRC","TYPE_TO_WALLET_COLOR","React","CountCircle","CircleIcon","LCSubtypes","MiniGradIcon","MiniTrophyIcon","MiniPuzzleIcon","achievementsGraphic","idsGraphic","jobhistoryGraphic","learningHistoryGraphic","coinsGraphic","skillsGraphic"],"mappings":"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"}

package/dist/cjs/index.js

@@ -20,8 +20,8 @@ var MiniVCThumbnail = require('./MiniVCThumbnail-a78e44f2.js');
 var Notification = require('./Notification-10b40c07.js');
 var QRCodeCard = require('./QRCodeCard-efaa58e1.js');
 var RoundedPill = require('./RoundedPill-15c0aca9.js');
-var RoundedSquare = require('./RoundedSquare-9208c484.js');
-var SchoolIDCard = require('./SchoolIDCard-32a47ae5.js');
+var constants = require('./constants-678d0aa9.js');
+var SchoolIDCard = require('./SchoolIDCard-1baf77e8.js');
 var SkillTabCard = require('./SkillTabCard-82f2fae0.js');
 var SkillVerticalCard = require('./SkillVerticalCard-3eb3a8e9.js');
 var SkillsCard = require('./SkillsCard-4b6dbb4f.js');
@@ -100,7 +100,11 @@ exports.NotificationTypeStyles = Notification.NotificationTypeStyles;
 exports.QRCodeCard = QRCodeCard.QRCodeCard;
 exports.CheckmarkSvg = RoundedPill.CheckmarkSvg;
 exports.RoundedPill = RoundedPill.RoundedPill;
-exports.RoundedSquare = RoundedSquare.RoundedSquare;
+exports.RoundedSquare = constants.RoundedSquare;
+exports.TYPE_TO_IMG_SRC = constants.TYPE_TO_IMG_SRC;
+exports.TYPE_TO_MINI_ICON = constants.TYPE_TO_MINI_ICON;
+exports.TYPE_TO_WALLET_COLOR = constants.TYPE_TO_WALLET_COLOR;
+exports.WALLET_SUBTYPES = constants.WALLET_SUBTYPES;
 exports.SchoolIDCard = SchoolIDCard.SchoolIDCard;
 exports.SkillTabCard = SkillTabCard.SkillTabCard;
 exports.SkillVerticalCard = SkillVerticalCard.SkillVerticalCard;

package/dist/cjs/index.js.map

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

package/dist/cjs/index10.js

@@ -20,8 +20,8 @@ var MiniVCThumbnail = require('./MiniVCThumbnail-a78e44f2.js');
 var Notification = require('./Notification-10b40c07.js');
 var QRCodeCard = require('./QRCodeCard-efaa58e1.js');
 var RoundedPill = require('./RoundedPill-15c0aca9.js');
-var RoundedSquare = require('./RoundedSquare-9208c484.js');
-var SchoolIDCard = require('./SchoolIDCard-32a47ae5.js');
+var constants = require('./constants-678d0aa9.js');
+var SchoolIDCard = require('./SchoolIDCard-1baf77e8.js');
 var SkillTabCard = require('./SkillTabCard-82f2fae0.js');
 var SkillVerticalCard = require('./SkillVerticalCard-3eb3a8e9.js');
 var SkillsCard = require('./SkillsCard-4b6dbb4f.js');
@@ -100,7 +100,11 @@ exports.NotificationTypeStyles = Notification.NotificationTypeStyles;
 exports.QRCodeCard = QRCodeCard.QRCodeCard;
 exports.CheckmarkSvg = RoundedPill.CheckmarkSvg;
 exports.RoundedPill = RoundedPill.RoundedPill;
-exports.RoundedSquare = RoundedSquare.RoundedSquare;
+exports.RoundedSquare = constants.RoundedSquare;
+exports.TYPE_TO_IMG_SRC = constants.TYPE_TO_IMG_SRC;
+exports.TYPE_TO_MINI_ICON = constants.TYPE_TO_MINI_ICON;
+exports.TYPE_TO_WALLET_COLOR = constants.TYPE_TO_WALLET_COLOR;
+exports.WALLET_SUBTYPES = constants.WALLET_SUBTYPES;
 exports.SchoolIDCard = SchoolIDCard.SchoolIDCard;
 exports.SkillTabCard = SkillTabCard.SkillTabCard;
 exports.SkillVerticalCard = SkillVerticalCard.SkillVerticalCard;

package/dist/cjs/index10.js.map

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

package/dist/cjs/index21.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var RoundedSquare = require('./RoundedSquare-9208c484.js');
+var constants = require('./constants-678d0aa9.js');
 require('react');
 require('./index-63ee021e.js');
 require('./icons-cf98ef88.js');
@@ -29,5 +29,9 @@ require('./minipuzzlecolored.svg');
 
 
 
-exports.RoundedSquare = RoundedSquare.RoundedSquare;
+exports.RoundedSquare = constants.RoundedSquare;
+exports.TYPE_TO_IMG_SRC = constants.TYPE_TO_IMG_SRC;
+exports.TYPE_TO_MINI_ICON = constants.TYPE_TO_MINI_ICON;
+exports.TYPE_TO_WALLET_COLOR = constants.TYPE_TO_WALLET_COLOR;
+exports.WALLET_SUBTYPES = constants.WALLET_SUBTYPES;
 //# sourceMappingURL=index21.js.map

package/dist/cjs/index21.js.map

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

package/dist/cjs/index22.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var SchoolIDCard = require('./SchoolIDCard-32a47ae5.js');
+var SchoolIDCard = require('./SchoolIDCard-1baf77e8.js');
 require('react');
 
 

package/dist/esm/{SchoolIDCard-4f56262c.js → SchoolIDCard-3b746226.js}

@@ -4666,6 +4666,9 @@ const SchoolIDCard = ({
   userName,
   text = null,
   extraText,
+  subjectInitials,
+  subjectInitialsClass,
+  showBarcode = true,
   backgroundImage,
   className,
   containerClassName
@@ -4678,6 +4681,18 @@ const SchoolIDCard = ({
   } else {
     textEl = text;
   }
+  let issueeImageEl = null;
+  const initialsClass = `subject-initials h-[70px] w-[70px] rounded-full mr-[10px] flex flex-row items-center justify-center h-full w-full overflow-hidden bg-emerald-700 text-white font-medium text-3xl ${subjectInitialsClass}`;
+  if (userImage && (userImage == null ? void 0 : userImage.trim()) !== "") {
+    issueeImageEl = /* @__PURE__ */ React.createElement("div", {
+      className: "h-[80px] w-[80px] rounded-full overflow-hidden bg-no-repeat bg-cover bg-center border-solid border-[2px] border-white mr-2",
+      style: { backgroundImage: `url(${userImage})` }
+    });
+  } else if (subjectInitials && (!userImage || (userImage == null ? void 0 : userImage.trim()) === "")) {
+    issueeImageEl = /* @__PURE__ */ React.createElement("div", {
+      className: initialsClass
+    }, subjectInitials);
+  }
   return /* @__PURE__ */ React.createElement("div", {
     style: { backgroundImage: `url(${backgroundImage})` },
     className: `h-[200px] w-[320px] rounded-[20px] overflow-hidden ${className}`
@@ -4685,14 +4700,11 @@ const SchoolIDCard = ({
     className: `h-full w-full flex items-center justify-start relative ${containerClassName}`
   }, /* @__PURE__ */ React.createElement("div", {
     className: "w-full flex justify-start items-center pl-3 mt-10"
-  }, /* @__PURE__ */ React.createElement("div", {
-    className: "h-[100px] w-[80px] rounded-full overflow-hidden bg-no-repeat bg-cover bg-center border-solid border-[2px] border-white mr-2",
-    style: { backgroundImage: `url(${userImage})` }
-  }), /* @__PURE__ */ React.createElement("div", {
+  }, issueeImageEl, /* @__PURE__ */ React.createElement("div", {
     className: "h-full flex items-start justify-center flex-col mt-7"
   }, userName && /* @__PURE__ */ React.createElement("p", {
     className: "text-sm text-black font-light"
-  }, userName), textEl && textEl)), /* @__PURE__ */ React.createElement("div", {
+  }, userName), textEl && textEl)), showBarcode && /* @__PURE__ */ React.createElement("div", {
     className: "barcode-container"
   }, /* @__PURE__ */ React.createElement("div", {
     className: "barcode-wrap"
@@ -4707,4 +4719,4 @@ const SchoolIDCard = ({
 };
 
 export { SchoolIDCard as S };
-//# sourceMappingURL=SchoolIDCard-4f56262c.js.map
+//# sourceMappingURL=SchoolIDCard-3b746226.js.map