@mbpockets/shared-ui 0.2.0 → 0.2.5

package/dist/EventPage.cjs

@@ -19,6 +19,7 @@ var Divider = require('@mui/material/Divider');
 var Typography4 = require('@mui/material/Typography');
 var Pagination = require('@mui/material/Pagination');
 var Avatar = require('@mui/material/Avatar');
+var navigation = require('next/navigation');
 var Chip2 = require('@mui/material/Chip');
 var LinearProgress = require('@mui/material/LinearProgress');
 var PersonIcon = require('@mui/icons-material/Person');
@@ -141,12 +142,29 @@ function Chip({ tag, removeCallback }) {
 function generateTagsDisplay(tag) {
   return /* @__PURE__ */ jsxRuntime.jsx(Chip, { tag }, tag.id);
 }
-function renderTagsFromIds(ids, legalTags) {
+function renderTagsFromIds(ids, legalTags, options = {}) {
   if (!ids || !legalTags || legalTags.length === 0) {
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
   }
+  const { showEventTag = false, eventTagId } = options;
   const validTags = ids.map((id) => legalTags.find((tag) => tag.id === id)).filter((tag) => Boolean(tag));
-  return validTags.map((tag) => generateTagsDisplay(tag));
+  const sortedTags = [...validTags].sort((a, b) => {
+    if (showEventTag && eventTagId !== void 0) {
+      if (a.id === eventTagId && b.id === eventTagId) return 0;
+      if (a.id === eventTagId) return -1;
+      if (b.id === eventTagId) return 1;
+    }
+    const priorityOrder = ["Organizer Run", "Display Only"];
+    const aIndex = priorityOrder.indexOf(a.label);
+    const bIndex = priorityOrder.indexOf(b.label);
+    if (aIndex !== -1 && bIndex !== -1) {
+      return aIndex - bIndex;
+    }
+    if (aIndex !== -1) return -1;
+    if (bIndex !== -1) return 1;
+    return 0;
+  });
+  return sortedTags.map((tag) => generateTagsDisplay(tag));
 }
 function EventBannerEdit({
   initialValue,
@@ -956,6 +974,9 @@ var generateLink = function(link) {
     link.text
   );
 };
+
+// src/data/values.tsx
+var DEFAULT_PROFILE_PIC = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnIHN0eWxlPSJzdHJva2U6IG5vbmU7IHN0cm9rZS13aWR0aDogMDsgc3Ryb2tlLWRhc2hhcnJheTogbm9uZTsgc3Ryb2tlLWxpbmVjYXA6IGJ1dHQ7IHN0cm9rZS1saW5lam9pbjogbWl0ZXI7IHN0cm9rZS1taXRlcmxpbWl0OiAxMDsgZmlsbDogbm9uZTsgZmlsbC1ydWxlOiBub256ZXJvOyBvcGFjaXR5OiAxOyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS40MDY1OTM0MDY1OTM0MDE2IDEuNDA2NTkzNDA2NTkzNDAxNikgc2NhbGUoMi44MSAyLjgxKSI+Cgk8cGF0aCBkPSJNIDQ1IDg4IGMgLTExLjA0OSAwIC0yMS4xOCAtMi4wMDMgLTI5LjAyMSAtOC42MzQgQyA2LjIxMiA3MS4xMDUgMCA1OC43NjQgMCA0NSBDIDAgMjAuMTg3IDIwLjE4NyAwIDQ1IDAgYyAyNC44MTMgMCA0NSAyMC4xODcgNDUgNDUgYyAwIDEzLjc2NSAtNi4yMTIgMjYuMTA1IC0xNS45NzkgMzQuMzY2IEMgNjYuMTgxIDg1Ljk5OCA1Ni4wNDkgODggNDUgODggeiIgc3R5bGU9InN0cm9rZTogbm9uZTsgc3Ryb2tlLXdpZHRoOiAxOyBzdHJva2UtZGFzaGFycmF5OiBub25lOyBzdHJva2UtbGluZWNhcDogYnV0dDsgc3Ryb2tlLWxpbmVqb2luOiBtaXRlcjsgc3Ryb2tlLW1pdGVybGltaXQ6IDEwOyBmaWxsOiByZ2IoMjE0LDIxNCwyMTQpOyBmaWxsLXJ1bGU6IG5vbnplcm87IG9wYWNpdHk6IDE7IiB0cmFuc2Zvcm09IiBtYXRyaXgoMSAwIDAgMSAwIDApICIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+Cgk8cGF0aCBkPSJNIDQ1IDYwLjcxIGMgLTExLjQ3OSAwIC0yMC44MTggLTkuMzM5IC0yMC44MTggLTIwLjgxNyBjIDAgLTExLjQ3OSA5LjMzOSAtMjAuODE4IDIwLjgxOCAtMjAuODE4IGMgMTEuNDc5IDAgMjAuODE3IDkuMzM5IDIwLjgxNyAyMC44MTggQyA2NS44MTcgNTEuMzcxIDU2LjQ3OSA2MC43MSA0NSA2MC43MSB6IiBzdHlsZT0ic3Ryb2tlOiBub25lOyBzdHJva2Utd2lkdGg6IDE7IHN0cm9rZS1kYXNoYXJyYXk6IG5vbmU7IHN0cm9rZS1saW5lY2FwOiBidXR0OyBzdHJva2UtbGluZWpvaW46IG1pdGVyOyBzdHJva2UtbWl0ZXJsaW1pdDogMTA7IGZpbGw6IHJnYigxNjUsMTY0LDE2NCk7IGZpbGwtcnVsZTogbm9uemVybzsgb3BhY2l0eTogMTsiIHRyYW5zZm9ybT0iIG1hdHJpeCgxIDAgMCAxIDAgMCkgIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KCTxwYXRoIGQ9Ik0gNDUgOTAgYyAtMTAuNjEzIDAgLTIwLjkyMiAtMy43NzMgLTI5LjAyOCAtMTAuNjI1IGMgLTAuNjQ4IC0wLjU0OCAtMC44OCAtMS40NDQgLTAuNTc5IC0yLjIzNyBDIDIwLjAzNCA2NC45MTkgMzEuOTMzIDU2LjcxIDQ1IDU2LjcxIHMgMjQuOTY2IDguMjA5IDI5LjYwNyAyMC40MjggYyAwLjMwMSAwLjc5MyAwLjA2OSAxLjY4OSAtMC41NzkgMi4yMzcgQyA2NS45MjIgODYuMjI3IDU1LjYxMyA5MCA0NSA5MCB6IiBzdHlsZT0ic3Ryb2tlOiBub25lOyBzdHJva2Utd2lkdGg6IDE7IHN0cm9rZS1kYXNoYXJyYXk6IG5vbmU7IHN0cm9rZS1saW5lY2FwOiBidXR0OyBzdHJva2UtbGluZWpvaW46IG1pdGVyOyBzdHJva2UtbWl0ZXJsaW1pdDogMTA7IGZpbGw6IHJnYigxNjUsMTY0LDE2NCk7IGZpbGwtcnVsZTogbm9uemVybzsgb3BhY2l0eTogMTsiIHRyYW5zZm9ybT0iIG1hdHJpeCgxIDAgMCAxIDAgMCkgIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPC9nPgo8L3N2Zz4=";
 var NextGameLabel = ({ nextGameTime }) => {
   const date = typeof nextGameTime === "string" ? new Date(nextGameTime) : nextGameTime;
   return /* @__PURE__ */ jsxRuntime.jsxs(material.Typography, { variant: "caption", sx: { display: "block", mb: 1, color: "primary.main", fontWeight: "bold" }, children: [
@@ -969,17 +990,22 @@ var BaseSearchResultCard = ({
   onClick,
   children,
   icon,
-  tags
+  tags,
+  showEventTag,
+  eventTagId
 }) => {
+  const router = navigation.useRouter();
   const handleClick = (e) => {
+    const url = `/${result.type}/${result.id}`;
+    if (e.ctrlKey || e.metaKey || e.shiftKey) {
+      e.stopPropagation();
+      window.open(url, "_blank");
+      return;
+    }
     if (onClick) {
-      if (e.ctrlKey || e.metaKey || e.shiftKey) {
-        e.stopPropagation();
-        const url = `/${result.type}/${result.id}`;
-        window.open(url, "_blank");
-      } else {
-        onClick(result.id);
-      }
+      onClick(result.id);
+    } else {
+      router.push(url);
     }
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -988,7 +1014,7 @@ var BaseSearchResultCard = ({
       elevation: 6,
       sx: {
         width: "100%",
-        cursor: onClick ? "pointer" : "default",
+        cursor: "pointer",
         boxShadow: "0px 8px 24px rgba(0, 0, 0, 0.15)",
         transition: "box-shadow 0.3s ease-in-out",
         "&:hover": {
@@ -1010,7 +1036,7 @@ var BaseSearchResultCard = ({
             const text = full || "";
             return text.length > 200 ? `${text.slice(0, 200).trimEnd()}...` : text;
           })() }) : /* @__PURE__ */ jsxRuntime.jsx(Typography4__default.default, { variant: "body1", children: result.description }),
-          result.tags && result.tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { mt: 1, display: "flex", flexWrap: "wrap", gap: 1 }, children: renderTagsFromIds(result.tags, tags) })
+          result.tags && result.tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { mt: 1, display: "flex", flexWrap: "wrap", gap: 1 }, children: renderTagsFromIds(result.tags, tags, { showEventTag, eventTagId }) })
         ] })
       ] })
     }
@@ -1052,7 +1078,7 @@ var PlayerResultCard = ({
   const playerIcon = /* @__PURE__ */ jsxRuntime.jsx(
     Avatar__default.default,
     {
-      src: result.imageUrl,
+      src: result.imageUrl || DEFAULT_PROFILE_PIC,
       alt: result.title,
       sx: {
         width: 40,
@@ -1068,7 +1094,9 @@ var PlayerResultCard_default = PlayerResultCard;
 var TableResultCard = ({
   result,
   onClick,
-  tags
+  tags,
+  showEventTag,
+  eventTagId
 }) => {
   const rawCapacity = result.capacity;
   const hasDefinedCapacity = typeof rawCapacity === "number" && Number.isFinite(rawCapacity) && rawCapacity > 0;
@@ -1086,40 +1114,51 @@ var TableResultCard = ({
       }
     }
   );
-  return /* @__PURE__ */ jsxRuntime.jsx(BaseSearchResultCard_default, { result, onClick, icon: tableIcon, tags, children: /* @__PURE__ */ jsxRuntime.jsxs(Box2__default.default, { sx: { mb: 2 }, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(Box2__default.default, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(Typography4__default.default, { variant: "body2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Players:" }),
-        " ",
-        hasDefinedCapacity ? `${activePlayers}/${capacity}` : activePlayers
-      ] }),
-      typeof hasDM === "boolean" && /* @__PURE__ */ jsxRuntime.jsx(
-        Chip2__default.default,
-        {
-          icon: hasDM ? /* @__PURE__ */ jsxRuntime.jsx(SupervisorAccountIcon__default.default, {}) : /* @__PURE__ */ jsxRuntime.jsx(PersonIcon__default.default, {}),
-          label: hasDM ? "DM Present" : "No DM",
-          color: hasDM ? "success" : "warning",
-          size: "small"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      LinearProgress__default.default,
-      {
-        variant: "determinate",
-        value: occupancyPercentage,
-        sx: {
-          height: 10,
-          borderRadius: 5,
-          backgroundColor: "#e0e0e0",
-          "& .MuiLinearProgress-bar": {
-            backgroundColor: hasDefinedCapacity ? availableSlots > 0 ? "#4caf50" : "#f44336" : "#2196f3"
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    BaseSearchResultCard_default,
+    {
+      result,
+      onClick,
+      icon: tableIcon,
+      tags,
+      showEventTag,
+      eventTagId,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(Box2__default.default, { sx: { mb: 2 }, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(Box2__default.default, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(Typography4__default.default, { variant: "body2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Players:" }),
+            " ",
+            hasDefinedCapacity ? `${activePlayers}/${capacity}` : activePlayers
+          ] }),
+          typeof hasDM === "boolean" && /* @__PURE__ */ jsxRuntime.jsx(
+            Chip2__default.default,
+            {
+              icon: hasDM ? /* @__PURE__ */ jsxRuntime.jsx(SupervisorAccountIcon__default.default, {}) : /* @__PURE__ */ jsxRuntime.jsx(PersonIcon__default.default, {}),
+              label: hasDM ? "DM Present" : "No DM",
+              color: hasDM ? "success" : "warning",
+              size: "small"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          LinearProgress__default.default,
+          {
+            variant: "determinate",
+            value: occupancyPercentage,
+            sx: {
+              height: 10,
+              borderRadius: 5,
+              backgroundColor: "#e0e0e0",
+              "& .MuiLinearProgress-bar": {
+                backgroundColor: hasDefinedCapacity ? availableSlots > 0 ? "#4caf50" : "#f44336" : "#2196f3"
+              }
+            }
           }
-        }
-      }
-    ),
-    hasDefinedCapacity && /* @__PURE__ */ jsxRuntime.jsx(Typography4__default.default, { variant: "body2", sx: { mt: 0.5, textAlign: "right" }, children: availableSlots > 0 ? `${availableSlots} slot${availableSlots !== 1 ? "s" : ""} available` : "Table full" })
-  ] }) });
+        ),
+        hasDefinedCapacity && /* @__PURE__ */ jsxRuntime.jsx(Typography4__default.default, { variant: "body2", sx: { mt: 0.5, textAlign: "right" }, children: availableSlots > 0 ? `${availableSlots} slot${availableSlots !== 1 ? "s" : ""} available` : "Table full" })
+      ] })
+    }
+  );
 };
 var TableResultCard_default = TableResultCard;
 var EventResultCard = ({
@@ -1137,7 +1176,7 @@ var EventResultCard = ({
     try {
       const date = new Date(dateString);
       return date.toLocaleDateString("en-US", options);
-    } catch (error) {
+    } catch (__) {
       return dateString;
     }
   };
@@ -1182,20 +1221,22 @@ var ResultsContainer = ({
   onResultClick,
   tags,
   pagination,
-  onPacketChange
+  onPacketChange,
+  showEventTag,
+  eventTagId
 }) => {
   if (!results || results.length === 0 || !results.map) {
     return /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { textAlign: "center", py: 4 }, children: "No results found. Try adjusting your filters." });
   }
-  const onPlayerClick = (id) => {
-    onResultClick == null ? void 0 : onResultClick(id, "player");
-  };
-  const onTableClick = (id) => {
-    onResultClick == null ? void 0 : onResultClick(id, "table");
-  };
-  const onEventClick = (id) => {
-    onResultClick == null ? void 0 : onResultClick(id, "event");
-  };
+  const onPlayerClick = onResultClick ? (id) => {
+    onResultClick(id, "player");
+  } : void 0;
+  const onTableClick = onResultClick ? (id) => {
+    onResultClick(id, "table");
+  } : void 0;
+  const onEventClick = onResultClick ? (id) => {
+    onResultClick(id, "event");
+  } : void 0;
   const handlePacketChange = (_event, packet) => {
     onPacketChange == null ? void 0 : onPacketChange(packet);
   };
@@ -1229,7 +1270,9 @@ var ResultsContainer = ({
             {
               result,
               onClick: onTableClick,
-              tags
+              tags,
+              showEventTag,
+              eventTagId
             },
             result.id
           );
@@ -1265,17 +1308,30 @@ var ScrollableResultsList = ({
   tags,
   maxHeight = 400,
   onResultClick,
-  emptyText
+  emptyText,
+  showEventTag,
+  eventTagId
 }) => {
   const hasResults = Array.isArray(results) && results.length > 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { maxHeight, overflowY: "auto", pr: 1 }, children: hasResults ? /* @__PURE__ */ jsxRuntime.jsx(ResultsContainer_default, { results, onResultClick, tags }) : /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { textAlign: "center", py: 2 }, children: emptyText || "No results to display." }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { maxHeight, overflowY: "auto", pr: 1 }, children: hasResults ? /* @__PURE__ */ jsxRuntime.jsx(
+    ResultsContainer_default,
+    {
+      results,
+      onResultClick,
+      tags,
+      showEventTag,
+      eventTagId
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { textAlign: "center", py: 2 }, children: emptyText || "No results to display." }) });
 };
 var ScrollableResultsList_default = ScrollableResultsList;
 var TablesScrollableList = ({
   results,
   tags,
   maxHeight,
-  onResultClick
+  onResultClick,
+  showEventTag,
+  eventTagId
 }) => {
   const tables = (results || []).filter((r) => (r == null ? void 0 : r.type) === "table");
   const handleClick = (id) => onResultClick == null ? void 0 : onResultClick(id);
@@ -1287,7 +1343,9 @@ var TablesScrollableList = ({
       maxHeight,
       onResultClick: (id, type) => {
         if (type === "table") handleClick(id);
-      }
+      },
+      showEventTag,
+      eventTagId
     }
   );
 };