@mbpockets/shared-ui 0.1.21 → 0.2.5

package/dist/SearchPage.cjs

@@ -1,12 +1,14 @@
 "use client";
 'use strict';
 
+var Typography7 = require('@mui/material/Typography');
+var FormControl = require('@mui/material/FormControl');
+var Select = require('@mui/material/Select');
+var MenuItem = require('@mui/material/MenuItem');
+var jsxRuntime = require('react/jsx-runtime');
 var FormControlLabel = require('@mui/material/FormControlLabel');
 var Checkbox = require('@mui/material/Checkbox');
 var Box8 = require('@mui/material/Box');
-var jsxRuntime = require('react/jsx-runtime');
-var Typography6 = require('@mui/material/Typography');
-var FormControl = require('@mui/material/FormControl');
 var RadioGroup = require('@mui/material/RadioGroup');
 var Radio = require('@mui/material/Radio');
 var React = require('react');
@@ -21,6 +23,7 @@ var Pagination = require('@mui/material/Pagination');
 var Avatar = require('@mui/material/Avatar');
 var Card2 = require('@mui/material/Card');
 var CardContent2 = require('@mui/material/CardContent');
+var navigation = require('next/navigation');
 var material = require('@mui/material');
 var Chip2 = require('@mui/material/Chip');
 var LinearProgress = require('@mui/material/LinearProgress');
@@ -36,11 +39,13 @@ var CircularProgress = require('@mui/material/CircularProgress');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
+var Typography7__default = /*#__PURE__*/_interopDefault(Typography7);
+var FormControl__default = /*#__PURE__*/_interopDefault(FormControl);
+var Select__default = /*#__PURE__*/_interopDefault(Select);
+var MenuItem__default = /*#__PURE__*/_interopDefault(MenuItem);
 var FormControlLabel__default = /*#__PURE__*/_interopDefault(FormControlLabel);
 var Checkbox__default = /*#__PURE__*/_interopDefault(Checkbox);
 var Box8__default = /*#__PURE__*/_interopDefault(Box8);
-var Typography6__default = /*#__PURE__*/_interopDefault(Typography6);
-var FormControl__default = /*#__PURE__*/_interopDefault(FormControl);
 var RadioGroup__default = /*#__PURE__*/_interopDefault(RadioGroup);
 var Radio__default = /*#__PURE__*/_interopDefault(Radio);
 var React__default = /*#__PURE__*/_interopDefault(React);
@@ -67,7 +72,25 @@ var Grid__default = /*#__PURE__*/_interopDefault(Grid);
 var CardHeader__default = /*#__PURE__*/_interopDefault(CardHeader);
 var CircularProgress__default = /*#__PURE__*/_interopDefault(CircularProgress);
 
-// src/components/SearchPage/Filters/ExpiredTablesFilter.tsx
+// src/components/SearchPage/Filters/DistanceFilter.tsx
+var DistanceFilter = ({ distances, selectedDistance, onChange }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "h6", gutterBottom: true, children: "Distance" }),
+    /* @__PURE__ */ jsxRuntime.jsx(FormControl__default.default, { fullWidth: true, size: "small", children: /* @__PURE__ */ jsxRuntime.jsxs(
+      Select__default.default,
+      {
+        value: selectedDistance !== void 0 ? selectedDistance : "",
+        onChange: (e) => onChange(Number(e.target.value)),
+        displayEmpty: true,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(MenuItem__default.default, { value: "", children: /* @__PURE__ */ jsxRuntime.jsx("em", { children: "Any Distance" }) }),
+          distances.map((option) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem__default.default, { value: option.value, children: option.display }, option.value))
+        ]
+      }
+    ) })
+  ] });
+};
+var DistanceFilter_default = DistanceFilter;
 var ExpiredTablesFilter = ({
   includeExpiredTables,
   onChange
@@ -101,7 +124,7 @@ var SortOptions = ({
     onChange == null ? void 0 : onChange(event.target.value);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "h6", gutterBottom: true, children: "Sort By" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "h6", gutterBottom: true, children: "Sort By" }),
     /* @__PURE__ */ jsxRuntime.jsx(FormControl__default.default, { children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroup__default.default, { defaultValue, onChange: handleSortChange, children: SORT_OPTIONS.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
       FormControlLabel__default.default,
       {
@@ -168,13 +191,13 @@ var TagsFilter = ({
     shouldHaveAtLeastOne: ""
   });
   const tagOptions = React__default.default.useMemo(() => {
+    var _a;
     console.log("available tags: " + JSON.stringify(Tags));
     console.log(!Tags);
-    if (!Tags || Tags.length === 0 || !Tags.map) return [];
-    return Tags.map((tag) => ({
+    return (_a = Tags == null ? void 0 : Tags.map((tag) => ({
       value: tag.id,
       label: tag.label
-    }));
+    }))) != null ? _a : [];
   }, [Tags]);
   const handleTagChange = (tagId, category) => {
     let newTags = [];
@@ -202,8 +225,7 @@ var TagsFilter = ({
   };
   const renderSelectedTags = (selectedTags, category) => {
     const tagValues = [];
-    if (!Tags || Tags.length === 0 || !Tags.map) return null;
-    Tags.forEach((tag) => {
+    Tags == null ? void 0 : Tags.forEach((tag) => {
       if (selectedTags.includes(tag.id)) {
         tagValues.push(tag);
       }
@@ -223,7 +245,7 @@ var TagsFilter = ({
   const createTagSelector = (category, label) => {
     const selectedTags = category === "mustHave" ? mustHaveTags : category === "mustNotHave" ? mustNotHaveTags : shouldHaveAtLeastOneTags;
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "subtitle1", gutterBottom: true, sx: { mt: 2 }, children: label }),
+      /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "subtitle1", gutterBottom: true, sx: { mt: 2 }, children: label }),
       renderSelectedTags(selectedTags, category),
       /* @__PURE__ */ jsxRuntime.jsx(
         Autocomplete__default.default,
@@ -276,7 +298,7 @@ var TagsFilter = ({
     ] });
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "h6", gutterBottom: true, children: "Tags" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "h6", gutterBottom: true, children: "Tags" }),
     createTagSelector("mustHave", "Must Have Tags"),
     /* @__PURE__ */ jsxRuntime.jsx(Divider2__default.default, { sx: { my: 2 } }),
     createTagSelector("mustNotHave", "Must Not Have Tags"),
@@ -338,7 +360,7 @@ var TextSearchCard = ({ onChange, selectedTypes, initialTextSearch }) => {
     }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "h6", gutterBottom: true, children: "Text Search" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "h6", gutterBottom: true, children: "Text Search" }),
     /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { mb: 2 }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         TextField__default.default,
@@ -382,7 +404,7 @@ var TypeFilter = ({ types, initialSelectedTypes = [], onChange }) => {
     }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "h6", gutterBottom: true, children: "Type" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "h6", gutterBottom: true, children: "Type" }),
     /* @__PURE__ */ jsxRuntime.jsx(FormGroup__default.default, { children: types.map((type) => /* @__PURE__ */ jsxRuntime.jsx(
       FormControlLabel__default.default,
       {
@@ -390,9 +412,7 @@ var TypeFilter = ({ types, initialSelectedTypes = [], onChange }) => {
           Checkbox__default.default,
           {
             checked: selectedTypes.includes(type.id),
-            onChange: () => handleTypeChange(type.id),
-            disabled: type.id === "event",
-            title: type.id === "event" ? "Coming soon! Currently only player and table search are supported." : ""
+            onChange: () => handleTypeChange(type.id)
           }
         ),
         label: type.label
@@ -407,10 +427,13 @@ var FiltersContainer = ({
   initialSelectedTags,
   initialTextSearch,
   includeExpiredTables = false,
+  distance,
+  distances,
   onTypeChange,
   onTagChange,
   onTextSearchChange,
   onIncludeExpiredTablesChange,
+  onDistanceChange,
   onSubmit,
   tags,
   searchTypes
@@ -425,7 +448,10 @@ var FiltersContainer = ({
       onTypeChange(types);
     }
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { component: "form", onSubmit: (e) => {
+    e.preventDefault();
+    if (onSubmit) onSubmit();
+  }, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       TypeFilter_default,
       {
@@ -435,6 +461,16 @@ var FiltersContainer = ({
       }
     ),
     /* @__PURE__ */ jsxRuntime.jsx(Divider2__default.default, { sx: { my: 2 } }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      DistanceFilter_default,
+      {
+        distances,
+        selectedDistance: distance,
+        onChange: onDistanceChange || (() => {
+        })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(Divider2__default.default, { sx: { my: 2 } }),
     /* @__PURE__ */ jsxRuntime.jsx(
       TextSearchCard_default,
       {
@@ -467,11 +503,11 @@ var FiltersContainer = ({
     /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { display: "flex", justifyContent: "center", mt: 2 }, children: /* @__PURE__ */ jsxRuntime.jsx(
       Button__default.default,
       {
+        type: "submit",
         variant: "contained",
         color: "primary",
         size: "large",
         startIcon: /* @__PURE__ */ jsxRuntime.jsx(SearchIcon__default.default, {}),
-        onClick: onSubmit,
         sx: {
           width: "100%",
           py: 1.5,
@@ -489,6 +525,9 @@ var FiltersContainer = ({
   ] });
 };
 var FiltersContainer_default = FiltersContainer;
+
+// 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: [
@@ -500,29 +539,51 @@ var NextGameLabel_default = NextGameLabel;
 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));
 }
 var BaseSearchResultCard = ({
   result,
   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(
@@ -531,7 +592,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": {
@@ -543,18 +604,17 @@ var BaseSearchResultCard = ({
       children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent2__default.default, { sx: { display: "flex", alignItems: "flex-start" }, children: [
         icon && /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { mr: 2, display: "flex", alignItems: "center", pt: 0.5 }, children: icon }),
         /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { flex: 1 }, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "h6", sx: { mb: 1 }, children: result.title }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "h6", sx: { mb: 1 }, children: result.title }),
           result.nextGameTime && /* @__PURE__ */ jsxRuntime.jsx(NextGameLabel_default, { nextGameTime: result.nextGameTime }),
-          result.type === "table" && result.shortDescription ? /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "body2", sx: { mb: 1 }, children: result.shortDescription }) : null,
+          result.type === "table" && result.shortDescription ? /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "body2", sx: { mb: 1 }, children: result.shortDescription }) : null,
           children,
-          result.type === "table" ? /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "body1", children: (() => {
+          result.type === "table" ? /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "body1", children: (() => {
             var _a, _b;
             const full = (_b = (_a = result.fullDescription) != null ? _a : result.description) != null ? _b : "";
-            if (typeof full !== "string") return "";
             const text = full || "";
             return text.length > 200 ? `${text.slice(0, 200).trimEnd()}...` : text;
-          })() }) : /* @__PURE__ */ jsxRuntime.jsx(Typography6__default.default, { variant: "body1", children: result.description }),
-          result.tags && result.tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { mt: 1, display: "flex", flexWrap: "wrap", gap: 1 }, children: renderTagsFromIds(result.tags, tags) })
+          })() }) : /* @__PURE__ */ jsxRuntime.jsx(Typography7__default.default, { variant: "body1", children: result.description }),
+          result.tags && result.tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { mt: 1, display: "flex", flexWrap: "wrap", gap: 1 }, children: renderTagsFromIds(result.tags, tags, { showEventTag, eventTagId }) })
         ] })
       ] })
     }
@@ -596,7 +656,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,
@@ -612,7 +672,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;
@@ -630,40 +692,51 @@ var TableResultCard = ({
       }
     }
   );
-  return /* @__PURE__ */ jsxRuntime.jsx(BaseSearchResultCard_default, { result, onClick, icon: tableIcon, tags, children: /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { mb: 2 }, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(Typography6__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(Box8__default.default, { sx: { mb: 2 }, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(Typography7__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(Typography6__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(Typography7__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 = ({
@@ -681,7 +754,7 @@ var EventResultCard = ({
     try {
       const date = new Date(dateString);
       return date.toLocaleDateString("en-US", options);
-    } catch (error) {
+    } catch (__) {
       return dateString;
     }
   };
@@ -699,7 +772,7 @@ var EventResultCard = ({
   return /* @__PURE__ */ jsxRuntime.jsx(BaseSearchResultCard_default, { result, onClick, icon: eventIcon, tags, children: /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { mb: 2 }, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { display: "flex", alignItems: "center", mb: 1 }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(CalendarTodayIcon__default.default, { sx: { mr: 1, color: "primary.main" } }),
-      /* @__PURE__ */ jsxRuntime.jsxs(Typography6__default.default, { variant: "body2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Typography7__default.default, { variant: "body2", children: [
         /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Date:" }),
         " ",
         formattedDate
@@ -707,13 +780,13 @@ var EventResultCard = ({
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { display: "flex", alignItems: "center" }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(LocationOnIcon__default.default, { sx: { mr: 1, color: "primary.main" } }),
-      /* @__PURE__ */ jsxRuntime.jsxs(Typography6__default.default, { variant: "body2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Typography7__default.default, { variant: "body2", children: [
         /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Location:" }),
         " ",
         location
       ] })
     ] }),
-    result.organizer && /* @__PURE__ */ jsxRuntime.jsxs(Typography6__default.default, { variant: "body2", sx: { mt: 1 }, children: [
+    result.organizer && /* @__PURE__ */ jsxRuntime.jsxs(Typography7__default.default, { variant: "body2", sx: { mt: 1 }, children: [
       /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Organizer:" }),
       " ",
       result.organizer
@@ -726,27 +799,29 @@ var ResultsContainer = ({
   onResultClick,
   tags,
   pagination,
-  onPacketChange
+  onPacketChange,
+  showEventTag,
+  eventTagId
 }) => {
   if (!results || results.length === 0 || !results.map) {
     return /* @__PURE__ */ jsxRuntime.jsx(Box8__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);
   };
   const startResult = pagination ? (pagination.currentPacket - 1) * pagination.packetSize + 1 : 1;
   const endResult = pagination ? Math.min(pagination.currentPacket * pagination.packetSize, pagination.totalResults) : results.length;
   return /* @__PURE__ */ jsxRuntime.jsxs(Box8__default.default, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
-    pagination && /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }, children: /* @__PURE__ */ jsxRuntime.jsxs(Typography6__default.default, { variant: "body2", color: "text.secondary", children: [
+    pagination && /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }, children: /* @__PURE__ */ jsxRuntime.jsxs(Typography7__default.default, { variant: "body2", color: "text.secondary", children: [
       "Showing ",
       startResult,
       "-",
@@ -755,7 +830,7 @@ var ResultsContainer = ({
       pagination.totalResults,
       " results"
     ] }) }),
-    results.map((result, index) => {
+    results.map((result) => {
       switch (result.type) {
         case "player":
           return /* @__PURE__ */ jsxRuntime.jsx(
@@ -773,7 +848,9 @@ var ResultsContainer = ({
             {
               result,
               onClick: onTableClick,
-              tags
+              tags,
+              showEventTag,
+              eventTagId
             },
             result.id
           );
@@ -809,10 +886,21 @@ var ScrollableResultsList = ({
   tags,
   maxHeight = 400,
   onResultClick,
-  emptyText
+  emptyText,
+  showEventTag,
+  eventTagId
 }) => {
   const hasResults = Array.isArray(results) && results.length > 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { maxHeight, overflowY: "auto", pr: 1 }, children: hasResults ? /* @__PURE__ */ jsxRuntime.jsx(ResultsContainer_default, { results, onResultClick, tags }) : /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { textAlign: "center", py: 2 }, children: emptyText || "No results to display." }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { maxHeight, overflowY: "auto", pr: 1 }, children: hasResults ? /* @__PURE__ */ jsxRuntime.jsx(
+    ResultsContainer_default,
+    {
+      results,
+      onResultClick,
+      tags,
+      showEventTag,
+      eventTagId
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(Box8__default.default, { sx: { textAlign: "center", py: 2 }, children: emptyText || "No results to display." }) });
 };
 var ScrollableResultsList_default = ScrollableResultsList;
 var PlayersScrollableList = ({
@@ -857,11 +945,13 @@ function SearchPageLayout({
     query: "",
     titleOnly: false
   },
-  includeExpiredTables: initialIncludeExpiredTables = false,
+  initialDistance,
+  distances,
   onTypeChange,
   onTagChange,
   onTextSearchChange,
   onIncludeExpiredTablesChange,
+  onDistanceChange,
   onSubmit,
   onResultClick,
   onPacketChange,
@@ -869,14 +959,16 @@ function SearchPageLayout({
   validTags,
   allTags,
   searchTypes,
-  isLoading = false
+  isLoading = false,
+  eventTagId
 }) {
   const theme = material.useTheme();
   const isMobile = material.useMediaQuery(theme.breakpoints.down("md"));
   const [selectedTypes, setSelectedTypes] = React.useState(initialSelectedTypes);
   const [selectedTags, setSelectedTags] = React.useState(initialSelectedTags);
   const [textSearch, setTextSearch] = React.useState(initialTextSearch);
-  const [includeExpiredTables, setIncludeExpiredTables] = React.useState(initialIncludeExpiredTables);
+  const [includeExpiredTables, setIncludeExpiredTables] = React.useState(false);
+  const [distance, setDistance] = React.useState(initialDistance);
   React.useEffect(() => {
     setSelectedTypes(initialSelectedTypes);
   }, [initialSelectedTypes]);
@@ -887,8 +979,8 @@ function SearchPageLayout({
     setTextSearch(initialTextSearch);
   }, [initialTextSearch]);
   React.useEffect(() => {
-    setIncludeExpiredTables(initialIncludeExpiredTables);
-  }, [initialIncludeExpiredTables]);
+    setDistance(initialDistance);
+  }, [initialDistance]);
   const handleTypeChange = (types) => {
     setSelectedTypes(types);
     if (onTypeChange) onTypeChange(types);
@@ -905,12 +997,17 @@ function SearchPageLayout({
     setIncludeExpiredTables(include);
     if (onIncludeExpiredTablesChange) onIncludeExpiredTablesChange(include);
   };
+  const handleDistanceChange = (dist) => {
+    setDistance(dist);
+    if (onDistanceChange) onDistanceChange(dist);
+  };
   const handleSubmit = () => {
     const currentCriteria = {
       selectedTypes,
       selectedTags,
       textSearch,
-      includeExpiredTables
+      includeExpiredTables,
+      distance
     };
     if (onSubmit) {
       onSubmit(currentCriteria);
@@ -950,10 +1047,13 @@ function SearchPageLayout({
             initialSelectedTags: selectedTags,
             initialTextSearch: textSearch,
             includeExpiredTables,
+            distance,
+            distances,
             onTypeChange: handleTypeChange,
             onTagChange: handleTagChange,
             onTextSearchChange: handleTextSearchChange,
             onIncludeExpiredTablesChange: handleIncludeExpiredTablesChange,
+            onDistanceChange: handleDistanceChange,
             onSubmit: handleSubmit,
             tags: validTags,
             searchTypes
@@ -980,7 +1080,9 @@ function SearchPageLayout({
             pagination,
             onPacketChange,
             onResultClick,
-            tags: allTags
+            tags: allTags,
+            showEventTag: true,
+            eventTagId
           }
         ) })
       ] }) })
@@ -991,7 +1093,9 @@ 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);
@@ -1003,13 +1107,16 @@ var TablesScrollableList = ({
       maxHeight,
       onResultClick: (id, type) => {
         if (type === "table") handleClick(id);
-      }
+      },
+      showEventTag,
+      eventTagId
     }
   );
 };
 var TablesScrollableList_default = TablesScrollableList;
 
 exports.BaseSearchResultCard = BaseSearchResultCard_default;
+exports.DistanceFilter = DistanceFilter_default;
 exports.EventResultCard = EventResultCard_default;
 exports.ExpiredTablesFilter = ExpiredTablesFilter_default;
 exports.FiltersContainer = FiltersContainer_default;