@local-civics/hub-ui 0.1.207 → 0.1.208

package/dist/index.d.ts

@@ -1017,6 +1017,7 @@ type BadgeItem = {
     completedAt?: string | null;
     startedAt?: string | null;
     weight: number;
+    iconURL?: string;
     onClick?: () => void;
 };
 type PathwayCriteria = Record<string, number>;

package/dist/index.js

@@ -5671,7 +5671,7 @@ const PathwayTranscript = (props) => {
       const groupBadges = badgePool.filter((b) => b.categories.includes(l2Id));
       if (groupBadges.length === 0)
         return null;
-      return /* @__PURE__ */ React__namespace.createElement("div", { key: l2Id, className: "space-y-4" }, /* @__PURE__ */ React__namespace.createElement("h3", { className: "font-bold text-base text-zinc-800 flex items-center gap-x-2" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "h-4 w-1 bg-blue-600 rounded-full" }), ((_a2 = props.categoryNames) == null ? void 0 : _a2[l2Id]) || l2Id), /* @__PURE__ */ React__namespace.createElement("div", { className: layout === "grid" ? "grid grid-cols-3 gap-4" : "space-y-3" }, groupBadges.map((b) => /* @__PURE__ */ React__namespace.createElement("div", { key: b.badgeId, className: `p-4 bg-white rounded-xl border border-zinc-200 shadow-sm ${layout === "grid" ? "flex flex-col" : "flex items-center justify-between"}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "flex items-center gap-x-3" }, /* @__PURE__ */ React__namespace.createElement(BadgeEmblem, { size: "sm", iconURL: props.imageURL }), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement("p", { className: "text-xs font-bold text-zinc-800" }, b.displayName), statusLabel && /* @__PURE__ */ React__namespace.createElement("p", { className: "text-[9px] text-amber-500 font-black uppercase mt-0.5" }, statusLabel))), /* @__PURE__ */ React__namespace.createElement("span", { className: "font-black text-blue-600 text-xs" }, b.weight, " pts")))));
+      return /* @__PURE__ */ React__namespace.createElement("div", { key: l2Id, className: "space-y-4" }, /* @__PURE__ */ React__namespace.createElement("h3", { className: "font-bold text-base text-zinc-800 flex items-center gap-x-2" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "h-4 w-1 bg-blue-600 rounded-full" }), ((_a2 = props.categoryNames) == null ? void 0 : _a2[l2Id]) || l2Id), /* @__PURE__ */ React__namespace.createElement("div", { className: layout === "grid" ? "grid grid-cols-3 gap-4" : "space-y-3" }, groupBadges.map((b) => /* @__PURE__ */ React__namespace.createElement("div", { key: b.badgeId, className: `p-4 bg-white rounded-xl border border-zinc-200 shadow-sm ${layout === "grid" ? "flex flex-col" : "flex items-center justify-between"}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "flex items-center gap-x-3" }, /* @__PURE__ */ React__namespace.createElement(BadgeEmblem, { size: "sm", iconURL: b.iconURL }), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement("p", { className: "text-xs font-bold text-zinc-800" }, b.displayName), statusLabel && /* @__PURE__ */ React__namespace.createElement("p", { className: "text-[9px] text-amber-500 font-black uppercase mt-0.5" }, statusLabel))), /* @__PURE__ */ React__namespace.createElement("span", { className: "font-black text-blue-600 text-xs" }, b.weight, " pts")))));
     }));
   };
   return /* @__PURE__ */ React__namespace.createElement("div", { className: "p-6 space-y-10 border-t border-zinc-100 bg-zinc-50/30 animate-in fade-in duration-500" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "grid grid-cols-3 gap-4 bg-white p-5 rounded-xl border border-zinc-100 shadow-sm text-sm" }, /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement("p", { className: "text-zinc-400 uppercase text-[9px] font-black mb-1" }, "Student"), /* @__PURE__ */ React__namespace.createElement("p", { className: "font-bold text-zinc-800" }, safeRender(props.studentName) || "Guest User"), /* @__PURE__ */ React__namespace.createElement("p", { className: "text-zinc-500 text-[11px] mt-0.5" }, safeRender(props.studentEmail))), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement("p", { className: "text-zinc-400 uppercase text-[9px] font-black mb-1" }, "Organization"), /* @__PURE__ */ React__namespace.createElement("p", { className: "font-bold text-zinc-800" }, safeRender(props.schoolName) || "Not Provided"), /* @__PURE__ */ React__namespace.createElement("p", { className: "text-zinc-500 text-[11px] mt-0.5" }, props.gradeLevel ? `Grade ${safeRender(props.gradeLevel)}` : "")), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement("p", { className: "text-zinc-400 uppercase text-[9px] font-black mb-1" }, "Status"), /* @__PURE__ */ React__namespace.createElement("p", { className: "text-blue-500 font-bold text-[10px] uppercase" }, "Verified Record"), /* @__PURE__ */ React__namespace.createElement("p", { className: "text-zinc-400 text-[10px] mt-0.5" }, props.today || new Date().toLocaleDateString()))), /* @__PURE__ */ React__namespace.createElement("section", { className: "space-y-6" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React__namespace.createElement("h1", { className: "text-2xl font-black text-zinc-900 tracking-tight" }, props.title || "Untitled Pathway"), /* @__PURE__ */ React__namespace.createElement("p", { className: "text-sm text-zinc-500 max-w-3xl leading-relaxed" }, props.description || "No description provided for this pathway.")), /* @__PURE__ */ React__namespace.createElement("div", { className: "grid grid-cols-3 gap-4" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "bg-white border border-zinc-200 p-4 rounded-xl shadow-sm flex flex-col items-center justify-center text-center" }, /* @__PURE__ */ React__namespace.createElement("span", { className: "text-2xl font-black text-blue-600" }, totalPointsEarned.toLocaleString()), /* @__PURE__ */ React__namespace.createElement("span", { className: "text-[10px] font-bold text-zinc-400 uppercase tracking-widest mt-1" }, "Total Pts")), /* @__PURE__ */ React__namespace.createElement("div", { className: "bg-white border border-zinc-200 p-4 rounded-xl shadow-sm flex flex-col items-center justify-center text-center" }, /* @__PURE__ */ React__namespace.createElement("span", { className: "text-2xl font-black text-blue-600" }, badgesEarnedCount), /* @__PURE__ */ React__namespace.createElement("span", { className: "text-[10px] font-bold text-zinc-400 uppercase tracking-widest mt-1" }, "Badges Earned")), /* @__PURE__ */ React__namespace.createElement("div", { className: "bg-white border border-zinc-200 p-4 rounded-xl shadow-sm flex flex-col items-center justify-center text-center" }, /* @__PURE__ */ React__namespace.createElement("span", { className: `text-2xl font-black ${sealEarned ? "text-emerald-500" : "text-zinc-300"}` }, sealEarned ? "Yes" : "No"), /* @__PURE__ */ React__namespace.createElement("span", { className: "text-[10px] font-bold text-zinc-400 uppercase tracking-widest mt-1" }, "Seal Earned")))), /* @__PURE__ */ React__namespace.createElement("section", null, /* @__PURE__ */ React__namespace.createElement("p", { className: "text-[10px] font-black uppercase text-zinc-400 tracking-widest mb-3" }, "Criteria & Progress"), /* @__PURE__ */ React__namespace.createElement("div", { className: "p-5 border border-zinc-100 rounded-xl bg-white shadow-sm" }, /* @__PURE__ */ React__namespace.createElement(PathwayProgressBarChart, { targets: props.mappedTargets, points: props.mappedPoints, height: "md" }))), /* @__PURE__ */ React__namespace.createElement("section", { className: "space-y-12" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "flex justify-between items-center border-b border-zinc-200 pb-3" }, /* @__PURE__ */ React__namespace.createElement("p", { className: "text-[10px] font-black uppercase text-zinc-400 tracking-widest" }, "Activity History"), /* @__PURE__ */ React__namespace.createElement("div", { className: "flex bg-white border border-zinc-200 p-1 rounded-md text-[10px] font-bold uppercase" }, /* @__PURE__ */ React__namespace.createElement("button", { onClick: () => setLayout("list"), className: `px-3 py-1.5 rounded ${layout === "list" ? "bg-zinc-100 text-blue-600" : "text-zinc-400"}` }, "List View"), /* @__PURE__ */ React__namespace.createElement("button", { onClick: () => setLayout("grid"), className: `px-3 py-1.5 rounded ${layout === "grid" ? "bg-zinc-100 text-blue-600" : "text-zinc-400"}` }, "Grid View"))), renderBadgePool(completedBadges, "Completed Activity"), renderBadgePool(inProgressBadges, "In Progress", "Started")));