@local-civics/hub-ui 0.1.250 → 0.1.251

package/dist/index.d.ts

@@ -1597,7 +1597,7 @@ declare const FileLocker: (props: FileLockerProps) => JSX.Element;
  */
 type CommentsItem = {
     commentId: string;
-    authorName?: string;
+    commenterName?: string;
     badgeId?: string;
     badgeName?: string;
     lessonId?: string;
@@ -1605,6 +1605,7 @@ type CommentsItem = {
     commentText: string;
     requireValidation: boolean;
     resolvedAt?: string;
+    needsSubmission?: boolean;
     createdAt: string;
 };
 /**

package/dist/index.js

@@ -3986,7 +3986,7 @@ const MonthSelection = (props) => {
   const month = props.month;
   const previousMonth = () => props.setMonth(new Date(month.getFullYear(), month.getMonth() - 1, 1));
   const nextMonth = () => props.setMonth(new Date(month.getFullYear(), month.getMonth() + 1, 1));
-  return /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React.createElement("div", { className: "grow" }, /* @__PURE__ */ React.createElement("span", { className: "font-semibold text-md text-slate-300" }, formatDate$1(month, { month: "long" })), /* @__PURE__ */ React.createElement("span", { className: "text-md ml-1 text-slate-300" }, formatDate$1(month, { year: "numeric" }))), /* @__PURE__ */ React.createElement("div", { onClick: previousMonth, className: "cursor-pointer w-3 h-3 min-w-3 text-slate-300 hover:text-slate-500" }, /* @__PURE__ */ React.createElement(Icon$1, { name: "leftArrow" })), /* @__PURE__ */ React.createElement("div", { onClick: nextMonth, className: "cursor-pointer ml-2 w-3 h-3 min-w-3 text-slate-300 hover:text-slate-500" }, /* @__PURE__ */ React.createElement(Icon$1, { name: "rightArrow" })));
+  return /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React.createElement("div", { className: "grow" }, /* @__PURE__ */ React.createElement("span", { className: "font-semibold text-md text-slate-300" }, formatDate$2(month, { month: "long" })), /* @__PURE__ */ React.createElement("span", { className: "text-md ml-1 text-slate-300" }, formatDate$2(month, { year: "numeric" }))), /* @__PURE__ */ React.createElement("div", { onClick: previousMonth, className: "cursor-pointer w-3 h-3 min-w-3 text-slate-300 hover:text-slate-500" }, /* @__PURE__ */ React.createElement(Icon$1, { name: "leftArrow" })), /* @__PURE__ */ React.createElement("div", { onClick: nextMonth, className: "cursor-pointer ml-2 w-3 h-3 min-w-3 text-slate-300 hover:text-slate-500" }, /* @__PURE__ */ React.createElement(Icon$1, { name: "rightArrow" })));
 };
 const DaySelection = (props) => {
   const today = new Date();
@@ -4031,7 +4031,7 @@ const calend = (date) => {
 const isSameDate = (left, right) => {
   return left === right || !!(left && right) && left.getFullYear() === right.getFullYear() && left.getMonth() === right.getMonth() && left.getDate() === right.getDate();
 };
-const formatDate$1 = (date, options) => {
+const formatDate$2 = (date, options) => {
   return Intl.DateTimeFormat("en-US", options).format(date);
 };
 const nextDate$1 = (date) => {
@@ -4078,9 +4078,9 @@ const EventList = (props) => {
   return /* @__PURE__ */ React.createElement(Widget, null, /* @__PURE__ */ React.createElement(WidgetHeader, { divide: true }, /* @__PURE__ */ React.createElement(WidgetTitle, null, /* @__PURE__ */ React.createElement(DateTitle, null, date)), /* @__PURE__ */ React.createElement(WidgetHeaderLink, { onClick: () => props.onSetDate(previousDate(date)), display: !!props.date }, /* @__PURE__ */ React.createElement(Icon$1, { name: "leftArrow" })), /* @__PURE__ */ React.createElement(WidgetHeaderLink, { onClick: () => props.onSetDate(nextDate(date)), display: !!props.date }, /* @__PURE__ */ React.createElement(Icon$1, { name: "rightArrow" }))), /* @__PURE__ */ React.createElement(WidgetBody, null, /* @__PURE__ */ React.createElement(Loader, { isLoading: props.isLoading }, hasChildren && /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-1 max-h-[30rem] overflow-auto gap-2" }, props.children), !hasChildren && /* @__PURE__ */ React.createElement("div", { className: "grid justify-items-center content-center h-[16rem] lg:h-[22rem]" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-center align-middle leading-6 font-semibold text-slate-300" }, "No events for the day.")))));
 };
 const DateTitle = (props) => {
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { className: "font-semibold text-3xl text-slate-600" }, formatDate(props.children, { month: "long" })), /* @__PURE__ */ React.createElement("span", { className: "font-semibold ml-2 text-3xl text-slate-600" }, ordNumber(props.children.getDate())), /* @__PURE__ */ React.createElement("span", { className: "text-3xl ml-2 text-slate-600" }, formatDate(props.children, { year: "numeric" })));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { className: "font-semibold text-3xl text-slate-600" }, formatDate$1(props.children, { month: "long" })), /* @__PURE__ */ React.createElement("span", { className: "font-semibold ml-2 text-3xl text-slate-600" }, ordNumber(props.children.getDate())), /* @__PURE__ */ React.createElement("span", { className: "text-3xl ml-2 text-slate-600" }, formatDate$1(props.children, { year: "numeric" })));
 };
-const formatDate = (date, options) => {
+const formatDate$1 = (date, options) => {
   return Intl.DateTimeFormat("en-US", options).format(date);
 };
 const previousDate = (date) => {
@@ -7256,6 +7256,12 @@ const Comments = (props) => {
     }
   ))));
 };
+const formatDate = (iso) => {
+  const d = new Date(iso);
+  if (isNaN(d.getTime()))
+    return "";
+  return d.toLocaleDateString(void 0, { month: "short", day: "numeric", year: "numeric" });
+};
 const CommentCard = (props) => {
   const { comment } = props;
   const target = comment.badgeId ? {
@@ -7269,7 +7275,7 @@ const CommentCard = (props) => {
   } : { label: "General", kind: "general", onClick: void 0 };
   const needsAttention = comment.requireValidation && !comment.resolvedAt;
   const actionLabel = needsAttention && target.kind === "badge" ? "Resubmit this badge" : target.kind === "badge" ? "View this badge" : target.kind === "lesson" ? "View this lesson" : void 0;
-  return /* @__PURE__ */ React__namespace.createElement("div", { className: `rounded-2xl border bg-white p-4 ${needsAttention ? "border-gold-400/40" : "border-slate-200"}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "flex items-start justify-between gap-3" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-xs font-extrabold text-dark-blue-400" }, target.label), comment.authorName && /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-0.5 text-[11px] text-slate-400" }, "from ", comment.authorName)), comment.requireValidation && (comment.resolvedAt ? /* @__PURE__ */ React__namespace.createElement("span", { className: "flex shrink-0 items-center gap-1 rounded-full bg-mint-400/15 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, /* @__PURE__ */ React__namespace.createElement(icons$1.IconCheck, { size: 11, stroke: 3, className: "text-mint-400" }), "Resolved") : /* @__PURE__ */ React__namespace.createElement("span", { className: "shrink-0 rounded-full bg-gold-400/15 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, "Needs attention"))), /* @__PURE__ */ React__namespace.createElement("p", { className: "mt-2.5 text-xs text-slate-600" }, comment.commentText), actionLabel && target.onClick && /* @__PURE__ */ React__namespace.createElement(
+  return /* @__PURE__ */ React__namespace.createElement("div", { className: `rounded-2xl border bg-white p-4 ${needsAttention ? "border-gold-400/40" : "border-slate-200"}` }, /* @__PURE__ */ React__namespace.createElement("div", { className: "flex items-start justify-between gap-3" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React__namespace.createElement("div", { className: "text-xs font-extrabold text-dark-blue-400" }, target.label), /* @__PURE__ */ React__namespace.createElement("div", { className: "mt-0.5 flex items-center gap-1.5 text-[11px] text-slate-400" }, comment.commenterName && /* @__PURE__ */ React__namespace.createElement("span", null, "Commenter: ", comment.commenterName), comment.commenterName && comment.createdAt && /* @__PURE__ */ React__namespace.createElement("span", null, "\xB7"), comment.createdAt && /* @__PURE__ */ React__namespace.createElement("span", null, formatDate(comment.createdAt)))), comment.requireValidation && (!comment.resolvedAt ? /* @__PURE__ */ React__namespace.createElement("span", { className: "shrink-0 rounded-full bg-gold-400/15 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, "Needs attention") : comment.needsSubmission ? /* @__PURE__ */ React__namespace.createElement("span", { className: "shrink-0 rounded-full bg-sky-blue-400/15 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, "Needs submission") : /* @__PURE__ */ React__namespace.createElement("span", { className: "flex shrink-0 items-center gap-1 rounded-full bg-mint-400/15 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, /* @__PURE__ */ React__namespace.createElement(icons$1.IconCheck, { size: 11, stroke: 3, className: "text-mint-400" }), "Resolved"))), /* @__PURE__ */ React__namespace.createElement("p", { className: "mt-2.5 text-xs text-slate-600" }, comment.commentText), actionLabel && target.onClick && /* @__PURE__ */ React__namespace.createElement(
     "button",
     {
       type: "button",