@agg-build/ui 4.19.1 → 4.21.0

package/dist/events.js

@@ -65,6 +65,7 @@ __export(events_exports, {
   EventListItem: () => EventListItem,
   EventListItemDetails: () => EventListItemDetails,
   EventListItemV2: () => EventListItemV2,
+  EventListVenueStrip: () => EventListVenueStrip,
   MarketDetails: () => MarketDetails,
   MarketDetailsList: () => MarketDetailsList,
   Orderbook: () => Orderbook,
@@ -16415,10 +16416,10 @@ var MarketDetailsList = ({
 MarketDetailsList.displayName = "MarketDetailsList";
 
 // src/events/list/index.tsx
-var import_hooks58 = require("@agg-build/hooks");
+var import_hooks59 = require("@agg-build/hooks");
 var import_sdk17 = require("@agg-build/sdk");
 var Dialog2 = __toESM(require("@radix-ui/react-dialog"));
-var import_react31 = require("react");
+var import_react32 = require("react");
 
 // src/events/list/category-sidebar.tsx
 var import_react29 = require("react");
@@ -16741,8 +16742,327 @@ var EventListTabs = ({
 };
 EventListTabs.displayName = "EventListTabs";
 
-// src/events/list/index.tsx
+// src/events/list/event-list-venue-strip.tsx
+var import_hooks58 = require("@agg-build/hooks");
+var import_react31 = require("react");
 var import_jsx_runtime152 = require("react/jsx-runtime");
+var TILE = 28;
+var TILE_GAP = 4;
+var CHIP = 36;
+var STRIP_INSET = 7;
+var FIT_TOLERANCE = 0.5;
+var useIsomorphicLayoutEffect = typeof window === "undefined" ? import_react31.useEffect : import_react31.useLayoutEffect;
+var isTabUnavailable = (tab) => !!tab.disabled || !!tab.isComingSoon;
+var resolveTabLabel = (tab) => tab.isComingSoon ? `${tab.label} (soon)` : tab.label;
+var StripFrame = ({
+  className,
+  children,
+  frameRef
+}) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+  "div",
+  {
+    ref: frameRef,
+    className: cn(
+      "inline-flex items-center gap-1 rounded-agg-lg border border-agg-separator bg-agg-secondary p-1.5",
+      className
+    ),
+    children
+  }
+);
+var StripTile = ({
+  tab,
+  isActive,
+  shape,
+  motionClassName,
+  onSelect,
+  showTooltip = true,
+  isVenue = false
+}) => {
+  const isUnavailable = isTabUnavailable(tab);
+  const label2 = resolveTabLabel(tab);
+  const isExpanded = shape === "pill" || isActive;
+  const glyphClassName = cn(
+    "shrink-0",
+    motionClassName,
+    !isActive && shape === "tile" && "opacity-70 group-hover:opacity-100"
+  );
+  const glyph = tab.venueLogo ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(VenueLogo, { venue: tab.venueLogo, size: "small", className: glyphClassName }) : tab.iconName ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+    Icon,
+    {
+      name: tab.iconName,
+      size: "small",
+      color: "currentColor",
+      className: cn(tab.iconName === "warning-filled" ? "shrink-0" : glyphClassName)
+    }
+  ) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+    "button",
+    {
+      type: "button",
+      "data-venue-tile": isVenue ? "" : void 0,
+      "aria-pressed": isActive,
+      "aria-label": label2,
+      disabled: isUnavailable,
+      onClick: () => onSelect == null ? void 0 : onSelect(tab.value),
+      className: cn(
+        "agg-venue-strip-tile group relative inline-flex h-7 shrink-0 items-center gap-1.5",
+        "rounded-agg-sm font-agg-sans text-agg-sm leading-agg-5 font-agg-normal",
+        "cursor-pointer disabled:cursor-not-allowed",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary/40",
+        motionClassName,
+        isExpanded ? "px-3" : "w-7 justify-center",
+        isActive ? "bg-agg-primary/10 text-agg-primary" : "bg-transparent text-agg-foreground hover:bg-agg-secondary-hover",
+        isUnavailable && "opacity-50 hover:bg-transparent"
+      ),
+      children: [
+        glyph,
+        isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("span", { className: "whitespace-nowrap", children: tab.label }) : null,
+        !isExpanded && showTooltip ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+          "span",
+          {
+            role: "tooltip",
+            className: cn(
+              "pointer-events-none absolute left-1/2 top-[calc(100%+6px)] z-10 -translate-x-1/2",
+              "whitespace-nowrap rounded-agg-sm border border-agg-separator bg-agg-secondary px-2 py-1",
+              "text-agg-xs text-agg-foreground shadow-agg-card-hover",
+              "opacity-0 transition-opacity delay-150 group-hover:opacity-100 group-focus-visible:opacity-100"
+            ),
+            children: label2
+          }
+        ) : null
+      ]
+    }
+  );
+};
+var EventListVenueStrip = ({
+  tabs,
+  activeTab,
+  onTabChange,
+  ariaLabel,
+  className,
+  fullWidth = false
+}) => {
+  const labels = (0, import_hooks58.useLabels)();
+  const {
+    features: { enableAnimations }
+  } = (0, import_hooks58.useSdkUiConfig)();
+  const { isLoading: isAppConfigLoading } = (0, import_hooks58.useAppConfig)();
+  const resolvedTabs = useEventListTabs(tabs);
+  const wrapRef = (0, import_react31.useRef)(null);
+  const ghostRef = (0, import_react31.useRef)(null);
+  const [fit, setFit] = (0, import_react31.useState)(null);
+  const [isListOpen, setIsListOpen] = (0, import_react31.useState)(false);
+  const motionClassName = getMotionClassName(
+    enableAnimations,
+    "transition-[color,background-color,opacity] duration-200 motion-reduce:transition-none"
+  );
+  const modeTabs = (0, import_react31.useMemo)(() => resolvedTabs.filter((tab) => !tab.venueLogo), [resolvedTabs]);
+  const venueTabs = (0, import_react31.useMemo)(() => resolvedTabs.filter((tab) => !!tab.venueLogo), [resolvedTabs]);
+  const activeVenueIndex = venueTabs.findIndex((tab) => tab.value === activeTab);
+  (0, import_react31.useEffect)(() => {
+    if (isAppConfigLoading) return;
+    const fallbackTab = resolvedTabs.find((tab) => !isTabUnavailable(tab));
+    if (!fallbackTab) return;
+    if (resolvedTabs.some((tab) => tab.value === activeTab && !isTabUnavailable(tab))) return;
+    onTabChange(fallbackTab.value);
+  }, [activeTab, isAppConfigLoading, onTabChange, resolvedTabs]);
+  useIsomorphicLayoutEffect(() => {
+    const wrap = wrapRef.current;
+    const ghost = ghostRef.current;
+    if (!wrap || !ghost) return;
+    const measure = () => {
+      const available = wrap.getBoundingClientRect().width;
+      const strip = ghost.getBoundingClientRect();
+      if (strip.width <= available + FIT_TOLERANCE) {
+        setFit(null);
+        return;
+      }
+      const firstTile = ghost.querySelector("[data-venue-tile]");
+      if (!firstTile) {
+        setFit(null);
+        return;
+      }
+      const activeTile = ghost.querySelector('[data-venue-tile][aria-pressed="true"]');
+      const room = strip.right - STRIP_INSET - firstTile.getBoundingClientRect().left - (strip.width - available);
+      const activeWidth = activeTile ? activeTile.getBoundingClientRect().width + TILE_GAP : 0;
+      const plain = Math.max(0, Math.floor((room - CHIP - activeWidth) / (TILE + TILE_GAP)));
+      setFit(plain + (activeTile ? 1 : 0));
+    };
+    measure();
+    if (typeof ResizeObserver === "undefined") return;
+    const observer = new ResizeObserver(measure);
+    observer.observe(wrap);
+    observer.observe(ghost);
+    return () => {
+      observer.disconnect();
+    };
+  }, [venueTabs, activeVenueIndex, fullWidth]);
+  (0, import_react31.useEffect)(() => {
+    if (!isListOpen) return;
+    const handlePointerDown = (event) => {
+      var _a;
+      if (!((_a = wrapRef.current) == null ? void 0 : _a.contains(event.target))) setIsListOpen(false);
+    };
+    const handleKeyDown = (event) => {
+      if (event.key === "Escape") setIsListOpen(false);
+    };
+    document.addEventListener("mousedown", handlePointerDown);
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("mousedown", handlePointerDown);
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isListOpen]);
+  const shownVenueTabs = (0, import_react31.useMemo)(() => {
+    if (fit === null) return venueTabs;
+    if (activeVenueIndex >= fit) {
+      const activeVenueTab = venueTabs[activeVenueIndex];
+      return activeVenueTab ? [...venueTabs.slice(0, Math.max(0, fit - 1)), activeVenueTab] : venueTabs.slice(0, fit);
+    }
+    return venueTabs.slice(0, fit);
+  }, [activeVenueIndex, fit, venueTabs]);
+  const foldedVenueTabs = (0, import_react31.useMemo)(
+    () => venueTabs.filter((tab) => !shownVenueTabs.includes(tab)),
+    [shownVenueTabs, venueTabs]
+  );
+  const foldedCount = foldedVenueTabs.length;
+  const modeShape = fullWidth ? "tile" : "pill";
+  const separator = /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("span", { className: "mx-0.5 h-4 w-px shrink-0 bg-agg-separator", "aria-hidden": true });
+  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+    "div",
+    {
+      ref: wrapRef,
+      className: cn(
+        "agg-venue-strip relative flex min-w-0 max-w-full flex-col items-end",
+        fullWidth && "w-full",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", __spreadProps(__spreadValues({ "aria-hidden": true }, { inert: "" }), { className: "h-0 w-full overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(StripFrame, { frameRef: ghostRef, className: "w-max", children: [
+          modeTabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+            StripTile,
+            {
+              tab,
+              isActive: tab.value === activeTab,
+              shape: modeShape,
+              showTooltip: false
+            },
+            tab.value
+          )),
+          venueTabs.length > 0 && modeTabs.length > 0 ? separator : null,
+          venueTabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+            StripTile,
+            {
+              tab,
+              isActive: tab.value === activeTab,
+              shape: "tile",
+              showTooltip: false,
+              isVenue: true
+            },
+            tab.value
+          ))
+        ] }) })),
+        /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(StripFrame, { className: cn("agg-venue-strip-bar relative", fullWidth && "w-full"), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { role: "group", "aria-label": ariaLabel, className: "contents", children: [
+            modeTabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+              StripTile,
+              {
+                tab,
+                isActive: tab.value === activeTab,
+                shape: modeShape,
+                motionClassName,
+                showTooltip: false,
+                onSelect: onTabChange
+              },
+              tab.value
+            )),
+            venueTabs.length > 0 && modeTabs.length > 0 ? separator : null,
+            shownVenueTabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+              StripTile,
+              {
+                tab,
+                isActive: tab.value === activeTab,
+                shape: "tile",
+                motionClassName,
+                onSelect: onTabChange,
+                isVenue: true
+              },
+              tab.value
+            ))
+          ] }),
+          foldedCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+            "button",
+            {
+              type: "button",
+              "aria-haspopup": "listbox",
+              "aria-expanded": isListOpen,
+              "aria-label": labels.eventList.moreVenuesAria(foldedCount),
+              onClick: () => setIsListOpen((open) => !open),
+              className: cn(
+                "agg-venue-strip-more inline-flex h-7 w-9 shrink-0 items-center justify-center",
+                "rounded-agg-sm font-agg-sans text-agg-xs tabular-nums cursor-pointer",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary/40",
+                motionClassName,
+                fullWidth && "ml-auto",
+                isListOpen ? "bg-agg-secondary-hover text-agg-foreground" : "text-agg-foreground/70 hover:bg-agg-secondary-hover hover:text-agg-foreground"
+              ),
+              children: [
+                "+",
+                foldedCount
+              ]
+            }
+          ) : null
+        ] }),
+        isListOpen ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+          "div",
+          {
+            role: "listbox",
+            "aria-label": labels.eventList.moreVenuesListAria,
+            className: cn(
+              "agg-venue-strip-list absolute right-0 top-[calc(100%+6px)] z-20 flex flex-col",
+              "rounded-agg-lg border border-agg-separator bg-agg-secondary p-1.5 shadow-agg-card-hover",
+              fullWidth ? "left-0" : "w-[248px]"
+            ),
+            children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "flex max-h-[352px] flex-col overflow-y-auto", children: foldedVenueTabs.map((tab) => {
+              const isActive = tab.value === activeTab;
+              const isUnavailable = isTabUnavailable(tab);
+              return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+                "button",
+                {
+                  type: "button",
+                  role: "option",
+                  "aria-selected": isActive,
+                  "aria-disabled": isUnavailable || void 0,
+                  disabled: isUnavailable,
+                  onClick: () => {
+                    onTabChange(tab.value);
+                    setIsListOpen(false);
+                  },
+                  className: cn(
+                    "flex h-8 shrink-0 items-center gap-2.5 rounded-agg-sm px-2.5",
+                    "font-agg-sans text-agg-sm leading-agg-5 cursor-pointer disabled:cursor-not-allowed",
+                    motionClassName,
+                    isActive ? "bg-agg-primary/10 text-agg-primary" : "text-agg-foreground hover:bg-agg-secondary-hover",
+                    isUnavailable && "opacity-50 hover:bg-transparent"
+                  ),
+                  children: [
+                    tab.iconName === "warning-filled" ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: "warning-filled", size: "small", color: "currentColor" }) : tab.venueLogo ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(VenueLogo, { venue: tab.venueLogo, size: "small", className: "shrink-0" }) : null,
+                    /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("span", { className: "flex-1 truncate text-left", children: resolveTabLabel(tab) })
+                  ]
+                },
+                tab.value
+              );
+            }) })
+          }
+        ) : null
+      ]
+    }
+  );
+};
+EventListVenueStrip.displayName = "EventListVenueStrip";
+
+// src/events/list/index.tsx
+var import_jsx_runtime153 = require("react/jsx-runtime");
 var SORT_ICON_BY_VALUE = {
   volume24hr: "sort-volume-24hr",
   topArbitrage: "sort-top-arbitrage",
@@ -16803,69 +17123,69 @@ var EventList = ({
   stateRef
 }) => {
   var _a, _b, _c, _d, _e, _f;
-  const labels = (0, import_hooks58.useLabels)();
-  const { disabledVenues } = (0, import_hooks58.useAppConfig)();
+  const labels = (0, import_hooks59.useLabels)();
+  const { disabledVenues } = (0, import_hooks59.useAppConfig)();
   const {
     features: { enableVenueEventDiscoveryFilters, showSportsMarkets }
-  } = (0, import_hooks58.useSdkUiConfig)();
+  } = (0, import_hooks59.useSdkUiConfig)();
   const isDiscoveryFiltersEnabled = enableVenueEventDiscoveryFilters && !search;
   const resolvedTabs = useEventListTabs();
-  const visibleVenues = (0, import_react31.useMemo)(
-    () => disabledVenues.length === 0 ? void 0 : (0, import_hooks58.getVisibleVenueIdsByConfig)(import_sdk17.VENUES, disabledVenues),
+  const visibleVenues = (0, import_react32.useMemo)(
+    () => disabledVenues.length === 0 ? void 0 : (0, import_hooks59.getVisibleVenueIdsByConfig)(import_sdk17.VENUES, disabledVenues),
     [disabledVenues]
   );
-  const [internalActiveTabValue, setInternalActiveTabValue] = (0, import_react31.useState)(
+  const [internalActiveTabValue, setInternalActiveTabValue] = (0, import_react32.useState)(
     (_b = initialVenueTab != null ? initialVenueTab : (_a = resolvedTabs[0]) == null ? void 0 : _a.value) != null ? _b : "matched"
   );
   const activeTabValue = controlledActiveVenueTab != null ? controlledActiveVenueTab : internalActiveTabValue;
-  const [internalSelectedSort, setInternalSelectedSort] = (0, import_react31.useState)(DEFAULT_EVENT_LIST_SORT);
+  const [internalSelectedSort, setInternalSelectedSort] = (0, import_react32.useState)(DEFAULT_EVENT_LIST_SORT);
   const selectedSort = controlledSelectedSort != null ? controlledSelectedSort : internalSelectedSort;
-  const [isSubcategoriesModalOpen, setIsSubcategoriesModalOpen] = (0, import_react31.useState)(false);
-  const [internalCategoryPath, setInternalCategoryPath] = (0, import_react31.useState)([]);
+  const [isSubcategoriesModalOpen, setIsSubcategoriesModalOpen] = (0, import_react32.useState)(false);
+  const [internalCategoryPath, setInternalCategoryPath] = (0, import_react32.useState)([]);
   const categoryPath = controlledCategoryPath != null ? controlledCategoryPath : internalCategoryPath;
-  const [collapsedCategoryIds, setCollapsedCategoryIds] = (0, import_react31.useState)(() => /* @__PURE__ */ new Set());
-  const handleActiveTabChange = (0, import_react31.useCallback)(
+  const [collapsedCategoryIds, setCollapsedCategoryIds] = (0, import_react32.useState)(() => /* @__PURE__ */ new Set());
+  const handleActiveTabChange = (0, import_react32.useCallback)(
     (value) => {
       if (controlledActiveVenueTab == null) setInternalActiveTabValue(value);
       onActiveVenueTabChange == null ? void 0 : onActiveVenueTabChange(value, { history: "push" });
     },
     [controlledActiveVenueTab, onActiveVenueTabChange]
   );
-  const handleSelectedSortChange = (0, import_react31.useCallback)(
+  const handleSelectedSortChange = (0, import_react32.useCallback)(
     (value) => {
       if (controlledSelectedSort == null) setInternalSelectedSort(value);
       onSelectedSortChange == null ? void 0 : onSelectedSortChange(value, { history: "push" });
     },
     [controlledSelectedSort, onSelectedSortChange]
   );
-  const handleCategoryPathChange = (0, import_react31.useCallback)(
+  const handleCategoryPathChange = (0, import_react32.useCallback)(
     (value, options) => {
       if (controlledCategoryPath == null) setInternalCategoryPath(value);
       onCategoryPathChange == null ? void 0 : onCategoryPathChange(value, options);
     },
     [controlledCategoryPath, onCategoryPathChange]
   );
-  const sortItems = (0, import_react31.useMemo)(() => {
+  const sortItems = (0, import_react32.useMemo)(() => {
     return [
       {
         value: "volume24hr",
         label: labels.eventList.sortBy24hVolume,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: SORT_ICON_BY_VALUE.volume24hr, size: "small", color: "currentColor" })
+        icon: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Icon, { name: SORT_ICON_BY_VALUE.volume24hr, size: "small", color: "currentColor" })
       },
       {
         value: "topArbitrage",
         label: labels.eventList.sortByTopArbitrage,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: SORT_ICON_BY_VALUE.topArbitrage, size: "small", color: "currentColor" })
+        icon: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Icon, { name: SORT_ICON_BY_VALUE.topArbitrage, size: "small", color: "currentColor" })
       },
       {
         value: "volume",
         label: labels.eventList.sortByTotalVolume,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: SORT_ICON_BY_VALUE.volume, size: "small", color: "currentColor" })
+        icon: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Icon, { name: SORT_ICON_BY_VALUE.volume, size: "small", color: "currentColor" })
       },
       {
         value: "endDate",
         label: labels.eventList.sortByEndingSoon,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: SORT_ICON_BY_VALUE.endDate, size: "small", color: "currentColor" })
+        icon: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Icon, { name: SORT_ICON_BY_VALUE.endDate, size: "small", color: "currentColor" })
       }
     ];
   }, [
@@ -16875,8 +17195,8 @@ var EventList = ({
     labels.eventList.sortByTotalVolume
   ]);
   const baseCategoryId = (_c = categoryIds == null ? void 0 : categoryIds[0]) != null ? _c : null;
-  const previousBaseCategoryIdRef = (0, import_react31.useRef)(baseCategoryId);
-  (0, import_react31.useEffect)(() => {
+  const previousBaseCategoryIdRef = (0, import_react32.useRef)(baseCategoryId);
+  (0, import_react32.useEffect)(() => {
     var _a2, _b2;
     if (previousBaseCategoryIdRef.current === baseCategoryId) return;
     previousBaseCategoryIdRef.current = baseCategoryId;
@@ -16895,15 +17215,15 @@ var EventList = ({
     isDiscoveryFiltersEnabled,
     resolvedTabs
   ]);
-  const { categories: topLevelCategories } = (0, import_hooks58.useCategories)({
+  const { categories: topLevelCategories } = (0, import_hooks59.useCategories)({
     queryKeyScope: "event-list-top-categories",
     enabled: isDiscoveryFiltersEnabled,
     limit: 100
   });
-  const sortedTopLevelCategories = (0, import_react31.useMemo)(() => {
+  const sortedTopLevelCategories = (0, import_react32.useMemo)(() => {
     return sortCategoriesForNavigation(topLevelCategories);
   }, [topLevelCategories]);
-  const baseCategoryChildPrefetchIds = (0, import_react31.useMemo)(() => {
+  const baseCategoryChildPrefetchIds = (0, import_react32.useMemo)(() => {
     return Array.from(
       /* @__PURE__ */ new Set([
         ...baseCategoryId ? [baseCategoryId] : [],
@@ -16912,13 +17232,13 @@ var EventList = ({
       ])
     );
   }, [baseCategoryId, categoryPath, sortedTopLevelCategories]);
-  const { childrenByParentId: baseChildrenByParentId, isLoading: isBaseCategoryChildrenLoading } = (0, import_hooks58.useCategoryChildren)({
+  const { childrenByParentId: baseChildrenByParentId, isLoading: isBaseCategoryChildrenLoading } = (0, import_hooks59.useCategoryChildren)({
     queryKeyScope: "event-list-category-children",
     enabled: isDiscoveryFiltersEnabled,
     parentIds: baseCategoryChildPrefetchIds,
     limit: 100
   });
-  const visibleChildPrefetchIds = (0, import_react31.useMemo)(() => {
+  const visibleChildPrefetchIds = (0, import_react32.useMemo)(() => {
     var _a2, _b2;
     const ids = /* @__PURE__ */ new Set();
     if (baseCategoryId) {
@@ -16933,13 +17253,13 @@ var EventList = ({
     }
     return Array.from(ids);
   }, [baseCategoryId, baseChildrenByParentId, categoryPath]);
-  const { childrenByParentId: visibleChildrenByParentId } = (0, import_hooks58.useCategoryChildren)({
+  const { childrenByParentId: visibleChildrenByParentId } = (0, import_hooks59.useCategoryChildren)({
     queryKeyScope: "event-list-category-children",
     enabled: isDiscoveryFiltersEnabled,
     parentIds: visibleChildPrefetchIds,
     limit: 100
   });
-  const visibleGrandchildPrefetchIds = (0, import_react31.useMemo)(() => {
+  const visibleGrandchildPrefetchIds = (0, import_react32.useMemo)(() => {
     var _a2;
     const ids = /* @__PURE__ */ new Set();
     for (const expandedCategory of categoryPath) {
@@ -16949,13 +17269,13 @@ var EventList = ({
     }
     return Array.from(ids);
   }, [categoryPath, visibleChildrenByParentId]);
-  const { childrenByParentId: visibleGrandchildrenByParentId } = (0, import_hooks58.useCategoryChildren)({
+  const { childrenByParentId: visibleGrandchildrenByParentId } = (0, import_hooks59.useCategoryChildren)({
     queryKeyScope: "event-list-category-children",
     enabled: isDiscoveryFiltersEnabled,
     parentIds: visibleGrandchildPrefetchIds,
     limit: 100
   });
-  const childrenByParentId = (0, import_react31.useMemo)(() => {
+  const childrenByParentId = (0, import_react32.useMemo)(() => {
     return new Map([
       ...baseChildrenByParentId,
       ...visibleChildrenByParentId,
@@ -16964,10 +17284,10 @@ var EventList = ({
   }, [baseChildrenByParentId, visibleChildrenByParentId, visibleGrandchildrenByParentId]);
   const controlledCategoryPathKey = (_d = controlledCategoryPath == null ? void 0 : controlledCategoryPath.map((entry) => entry.id).join(",")) != null ? _d : "";
   const controlledCategoryPathValidationKey = `${baseCategoryId != null ? baseCategoryId : ""}|${controlledCategoryPathKey}`;
-  const [validatedCategoryPathKey, setValidatedCategoryPathKey] = (0, import_react31.useState)(
+  const [validatedCategoryPathKey, setValidatedCategoryPathKey] = (0, import_react32.useState)(
     () => controlledCategoryPath == null || controlledCategoryPath.length === 0 ? controlledCategoryPathValidationKey : ""
   );
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     if (controlledCategoryPath == null || controlledCategoryPath.length === 0) {
       setValidatedCategoryPathKey(controlledCategoryPathValidationKey);
       return;
@@ -16992,33 +17312,33 @@ var EventList = ({
     isBaseCategoryChildrenLoading
   ]);
   const shouldRenderSubcategoryFilters = isDiscoveryFiltersEnabled && baseCategoryId !== null && (((_f = (_e = childrenByParentId.get(baseCategoryId)) == null ? void 0 : _e.length) != null ? _f : 0) > 0 || categoryPath.length > 0);
-  const baseCategoryEventCount = (0, import_react31.useMemo)(() => {
+  const baseCategoryEventCount = (0, import_react32.useMemo)(() => {
     var _a2, _b2;
     return (_b2 = (_a2 = sortedTopLevelCategories.find((c) => c.id === baseCategoryId)) == null ? void 0 : _a2.eventCount) != null ? _b2 : 0;
   }, [baseCategoryId, sortedTopLevelCategories]);
-  const resolvedCategoryIds = (0, import_react31.useMemo)(() => {
+  const resolvedCategoryIds = (0, import_react32.useMemo)(() => {
     if (!isDiscoveryFiltersEnabled) return categoryIds;
     return resolveCategoryIdsFromPath(categoryPath, baseCategoryId ? [baseCategoryId] : void 0);
   }, [baseCategoryId, categoryIds, categoryPath, isDiscoveryFiltersEnabled]);
-  const sortQueryParams = (0, import_react31.useMemo)(() => {
+  const sortQueryParams = (0, import_react32.useMemo)(() => {
     return resolveSortQueryParams(selectedSort);
   }, [selectedSort]);
-  const activeTab = (0, import_react31.useMemo)(() => {
+  const activeTab = (0, import_react32.useMemo)(() => {
     return resolvedTabs.find((tab) => tab.value === activeTabValue);
   }, [activeTabValue, resolvedTabs]);
-  const venues = (0, import_react31.useMemo)(() => {
+  const venues = (0, import_react32.useMemo)(() => {
     return resolveTabVenus(activeTab, visibleVenues);
   }, [activeTab, visibleVenues]);
-  const matchStatus = (0, import_react31.useMemo)(() => {
+  const matchStatus = (0, import_react32.useMemo)(() => {
     return activeTabValue === "matched" ? activeTab == null ? void 0 : activeTab.matchStatus : void 0;
   }, [activeTabValue, activeTab]);
-  const resolvedMaxVisibleItems = (0, import_react31.useMemo)(() => {
+  const resolvedMaxVisibleItems = (0, import_react32.useMemo)(() => {
     if (!Number.isFinite(maxVisibleItems)) return void 0;
     return Math.max(1, Math.floor(maxVisibleItems));
   }, [maxVisibleItems]);
   const requestLimit = resolvedMaxVisibleItems != null ? resolvedMaxVisibleItems : limit;
   const shouldPaginate = resolvedMaxVisibleItems == null;
-  const endDateFrom = (0, import_react31.useMemo)(() => {
+  const endDateFrom = (0, import_react32.useMemo)(() => {
     if (search) return void 0;
     const BUCKET_MINUTES = 5;
     const bucket = /* @__PURE__ */ new Date();
@@ -17034,14 +17354,14 @@ var EventList = ({
     isFetchingNextPage,
     isPlaceholderData,
     loadedPageCount
-  } = (0, import_hooks58.useVenueEvents)({
+  } = (0, import_hooks59.useVenueEvents)({
     queryKeyScope: "event-list",
     venues,
     search,
     categoryIds: resolvedCategoryIds,
     matchStatus,
     limit: requestLimit,
-    status: [import_hooks58.MarketStatus.open],
+    status: [import_hooks59.MarketStatus.open],
     sortBy: sortQueryParams.sortBy,
     sortDir: sortQueryParams.sortDir,
     endDateFrom,
@@ -17052,32 +17372,32 @@ var EventList = ({
     initialPages: initialLoadedPageCount,
     enabled: controlledCategoryPath == null || validatedCategoryPathKey === controlledCategoryPathValidationKey
   });
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     if (stateRef) {
       stateRef.current = { venueTab: activeTabValue, loadedPageCount };
     }
   }, [stateRef, activeTabValue, loadedPageCount]);
-  const filteredEvents = (0, import_react31.useMemo)(() => {
+  const filteredEvents = (0, import_react32.useMemo)(() => {
     return filterEventsByTabValue(events, activeTabValue);
   }, [events, activeTabValue]);
-  const groupedEvents = (0, import_react31.useMemo)(() => {
+  const groupedEvents = (0, import_react32.useMemo)(() => {
     return splitEventsByLifecycle(filteredEvents);
   }, [filteredEvents]);
-  const orderedEvents = (0, import_react31.useMemo)(() => {
+  const orderedEvents = (0, import_react32.useMemo)(() => {
     return groupedEvents.open;
   }, [groupedEvents.open]);
-  const tileEvents = (0, import_react31.useMemo)(() => {
+  const tileEvents = (0, import_react32.useMemo)(() => {
     const normalizedEvents = orderedEvents.map((event) => mapEventToEventListItemEvent(event)).filter((event) => event != null);
     if (resolvedMaxVisibleItems == null) return normalizedEvents;
     return normalizedEvents.slice(0, resolvedMaxVisibleItems);
   }, [orderedEvents, resolvedMaxVisibleItems]);
-  const visibleVenueMarkets = (0, import_react31.useMemo)(() => {
+  const visibleVenueMarkets = (0, import_react32.useMemo)(() => {
     return collectEventListVenueMarkets(tileEvents);
   }, [tileEvents]);
-  const visibleMidpointVenueMarketIds = (0, import_react31.useMemo)(() => {
+  const visibleMidpointVenueMarketIds = (0, import_react32.useMemo)(() => {
     return collectMidpointVenueMarketIds(visibleVenueMarkets);
   }, [visibleVenueMarkets]);
-  const { midpointRows: sharedMidpointRows, isLoading: isSharedMidpointsLoading } = (0, import_hooks58.useVenueMarketMidpoints)({
+  const { midpointRows: sharedMidpointRows, isLoading: isSharedMidpointsLoading } = (0, import_hooks59.useVenueMarketMidpoints)({
     venueMarketIds: visibleMidpointVenueMarketIds,
     enabled: visibleMidpointVenueMarketIds.length > 0
   });
@@ -17085,8 +17405,8 @@ var EventList = ({
   const shouldRenderEmptyState = !isLoading && !isError && tileEvents.length === 0;
   const placeholderSkeletonCount = isPlaceholderData ? Math.min(Math.max(tileEvents.length, PLACEHOLDER_SKELETON_MIN_ITEMS), requestLimit) : 0;
   const shouldRenderPaginationLoadingItems = shouldPaginate && hasNextPage && !isPlaceholderData;
-  const loadMoreRef = (0, import_react31.useRef)(null);
-  (0, import_react31.useEffect)(() => {
+  const loadMoreRef = (0, import_react32.useRef)(null);
+  (0, import_react32.useEffect)(() => {
     if (!shouldPaginate) return;
     if (!hasNextPage) return;
     if (typeof IntersectionObserver === "undefined") return;
@@ -17137,7 +17457,7 @@ var EventList = ({
     onCategoryRootChange == null ? void 0 : onCategoryRootChange(baseCategoryId != null ? baseCategoryId : void 0);
   };
   if (shouldRenderLoadingState) {
-    return /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
       Skeleton,
       {
         view: "event-list",
@@ -17146,8 +17466,8 @@ var EventList = ({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("section", { className: "agg-event-list flex w-full flex-col gap-2 md:gap-5 t", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("section", { className: "agg-event-list flex w-full flex-col gap-2 md:gap-5 t", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)(
       "header",
       {
         className: cn(
@@ -17156,19 +17476,18 @@ var EventList = ({
           "gap-2 sm:flex-row sm:items-center sm:gap-4"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "agg-event-list-title min-w-32", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Typography, { as: "h2", variant: "title", className: "truncate first-letter:uppercase", children: title2 }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "hidden min-w-0 max-w-full items-center gap-3 md:flex", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
-              EventListTabs,
+          /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { className: "agg-event-list-title min-w-32", children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Typography, { as: "h2", variant: "title", className: "truncate first-letter:uppercase", children: title2 }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("div", { className: "hidden min-w-0 max-w-full items-center gap-3 md:flex", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
+              EventListVenueStrip,
               {
                 ariaLabel: labels.eventList.tabsAria(title2),
-                className: "agg-event-list-tabs min-w-0 flex-1 max-w-[600px]!",
+                className: "agg-event-list-tabs",
                 activeTab: activeTabValue,
-                onTabChange: handleActiveTabChange,
-                overflowBehavior: "scroll"
+                onTabChange: handleActiveTabChange
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
               Select,
               {
                 ariaLabel: labels.eventList.sortByLabel,
@@ -17184,18 +17503,18 @@ var EventList = ({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "flex w-full gap-2 md:hidden mb-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
-        EventListTabs,
-        {
-          ariaLabel: labels.eventList.tabsAria(title2),
-          className: "agg-event-list-tabs min-w-0 flex-1",
-          activeTab: activeTabValue,
-          onTabChange: handleActiveTabChange,
-          overflowBehavior: "select"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
+      EventListVenueStrip,
+      {
+        ariaLabel: labels.eventList.tabsAria(title2),
+        className: "agg-event-list-tabs md:hidden!",
+        activeTab: activeTabValue,
+        onTabChange: handleActiveTabChange,
+        fullWidth: true
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("div", { className: "flex w-full gap-2 md:hidden mb-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
         Select,
         {
           ariaLabel: labels.eventList.sortByLabel,
@@ -17206,23 +17525,23 @@ var EventList = ({
           contentClassName: "rounded-[12px] py-2 shadow-[0_8px_16px_rgba(0,0,0,0.1)]"
         }
       ),
-      shouldRenderSubcategoryFilters ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+      shouldRenderSubcategoryFilters ? /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
         "button",
         {
           type: "button",
           className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-[8px] border-2 border-agg-primary bg-agg-secondary text-agg-foreground cursor-pointer",
           "aria-label": labels.eventList.subcategoriesOpenAria,
           onClick: () => setIsSubcategoriesModalOpen(true),
-          children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: "apps", size: "small", color: "currentColor" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Icon, { name: "apps", size: "small", color: "currentColor" })
         }
       ) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)(
       "div",
       {
         className: cn("flex w-full gap-6", shouldRenderSubcategoryFilters ? "md:items-start" : ""),
         children: [
-          shouldRenderSubcategoryFilters ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("aside", { className: "hidden w-[200px] shrink-0 md:block self-start sticky top-4", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "agg-sidebar max-h-[calc(100vh-19rem)] overflow-y-auto rounded-[8px] border border-agg-separator bg-agg-secondary p-2", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+          shouldRenderSubcategoryFilters ? /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("aside", { className: "hidden w-[200px] shrink-0 md:block self-start sticky top-4", children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { className: "agg-sidebar max-h-[calc(100vh-19rem)] overflow-y-auto rounded-[8px] border border-agg-separator bg-agg-secondary p-2", children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
             CategorySidebar,
             {
               baseCategoryId,
@@ -17235,7 +17554,7 @@ var EventList = ({
               onToggleCategory: handleToggleSubcategory
             }
           ) }) }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)(
             "div",
             {
               className: cn(
@@ -17245,7 +17564,7 @@ var EventList = ({
                 gridClassName
               ),
               children: [
-                isPlaceholderData ? Array.from({ length: placeholderSkeletonCount }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+                isPlaceholderData ? Array.from({ length: placeholderSkeletonCount }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
                   EventListItem,
                   {
                     isLoading: true,
@@ -17255,7 +17574,7 @@ var EventList = ({
                   },
                   `placeholder-${index}`
                 )) : null,
-                (isPlaceholderData ? [] : tileEvents).map((event) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+                (isPlaceholderData ? [] : tileEvents).map((event) => /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
                   EventListItem,
                   {
                     event,
@@ -17268,11 +17587,11 @@ var EventList = ({
                     onMarketClick,
                     getMarketHref,
                     href: getEventHref == null ? void 0 : getEventHref(event),
-                    marketStatus: import_hooks58.MarketStatus.open
+                    marketStatus: import_hooks59.MarketStatus.open
                   },
                   event.id
                 )),
-                shouldRenderPaginationLoadingItems ? Array.from({ length: 6 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+                shouldRenderPaginationLoadingItems ? Array.from({ length: 6 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
                   EventListItem,
                   {
                     isLoading: true,
@@ -17282,20 +17601,20 @@ var EventList = ({
                   },
                   `loading-${index}`
                 )) : null,
-                shouldRenderEmptyState ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "col-span-full w-full", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+                shouldRenderEmptyState ? /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { className: "col-span-full w-full", children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
                   StateMessage,
                   {
                     title: labels.eventList.emptyTitle,
                     description: labels.eventList.emptyDescription,
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: "search-empty" })
+                    icon: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Icon, { name: "search-empty" })
                   }
                 ) }) : null,
-                isError ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "col-span-full w-full", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+                isError ? /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { className: "col-span-full w-full", children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
                   StateMessage,
                   {
                     title: labels.eventList.errorTitle,
                     description: labels.eventList.errorDescription,
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Icon, { name: "warning" })
+                    icon: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Icon, { name: "warning" })
                   }
                 ) }) : null
               ]
@@ -17304,7 +17623,7 @@ var EventList = ({
         ]
       }
     ),
-    shouldRenderSubcategoryFilters ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Modal, { open: isSubcategoriesModalOpen, onOpenChange: setIsSubcategoriesModalOpen, children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+    shouldRenderSubcategoryFilters ? /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Modal, { open: isSubcategoriesModalOpen, onOpenChange: setIsSubcategoriesModalOpen, children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
       Modal.Container,
       {
         classNames: {
@@ -17313,20 +17632,20 @@ var EventList = ({
           content: "items-end p-0 pointer-events-none",
           container: "w-full max-w-none border-0 bg-transparent shadow-none"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "pointer-events-auto w-full rounded-t-[12px] border border-agg-separator bg-agg-secondary", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "flex justify-center pb-1 pt-3", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "h-1 w-10 rounded-full bg-agg-muted-foreground/30" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "flex items-center justify-between px-4 pb-2 pt-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(Dialog2.Title, { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: labels.eventList.subcategoriesLabel }),
-            /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("div", { className: "pointer-events-auto w-full rounded-t-[12px] border border-agg-separator bg-agg-secondary", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { className: "flex justify-center pb-1 pt-3", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { className: "h-1 w-10 rounded-full bg-agg-muted-foreground/30" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("div", { className: "flex items-center justify-between px-4 pb-2 pt-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(Dialog2.Title, { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: labels.eventList.subcategoriesLabel }),
+            /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
               Dialog2.Close,
               {
                 className: "flex cursor-pointer items-center justify-center rounded-full p-1 text-agg-muted-foreground hover:bg-agg-secondary-hover",
                 "aria-label": labels.common.close,
-                children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(CloseIcon, { className: "h-5 w-5" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(CloseIcon, { className: "h-5 w-5" })
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "flex flex-col gap-1 px-4 pb-4", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { className: "flex flex-col gap-1 px-4 pb-4", children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
             CategorySidebar,
             {
               baseCategoryId,
@@ -17342,7 +17661,7 @@ var EventList = ({
         ] })
       }
     ) }) : null,
-    shouldPaginate && hasNextPage ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { ref: loadMoreRef, className: "agg-event-list-sentinel h-px w-full", "aria-hidden": true }) : null
+    shouldPaginate && hasNextPage ? /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("div", { ref: loadMoreRef, className: "agg-event-list-sentinel h-px w-full", "aria-hidden": true }) : null
   ] });
 };
 EventList.displayName = "EventList";
@@ -17352,6 +17671,7 @@ EventList.displayName = "EventList";
   EventListItem,
   EventListItemDetails,
   EventListItemV2,
+  EventListVenueStrip,
   MarketDetails,
   MarketDetailsList,
   Orderbook,