@agg-build/ui 4.17.3 → 4.18.0

package/dist/chunk-WSZYDOZN.mjs

@@ -0,0 +1,2040 @@
+"use client";
+import {
+  isErrorWithStatus
+} from "./chunk-2UPO6G3S.mjs";
+import {
+  Badge,
+  Card,
+  CloseIcon,
+  Icon,
+  Modal,
+  RemoteImage,
+  SearchEmptyIcon,
+  Select,
+  Skeleton,
+  StateMessage,
+  Tabs,
+  Typography,
+  VenueLogo,
+  __objRest,
+  __spreadProps,
+  __spreadValues,
+  baseCardClassName,
+  cn,
+  dedupeVenueMarketsById,
+  filterEventsByTabValue,
+  formatMarketProbabilityPercent,
+  formatPriceGapPercent,
+  getMotionClassName,
+  mapEventToEventListItemEvent,
+  normalizeProbability,
+  resolveCategoryIdsFromPath,
+  resolveDisplayVolume,
+  resolveEventHeading,
+  resolveEventListItemEvent,
+  resolveOutcomeTitle,
+  resolveTabVenus,
+  resolveVenueLabel,
+  resolveYesOutcome,
+  sortCategoriesForNavigation,
+  sortOutcomes,
+  splitEventsByLifecycle,
+  validateSubcategoryPath
+} from "./chunk-WIGSRHUG.mjs";
+
+// src/events/item/index.tsx
+import {
+  optimizedImageUrl,
+  retinaImageUrl,
+  resolveRecurringCryptoIdentity,
+  sortVenues,
+  useLabels,
+  useMidpoints,
+  useSdkUiConfig,
+  useVenueEvent,
+  useVenueMarketMidpoints,
+  useVenueMarkets
+} from "@agg-build/hooks";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+
+// src/events/item/event-list-item-v2.utils.ts
+var isNonEmptyString = (value) => {
+  return typeof value === "string" && value.trim().length > 0;
+};
+var getOutcomeSortPrice = (outcome) => {
+  var _a;
+  return (_a = normalizeProbability(outcome.price)) != null ? _a : -1;
+};
+var MAX_VISIBLE_OUTCOME_PRICE_PILLS = 3;
+var resolveDisplayOutcome = (market) => {
+  var _a;
+  return (_a = resolveYesOutcome(market)) != null ? _a : [...market.venueMarketOutcomes].sort((left, right) => {
+    return getOutcomeSortPrice(right) - getOutcomeSortPrice(left);
+  })[0];
+};
+var resolveOutcomeRows = ({
+  venueMarkets,
+  marketCount
+}) => {
+  if (venueMarkets.length === 0) return [];
+  if (marketCount === 1 && venueMarkets.length === 1) {
+    const [market] = venueMarkets;
+    return sortOutcomes(market.venueMarketOutcomes).map((outcome) => ({
+      id: outcome.id,
+      label: resolveOutcomeTitle(outcome),
+      market,
+      outcome
+    }));
+  }
+  return venueMarkets.map((market) => {
+    const outcome = resolveDisplayOutcome(market);
+    if (!outcome) return void 0;
+    return {
+      id: market.id,
+      label: isNonEmptyString(market.question) ? market.question : resolveOutcomeTitle(outcome),
+      market,
+      outcome
+    };
+  }).filter((row) => row != null);
+};
+var collectOutcomePrices = (market, outcome, priceByOutcomeId) => {
+  var _a, _b, _c;
+  const prices = [];
+  const seenOutcomeKeys = /* @__PURE__ */ new Set();
+  const addPrice = (priceMarket, priceOutcome) => {
+    if (!priceMarket || !priceOutcome) return;
+    const resolvedPrice = priceByOutcomeId === void 0 ? priceOutcome.price : priceByOutcomeId.has(priceOutcome.id) ? priceByOutcomeId.get(priceOutcome.id) : void 0;
+    const normalizedPrice = normalizeProbability(resolvedPrice);
+    if (normalizedPrice == null) return;
+    const key = `${priceMarket.id}:${priceOutcome.id}`;
+    if (seenOutcomeKeys.has(key)) return;
+    seenOutcomeKeys.add(key);
+    prices.push({
+      venue: priceMarket.venue,
+      market: priceMarket,
+      outcome: priceOutcome,
+      price: normalizedPrice,
+      isBest: false
+    });
+  };
+  addPrice(market, outcome);
+  for (const matchedOutcomeRef of (_a = outcome.matchedVenueMarketOutcomes) != null ? _a : []) {
+    const matchedMarket = (_b = market.matchedVenueMarkets) == null ? void 0 : _b.find((candidate) => {
+      return candidate.id === matchedOutcomeRef.venueMarketId;
+    });
+    const matchedOutcome = (_c = matchedMarket == null ? void 0 : matchedMarket.venueMarketOutcomes) == null ? void 0 : _c.find((candidate) => {
+      return candidate.id === matchedOutcomeRef.venueMarketOutcomeId;
+    });
+    addPrice(matchedMarket, matchedOutcome);
+  }
+  if (prices.length === 0) return [];
+  const bestPriceByVenue = /* @__PURE__ */ new Map();
+  for (const price of prices) {
+    const existing = bestPriceByVenue.get(price.venue);
+    if (!existing || price.price < existing.price) {
+      bestPriceByVenue.set(price.venue, price);
+    }
+  }
+  const dedupedPrices = Array.from(bestPriceByVenue.values());
+  const sortedPricesByBestOdds = [...dedupedPrices].sort((left, right) => {
+    return left.price - right.price;
+  });
+  const bestPrice = sortedPricesByBestOdds[0];
+  if (!bestPrice) return [];
+  const visiblePrices = [
+    sortedPricesByBestOdds.at(-1),
+    sortedPricesByBestOdds[1],
+    bestPrice
+  ].reduce((accumulator, price) => {
+    if (!price) return accumulator;
+    const isDuplicate = accumulator.some((candidate) => {
+      return candidate.market.id === price.market.id && candidate.outcome.id === price.outcome.id;
+    });
+    if (isDuplicate) return accumulator;
+    accumulator.push(price);
+    return accumulator;
+  }, []);
+  return visiblePrices.slice(0, MAX_VISIBLE_OUTCOME_PRICE_PILLS).map((price) => __spreadProps(__spreadValues({}, price), {
+    isBest: price.market.id === bestPrice.market.id && price.outcome.id === bestPrice.outcome.id
+  }));
+};
+var collectMatchedVenues = (rows) => {
+  const venues = /* @__PURE__ */ new Set();
+  for (const row of rows) {
+    if (row.prices.length < 2) continue;
+    for (const price of row.prices) {
+      venues.add(price.venue);
+    }
+  }
+  return Array.from(venues);
+};
+var computePriceGapsFromComparisonRows = (rows) => {
+  const gapsByVenueMarketId = /* @__PURE__ */ new Map();
+  for (const row of rows) {
+    if (row.prices.length < 2) continue;
+    const prices = row.prices.map((price) => price.price);
+    const minPrice = Math.min(...prices);
+    const maxPrice = Math.max(...prices);
+    if (minPrice <= 0 || maxPrice <= minPrice) continue;
+    gapsByVenueMarketId.set(row.market.id, (maxPrice - minPrice) * 100);
+  }
+  return gapsByVenueMarketId;
+};
+var normalizeEventListItemV2Comparison = ({
+  venueMarkets,
+  marketCount,
+  priceByOutcomeId
+}) => {
+  const outcomeRows = resolveOutcomeRows({ venueMarkets, marketCount });
+  const rows = outcomeRows.map((row) => {
+    const prices = collectOutcomePrices(row.market, row.outcome, priceByOutcomeId);
+    return __spreadProps(__spreadValues({}, row), {
+      prices
+    });
+  }).filter((row) => row.prices.length === 0 || row.prices.some((price) => price.price > 0));
+  const matchedVenues = collectMatchedVenues(rows);
+  return {
+    rows,
+    matchedVenues,
+    hasVenueCompetition: matchedVenues.length > 1
+  };
+};
+
+// src/events/item/index.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var EventListItemLoadingState = ({
+  classNames,
+  ariaLabel
+}) => {
+  const labels = useLabels();
+  return /* @__PURE__ */ jsx(
+    Skeleton,
+    {
+      view: "event-list-item",
+      className: classNames == null ? void 0 : classNames.root,
+      ariaLabel: ariaLabel != null ? ariaLabel : labels.eventItem.loading
+    }
+  );
+};
+var EventListItemUnavailableState = ({
+  classNames,
+  ariaLabel
+}) => {
+  const labels = useLabels();
+  return /* @__PURE__ */ jsx(
+    Card,
+    {
+      className: cn(
+        "group/agg-event-card agg-event-card-unavailable",
+        baseCardClassName,
+        classNames == null ? void 0 : classNames.root
+      ),
+      role: "status",
+      "aria-label": ariaLabel != null ? ariaLabel : labels.eventItem.unavailableAria,
+      children: /* @__PURE__ */ jsxs("div", { className: cn("agg-event-card-header min-h-12 flex flex-col gap-1", classNames == null ? void 0 : classNames.header), children: [
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            variant: "body-large-strong",
+            className: cn("agg-event-title truncate", classNames == null ? void 0 : classNames.title),
+            children: labels.eventItem.unavailableTitle
+          }
+        ),
+        /* @__PURE__ */ jsx(Typography, { variant: "body", className: "text-agg-muted-foreground", children: labels.eventItem.unavailableDescription })
+      ] })
+    }
+  );
+};
+var EventListItemNotFoundState = ({
+  classNames: _classNames,
+  ariaLabel: _ariaLabel
+}) => {
+  const labels = useLabels();
+  return /* @__PURE__ */ jsx(
+    StateMessage,
+    {
+      title: labels.eventItemDetails.notFoundTitle,
+      description: labels.eventItemDetails.notFoundDescription,
+      icon: /* @__PURE__ */ jsx(SearchEmptyIcon, {}),
+      classNames: { root: "agg-event-card-state min-h-[280px] md:min-h-[320px]" }
+    }
+  );
+};
+var OUTCOMES_SCROLL_LOAD_THRESHOLD_PX = 16;
+var OUTCOMES_SCROLL_STATE_EPSILON_PX = 1;
+var OUTCOMES_SCROLL_MASK_HEIGHT_PX = 24;
+var MARKET_ID_QUERY_PARAM = "marketId";
+var OUTCOME_ID_QUERY_PARAM = "outcomeId";
+var OUTCOME_ROW_SELECTOR = ".agg-outcome-row";
+var DEFAULT_OUTCOMES_SCROLL_STATE = {
+  hasOverflow: false,
+  isAtTop: true,
+  isAtBottom: true,
+  remainingMarkets: 0
+};
+var areOutcomesScrollStatesEqual = (left, right) => {
+  return left.hasOverflow === right.hasOverflow && left.isAtTop === right.isAtTop && left.isAtBottom === right.isAtBottom && left.remainingMarkets === right.remainingMarkets;
+};
+var useOutcomesScrollState = ({
+  totalMarketCount,
+  onReachScrollThreshold
+}) => {
+  const containerRef = useRef(null);
+  const frameRef = useRef(null);
+  const scrollStateRef = useRef(DEFAULT_OUTCOMES_SCROLL_STATE);
+  const [scrollState, setScrollState] = useState(
+    DEFAULT_OUTCOMES_SCROLL_STATE
+  );
+  const measureScrollState = useCallback(() => {
+    frameRef.current = null;
+    const element = containerRef.current;
+    if (!element) return;
+    const { clientHeight, scrollHeight, scrollTop } = element;
+    const hasOverflow = scrollHeight > clientHeight + OUTCOMES_SCROLL_STATE_EPSILON_PX;
+    const isAtTop = scrollTop <= OUTCOMES_SCROLL_STATE_EPSILON_PX;
+    const isAtBottom = !hasOverflow || scrollTop + clientHeight >= scrollHeight - OUTCOMES_SCROLL_STATE_EPSILON_PX;
+    const loadedRows = Array.from(element.querySelectorAll(OUTCOME_ROW_SELECTOR));
+    const visibleMarketCount = loadedRows.reduce((count, row) => {
+      return count + (row.offsetTop < clientHeight - OUTCOMES_SCROLL_STATE_EPSILON_PX ? 1 : 0);
+    }, 0);
+    const remainingMarkets = hasOverflow ? Math.max(0, totalMarketCount - visibleMarketCount) : 0;
+    const nextScrollState = {
+      hasOverflow,
+      isAtTop,
+      isAtBottom,
+      remainingMarkets
+    };
+    if (!areOutcomesScrollStatesEqual(scrollStateRef.current, nextScrollState)) {
+      scrollStateRef.current = nextScrollState;
+      setScrollState(nextScrollState);
+    }
+    const distanceToBottom = scrollHeight - scrollTop - clientHeight;
+    if (distanceToBottom <= OUTCOMES_SCROLL_LOAD_THRESHOLD_PX) {
+      onReachScrollThreshold == null ? void 0 : onReachScrollThreshold();
+    }
+  }, [onReachScrollThreshold, totalMarketCount]);
+  const updateScrollState = useCallback(() => {
+    if (frameRef.current != null) return;
+    frameRef.current = window.requestAnimationFrame(measureScrollState);
+  }, [measureScrollState]);
+  useEffect(() => {
+    const element = containerRef.current;
+    if (!element) return;
+    element.addEventListener("scroll", updateScrollState, { passive: true });
+    let resizeObserver = null;
+    if (typeof ResizeObserver !== "undefined") {
+      resizeObserver = new ResizeObserver(() => {
+        updateScrollState();
+      });
+      resizeObserver.observe(element);
+    }
+    updateScrollState();
+    return () => {
+      element.removeEventListener("scroll", updateScrollState);
+      resizeObserver == null ? void 0 : resizeObserver.disconnect();
+      if (frameRef.current != null) {
+        window.cancelAnimationFrame(frameRef.current);
+        frameRef.current = null;
+      }
+    };
+  }, [updateScrollState]);
+  return { containerRef, scrollState, updateScrollState };
+};
+var buildOutcomeMidpointsByOutcomeId = (midpointRows) => {
+  const outcomeMidpointsByOutcomeId = /* @__PURE__ */ new Map();
+  const addOutcomeMidpoints = (value) => {
+    var _a, _b;
+    if (!value || typeof value !== "object") return;
+    const row = value;
+    for (const outcome of (_a = row.outcomes) != null ? _a : []) {
+      if (outcome.midpoint == null) continue;
+      outcomeMidpointsByOutcomeId.set(outcome.venueMarketOutcomeId, outcome.midpoint);
+    }
+    for (const matchedRow of (_b = row.matched) != null ? _b : []) {
+      addOutcomeMidpoints(matchedRow);
+    }
+  };
+  for (const row of midpointRows) {
+    addOutcomeMidpoints(row);
+  }
+  return outcomeMidpointsByOutcomeId;
+};
+var buildArbReturnByVenueMarketId = (midpointRows) => {
+  const arbReturnByVenueMarketId = /* @__PURE__ */ new Map();
+  const addArbReturn = (value) => {
+    var _a, _b;
+    if (!value || typeof value !== "object") return;
+    const row = value;
+    if (row.venueMarketId && !arbReturnByVenueMarketId.has(row.venueMarketId)) {
+      arbReturnByVenueMarketId.set(row.venueMarketId, (_a = row.arbReturn) != null ? _a : null);
+    }
+    for (const matchedRow of (_b = row.matched) != null ? _b : []) {
+      addArbReturn(matchedRow);
+    }
+  };
+  for (const row of midpointRows) {
+    addArbReturn(row);
+  }
+  return arbReturnByVenueMarketId;
+};
+var resolveMarketHrefFromEventHref = (eventHref, marketId, outcomeId) => {
+  if (!eventHref) return void 0;
+  if (typeof window === "undefined") return void 0;
+  try {
+    const url = new URL(eventHref, window.location.origin);
+    url.searchParams.set(MARKET_ID_QUERY_PARAM, marketId);
+    url.searchParams.set(OUTCOME_ID_QUERY_PARAM, outcomeId);
+    return url.toString();
+  } catch (e) {
+    return void 0;
+  }
+};
+var EventListItemContent = ({
+  event,
+  classNames,
+  arbitrageByOutcomeId,
+  midpointPrices,
+  midpointRows: sharedMidpointRows,
+  midpointsLoading,
+  onEventClick,
+  onMarketClick,
+  getMarketHref,
+  href,
+  ariaLabel,
+  marketStatus
+}) => {
+  var _a;
+  const config = useSdkUiConfig();
+  const labels = useLabels();
+  const allVenueMarkets = useMemo(() => event.venueMarkets, [event.venueMarkets]);
+  const recurringCryptoIdentity = resolveRecurringCryptoIdentity(event);
+  const eventHeading = resolveEventHeading({
+    title: event.title,
+    categories: event.categories,
+    structureType: event.structureType,
+    gameStartTime: event.gameStartTime,
+    endDate: event.endDate,
+    venueMarkets: event.venueMarkets,
+    recurringCryptoWindowStart: recurringCryptoIdentity == null ? void 0 : recurringCryptoIdentity.windowStart,
+    recurringCryptoDuration: recurringCryptoIdentity == null ? void 0 : recurringCryptoIdentity.duration
+  });
+  const resolvedTitle = eventHeading.title;
+  const resolvedTimestamp = eventHeading.timestampLabel;
+  const resolvedImage = event.image;
+  const visibleVenueLogos = useMemo(() => {
+    var _a2;
+    return sortVenues(Array.from(new Set(((_a2 = event.venues) != null ? _a2 : []).map((venue) => venue))));
+  }, [event.venues]);
+  const resolvedMarketCount = typeof event.marketCount === "number" && Number.isFinite(event.marketCount) ? Math.max(0, Math.floor(event.marketCount)) : allVenueMarkets.length;
+  const resolvedVenueCount = typeof event.venueCount === "number" && Number.isFinite(event.venueCount) ? Math.max(0, Math.floor(event.venueCount)) : visibleVenueLogos.length;
+  const [isLazyMarketsQueryEnabled, setIsLazyMarketsQueryEnabled] = useState(false);
+  const shouldEnableLazyMarketLoading = useMemo(() => {
+    if (!event.id) return false;
+    const hasExplicitMarketCount = typeof event.marketCount === "number" && Number.isFinite(event.marketCount);
+    if (hasExplicitMarketCount) {
+      return resolvedMarketCount > allVenueMarkets.length;
+    }
+    return allVenueMarkets.length > 1;
+  }, [allVenueMarkets.length, event.id, event.marketCount, resolvedMarketCount]);
+  const {
+    markets: lazyLoadedMarkets,
+    fetchNextPage: fetchNextLazyMarketsPage,
+    hasNextPage: hasNextLazyMarketsPage,
+    isLoading: isLoadingLazyMarkets,
+    isFetchingNextPage: isFetchingNextLazyMarketsPage
+  } = useVenueMarkets({
+    venueEventId: event.id,
+    enabled: shouldEnableLazyMarketLoading && isLazyMarketsQueryEnabled,
+    // List/tile surface: axis/dates sort by volume so the scroll tail matches
+    // the volume-sorted top-3 (the detail page omits context and keeps the
+    // structured threshold/date order).
+    context: "list",
+    status: marketStatus
+  });
+  const resolvedOutcomeMarkets = useMemo(() => {
+    if (!isLazyMarketsQueryEnabled || lazyLoadedMarkets.length === 0) return allVenueMarkets;
+    return dedupeVenueMarketsById([...allVenueMarkets, ...lazyLoadedMarkets]);
+  }, [allVenueMarkets, isLazyMarketsQueryEnabled, lazyLoadedMarkets]);
+  const hasExpandedMarkets = isLazyMarketsQueryEnabled && lazyLoadedMarkets.length > 0;
+  const shouldUseSharedMidpoints = !hasExpandedMarkets && (midpointPrices !== void 0 || sharedMidpointRows !== void 0 || midpointsLoading !== void 0);
+  const midpointVenueMarketIds = useMemo(() => {
+    var _a2;
+    const ids = [];
+    for (const market of resolvedOutcomeMarkets) {
+      ids.push(market.id);
+      for (const sibling of (_a2 = market.matchedVenueMarkets) != null ? _a2 : []) {
+        ids.push(sibling.id);
+      }
+    }
+    return [...new Set(ids)];
+  }, [resolvedOutcomeMarkets]);
+  const { midpointRows: fetchedMidpointRows, isLoading: isVenueMarketMidpointsLoading } = useVenueMarketMidpoints({
+    venueMarketIds: shouldUseSharedMidpoints ? [] : midpointVenueMarketIds,
+    enabled: !shouldUseSharedMidpoints && midpointVenueMarketIds.length > 0
+  });
+  const { prices: displayMidpointsByOutcomeId, isLoading: isOutcomeMidpointsLoading } = useMidpoints(shouldUseSharedMidpoints ? [] : resolvedOutcomeMarkets);
+  const resolvedMidpointRows = useMemo(
+    () => shouldUseSharedMidpoints ? sharedMidpointRows != null ? sharedMidpointRows : [] : fetchedMidpointRows,
+    [fetchedMidpointRows, sharedMidpointRows, shouldUseSharedMidpoints]
+  );
+  const resolvedDisplayMidpointsByOutcomeId = useMemo(
+    () => shouldUseSharedMidpoints ? midpointPrices != null ? midpointPrices : /* @__PURE__ */ new Map() : displayMidpointsByOutcomeId,
+    [displayMidpointsByOutcomeId, midpointPrices, shouldUseSharedMidpoints]
+  );
+  const isAwaitingMidpoints = midpointsLoading != null ? midpointsLoading : isOutcomeMidpointsLoading || midpointVenueMarketIds.length > 0 && isVenueMarketMidpointsLoading;
+  const displayPriceByOutcomeId = useMemo(() => {
+    const priceByOutcomeId = new Map(resolvedDisplayMidpointsByOutcomeId);
+    for (const [outcomeId, price] of buildOutcomeMidpointsByOutcomeId(resolvedMidpointRows)) {
+      priceByOutcomeId.set(outcomeId, price);
+    }
+    return priceByOutcomeId;
+  }, [resolvedDisplayMidpointsByOutcomeId, resolvedMidpointRows]);
+  const comparison = useMemo(() => {
+    return normalizeEventListItemV2Comparison({
+      venueMarkets: resolvedOutcomeMarkets,
+      marketCount: resolvedMarketCount,
+      priceByOutcomeId: displayPriceByOutcomeId
+    });
+  }, [displayPriceByOutcomeId, resolvedMarketCount, resolvedOutcomeMarkets]);
+  const gapsByVenueMarketId = useMemo(() => {
+    return computePriceGapsFromComparisonRows(comparison.rows);
+  }, [comparison.rows]);
+  const arbReturnByVenueMarketId = useMemo(() => {
+    return buildArbReturnByVenueMarketId(resolvedMidpointRows);
+  }, [resolvedMidpointRows]);
+  const shouldRenderLoadingOutcomeRow = shouldEnableLazyMarketLoading && (!isLazyMarketsQueryEnabled || isLoadingLazyMarkets || isFetchingNextLazyMarketsPage || hasNextLazyMarketsPage);
+  const resolvedVolume = (_a = resolveDisplayVolume(event.volume, allVenueMarkets)) != null ? _a : 0;
+  const volumeLabel = `${config.formatting.formatCompactCurrency(resolvedVolume)} ${labels.eventItem.volumeSuffix}`;
+  const orderedFooterVenues = useMemo(() => {
+    const venues = visibleVenueLogos.length > 0 ? visibleVenueLogos : comparison.matchedVenues.length > 0 ? comparison.matchedVenues : event.venue ? [event.venue] : [];
+    return Array.from(new Set(venues));
+  }, [comparison.matchedVenues, event.venue, visibleVenueLogos]);
+  const shouldShowMatchedVenueSummary = resolvedVenueCount > 1 || orderedFooterVenues.length > 1;
+  const visibleFooterVenues = shouldShowMatchedVenueSummary ? orderedFooterVenues : orderedFooterVenues.slice(0, 1);
+  const singleFooterVenue = shouldShowMatchedVenueSummary ? void 0 : visibleFooterVenues[0];
+  const matchedCountLabel = labels.eventItem.matchedCount(
+    Math.max(resolvedVenueCount, visibleFooterVenues.length)
+  );
+  const handleOutcomesScrollThreshold = useCallback(() => {
+    if (!shouldEnableLazyMarketLoading) return;
+    if (!isLazyMarketsQueryEnabled) {
+      setIsLazyMarketsQueryEnabled(true);
+      return;
+    }
+    if (!hasNextLazyMarketsPage) return;
+    if (isLoadingLazyMarkets || isFetchingNextLazyMarketsPage) return;
+    void fetchNextLazyMarketsPage();
+  }, [
+    fetchNextLazyMarketsPage,
+    hasNextLazyMarketsPage,
+    isFetchingNextLazyMarketsPage,
+    isLazyMarketsQueryEnabled,
+    isLoadingLazyMarkets,
+    shouldEnableLazyMarketLoading
+  ]);
+  const {
+    containerRef: outcomesContainerRef,
+    scrollState: outcomesScrollState,
+    updateScrollState
+  } = useOutcomesScrollState({
+    totalMarketCount: resolvedMarketCount,
+    onReachScrollThreshold: handleOutcomesScrollThreshold
+  });
+  const shouldUseNativeLinkNavigation = (eventToHandle) => {
+    return eventToHandle.metaKey || eventToHandle.ctrlKey || eventToHandle.shiftKey || eventToHandle.altKey || eventToHandle.button === 1;
+  };
+  const handleClick = (eventToHandle) => {
+    if (!eventToHandle) {
+      onEventClick == null ? void 0 : onEventClick(event);
+      return;
+    }
+    if (!href) {
+      onEventClick == null ? void 0 : onEventClick(event);
+      return;
+    }
+    if (shouldUseNativeLinkNavigation(eventToHandle)) {
+      return;
+    }
+    if (!onEventClick) {
+      return;
+    }
+    eventToHandle.preventDefault();
+    eventToHandle.stopPropagation();
+    onEventClick(event);
+  };
+  const handleOutcomeBadgeClick = (eventToHandle, market, outcome, marketHref) => {
+    eventToHandle.preventDefault();
+    eventToHandle.stopPropagation();
+    if (marketHref && shouldUseNativeLinkNavigation(eventToHandle)) {
+      window.open(marketHref, "_blank", "noopener,noreferrer");
+      return;
+    }
+    if (onMarketClick) {
+      onMarketClick(event, market, outcome);
+      return;
+    }
+    if (marketHref) {
+      window.location.assign(marketHref);
+    }
+  };
+  const handleKeyDown = (eventToHandle) => {
+    if (href) {
+      if ((eventToHandle == null ? void 0 : eventToHandle.key) === " ") {
+        eventToHandle == null ? void 0 : eventToHandle.preventDefault();
+        eventToHandle.currentTarget.click();
+      }
+      return;
+    }
+    if (!onEventClick) return;
+    if ((eventToHandle == null ? void 0 : eventToHandle.key) === "Enter" || (eventToHandle == null ? void 0 : eventToHandle.key) === " ") {
+      eventToHandle == null ? void 0 : eventToHandle.preventDefault();
+      onEventClick == null ? void 0 : onEventClick(event);
+    }
+  };
+  useEffect(() => {
+    updateScrollState();
+  }, [comparison.rows.length, shouldRenderLoadingOutcomeRow, updateScrollState]);
+  const renderArbitrage = (value) => {
+    if (value == null) return null;
+    if (Math.abs(value) < config.market.arbitrageThreshold) return null;
+    return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-1", "text-agg-success"), children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "label-strong", className: "text-agg-success", children: config.formatting.formatPercent(value) }),
+      /* @__PURE__ */ jsx(
+        Icon,
+        {
+          name: "triangle-up",
+          size: "small",
+          title: labels.eventItem.arbitrage,
+          className: "size-2!"
+        }
+      )
+    ] });
+  };
+  const renderPriceStripSkeleton = (count) => {
+    const safeCount = Math.max(1, Math.min(count || 1, 3));
+    const collapsedCount = safeCount - 1;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      Array.from({ length: collapsedCount }).map((_, index) => /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: cn(
+            "agg-outcome-price-loading agg-outcome-price-loading-collapsed",
+            "h-[30px] w-[30px] shrink-0 rounded-agg-full bg-agg-separator animate-pulse",
+            index > 0 && "-ml-3"
+          )
+        },
+        `agg-outcome-price-loading-collapsed-${index}`
+      )),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: cn(
+            "agg-outcome-price-loading agg-outcome-price-loading-best",
+            "h-[30px] w-[68px] shrink-0 rounded-agg-full bg-agg-separator animate-pulse",
+            collapsedCount > 0 && "ml-2"
+          )
+        }
+      )
+    ] });
+  };
+  const renderPriceGapPill = (value, source = "percent") => {
+    if (!config.features.enablePriceGap) return null;
+    if (isAwaitingMidpoints) return null;
+    const formattedPriceGap = formatPriceGapPercent(value, source);
+    if (!formattedPriceGap) return null;
+    return /* @__PURE__ */ jsxs(
+      "span",
+      {
+        className: cn(
+          "agg-price-gap-pill",
+          "inline-flex max-w-[52px] shrink-0 items-center gap-1 overflow-hidden whitespace-nowrap",
+          "text-agg-2xs font-agg-bold leading-agg-14 text-agg-success",
+          "opacity-100 transition-all duration-200 ease-out",
+          "group-hover/agg-event-card:mr-0 group-hover/agg-event-card:max-w-0 group-hover/agg-event-card:opacity-0"
+        ),
+        title: labels.eventItem.priceGap,
+        "aria-label": `${formattedPriceGap} ${labels.eventItem.priceGap}`,
+        children: [
+          /* @__PURE__ */ jsx(
+            "i",
+            {
+              "aria-hidden": "true",
+              className: "fi-rr-arrow-down inline-flex size-3! shrink-0 items-center justify-center text-agg-xs text-agg-success"
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { children: formattedPriceGap })
+        ]
+      }
+    );
+  };
+  const renderComparisonPriceBadge = (row, price, priceIndex) => {
+    var _a2;
+    const marketHref = (_a2 = getMarketHref == null ? void 0 : getMarketHref(event, row.market, row.outcome)) != null ? _a2 : resolveMarketHrefFromEventHref(href, row.market.id, row.outcome.id);
+    const isInteractive = Boolean(onMarketClick || marketHref);
+    const hasVenueCompetition = row.prices.length > 1;
+    const isHighlightedBestPrice = hasVenueCompetition && price.isBest;
+    const shouldCollapsePriceText = hasVenueCompetition && !isHighlightedBestPrice;
+    return /* @__PURE__ */ jsx(
+      Badge,
+      {
+        text: formatMarketProbabilityPercent(price.price, config.formatting.formatPercent),
+        prefix: /* @__PURE__ */ jsx(
+          VenueLogo,
+          {
+            venue: price.venue,
+            size: "small",
+            isMonochromatic: !isHighlightedBestPrice,
+            className: cn(!isHighlightedBestPrice && "text-agg-muted-foreground!")
+          }
+        ),
+        size: "small",
+        classNames: {
+          root: cn(
+            "agg-outcome-price",
+            "h-[30px] justify-center overflow-hidden px-0 text-agg-sm leading-agg-5",
+            "shrink-0 p-0! transition-all duration-300 ease-out",
+            isHighlightedBestPrice ? "agg-outcome-price-best ml-2 w-[68px] min-w-[68px] shadow-none" : cn(
+              "bg-agg-secondary-hover hover:bg-agg-tertiary",
+              hasVenueCompetition ? "agg-outcome-price-collapsed relative box-border w-[30px] min-w-[30px] group-hover/agg-event-card:w-[68px] group-hover/agg-event-card:min-w-[68px] group-hover/agg-event-card:gap-1" : "w-[68px] min-w-[68px]",
+              hasVenueCompetition && priceIndex > 0 && "-ml-3 group-hover/agg-event-card:ml-2"
+            ),
+            isInteractive && "cursor-pointer",
+            classNames == null ? void 0 : classNames.badge
+          ),
+          prefix: cn(
+            "flex shrink-0 items-center justify-center [&>svg]:size-3.5",
+            shouldCollapsePriceText && "pointer-events-none absolute inset-0 transition-[opacity] duration-300 ease-in group-hover/agg-event-card:pointer-events-auto group-hover/agg-event-card:static group-hover/agg-event-card:inset-auto"
+          ),
+          text: cn(
+            "transition-[max-width,opacity] duration-300 ease-in",
+            price.isBest ? "text-agg-foreground" : "text-agg-muted-foreground",
+            shouldCollapsePriceText && "max-w-0 overflow-hidden! opacity-0 group-hover/agg-event-card:max-w-[40px] group-hover/agg-event-card:opacity-100"
+          )
+        },
+        onClick: isInteractive ? (eventToHandle) => {
+          handleOutcomeBadgeClick(eventToHandle, row.market, row.outcome, marketHref);
+        } : void 0,
+        onAuxClick: isInteractive ? (eventToHandle) => {
+          handleOutcomeBadgeClick(eventToHandle, row.market, row.outcome, marketHref);
+        } : void 0
+      },
+      `${price.market.id}:${price.outcome.id}`
+    );
+  };
+  return /* @__PURE__ */ jsxs(
+    Card,
+    {
+      className: cn(
+        "group/agg-event-card min-w-60 md:min-w-90",
+        baseCardClassName,
+        (onEventClick || href) && "cursor-pointer",
+        classNames == null ? void 0 : classNames.root
+      ),
+      role: !href && onEventClick ? "button" : void 0,
+      tabIndex: !href && onEventClick ? 0 : void 0,
+      href,
+      onClick: handleClick,
+      onKeyDown: handleKeyDown,
+      "aria-label": ariaLabel != null ? ariaLabel : [resolvedTitle, resolvedTimestamp].filter(Boolean).join(" "),
+      withGradient: true,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: cn("agg-event-card-header flex items-center gap-4", classNames == null ? void 0 : classNames.header), children: [
+          /* @__PURE__ */ jsx(
+            RemoteImage,
+            {
+              src: optimizedImageUrl(resolvedImage, 40),
+              retinaSrc: retinaImageUrl(resolvedImage, 40),
+              alt: "",
+              classNames: {
+                root: "agg-event-image h-10 w-10 shrink-0 rounded-agg-lg object-cover",
+                image: "transition-transform duration-300 group-hover/agg-event-card:scale-110"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 self-stretch", children: /* @__PURE__ */ jsxs("div", { className: "flex h-12 min-w-0 flex-col justify-center", children: [
+            /* @__PURE__ */ jsx(
+              Typography,
+              {
+                variant: "body-strong",
+                className: cn(
+                  "agg-event-title",
+                  "min-w-0 text-agg-base font-agg-bold leading-agg-6",
+                  resolvedTimestamp ? "truncate whitespace-nowrap" : "text-wrap wrap-break-word line-clamp-2",
+                  classNames == null ? void 0 : classNames.title
+                ),
+                children: resolvedTitle
+              }
+            ),
+            resolvedTimestamp ? /* @__PURE__ */ jsx("div", { className: "agg-event-timestamp-row mt-0.5 h-5 min-w-0", children: /* @__PURE__ */ jsx(
+              Typography,
+              {
+                variant: "body",
+                className: cn(
+                  "agg-event-timestamp min-w-0 truncate",
+                  "text-agg-sm leading-agg-5 text-agg-muted-foreground"
+                ),
+                children: resolvedTimestamp
+              }
+            ) }) : null
+          ] }) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "relative w-full", children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              ref: outcomesContainerRef,
+              className: cn(
+                "agg-outcomes flex max-h-[76px] flex-col gap-4 overflow-y-auto rounded-agg-md [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary focus-visible:ring-offset-2 focus-visible:ring-offset-agg-secondary",
+                classNames == null ? void 0 : classNames.outcomes
+              ),
+              "aria-label": labels.marketDetails.marketOutcomesAria,
+              tabIndex: 0,
+              children: [
+                comparison.rows.map((row) => {
+                  var _a2;
+                  const arbitragePercent = (_a2 = arbitrageByOutcomeId == null ? void 0 : arbitrageByOutcomeId[row.outcome.id]) != null ? _a2 : arbitrageByOutcomeId == null ? void 0 : arbitrageByOutcomeId[row.market.id];
+                  const arbReturn = arbReturnByVenueMarketId.get(row.market.id);
+                  const priceGapPercent = arbReturn == null ? gapsByVenueMarketId.get(row.market.id) : arbReturn;
+                  const priceGapSource = arbReturn == null ? "percent" : "fraction";
+                  return /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: cn(
+                        "agg-outcome-row",
+                        "flex h-10 w-full flex-row items-center justify-between gap-3",
+                        classNames == null ? void 0 : classNames.outcomeRow
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx("div", { className: "agg-outcome-label-row flex min-w-0 flex-1 flex-row items-center justify-start gap-2", children: /* @__PURE__ */ jsx(
+                          Typography,
+                          {
+                            variant: "body",
+                            className: "agg-outcome-label min-w-0 truncate text-agg-xs leading-agg-5 md:text-agg-base md:leading-agg-6",
+                            children: row.label
+                          }
+                        ) }),
+                        /* @__PURE__ */ jsxs("div", { className: "agg-outcome-meta flex shrink-0 flex-row items-center justify-end gap-2", children: [
+                          renderArbitrage(arbitragePercent),
+                          renderPriceGapPill(priceGapPercent, priceGapSource),
+                          /* @__PURE__ */ jsx("div", { className: "agg-outcome-price-strip relative flex shrink-0 items-center justify-end", children: isAwaitingMidpoints ? renderPriceStripSkeleton(row.prices.length) : row.prices.map(
+                            (price, priceIndex) => renderComparisonPriceBadge(row, price, priceIndex)
+                          ) })
+                        ] })
+                      ]
+                    },
+                    row.id
+                  );
+                }),
+                shouldRenderLoadingOutcomeRow ? /* @__PURE__ */ jsxs("div", { className: "agg-outcome-row-loading flex w-full items-center justify-between gap-3", children: [
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      "aria-hidden": "true",
+                      className: "bg-agg-separator animate-pulse h-5 rounded-agg-sm w-[200px]"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      "aria-hidden": "true",
+                      className: "bg-agg-separator animate-pulse h-9 w-[100px] rounded-agg-full"
+                    }
+                  )
+                ] }) : null
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "agg-outcomes-scroll-gradient-top pointer-events-none absolute inset-x-0 top-0 z-10 bg-gradient-to-b from-agg-secondary to-transparent transition-opacity duration-150",
+                outcomesScrollState.hasOverflow && !outcomesScrollState.isAtTop ? "opacity-100" : "opacity-0"
+              ),
+              style: { height: OUTCOMES_SCROLL_MASK_HEIGHT_PX }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "agg-outcomes-scroll-gradient-bottom pointer-events-none absolute inset-x-0 bottom-0 z-10 bg-gradient-to-t from-agg-secondary to-transparent transition-opacity duration-150",
+                outcomesScrollState.hasOverflow && !outcomesScrollState.isAtBottom ? "opacity-100" : "opacity-0"
+              ),
+              style: { height: OUTCOMES_SCROLL_MASK_HEIGHT_PX }
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "agg-event-card-footer",
+              "flex items-center justify-between gap-5",
+              "text-agg-muted-foreground",
+              classNames == null ? void 0 : classNames.footer
+            ),
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: cn(
+                    "agg-event-meta flex min-w-0 flex-1 items-center gap-2 text-agg-sm leading-agg-5 truncate"
+                  ),
+                  children: [
+                    outcomesScrollState.remainingMarkets > 0 ? /* @__PURE__ */ jsx(
+                      Typography,
+                      {
+                        variant: "body",
+                        className: "agg-event-remaining-markets shrink-0 text-agg-sm leading-agg-5 text-agg-muted-foreground",
+                        children: labels.eventItem.remainingMarkets(outcomesScrollState.remainingMarkets)
+                      }
+                    ) : null,
+                    shouldShowMatchedVenueSummary ? /* @__PURE__ */ jsx("span", { className: "agg-event-matched-badge rounded-agg-full bg-agg-primary/10 px-2 py-[3px] text-agg-2xs font-agg-bold uppercase leading-agg-14 text-agg-primary", children: matchedCountLabel }) : null,
+                    singleFooterVenue ? /* @__PURE__ */ jsxs("span", { className: "agg-event-single-venue flex min-w-0 items-center gap-1 overflow-hidden", children: [
+                      /* @__PURE__ */ jsx(
+                        VenueLogo,
+                        {
+                          venue: singleFooterVenue,
+                          size: "small",
+                          isMonochromatic: true,
+                          className: "text-agg-muted-foreground! size-[14px]!"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx("span", { className: "truncate text-agg-muted-foreground", children: resolveVenueLabel(singleFooterVenue, void 0, labels) })
+                    ] }) : null,
+                    shouldShowMatchedVenueSummary && visibleFooterVenues.length > 0 ? /* @__PURE__ */ jsx("span", { className: "agg-event-venues flex items-center gap-1 overflow-hidden", children: visibleFooterVenues.map((venue) => (
+                      // Muted at rest; hovering a logo crossfades it to the venue's colours.
+                      /* @__PURE__ */ jsxs(
+                        "span",
+                        {
+                          className: "agg-event-venue-logo group/agg-footer-venue relative inline-flex size-3.5 shrink-0",
+                          title: resolveVenueLabel(venue, void 0, labels),
+                          children: [
+                            /* @__PURE__ */ jsx(
+                              VenueLogo,
+                              {
+                                venue,
+                                size: "small",
+                                isMonochromatic: true,
+                                className: cn(
+                                  "text-agg-muted-foreground! size-3.5!",
+                                  getMotionClassName(
+                                    config.features.enableAnimations,
+                                    "transition-opacity duration-150"
+                                  ),
+                                  "group-hover/agg-footer-venue:opacity-0"
+                                )
+                              }
+                            ),
+                            /* @__PURE__ */ jsx(
+                              VenueLogo,
+                              {
+                                venue,
+                                size: "small",
+                                className: cn(
+                                  "absolute inset-0 size-3.5! opacity-0",
+                                  getMotionClassName(
+                                    config.features.enableAnimations,
+                                    "transition-opacity duration-150"
+                                  ),
+                                  "group-hover/agg-footer-venue:opacity-100"
+                                )
+                              }
+                            )
+                          ]
+                        },
+                        venue
+                      )
+                    )) }) : null
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Typography,
+                {
+                  variant: "label",
+                  className: "agg-event-volume min-w-fit shrink-0 truncate whitespace-pre text-agg-sm text-agg-muted-foreground line-clamp-1",
+                  children: volumeLabel
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+var EventListItemByEventId = (_a) => {
+  var _b = _a, {
+    eventId
+  } = _b, rest = __objRest(_b, [
+    "eventId"
+  ]);
+  const {
+    event: fetchedEvent,
+    error,
+    isError,
+    isLoading
+  } = useVenueEvent({
+    eventId: eventId != null ? eventId : "",
+    enabled: !!eventId
+  });
+  const resolvedEvent = useMemo(() => {
+    return resolveEventListItemEvent(fetchedEvent);
+  }, [fetchedEvent]);
+  if (!eventId) {
+    return /* @__PURE__ */ jsx(EventListItemUnavailableState, { classNames: rest.classNames, ariaLabel: rest.ariaLabel });
+  }
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(EventListItemLoadingState, { classNames: rest.classNames, ariaLabel: rest.ariaLabel });
+  }
+  if (isErrorWithStatus(error, 404)) {
+    return /* @__PURE__ */ jsx(EventListItemNotFoundState, { classNames: rest.classNames, ariaLabel: rest.ariaLabel });
+  }
+  if (!fetchedEvent && !isError) {
+    return /* @__PURE__ */ jsx(EventListItemLoadingState, { classNames: rest.classNames, ariaLabel: rest.ariaLabel });
+  }
+  if (!resolvedEvent) {
+    return /* @__PURE__ */ jsx(EventListItemUnavailableState, { classNames: rest.classNames, ariaLabel: rest.ariaLabel });
+  }
+  return /* @__PURE__ */ jsx(EventListItemContent, __spreadValues({ event: resolvedEvent }, rest));
+};
+var EventListItem = (props) => {
+  if (props.isLoading) {
+    return /* @__PURE__ */ jsx(EventListItemLoadingState, { classNames: props.classNames, ariaLabel: props.ariaLabel });
+  }
+  if ("event" in props && props.event) {
+    const _a = props, { event } = _a, rest = __objRest(_a, ["event"]);
+    return /* @__PURE__ */ jsx(EventListItemContent, __spreadValues({ event }, rest));
+  }
+  return /* @__PURE__ */ jsx(EventListItemByEventId, __spreadValues({}, props));
+};
+EventListItem.displayName = "EventListItem";
+var EventListItemV2 = (props) => {
+  return /* @__PURE__ */ jsx(EventListItem, __spreadValues({}, props));
+};
+EventListItemV2.displayName = "EventListItemV2";
+
+// src/events/list/index.tsx
+import {
+  MarketStatus,
+  getVisibleVenueIdsByConfig,
+  useAppConfig as useAppConfig2,
+  useCategories,
+  useCategoryChildren,
+  useLabels as useLabels3,
+  useSdkUiConfig as useSdkUiConfig2,
+  useVenueEvents,
+  useVenueMarketMidpoints as useVenueMarketMidpoints2
+} from "@agg-build/hooks";
+import { VENUES } from "@agg-build/sdk";
+import * as Dialog from "@radix-ui/react-dialog";
+import { useCallback as useCallback3, useEffect as useEffect3, useMemo as useMemo4, useRef as useRef3, useState as useState3 } from "react";
+
+// src/events/list/category-sidebar.tsx
+import { useMemo as useMemo2 } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var rowBase = cn(
+  "flex min-h-11 w-full items-center gap-3 rounded-[6px] px-3 py-3",
+  "text-left text-agg-sm font-agg-normal leading-agg-5",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary focus-visible:ring-offset-1 focus-visible:ring-offset-agg-secondary"
+);
+var idleRowClassName = cn(
+  rowBase,
+  "cursor-pointer text-agg-foreground hover:bg-agg-secondary-hover"
+);
+var selectedRowClassName = cn(rowBase, "cursor-pointer bg-agg-primary/10 text-agg-primary");
+var CategorySidebar = ({
+  baseCategoryId,
+  childrenByParentId,
+  categoryPath,
+  collapsedCategoryIds,
+  totalEventCount,
+  labels,
+  onSelectAll,
+  onToggleCategory
+}) => {
+  const isDrilledIn = categoryPath.length > 0;
+  const sortedBaseChildren = useMemo2(() => {
+    var _a;
+    if (!baseCategoryId) return [];
+    const children = [...(_a = childrenByParentId.get(baseCategoryId)) != null ? _a : []];
+    return children.sort((a, b) => {
+      var _a2, _b, _c, _d;
+      const aHasChildren = ((_b = (_a2 = childrenByParentId.get(a.id)) == null ? void 0 : _a2.length) != null ? _b : 0) > 0;
+      const bHasChildren = ((_d = (_c = childrenByParentId.get(b.id)) == null ? void 0 : _c.length) != null ? _d : 0) > 0;
+      if (aHasChildren === bHasChildren) return 0;
+      return aHasChildren ? -1 : 1;
+    });
+  }, [baseCategoryId, childrenByParentId]);
+  const renderRow = ({
+    entry,
+    isExpanded,
+    isSelected,
+    onClick
+  }) => {
+    var _a, _b;
+    const hasKnownChildren = ((_b = (_a = childrenByParentId.get(entry.id)) == null ? void 0 : _a.length) != null ? _b : 0) > 0;
+    return /* @__PURE__ */ jsxs2(
+      "button",
+      {
+        type: "button",
+        "aria-current": isSelected ? "true" : void 0,
+        "aria-expanded": hasKnownChildren ? isExpanded : void 0,
+        className: isSelected ? selectedRowClassName : idleRowClassName,
+        onClick,
+        children: [
+          /* @__PURE__ */ jsx2("span", { className: "min-w-0 flex-1 truncate first-letter:uppercase", children: entry.label }),
+          hasKnownChildren ? /* @__PURE__ */ jsx2(
+            Icon,
+            {
+              name: isExpanded ? "chevron-up" : "chevron-down",
+              size: "small",
+              color: "currentColor",
+              className: "shrink-0 text-agg-muted-foreground"
+            }
+          ) : /* @__PURE__ */ jsx2("span", { className: "shrink-0 text-agg-muted-foreground", children: entry.eventCount })
+        ]
+      },
+      entry.id
+    );
+  };
+  const renderBranch = (category, depth) => {
+    var _a, _b, _c, _d, _e;
+    const label = (_a = category.displayName) != null ? _a : category.name;
+    const entry = {
+      id: category.id,
+      label,
+      eventCount: (_b = category.eventCount) != null ? _b : 0
+    };
+    const childCategories = (_c = childrenByParentId.get(category.id)) != null ? _c : [];
+    const hasKnownChildren = childCategories.length > 0;
+    const isExpanded = ((_d = categoryPath[depth]) == null ? void 0 : _d.id) === category.id && !collapsedCategoryIds.has(category.id);
+    const isSelected = ((_e = categoryPath[depth]) == null ? void 0 : _e.id) === category.id && categoryPath.length === depth + 1;
+    return /* @__PURE__ */ jsxs2("div", { className: "flex w-full flex-col", children: [
+      renderRow({
+        entry,
+        isExpanded,
+        isSelected,
+        onClick: () => onToggleCategory({ entry, depth, hasKnownChildren, isExpanded, isSelected })
+      }),
+      /* @__PURE__ */ jsx2(
+        "div",
+        {
+          className: cn(
+            "grid transition-[grid-template-rows] duration-150 ease-in-out motion-reduce:transition-none",
+            isExpanded ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
+          ),
+          children: /* @__PURE__ */ jsx2("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx2("div", { className: "flex w-full flex-col gap-1 pl-4 pt-1", children: childCategories.map((child) => renderBranch(child, depth + 1)) }) })
+        }
+      )
+    ] }, category.id);
+  };
+  return /* @__PURE__ */ jsxs2("div", { className: "flex w-full flex-col gap-1", children: [
+    /* @__PURE__ */ jsxs2(
+      "button",
+      {
+        type: "button",
+        "aria-current": !isDrilledIn ? "true" : void 0,
+        className: !isDrilledIn ? selectedRowClassName : idleRowClassName,
+        onClick: onSelectAll,
+        children: [
+          /* @__PURE__ */ jsx2("span", { className: "min-w-0 flex-1 truncate", children: labels.subcategoriesAll }),
+          /* @__PURE__ */ jsx2("span", { className: "shrink-0 text-agg-muted-foreground", children: totalEventCount })
+        ]
+      }
+    ),
+    sortedBaseChildren.map((category) => renderBranch(category, 0))
+  ] });
+};
+CategorySidebar.displayName = "CategorySidebar";
+
+// src/events/list/event-list-tabs.tsx
+import { getVenueAvailabilityState, useAppConfig, useGeoBlock, useLabels as useLabels2 } from "@agg-build/hooks";
+import { getEffectiveDisabledVenues, isVenueInactive } from "@agg-build/sdk";
+import { useCallback as useCallback2, useEffect as useEffect2, useMemo as useMemo3, useRef as useRef2, useState as useState2 } from "react";
+
+// src/events/list/event-list.constants.ts
+import { sortVenues as sortVenues2 } from "@agg-build/hooks";
+import { MatchStatus, Venue } from "@agg-build/sdk";
+var DEFAULT_EVENTS_LIMIT = 50;
+var DEFAULT_EVENT_LIST_SORT = "volume24hr";
+var PLACEHOLDER_SKELETON_MIN_ITEMS = 6;
+var EVENT_LIST_SORT_VALUES = [
+  "volume24hr",
+  "topArbitrage",
+  "volume",
+  "endDate"
+];
+var getDefaultEventListTabs = (labels) => {
+  const tabs = [
+    {
+      value: "matched",
+      label: labels.eventList.matchedTab,
+      iconName: "circle-overlap",
+      matchStatus: [MatchStatus.matched, MatchStatus.verified]
+    },
+    {
+      value: "all",
+      label: labels.eventList.allTab,
+      iconName: "apps"
+    },
+    {
+      value: Venue.polymarket,
+      label: labels.venues.polymarket,
+      venueLogo: Venue.polymarket,
+      venues: [Venue.polymarket]
+    },
+    {
+      value: Venue.kalshi,
+      label: labels.venues.kalshi,
+      venueLogo: Venue.kalshi,
+      venues: [Venue.kalshi]
+    },
+    {
+      value: Venue.limitless,
+      label: labels.venues.limitless,
+      venueLogo: Venue.limitless,
+      venues: [Venue.limitless]
+    },
+    {
+      value: Venue.predict,
+      label: labels.venues.predict,
+      venueLogo: Venue.predict,
+      venues: [Venue.predict]
+    },
+    {
+      value: Venue.pred,
+      label: labels.venues.pred,
+      venueLogo: Venue.pred,
+      venues: [Venue.pred]
+    },
+    {
+      value: Venue.hyperliquid,
+      label: labels.venues.hyperliquid,
+      venueLogo: Venue.hyperliquid,
+      venues: [Venue.hyperliquid]
+      // isComingSoon: true,
+    },
+    {
+      value: Venue.myriad,
+      label: labels.venues.myriad,
+      venueLogo: Venue.myriad,
+      venues: [Venue.myriad]
+      // isComingSoon: true,
+    },
+    {
+      value: Venue.novig,
+      label: labels.venues.novig,
+      venueLogo: Venue.novig,
+      venues: [Venue.novig]
+    },
+    {
+      value: Venue.prophetx,
+      label: labels.venues.prophetx,
+      venueLogo: Venue.prophetx,
+      venues: [Venue.prophetx]
+    },
+    {
+      value: Venue.opinion,
+      label: labels.venues.opinion,
+      venueLogo: Venue.opinion,
+      venues: [Venue.opinion],
+      isComingSoon: true
+    }
+  ];
+  const venueRank = new Map(
+    sortVenues2(tabs.flatMap((tab) => tab.venueLogo ? [tab.venueLogo] : [])).map((venue, i) => [
+      venue,
+      i
+    ])
+  );
+  const rank = (tab) => {
+    var _a;
+    return tab.venueLogo ? 1 + ((_a = venueRank.get(tab.venueLogo)) != null ? _a : venueRank.size) : 0;
+  };
+  return [...tabs].sort((a, b) => rank(a) - rank(b));
+};
+
+// src/events/list/event-list-tabs.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var DEFAULT_HIDDEN_VENUES = new Set(getEffectiveDisabledVenues(void 0));
+var renderTabIcon = (tab, isActive) => {
+  if (tab.iconName === "warning-filled") {
+    return /* @__PURE__ */ jsx3(Icon, { name: "warning-filled", size: "small", color: "currentColor" });
+  }
+  if (tab.venueLogo) {
+    return /* @__PURE__ */ jsx3(VenueLogo, { venue: tab.venueLogo, size: "small" });
+  }
+  if (!tab.iconName) return null;
+  return /* @__PURE__ */ jsx3(
+    Icon,
+    {
+      name: tab.iconName,
+      size: "small",
+      color: isActive ? "var(--agg-color-primary)" : "var(--agg-color-foreground)"
+    }
+  );
+};
+var useEventListTabs = (tabs) => {
+  const labels = useLabels2();
+  const { disabledVenues, isLoading: isAppConfigLoading } = useAppConfig();
+  const { isLocationBlocked } = useGeoBlock();
+  return useMemo3(() => {
+    const baseTabs = tabs != null ? tabs : getDefaultEventListTabs(labels);
+    return baseTabs.flatMap((tab) => {
+      if (!tab.venueLogo) return [tab];
+      const availabilityState = getVenueAvailabilityState({
+        venueId: tab.venueLogo,
+        disabledVenues,
+        // A globally inactive or default-disabled venue is hidden until
+        // `/app/config` resolves. That prevents partner-opt-in venues such as
+        // Novig from flashing briefly for apps that still disable them, while
+        // ordinary active venues continue rendering immediately.
+        isConfigLoading: isAppConfigLoading && (isVenueInactive(tab.venueLogo) || DEFAULT_HIDDEN_VENUES.has(tab.venueLogo)),
+        isLocationBlocked
+      });
+      if (availabilityState === "hidden") return [];
+      return [
+        __spreadProps(__spreadValues({}, tab), {
+          disabled: tab.disabled || availabilityState === "geoblocked",
+          label: availabilityState === "geoblocked" ? `${tab.label} (${labels.trading.venueUnavailableInRegion})` : tab.label,
+          iconName: availabilityState === "geoblocked" ? "warning-filled" : tab.iconName
+        })
+      ];
+    });
+  }, [tabs, labels, disabledVenues, isAppConfigLoading, isLocationBlocked]);
+};
+var EventListTabs = ({
+  tabs,
+  activeTab,
+  onTabChange,
+  ariaLabel,
+  className,
+  overflowBehavior
+}) => {
+  const resolvedTabs = useEventListTabs(tabs);
+  useEffect2(() => {
+    const fallbackTab = resolvedTabs.find((tab) => !tab.disabled);
+    if (!fallbackTab) return;
+    if (resolvedTabs.some((tab) => tab.value === activeTab && !tab.disabled)) return;
+    onTabChange(fallbackTab.value);
+  }, [activeTab, onTabChange, resolvedTabs]);
+  const items = useMemo3(() => {
+    return resolvedTabs.map((tab) => {
+      const isActive = tab.value === activeTab;
+      return {
+        value: tab.value,
+        label: tab.label,
+        icon: renderTabIcon(tab, isActive),
+        disabled: tab.disabled,
+        isComingSoon: tab.isComingSoon
+      };
+    });
+  }, [activeTab, resolvedTabs]);
+  return /* @__PURE__ */ jsx3(
+    Tabs,
+    {
+      ariaLabel,
+      className,
+      items,
+      overflowBehavior,
+      value: activeTab,
+      onChange: onTabChange
+    }
+  );
+};
+EventListTabs.displayName = "EventListTabs";
+var useEventListTabsHeaderOverflow = (recomputeOn, options) => {
+  const headerRef = useRef2(null);
+  const titleRef = useRef2(null);
+  const requiredTabsWidthRef = useRef2(0);
+  const [shouldUseSelectOverflow, setShouldUseSelectOverflow] = useState2(false);
+  const updateTabsOverflowBehavior = useCallback2(() => {
+    var _a;
+    if (typeof window === "undefined") return;
+    const headerElement = headerRef.current;
+    const titleElement = titleRef.current;
+    if (!headerElement || !titleElement) return;
+    const headerStyles = window.getComputedStyle(headerElement);
+    const rawGap = headerStyles.columnGap || headerStyles.gap || "0";
+    const horizontalGap = Number.parseFloat(rawGap) || 0;
+    const availableTabsWidth = headerElement.clientWidth - titleElement.getBoundingClientRect().width - horizontalGap;
+    if (availableTabsWidth <= 0) {
+      setShouldUseSelectOverflow(true);
+      return;
+    }
+    const minTabsInlineWidthForSelect = options == null ? void 0 : options.minTabsInlineWidthForSelect;
+    if (typeof minTabsInlineWidthForSelect === "number" && availableTabsWidth < minTabsInlineWidthForSelect) {
+      setShouldUseSelectOverflow(true);
+      return;
+    }
+    const preferSelectOnOverflow = (_a = options == null ? void 0 : options.preferSelectOnOverflow) != null ? _a : true;
+    if (!preferSelectOnOverflow) {
+      setShouldUseSelectOverflow(false);
+      return;
+    }
+    const tabListElement = headerElement.querySelector(".agg-tab-list");
+    if (tabListElement) {
+      const currentRequiredWidth = tabListElement.scrollWidth;
+      if (currentRequiredWidth > 0) {
+        requiredTabsWidthRef.current = currentRequiredWidth;
+      }
+      const hasRealOverflow = tabListElement.scrollWidth - tabListElement.clientWidth > 1;
+      setShouldUseSelectOverflow(hasRealOverflow);
+      return;
+    }
+    if (requiredTabsWidthRef.current <= 0) return;
+    setShouldUseSelectOverflow(requiredTabsWidthRef.current > availableTabsWidth);
+  }, [options == null ? void 0 : options.minTabsInlineWidthForSelect, options == null ? void 0 : options.preferSelectOnOverflow]);
+  useEffect2(() => {
+    updateTabsOverflowBehavior();
+  }, [recomputeOn, updateTabsOverflowBehavior]);
+  useEffect2(() => {
+    if (typeof window === "undefined") return;
+    const handleResize = () => {
+      updateTabsOverflowBehavior();
+    };
+    window.addEventListener("resize", handleResize);
+    return () => {
+      window.removeEventListener("resize", handleResize);
+    };
+  }, [updateTabsOverflowBehavior]);
+  useEffect2(() => {
+    if (typeof ResizeObserver === "undefined") return;
+    const headerElement = headerRef.current;
+    const titleElement = titleRef.current;
+    if (!headerElement || !titleElement) return;
+    const resizeObserver = new ResizeObserver(() => {
+      updateTabsOverflowBehavior();
+    });
+    resizeObserver.observe(headerElement);
+    resizeObserver.observe(titleElement);
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [updateTabsOverflowBehavior]);
+  return { headerRef, titleRef, shouldUseSelectOverflow };
+};
+
+// src/events/list/index.tsx
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var SORT_ICON_BY_VALUE = {
+  volume24hr: "sort-volume-24hr",
+  topArbitrage: "sort-top-arbitrage",
+  volume: "sort-volume",
+  endDate: "sort-end-date"
+};
+var resolveSortQueryParams = (value) => {
+  if (value === "volume") {
+    return { sortBy: "volume", sortDir: "desc" };
+  }
+  if (value === "endDate") {
+    return { sortBy: "endDate", sortDir: "asc" };
+  }
+  if (value === "topArbitrage") {
+    return {
+      sortBy: "arbReturn",
+      sortDir: "desc"
+    };
+  }
+  return { sortBy: "volume24hr", sortDir: "desc" };
+};
+var collectEventListVenueMarkets = (events) => {
+  return events.flatMap((event) => {
+    var _a;
+    return (_a = event.venueMarkets) != null ? _a : [];
+  });
+};
+var collectMidpointVenueMarketIds = (venueMarkets) => {
+  var _a;
+  const ids = [];
+  for (const market of venueMarkets) {
+    ids.push(market.id);
+    for (const sibling of (_a = market.matchedVenueMarkets) != null ? _a : []) {
+      ids.push(sibling.id);
+    }
+  }
+  return [...new Set(ids)];
+};
+var EventList = ({
+  title,
+  limit = DEFAULT_EVENTS_LIMIT,
+  maxVisibleItems,
+  search,
+  categoryIds,
+  onCategoryRootChange,
+  onEventClick,
+  onMarketClick,
+  getMarketHref,
+  getEventHref,
+  initialVenueTab,
+  activeVenueTab: controlledActiveVenueTab,
+  onActiveVenueTabChange,
+  selectedSort: controlledSelectedSort,
+  onSelectedSortChange,
+  categoryPath: controlledCategoryPath,
+  onCategoryPathChange,
+  initialLoadedPageCount,
+  stateRef
+}) => {
+  var _a, _b, _c, _d, _e, _f;
+  const labels = useLabels3();
+  const { disabledVenues } = useAppConfig2();
+  const {
+    features: { enableVenueEventDiscoveryFilters, showSportsMarkets }
+  } = useSdkUiConfig2();
+  const isDiscoveryFiltersEnabled = enableVenueEventDiscoveryFilters && !search;
+  const resolvedTabs = useEventListTabs();
+  const visibleVenues = useMemo4(
+    () => disabledVenues.length === 0 ? void 0 : getVisibleVenueIdsByConfig(VENUES, disabledVenues),
+    [disabledVenues]
+  );
+  const [internalActiveTabValue, setInternalActiveTabValue] = useState3(
+    (_b = initialVenueTab != null ? initialVenueTab : (_a = resolvedTabs[0]) == null ? void 0 : _a.value) != null ? _b : "matched"
+  );
+  const activeTabValue = controlledActiveVenueTab != null ? controlledActiveVenueTab : internalActiveTabValue;
+  const [internalSelectedSort, setInternalSelectedSort] = useState3(DEFAULT_EVENT_LIST_SORT);
+  const selectedSort = controlledSelectedSort != null ? controlledSelectedSort : internalSelectedSort;
+  const [isSubcategoriesModalOpen, setIsSubcategoriesModalOpen] = useState3(false);
+  const [internalCategoryPath, setInternalCategoryPath] = useState3([]);
+  const categoryPath = controlledCategoryPath != null ? controlledCategoryPath : internalCategoryPath;
+  const [collapsedCategoryIds, setCollapsedCategoryIds] = useState3(() => /* @__PURE__ */ new Set());
+  const handleActiveTabChange = useCallback3(
+    (value) => {
+      if (controlledActiveVenueTab == null) setInternalActiveTabValue(value);
+      onActiveVenueTabChange == null ? void 0 : onActiveVenueTabChange(value, { history: "push" });
+    },
+    [controlledActiveVenueTab, onActiveVenueTabChange]
+  );
+  const handleSelectedSortChange = useCallback3(
+    (value) => {
+      if (controlledSelectedSort == null) setInternalSelectedSort(value);
+      onSelectedSortChange == null ? void 0 : onSelectedSortChange(value, { history: "push" });
+    },
+    [controlledSelectedSort, onSelectedSortChange]
+  );
+  const handleCategoryPathChange = useCallback3(
+    (value, options) => {
+      if (controlledCategoryPath == null) setInternalCategoryPath(value);
+      onCategoryPathChange == null ? void 0 : onCategoryPathChange(value, options);
+    },
+    [controlledCategoryPath, onCategoryPathChange]
+  );
+  const sortItems = useMemo4(() => {
+    return [
+      {
+        value: "volume24hr",
+        label: labels.eventList.sortBy24hVolume,
+        icon: /* @__PURE__ */ jsx4(Icon, { name: SORT_ICON_BY_VALUE.volume24hr, size: "small", color: "currentColor" })
+      },
+      {
+        value: "topArbitrage",
+        label: labels.eventList.sortByTopArbitrage,
+        icon: /* @__PURE__ */ jsx4(Icon, { name: SORT_ICON_BY_VALUE.topArbitrage, size: "small", color: "currentColor" })
+      },
+      {
+        value: "volume",
+        label: labels.eventList.sortByTotalVolume,
+        icon: /* @__PURE__ */ jsx4(Icon, { name: SORT_ICON_BY_VALUE.volume, size: "small", color: "currentColor" })
+      },
+      {
+        value: "endDate",
+        label: labels.eventList.sortByEndingSoon,
+        icon: /* @__PURE__ */ jsx4(Icon, { name: SORT_ICON_BY_VALUE.endDate, size: "small", color: "currentColor" })
+      }
+    ];
+  }, [
+    labels.eventList.sortBy24hVolume,
+    labels.eventList.sortByEndingSoon,
+    labels.eventList.sortByTopArbitrage,
+    labels.eventList.sortByTotalVolume
+  ]);
+  const baseCategoryId = (_c = categoryIds == null ? void 0 : categoryIds[0]) != null ? _c : null;
+  const previousBaseCategoryIdRef = useRef3(baseCategoryId);
+  useEffect3(() => {
+    var _a2, _b2;
+    if (previousBaseCategoryIdRef.current === baseCategoryId) return;
+    previousBaseCategoryIdRef.current = baseCategoryId;
+    if (controlledActiveVenueTab == null) {
+      setInternalActiveTabValue((_b2 = (_a2 = resolvedTabs[0]) == null ? void 0 : _a2.value) != null ? _b2 : "matched");
+    }
+    if (controlledSelectedSort == null) setInternalSelectedSort(DEFAULT_EVENT_LIST_SORT);
+    if (!isDiscoveryFiltersEnabled) return;
+    if (controlledCategoryPath == null) setInternalCategoryPath([]);
+    setCollapsedCategoryIds(/* @__PURE__ */ new Set());
+  }, [
+    baseCategoryId,
+    controlledActiveVenueTab,
+    controlledCategoryPath,
+    controlledSelectedSort,
+    isDiscoveryFiltersEnabled,
+    resolvedTabs
+  ]);
+  const { categories: topLevelCategories } = useCategories({
+    queryKeyScope: "event-list-top-categories",
+    enabled: isDiscoveryFiltersEnabled,
+    limit: 100
+  });
+  const sortedTopLevelCategories = useMemo4(() => {
+    return sortCategoriesForNavigation(topLevelCategories);
+  }, [topLevelCategories]);
+  const baseCategoryChildPrefetchIds = useMemo4(() => {
+    return Array.from(
+      /* @__PURE__ */ new Set([
+        ...baseCategoryId ? [baseCategoryId] : [],
+        ...sortedTopLevelCategories.map((category) => category.id),
+        ...categoryPath.map((category) => category.id)
+      ])
+    );
+  }, [baseCategoryId, categoryPath, sortedTopLevelCategories]);
+  const { childrenByParentId: baseChildrenByParentId, isLoading: isBaseCategoryChildrenLoading } = useCategoryChildren({
+    queryKeyScope: "event-list-category-children",
+    enabled: isDiscoveryFiltersEnabled,
+    parentIds: baseCategoryChildPrefetchIds,
+    limit: 100
+  });
+  const visibleChildPrefetchIds = useMemo4(() => {
+    var _a2, _b2;
+    const ids = /* @__PURE__ */ new Set();
+    if (baseCategoryId) {
+      for (const child of (_a2 = baseChildrenByParentId.get(baseCategoryId)) != null ? _a2 : []) {
+        ids.add(child.id);
+      }
+    }
+    for (const expandedCategory of categoryPath) {
+      for (const childCategory of (_b2 = baseChildrenByParentId.get(expandedCategory.id)) != null ? _b2 : []) {
+        ids.add(childCategory.id);
+      }
+    }
+    return Array.from(ids);
+  }, [baseCategoryId, baseChildrenByParentId, categoryPath]);
+  const { childrenByParentId: visibleChildrenByParentId } = useCategoryChildren({
+    queryKeyScope: "event-list-category-children",
+    enabled: isDiscoveryFiltersEnabled,
+    parentIds: visibleChildPrefetchIds,
+    limit: 100
+  });
+  const visibleGrandchildPrefetchIds = useMemo4(() => {
+    var _a2;
+    const ids = /* @__PURE__ */ new Set();
+    for (const expandedCategory of categoryPath) {
+      for (const childCategory of (_a2 = visibleChildrenByParentId.get(expandedCategory.id)) != null ? _a2 : []) {
+        ids.add(childCategory.id);
+      }
+    }
+    return Array.from(ids);
+  }, [categoryPath, visibleChildrenByParentId]);
+  const { childrenByParentId: visibleGrandchildrenByParentId } = useCategoryChildren({
+    queryKeyScope: "event-list-category-children",
+    enabled: isDiscoveryFiltersEnabled,
+    parentIds: visibleGrandchildPrefetchIds,
+    limit: 100
+  });
+  const childrenByParentId = useMemo4(() => {
+    return new Map([
+      ...baseChildrenByParentId,
+      ...visibleChildrenByParentId,
+      ...visibleGrandchildrenByParentId
+    ]);
+  }, [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] = useState3(
+    () => controlledCategoryPath == null || controlledCategoryPath.length === 0 ? controlledCategoryPathValidationKey : ""
+  );
+  useEffect3(() => {
+    if (controlledCategoryPath == null || controlledCategoryPath.length === 0) {
+      setValidatedCategoryPathKey(controlledCategoryPathValidationKey);
+      return;
+    }
+    if (isBaseCategoryChildrenLoading) return;
+    const requestedIds = controlledCategoryPath.map((entry) => entry.id);
+    const validIds = validateSubcategoryPath(requestedIds, baseCategoryId, baseChildrenByParentId);
+    if (validIds.length !== requestedIds.length) {
+      handleCategoryPathChange(controlledCategoryPath.slice(0, validIds.length), {
+        history: "replace"
+      });
+      return;
+    }
+    setValidatedCategoryPathKey(controlledCategoryPathValidationKey);
+  }, [
+    baseCategoryId,
+    baseChildrenByParentId,
+    controlledCategoryPath,
+    controlledCategoryPathKey,
+    controlledCategoryPathValidationKey,
+    handleCategoryPathChange,
+    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 = useMemo4(() => {
+    var _a2, _b2;
+    return (_b2 = (_a2 = sortedTopLevelCategories.find((c) => c.id === baseCategoryId)) == null ? void 0 : _a2.eventCount) != null ? _b2 : 0;
+  }, [baseCategoryId, sortedTopLevelCategories]);
+  const resolvedCategoryIds = useMemo4(() => {
+    if (!isDiscoveryFiltersEnabled) return categoryIds;
+    return resolveCategoryIdsFromPath(categoryPath, baseCategoryId ? [baseCategoryId] : void 0);
+  }, [baseCategoryId, categoryIds, categoryPath, isDiscoveryFiltersEnabled]);
+  const sortQueryParams = useMemo4(() => {
+    return resolveSortQueryParams(selectedSort);
+  }, [selectedSort]);
+  const activeTab = useMemo4(() => {
+    return resolvedTabs.find((tab) => tab.value === activeTabValue);
+  }, [activeTabValue, resolvedTabs]);
+  const venues = useMemo4(() => {
+    return resolveTabVenus(activeTab, visibleVenues);
+  }, [activeTab, visibleVenues]);
+  const matchStatus = useMemo4(() => {
+    return activeTabValue === "matched" ? activeTab == null ? void 0 : activeTab.matchStatus : void 0;
+  }, [activeTabValue, activeTab]);
+  const resolvedMaxVisibleItems = useMemo4(() => {
+    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 = useMemo4(() => {
+    if (search) return void 0;
+    const BUCKET_MINUTES = 5;
+    const bucket = /* @__PURE__ */ new Date();
+    bucket.setMinutes(Math.floor(bucket.getMinutes() / BUCKET_MINUTES) * BUCKET_MINUTES, 0, 0);
+    return bucket.toISOString();
+  }, [search]);
+  const {
+    events,
+    isLoading,
+    isError,
+    fetchNextPage,
+    hasNextPage,
+    isFetchingNextPage,
+    isPlaceholderData,
+    loadedPageCount
+  } = useVenueEvents({
+    queryKeyScope: "event-list",
+    venues,
+    search,
+    categoryIds: resolvedCategoryIds,
+    matchStatus,
+    limit: requestLimit,
+    status: [MarketStatus.open],
+    sortBy: sortQueryParams.sortBy,
+    sortDir: sortQueryParams.sortDir,
+    endDateFrom,
+    // Fold same-venue companion events into one tile per game when the sports
+    // markets experience is enabled (the sports event-detail view loads the
+    // folded companions via aggKey). Gated on the same flag as that view.
+    grouped: showSportsMarkets,
+    initialPages: initialLoadedPageCount,
+    enabled: controlledCategoryPath == null || validatedCategoryPathKey === controlledCategoryPathValidationKey
+  });
+  useEffect3(() => {
+    if (stateRef) {
+      stateRef.current = { venueTab: activeTabValue, loadedPageCount };
+    }
+  }, [stateRef, activeTabValue, loadedPageCount]);
+  const filteredEvents = useMemo4(() => {
+    return filterEventsByTabValue(events, activeTabValue);
+  }, [events, activeTabValue]);
+  const groupedEvents = useMemo4(() => {
+    return splitEventsByLifecycle(filteredEvents);
+  }, [filteredEvents]);
+  const orderedEvents = useMemo4(() => {
+    return groupedEvents.open;
+  }, [groupedEvents.open]);
+  const tileEvents = useMemo4(() => {
+    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 = useMemo4(() => {
+    return collectEventListVenueMarkets(tileEvents);
+  }, [tileEvents]);
+  const visibleMidpointVenueMarketIds = useMemo4(() => {
+    return collectMidpointVenueMarketIds(visibleVenueMarkets);
+  }, [visibleVenueMarkets]);
+  const { midpointRows: sharedMidpointRows, isLoading: isSharedMidpointsLoading } = useVenueMarketMidpoints2({
+    venueMarketIds: visibleMidpointVenueMarketIds,
+    enabled: visibleMidpointVenueMarketIds.length > 0
+  });
+  const shouldRenderLoadingState = isLoading && !isPlaceholderData && tileEvents.length === 0;
+  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 = useRef3(null);
+  useEffect3(() => {
+    if (!shouldPaginate) return;
+    if (!hasNextPage) return;
+    if (typeof IntersectionObserver === "undefined") return;
+    const target = loadMoreRef.current;
+    if (!target) return;
+    const observer = new IntersectionObserver(
+      (entries) => {
+        const entry = entries[0];
+        if (!(entry == null ? void 0 : entry.isIntersecting)) return;
+        if (isLoading || isFetchingNextPage || !hasNextPage) return;
+        void fetchNextPage();
+      },
+      {
+        rootMargin: "320px 0px"
+      }
+    );
+    observer.observe(target);
+    return () => {
+      observer.disconnect();
+    };
+  }, [fetchNextPage, hasNextPage, isFetchingNextPage, isLoading, shouldPaginate]);
+  const gridClassName = cn(
+    "grid grid-cols-[repeat(auto-fill,minmax(240px,1fr))] md:grid-cols-[repeat(auto-fill,minmax(360px,1fr))] gap-4"
+  );
+  const handleSelectAllCategories = () => {
+    handleCategoryPathChange([], { history: "push" });
+    setCollapsedCategoryIds(/* @__PURE__ */ new Set());
+    onCategoryRootChange == null ? void 0 : onCategoryRootChange(baseCategoryId != null ? baseCategoryId : void 0);
+    setIsSubcategoriesModalOpen(false);
+  };
+  const handleToggleSubcategory = ({
+    entry,
+    depth,
+    hasKnownChildren,
+    isExpanded,
+    isSelected
+  }) => {
+    handleCategoryPathChange([...categoryPath.slice(0, depth), entry], { history: "push" });
+    setCollapsedCategoryIds((prev) => {
+      const next = new Set(prev);
+      if (hasKnownChildren && isExpanded && isSelected) {
+        next.add(entry.id);
+        return next;
+      }
+      next.delete(entry.id);
+      return next;
+    });
+    onCategoryRootChange == null ? void 0 : onCategoryRootChange(baseCategoryId != null ? baseCategoryId : void 0);
+  };
+  if (shouldRenderLoadingState) {
+    return /* @__PURE__ */ jsx4(
+      Skeleton,
+      {
+        view: "event-list",
+        ariaLabel: labels.eventList.loading(title),
+        withSidebar: shouldRenderSubcategoryFilters
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs3("section", { className: "agg-event-list flex w-full flex-col gap-2 md:gap-5 t", children: [
+    /* @__PURE__ */ jsxs3(
+      "header",
+      {
+        className: cn(
+          "agg-event-list-header",
+          "flex flex-col w-full items-start justify-between",
+          "gap-2 sm:flex-row sm:items-center sm:gap-4"
+        ),
+        children: [
+          /* @__PURE__ */ jsx4("div", { className: "agg-event-list-title min-w-32", children: /* @__PURE__ */ jsx4(Typography, { as: "h2", variant: "title", className: "truncate first-letter:uppercase", children: title }) }),
+          /* @__PURE__ */ jsxs3("div", { className: "hidden min-w-0 max-w-full items-center gap-3 md:flex", children: [
+            /* @__PURE__ */ jsx4(
+              EventListTabs,
+              {
+                ariaLabel: labels.eventList.tabsAria(title),
+                className: "agg-event-list-tabs min-w-0 flex-1 max-w-[600px]!",
+                activeTab: activeTabValue,
+                onTabChange: handleActiveTabChange,
+                overflowBehavior: "scroll"
+              }
+            ),
+            /* @__PURE__ */ jsx4(
+              Select,
+              {
+                ariaLabel: labels.eventList.sortByLabel,
+                className: "min-w-[200px] w-auto! shrink-0",
+                value: selectedSort,
+                onChange: handleSelectedSortChange,
+                items: sortItems,
+                contentClassName: "py-2",
+                triggerClassName: "rounded-agg-lg!"
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs3("div", { className: "flex w-full gap-2 md:hidden mb-3", children: [
+      /* @__PURE__ */ jsx4(
+        EventListTabs,
+        {
+          ariaLabel: labels.eventList.tabsAria(title),
+          className: "agg-event-list-tabs min-w-0 flex-1",
+          activeTab: activeTabValue,
+          onTabChange: handleActiveTabChange,
+          overflowBehavior: "select"
+        }
+      ),
+      /* @__PURE__ */ jsx4(
+        Select,
+        {
+          ariaLabel: labels.eventList.sortByLabel,
+          className: "min-w-0 flex-1 md:min-w-[144px]",
+          value: selectedSort,
+          onChange: handleSelectedSortChange,
+          items: sortItems,
+          contentClassName: "rounded-[12px] py-2 shadow-[0_8px_16px_rgba(0,0,0,0.1)]"
+        }
+      ),
+      shouldRenderSubcategoryFilters ? /* @__PURE__ */ jsx4(
+        "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__ */ jsx4(Icon, { name: "apps", size: "small", color: "currentColor" })
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        className: cn("flex w-full gap-6", shouldRenderSubcategoryFilters ? "md:items-start" : ""),
+        children: [
+          shouldRenderSubcategoryFilters ? /* @__PURE__ */ jsx4("aside", { className: "hidden w-[200px] shrink-0 md:block self-start sticky top-4", children: /* @__PURE__ */ jsx4("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__ */ jsx4(
+            CategorySidebar,
+            {
+              baseCategoryId,
+              childrenByParentId,
+              categoryPath,
+              collapsedCategoryIds,
+              totalEventCount: baseCategoryEventCount,
+              labels: { subcategoriesAll: labels.eventList.subcategoriesAll },
+              onSelectAll: handleSelectAllCategories,
+              onToggleCategory: handleToggleSubcategory
+            }
+          ) }) }) : null,
+          /* @__PURE__ */ jsxs3(
+            "div",
+            {
+              className: cn(
+                "agg-event-list-grid",
+                "grid grid-cols-[repeat(auto-fill,minmax(240px,1fr))] md:grid-cols-[repeat(auto-fill,minmax(360px,1fr))] gap-4",
+                "w-full",
+                gridClassName
+              ),
+              children: [
+                isPlaceholderData ? Array.from({ length: placeholderSkeletonCount }).map((_, index) => /* @__PURE__ */ jsx4(
+                  EventListItem,
+                  {
+                    isLoading: true,
+                    classNames: {
+                      root: "agg-event-list-item w-full min-w-0! max-w-none justify-between!"
+                    }
+                  },
+                  `placeholder-${index}`
+                )) : null,
+                (isPlaceholderData ? [] : tileEvents).map((event) => /* @__PURE__ */ jsx4(
+                  EventListItem,
+                  {
+                    event,
+                    midpointRows: sharedMidpointRows,
+                    midpointsLoading: isSharedMidpointsLoading,
+                    classNames: {
+                      root: "agg-event-list-item w-full min-w-0! max-w-none justify-between!"
+                    },
+                    onEventClick,
+                    onMarketClick,
+                    getMarketHref,
+                    href: getEventHref == null ? void 0 : getEventHref(event),
+                    marketStatus: MarketStatus.open
+                  },
+                  event.id
+                )),
+                shouldRenderPaginationLoadingItems ? Array.from({ length: 6 }).map((_, index) => /* @__PURE__ */ jsx4(
+                  EventListItem,
+                  {
+                    isLoading: true,
+                    classNames: {
+                      root: "agg-event-list-item w-full min-w-0! max-w-none justify-between!"
+                    }
+                  },
+                  `loading-${index}`
+                )) : null,
+                shouldRenderEmptyState ? /* @__PURE__ */ jsx4("div", { className: "col-span-full w-full", children: /* @__PURE__ */ jsx4(
+                  StateMessage,
+                  {
+                    title: labels.eventList.emptyTitle,
+                    description: labels.eventList.emptyDescription,
+                    icon: /* @__PURE__ */ jsx4(Icon, { name: "search-empty" })
+                  }
+                ) }) : null,
+                isError ? /* @__PURE__ */ jsx4("div", { className: "col-span-full w-full", children: /* @__PURE__ */ jsx4(
+                  StateMessage,
+                  {
+                    title: labels.eventList.errorTitle,
+                    description: labels.eventList.errorDescription,
+                    icon: /* @__PURE__ */ jsx4(Icon, { name: "warning" })
+                  }
+                ) }) : null
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    shouldRenderSubcategoryFilters ? /* @__PURE__ */ jsx4(Modal, { open: isSubcategoriesModalOpen, onOpenChange: setIsSubcategoriesModalOpen, children: /* @__PURE__ */ jsx4(
+      Modal.Container,
+      {
+        classNames: {
+          // pointer-events-none lets clicks on the empty area above the panel pass through
+          // to Dialog.Overlay, which triggers Radix's outside-click dismiss.
+          content: "items-end p-0 pointer-events-none",
+          container: "w-full max-w-none border-0 bg-transparent shadow-none"
+        },
+        children: /* @__PURE__ */ jsxs3("div", { className: "pointer-events-auto w-full rounded-t-[12px] border border-agg-separator bg-agg-secondary", children: [
+          /* @__PURE__ */ jsx4("div", { className: "flex justify-center pb-1 pt-3", "aria-hidden": "true", children: /* @__PURE__ */ jsx4("div", { className: "h-1 w-10 rounded-full bg-agg-muted-foreground/30" }) }),
+          /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between px-4 pb-2 pt-1", children: [
+            /* @__PURE__ */ jsx4(Dialog.Title, { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: labels.eventList.subcategoriesLabel }),
+            /* @__PURE__ */ jsx4(
+              Dialog.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__ */ jsx4(CloseIcon, { className: "h-5 w-5" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx4("div", { className: "flex flex-col gap-1 px-4 pb-4", children: /* @__PURE__ */ jsx4(
+            CategorySidebar,
+            {
+              baseCategoryId,
+              childrenByParentId,
+              categoryPath,
+              collapsedCategoryIds,
+              totalEventCount: baseCategoryEventCount,
+              labels: { subcategoriesAll: labels.eventList.subcategoriesAll },
+              onSelectAll: handleSelectAllCategories,
+              onToggleCategory: handleToggleSubcategory
+            }
+          ) })
+        ] })
+      }
+    ) }) : null,
+    shouldPaginate && hasNextPage ? /* @__PURE__ */ jsx4("div", { ref: loadMoreRef, className: "agg-event-list-sentinel h-px w-full", "aria-hidden": true }) : null
+  ] });
+};
+EventList.displayName = "EventList";
+
+export {
+  EventListItem,
+  EventListItemV2,
+  DEFAULT_EVENTS_LIMIT,
+  DEFAULT_EVENT_LIST_SORT,
+  EVENT_LIST_SORT_VALUES,
+  useEventListTabs,
+  EventListTabs,
+  useEventListTabsHeaderOverflow,
+  EventList
+};