@local-civics/hub-ui 0.1.222 → 0.1.223

package/dist/index.js

@@ -3043,6 +3043,7 @@ const BadgeEmblem = (props) => {
         return ["h-max w-24", "w-12 h-12"];
       case "lg":
         return ["h-max w-40", "w-20 h-20"];
+      case "md":
       default:
         return ["h-max w-28", "w-14 h-14"];
     }
@@ -3726,7 +3727,7 @@ const BadgeListCard = (props) => {
         imageURL: props.imageURL,
         alt: props.displayName,
         level: props.level,
-        size: "sm"
+        size: "md"
       }
     )), /* @__PURE__ */ React__namespace.createElement("div", { className: "w-full truncate text-xs font-bold text-dark-blue-400" }, props.displayName), /* @__PURE__ */ React__namespace.createElement(Pill, { label: pillLabel, accent: pillAccent }))
   );
@@ -3748,7 +3749,7 @@ const BadgeListRow = (props) => {
         imageURL: props.imageURL,
         alt: props.displayName,
         level: props.level,
-        size: "xxs"
+        size: "xs"
       }
     )),
     /* @__PURE__ */ React__namespace.createElement("div", { className: "min-w-0 flex-1 truncate text-xs font-semibold text-dark-blue-400" }, props.displayName),
@@ -3801,7 +3802,7 @@ const BadgeDetail = (props) => {
       imageURL: props.imageURL,
       alt: props.displayName,
       level: props.level,
-      size: "sm"
+      size: "lg"
     }
   )), /* @__PURE__ */ React__namespace.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-lg font-extrabold text-dark-blue-400" }, props.displayName), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2 text-xs text-slate-500" }, /* @__PURE__ */ React__namespace.createElement("span", { className: "font-semibold" }, "Level ", (props.level || 0) + 1, "."), !!xp && /* @__PURE__ */ React__namespace.createElement("span", { className: "ml-1.5 font-bold text-mint-400" }, xp, " XP")), !!props.summary && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2 text-xs text-slate-500" }, props.summary), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2.5" }, /* @__PURE__ */ React__namespace.createElement(Pill, { label: status, accent: pillAccent }))))), criteriaNames.length > 0 && /* @__PURE__ */ React__namespace.createElement("div", { className: `rounded-2xl border bg-white p-5 ${border} ${shadow}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, "Badge Criteria"), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-1.5 text-xs text-slate-500" }, "Complete 1 of each: ", criteriaNames.join(", ")), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-4 flex flex-col" }, criteria.map((c, i) => {
     var _a;
@@ -5934,7 +5935,15 @@ const PathwayTranscript = (props) => {
   const badgesEarnedCount = completedBadges.length;
   const target = badges.length;
   const anyStarted = badges.some((b) => b.startedAt);
-  const status = target > 0 && badgesEarnedCount === target ? "Completed" : anyStarted || badgesEarnedCount > 0 ? "In Progress" : "Available";
+  const criteriaEntries = Object.entries(props.rawCriteria || {});
+  const hasCriteria = criteriaEntries.length > 0;
+  const criteriaMet = hasCriteria && criteriaEntries.every(
+    ([categoryId, threshold]) => {
+      var _a2;
+      return (((_a2 = props.points) == null ? void 0 : _a2[categoryId]) || 0) >= threshold;
+    }
+  );
+  const status = hasCriteria ? criteriaMet ? "Completed" : anyStarted || badgesEarnedCount > 0 ? "In Progress" : "Available" : target > 0 && badgesEarnedCount === target ? "Completed" : anyStarted || badgesEarnedCount > 0 ? "In Progress" : "Available";
   const safeRender = (val) => typeof val === "string" || typeof val === "number" ? val : "";
   const renderBadgePool = (badgePool) => {
     if (badgePool.length === 0)
@@ -6248,7 +6257,7 @@ const PathwayListCard = (props) => {
       className: `overflow-hidden rounded-2xl border bg-white ${border} ${shadow} ${props.onClick ? "cursor-pointer hover:bg-slate-50" : ""}`
     },
     /* @__PURE__ */ React__namespace.createElement("div", { className: `h-1 bg-gradient-to-r ${strip}` }),
-    /* @__PURE__ */ React__namespace.createElement("div", { className: "flex gap-4 p-4" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "shrink-0" }, /* @__PURE__ */ React__namespace.createElement(BadgeEmblem, { iconURL: props.imageURL, alt: props.title, size: "xs" })), /* @__PURE__ */ React__namespace.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, props.title), props.description && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-1.5 text-xs text-slate-500" }, props.description), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-3 flex items-center gap-2.5" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "h-1.5 flex-1" }, /* @__PURE__ */ React__namespace.createElement(Progress, { rounded: true, color: progress, start: value, end: target })), /* @__PURE__ */ React__namespace.createElement("div", { className: "whitespace-nowrap text-[10.5px] font-semibold text-slate-400" }, value, "/", target, " badges"))))
+    /* @__PURE__ */ React__namespace.createElement("div", { className: "flex gap-4 p-4" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "shrink-0" }, /* @__PURE__ */ React__namespace.createElement(BadgeEmblem, { iconURL: props.imageURL, alt: props.title, size: "sm" })), /* @__PURE__ */ React__namespace.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, props.title), props.description && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-1.5 text-xs text-slate-500" }, props.description), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-3 flex items-center gap-2.5" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "h-1.5 flex-1" }, /* @__PURE__ */ React__namespace.createElement(Progress, { rounded: true, color: progress, start: value, end: target })), /* @__PURE__ */ React__namespace.createElement("div", { className: "whitespace-nowrap text-[10.5px] font-semibold text-slate-400" }, value, "/", target, " badges"))))
   );
 };
 
@@ -6343,7 +6352,15 @@ const PathwayDetail = (props) => {
   const completedCount = badges.filter((b) => b.completedAt).length;
   const target = badges.length;
   const anyStarted = badges.some((b) => b.startedAt);
-  const status = target > 0 && completedCount === target ? "Completed" : anyStarted || completedCount > 0 ? "In Progress" : "Available";
+  const criteriaEntries = Object.entries(props.rawCriteria || {});
+  const hasCriteria = criteriaEntries.length > 0;
+  const criteriaMet = hasCriteria && criteriaEntries.every(
+    ([categoryId, threshold]) => {
+      var _a2;
+      return (((_a2 = props.points) == null ? void 0 : _a2[categoryId]) || 0) >= threshold;
+    }
+  );
+  const status = hasCriteria ? criteriaMet ? "Completed" : anyStarted || completedCount > 0 ? "In Progress" : "Available" : target > 0 && completedCount === target ? "Completed" : anyStarted || completedCount > 0 ? "In Progress" : "Available";
   const { border, shadow, pillAccent } = STATUS_CLASSNAMES[status];
   const categoryIds = Object.keys(props.rawCriteria || {});
   const [catFilter, setCatFilter] = React__namespace.useState(null);
@@ -6352,7 +6369,7 @@ const PathwayDetail = (props) => {
     var _a2;
     return (_a2 = b.categories) == null ? void 0 : _a2.includes(catFilter);
   }) : badges;
-  return /* @__PURE__ */ React__namespace.createElement("div", { className: "flex max-w-2xl flex-col gap-3.5" }, props.onBack && /* @__PURE__ */ React__namespace.createElement("div", { onClick: props.onBack, className: "w-max cursor-pointer text-xs font-bold text-sky-blue-400" }, "\u2190 Back to My Pathways"), /* @__PURE__ */ React__namespace.createElement("div", { className: `overflow-hidden rounded-2xl border bg-white ${border} ${shadow}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "flex gap-4 p-5" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "shrink-0" }, /* @__PURE__ */ React__namespace.createElement(BadgeEmblem, { iconURL: props.imageURL, alt: props.title, size: "sm" })), /* @__PURE__ */ React__namespace.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-lg font-extrabold text-dark-blue-400" }, props.title), !!(props.displayTags && props.displayTags.length) && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2 flex flex-wrap gap-1.5" }, props.displayTags.map((tag) => /* @__PURE__ */ React__namespace.createElement(Pill, { key: tag, label: tag, accent: pillAccent }))), !!props.description && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2 text-xs text-slate-500" }, props.description), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2.5" }, /* @__PURE__ */ React__namespace.createElement(Pill, { label: status, accent: pillAccent }))))), /* @__PURE__ */ React__namespace.createElement("div", { className: `rounded-2xl border bg-white p-5 ${border} ${shadow}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, "Pathway Badges & Criteria"), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-1.5 text-xs text-slate-500" }, "This pathway is comprised of ", target, " badge", target === 1 ? "" : "s", ". It includes required and elective programming."), !!((_a = props.allCategories) == null ? void 0 : _a.length) && /* @__PURE__ */ React__namespace.createElement(
+  return /* @__PURE__ */ React__namespace.createElement("div", { className: "flex max-w-2xl flex-col gap-3.5" }, props.onBack && /* @__PURE__ */ React__namespace.createElement("div", { onClick: props.onBack, className: "w-max cursor-pointer text-xs font-bold text-sky-blue-400" }, "\u2190 Back to My Pathways"), /* @__PURE__ */ React__namespace.createElement("div", { className: `overflow-hidden rounded-2xl border bg-white ${border} ${shadow}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "flex gap-4 p-5" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "shrink-0" }, /* @__PURE__ */ React__namespace.createElement(BadgeEmblem, { iconURL: props.imageURL, alt: props.title, size: "lg" })), /* @__PURE__ */ React__namespace.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-lg font-extrabold text-dark-blue-400" }, props.title), !!(props.displayTags && props.displayTags.length) && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2 flex flex-wrap gap-1.5" }, props.displayTags.map((tag) => /* @__PURE__ */ React__namespace.createElement(Pill, { key: tag, label: tag, accent: pillAccent }))), !!props.description && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2 text-xs text-slate-500" }, props.description), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-2.5" }, /* @__PURE__ */ React__namespace.createElement(Pill, { label: status, accent: pillAccent }))))), /* @__PURE__ */ React__namespace.createElement("div", { className: `rounded-2xl border bg-white p-5 ${border} ${shadow}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, "Pathway Badges & Criteria"), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-1.5 text-xs text-slate-500" }, "This pathway is comprised of ", target, " badge", target === 1 ? "" : "s", ". It includes required and elective programming."), !!((_a = props.allCategories) == null ? void 0 : _a.length) && /* @__PURE__ */ React__namespace.createElement(
     "button",
     {
       onClick: () => setCategoriesOpen(true),