@agg-market/ui 4.0.0 → 6.0.0

package/dist/event-list-item-details.js

@@ -1,2254 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/events/item-details/index.tsx
-var item_details_exports = {};
-__export(item_details_exports, {
-  EventListItemDetails: () => EventListItemDetails
-});
-module.exports = __toCommonJS(item_details_exports);
-var import_react3 = require("react");
-var import_hooks13 = require("@agg-market/hooks");
-
-// src/primitives/badge/index.tsx
-var import_hooks = require("@agg-market/hooks");
-
-// src/shared/utils.ts
-var cn = (...values) => values.filter(Boolean).join(" ");
-var getMotionClassName = (enabled, ...values) => {
-  if (!enabled)
-    return void 0;
-  return cn(...values);
-};
-var toDate = (value) => {
-  if (!value)
-    return null;
-  if (value instanceof Date)
-    return value;
-  const parsed = new Date(value);
-  if (Number.isNaN(parsed.getTime()))
-    return null;
-  return parsed;
-};
-
-// src/primitives/badge/badge.constants.ts
-var badgeSizeClasses = {
-  small: cn("py-1.5 px-4 gap-1.5", "agg-type-label"),
-  medium: cn("py-1.5 px-4 gap-2", "agg-type-body"),
-  large: cn("py-2.5 px-6 gap-2", "agg-type-body")
-};
-var baseBadgeClasses = cn(
-  "inline-flex items-center justify-center rounded-agg-full font-agg-sans",
-  "bg-agg-secondary-hover text-agg-foreground whitespace-nowrap font-agg-normal"
-);
-
-// src/primitives/badge/index.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-function Badge({
-  text,
-  prefix,
-  suffix,
-  size = "medium",
-  classNames,
-  onClick,
-  isActive = false
-}) {
-  const { enableAnimations } = (0, import_hooks.useSdkUiConfig)();
-  const resolvedText = `${text}`;
-  const resolvedAriaLabel = resolvedText.length > 0 ? resolvedText : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-    "span",
-    __spreadProps(__spreadValues({
-      "aria-label": resolvedAriaLabel,
-      className: cn(
-        "group/agg-badge",
-        baseBadgeClasses,
-        badgeSizeClasses[size],
-        onClick ? "cursor-pointer hover:bg-agg-tertiary disabled:cursor-not-allowed" : "",
-        getMotionClassName(
-          enableAnimations,
-          "transition-[border-color,background-color] duration-200 ease-in-out"
-        ),
-        isActive ? "border-agg-primary bg-agg-secondary! font-agg-bold!" : "border-transparent font-agg-normal",
-        classNames == null ? void 0 : classNames.root
-      )
-    }, onClick && { onClick }), {
-      children: [
-        prefix ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: classNames == null ? void 0 : classNames.prefix, children: prefix }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: cn("truncate", classNames == null ? void 0 : classNames.text), children: text }),
-        suffix ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: classNames == null ? void 0 : classNames.suffix, children: suffix }) : null
-      ]
-    })
-  );
-}
-Badge.displayName = "Badge";
-
-// src/primitives/button/index.tsx
-var import_hooks2 = require("@agg-market/hooks");
-
-// src/primitives/icon/icon.constants.ts
-var iconSizeClasses = {
-  small: "h-4 w-4",
-  medium: "h-6 w-6",
-  large: "h-8 w-8"
-};
-
-// src/primitives/button/button.constants.ts
-var sizeClasses = {
-  small: cn("h-8 px-4 gap-1.5", "text-agg-sm leading-agg-5"),
-  medium: cn("h-9 px-5 gap-1.5", "text-agg-sm leading-agg-5"),
-  large: cn("h-10 px-6 gap-2", "text-agg-base leading-agg-6")
-};
-var iconSizeClasses2 = {
-  small: iconSizeClasses.small,
-  medium: iconSizeClasses.small,
-  large: iconSizeClasses.small
-};
-var iconSlotClasses = {
-  small: "[&_svg]:h-4 [&_svg]:w-4",
-  medium: "[&_svg]:h-4 [&_svg]:w-4",
-  large: "[&_svg]:h-4 [&_svg]:w-4"
-};
-var variantClasses = {
-  primary: cn(
-    "bg-agg-primary text-agg-on-primary",
-    "hover:bg-agg-primary-hover",
-    "disabled:bg-agg-separator disabled:text-agg-on-primary",
-    "focus-visible:ring-agg-primary-hover"
-  ),
-  secondary: cn(
-    "border border-agg-separator bg-agg-secondary text-agg-foreground",
-    "hover:bg-agg-secondary-hover",
-    "disabled:bg-agg-secondary disabled:text-agg-muted-foreground disabled:border-agg-separator",
-    "focus-visible:ring-agg-separator"
-  ),
-  tertiary: cn(
-    "bg-transparent text-agg-primary",
-    "hover:text-agg-primary-hover",
-    "disabled:bg-transparent disabled:text-agg-muted-foreground",
-    "focus-visible:ring-agg-separator",
-    "px-0! py-0! h-fit!"
-  )
-};
-var baseButtonClasses = cn(
-  "cursor-pointer disabled:cursor-not-allowed",
-  "inline-flex items-center justify-center rounded-agg-full font-agg-sans font-agg-bold text-center",
-  "whitespace-nowrap",
-  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-agg-secondary"
-);
-
-// src/primitives/button/index.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var Button = (_a) => {
-  var _b = _a, {
-    children,
-    variant = "primary",
-    size = "medium",
-    isLoading = false,
-    disabled,
-    prefix,
-    suffix,
-    type = "button",
-    className,
-    "aria-label": ariaLabel
-  } = _b, other = __objRest(_b, [
-    "children",
-    "variant",
-    "size",
-    "isLoading",
-    "disabled",
-    "prefix",
-    "suffix",
-    "type",
-    "className",
-    "aria-label"
-  ]);
-  const { enableAnimations } = (0, import_hooks2.useSdkUiConfig)();
-  const isDisabled = disabled || isLoading;
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    "button",
-    __spreadProps(__spreadValues({
-      type,
-      className: cn(
-        "group/agg-button",
-        baseButtonClasses,
-        getMotionClassName(enableAnimations, "transition-colors duration-200 ease-in-out"),
-        sizeClasses[size],
-        iconSlotClasses[size],
-        variantClasses[variant],
-        className
-      ),
-      disabled: isDisabled,
-      "aria-busy": isLoading,
-      "aria-label": ariaLabel
-    }, other), {
-      children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "span",
-        {
-          className: cn(
-            "inline-block rounded-agg-full border-2 border-current border-r-transparent",
-            getMotionClassName(enableAnimations, "animate-spin"),
-            iconSizeClasses2[size]
-          ),
-          "aria-hidden": "true"
-        }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-        prefix != null ? prefix : null,
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children }),
-        suffix != null ? suffix : null
-      ] })
-    })
-  );
-};
-Button.displayName = "Button";
-
-// src/primitives/chart/index.tsx
-var import_dayjs = __toESM(require("dayjs"));
-var import_hooks4 = require("@agg-market/hooks");
-var import_react2 = require("react");
-var import_liveline = require("liveline");
-
-// src/primitives/switch-button/index.tsx
-var import_react = require("react");
-var import_hooks3 = require("@agg-market/hooks");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var resolveActiveIndex = (options, value) => {
-  const activeIndex = options.findIndex((option) => option.value === value);
-  if (activeIndex >= 0)
-    return activeIndex;
-  return 0;
-};
-var resolveNextEnabledIndex = (options, currentIndex, direction) => {
-  if (options.length <= 1)
-    return currentIndex;
-  const step = direction === "next" ? 1 : -1;
-  for (let offset = 1; offset <= options.length; offset += 1) {
-    const candidateIndex = (currentIndex + step * offset + options.length) % options.length;
-    const candidate = options[candidateIndex];
-    if (candidate && !candidate.disabled) {
-      return candidateIndex;
-    }
-  }
-  return currentIndex;
-};
-var SwitchButton = ({
-  options,
-  value,
-  onValueChange,
-  ariaLabel,
-  className
-}) => {
-  const { enableAnimations } = (0, import_hooks3.useSdkUiConfig)();
-  const activeIndex = (0, import_react.useMemo)(() => {
-    return resolveActiveIndex(options, value);
-  }, [options, value]);
-  const [isAnimating, setIsAnimating] = (0, import_react.useState)(false);
-  const [lastAnimatedIndex, setLastAnimatedIndex] = (0, import_react.useState)(activeIndex);
-  (0, import_react.useEffect)(() => {
-    if (lastAnimatedIndex === activeIndex) {
-      return;
-    }
-    setLastAnimatedIndex(activeIndex);
-    if (!enableAnimations) {
-      setIsAnimating(false);
-      return;
-    }
-    setIsAnimating(true);
-    const timeoutId = window.setTimeout(() => {
-      setIsAnimating(false);
-    }, 350);
-    return () => {
-      window.clearTimeout(timeoutId);
-    };
-  }, [activeIndex, enableAnimations, lastAnimatedIndex]);
-  if (options.length === 0) {
-    return null;
-  }
-  const handleKeyDown = (event, optionIndex) => {
-    if ((event == null ? void 0 : event.key) !== "ArrowLeft" && (event == null ? void 0 : event.key) !== "ArrowRight") {
-      return;
-    }
-    event == null ? void 0 : event.preventDefault();
-    const nextOptionIndex = resolveNextEnabledIndex(
-      options,
-      optionIndex,
-      event.key === "ArrowRight" ? "next" : "previous"
-    );
-    const nextOption = options[nextOptionIndex];
-    if (!nextOption || nextOption.disabled) {
-      return;
-    }
-    onValueChange(nextOption.value);
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    "div",
-    {
-      className: cn(
-        "group/agg-switch",
-        "inline-flex min-w-0 rounded-agg-full bg-agg-secondary-hover font-agg-sans",
-        getMotionClassName(enableAnimations, "transition-background duration-200 ease-in-out"),
-        "cursor-pointer hover:bg-agg-tertiary",
-        className
-      ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-        "div",
-        {
-          className: "relative grid min-w-0 flex-1 items-center",
-          style: {
-            gridTemplateColumns: `repeat(${options.length}, minmax(0, 1fr))`
-          },
-          role: "tablist",
-          "aria-label": ariaLabel,
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-              "span",
-              {
-                className: cn(
-                  "pointer-events-none absolute inset-y-0 left-0 rounded-agg-full border-2 border-agg-primary bg-agg-secondary",
-                  getMotionClassName(
-                    enableAnimations,
-                    "transition-transform duration-500 ease-[cubic-bezier(0.77,0,0.175,1)]"
-                  )
-                ),
-                style: {
-                  width: `${100 / options.length}%`,
-                  transform: `translateX(${activeIndex * 100}%) scaleX(${isAnimating ? 1.08 : 1})`
-                },
-                "aria-hidden": "true"
-              }
-            ),
-            options.map((option, optionIndex) => {
-              var _a;
-              const isActive = optionIndex === activeIndex;
-              return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "button",
-                {
-                  type: "button",
-                  role: "tab",
-                  "aria-selected": isActive,
-                  "aria-label": (_a = option.ariaLabel) != null ? _a : void 0,
-                  tabIndex: isActive ? 0 : -1,
-                  disabled: option.disabled,
-                  className: cn(
-                    "relative z-10 min-w-0 rounded-agg-full px-5 py-1.5 font-agg-sans text-agg-base leading-agg-6 text-agg-foreground",
-                    getMotionClassName(
-                      enableAnimations,
-                      "transition-[colors] duration-200 ease-in-out"
-                    ),
-                    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary focus-visible:ring-offset-2 focus-visible:ring-offset-agg-secondary-hover",
-                    "cursor-pointer disabled:cursor-not-allowed disabled:text-agg-muted-foreground",
-                    isActive ? "font-agg-bold" : "font-agg-normal"
-                  ),
-                  onClick: (e) => {
-                    e.preventDefault();
-                    e.stopPropagation();
-                    if (option.disabled || isActive)
-                      return;
-                    onValueChange(option.value);
-                  },
-                  onKeyDown: (event) => {
-                    handleKeyDown(event, optionIndex);
-                  },
-                  children: option.label
-                },
-                option.value
-              );
-            })
-          ]
-        }
-      )
-    }
-  );
-};
-SwitchButton.displayName = "SwitchButton";
-
-// src/primitives/chart/index.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var normalizeSeries = (series) => {
-  return series.map((seriesItem) => {
-    const pointsByTime = /* @__PURE__ */ new Map();
-    seriesItem.points.forEach((point) => {
-      if (!Number.isFinite(point.time) || !Number.isFinite(point.value)) {
-        return;
-      }
-      pointsByTime.set(Math.floor(point.time), point.value);
-    });
-    const sortedPoints = [...pointsByTime.entries()].sort((left, right) => left[0] - right[0]).map(([time, value]) => ({
-      time,
-      value
-    }));
-    return __spreadProps(__spreadValues({}, seriesItem), {
-      points: sortedPoints
-    });
-  }).filter((seriesItem) => seriesItem.points.length > 0);
-};
-var defaultValueFormatter = (value) => {
-  return `${Math.round(value)}%`;
-};
-var resolveTimeFormatter = (windowSeconds) => {
-  return (timestamp) => {
-    if (!Number.isFinite(timestamp))
-      return "";
-    if (windowSeconds <= 48 * 60 * 60) {
-      return import_dayjs.default.unix(timestamp).format("HH:mm");
-    }
-    if (windowSeconds <= 14 * 24 * 60 * 60) {
-      return import_dayjs.default.unix(timestamp).format("MMM D HH:mm");
-    }
-    return import_dayjs.default.unix(timestamp).format("MMM D");
-  };
-};
-var toLivelinePoints = (points) => {
-  return points.map((point) => ({
-    time: point.time,
-    value: point.value
-  }));
-};
-var resolveWindowSeconds = (normalizedSeries) => {
-  const timestamps = normalizedSeries.flatMap(
-    (seriesItem) => seriesItem.points.map((point) => point.time)
-  );
-  if (timestamps.length <= 1)
-    return 30;
-  const minTimestamp = Math.min(...timestamps);
-  const maxTimestamp = Math.max(...timestamps);
-  const span = maxTimestamp - minTimestamp;
-  if (!Number.isFinite(span) || span <= 0)
-    return 30;
-  return Math.max(1, Math.floor(span));
-};
-var resolveLatestValue = (points) => {
-  const latestPoint = points[points.length - 1];
-  if (!latestPoint)
-    return 0;
-  return latestPoint.value;
-};
-var resolveActiveSeriesId = (series, activeSeriesId) => {
-  var _a, _b;
-  if (activeSeriesId) {
-    const matchingSeries = series.find((seriesItem) => seriesItem.id === activeSeriesId);
-    if (matchingSeries) {
-      return matchingSeries.id;
-    }
-  }
-  return (_b = (_a = series[0]) == null ? void 0 : _a.id) != null ? _b : "";
-};
-var formatDefaultSeriesLabel = (seriesItem) => {
-  return seriesItem.id.charAt(0).toUpperCase() + seriesItem.id.slice(1);
-};
-var renderDefaultSeriesControls = ({
-  series,
-  activeSeriesId,
-  handleSeriesChange,
-  defaultSeriesSwitchClassName,
-  seriesSwitchAriaLabel,
-  formatSeriesOptionAriaLabel
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    SwitchButton,
-    {
-      ariaLabel: seriesSwitchAriaLabel,
-      className: defaultSeriesSwitchClassName,
-      options: series.map((seriesItem) => ({
-        value: seriesItem.id,
-        label: formatDefaultSeriesLabel(seriesItem),
-        ariaLabel: formatSeriesOptionAriaLabel(formatDefaultSeriesLabel(seriesItem))
-      })),
-      value: activeSeriesId,
-      onValueChange: handleSeriesChange
-    }
-  );
-};
-var resolveSelectedSeries = (series, activeSeriesId) => {
-  const availableSeriesIds = new Set(series.map((seriesItem) => seriesItem.id));
-  if (!availableSeriesIds.has(activeSeriesId)) {
-    return series[0];
-  }
-  return series.find((seriesItem) => seriesItem.id === activeSeriesId);
-};
-var LineChart = ({
-  series,
-  height = 280,
-  width,
-  classNames,
-  isLoading = false,
-  showSeriesControls = true,
-  renderSeriesControls
-}) => {
-  var _a, _b;
-  const labels = (0, import_hooks4.useLabels)();
-  const { theme } = (0, import_hooks4.useSdkUiConfig)();
-  const normalizedSeries = (0, import_react2.useMemo)(() => {
-    return normalizeSeries(series);
-  }, [series]);
-  const [activeSeriesId, setActiveSeriesId] = (0, import_react2.useState)(
-    () => resolveActiveSeriesId(normalizedSeries, null)
-  );
-  (0, import_react2.useEffect)(() => {
-    setActiveSeriesId(
-      (currentActiveSeriesId) => resolveActiveSeriesId(normalizedSeries, currentActiveSeriesId)
-    );
-  }, [normalizedSeries]);
-  const livelineTheme = theme;
-  const handleSeriesChange = (seriesId) => {
-    setActiveSeriesId(seriesId);
-  };
-  const primarySeries = (0, import_react2.useMemo)(() => {
-    return resolveSelectedSeries(normalizedSeries, activeSeriesId);
-  }, [activeSeriesId, normalizedSeries]);
-  const primaryData = (0, import_react2.useMemo)(() => {
-    if (!primarySeries) {
-      return [];
-    }
-    return toLivelinePoints(primarySeries.points);
-  }, [primarySeries]);
-  const primaryValue = (0, import_react2.useMemo)(() => {
-    if (!primarySeries) {
-      return 0;
-    }
-    return resolveLatestValue(primarySeries.points);
-  }, [primarySeries]);
-  const livelineSeries = (0, import_react2.useMemo)(() => {
-    return normalizedSeries.map((seriesItem) => ({
-      id: seriesItem.id,
-      color: seriesItem.color,
-      data: toLivelinePoints(seriesItem.points),
-      value: resolveLatestValue(seriesItem.points)
-    }));
-  }, [normalizedSeries]);
-  const windowSeconds = (0, import_react2.useMemo)(() => {
-    return resolveWindowSeconds(normalizedSeries);
-  }, [normalizedSeries]);
-  const timeFormatter = (0, import_react2.useMemo)(() => {
-    return resolveTimeFormatter(windowSeconds);
-  }, [windowSeconds]);
-  const seriesControls = showSeriesControls && normalizedSeries.length > 0 ? (_a = renderSeriesControls == null ? void 0 : renderSeriesControls({
-    series: normalizedSeries,
-    activeSeriesId,
-    handleSeriesChange
-  })) != null ? _a : normalizedSeries.length > 1 ? renderDefaultSeriesControls({
-    series: normalizedSeries,
-    activeSeriesId,
-    handleSeriesChange,
-    defaultSeriesSwitchClassName: classNames == null ? void 0 : classNames.defaultSeriesSwitch,
-    seriesSwitchAriaLabel: labels.common.lineChartSeriesSwitchAria,
-    formatSeriesOptionAriaLabel: labels.common.lineChartSeriesOptionAria
-  }) : null : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: cn("group/agg-chart", "w-full", classNames == null ? void 0 : classNames.root), style: { width }, children: [
-    !isLoading && seriesControls ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: cn("mb-3", classNames == null ? void 0 : classNames.controls), children: seriesControls }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      "div",
-      {
-        className: cn(
-          "overflow-hidden [&>div:not(.agg-livechart):first-of-type]:hidden!",
-          classNames == null ? void 0 : classNames.chartViewport
-        ),
-        style: { height },
-        role: "img",
-        "aria-label": labels.common.lineChartAria,
-        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          import_liveline.Liveline,
-          {
-            className: cn("h-full w-full agg-livechart", classNames == null ? void 0 : classNames.liveline),
-            data: primaryData,
-            value: primaryValue,
-            series: livelineSeries,
-            color: (_b = primarySeries == null ? void 0 : primarySeries.color) != null ? _b : "var(--agg-color-primary)",
-            theme: livelineTheme,
-            grid: true,
-            momentum: false,
-            pulse: false,
-            window: windowSeconds,
-            formatValue: defaultValueFormatter,
-            formatTime: timeFormatter,
-            padding: {
-              top: 12,
-              right: 80,
-              bottom: 28,
-              left: 12
-            },
-            loading: isLoading
-          }
-        )
-      }
-    )
-  ] });
-};
-LineChart.displayName = "LineChart";
-
-// src/primitives/card/index.tsx
-var import_hooks5 = require("@agg-market/hooks");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var Card = (_a) => {
-  var _b = _a, { className, onClick } = _b, props = __objRest(_b, ["className", "onClick"]);
-  const { enableAnimations } = (0, import_hooks5.useSdkUiConfig)();
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    "div",
-    __spreadValues(__spreadValues({
-      className: cn(
-        "group/agg-card",
-        "flex w-full flex-col font-agg-sans",
-        "rounded-agg-xl border border-agg-separator",
-        "bg-agg-secondary text-agg-foreground shadow-agg-card",
-        getMotionClassName(
-          enableAnimations,
-          "transition-shadow hover:shadow-agg-card-hover duration-300 ease-in-out"
-        ),
-        className
-      )
-    }, onClick ? { onClick } : {}), props)
-  );
-};
-Card.displayName = "Card";
-
-// src/primitives/skeleton/views/event-list-skeleton-view.tsx
-var import_hooks8 = require("@agg-market/hooks");
-
-// src/primitives/skeleton/skeleton-block.tsx
-var import_hooks6 = require("@agg-market/hooks");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var SkeletonBlock = ({ className }) => {
-  const { enableAnimations } = (0, import_hooks6.useSdkUiConfig)();
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    "div",
-    {
-      "aria-hidden": true,
-      className: cn(
-        "bg-agg-separator",
-        getMotionClassName(enableAnimations, "animate-pulse"),
-        className
-      )
-    }
-  );
-};
-SkeletonBlock.displayName = "SkeletonBlock";
-
-// src/primitives/skeleton/views/event-list-item-skeleton-view.tsx
-var import_hooks7 = require("@agg-market/hooks");
-
-// src/events/item/event-list-item.constants.ts
-var baseCardClassName = "gap-3 overflow-hidden p-5 w-full";
-
-// src/primitives/skeleton/views/event-list-item-skeleton-view.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var EventListItemSkeletonView = ({
-  className,
-  ariaLabel,
-  isStandalone = false
-}) => {
-  const labels = (0, import_hooks7.useLabels)();
-  const outcomeTitleWidths = ["w-40", "w-[200px]"];
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-    Card,
-    {
-      className: cn("group/agg-skeleton", baseCardClassName, className),
-      role: isStandalone ? "status" : void 0,
-      "aria-label": isStandalone ? ariaLabel != null ? ariaLabel : labels.eventItem.loading : void 0,
-      "aria-busy": isStandalone || void 0,
-      "aria-hidden": isStandalone ? void 0 : true,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex h-14 w-full items-center gap-3 justify-stretch", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: "size-10! rounded-agg-lg" }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: "h-6 w-fit flex-1 rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex flex-col gap-3", children: outcomeTitleWidths.map((outcomeTitleWidth, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex w-full items-center justify-between gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: cn("h-5 rounded-agg-sm", outcomeTitleWidth) }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" })
-        ] }, index)) }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center justify-between gap-5 text-agg-muted-foreground", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: "h-5 w-[100px] rounded-agg-sm" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: "size-[14px] rounded-agg-sm" }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: "size-[14px] rounded-agg-sm" })
-            ] })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
-        ] })
-      ]
-    }
-  );
-};
-EventListItemSkeletonView.displayName = "EventListItemSkeletonView";
-
-// src/primitives/skeleton/views/event-list-skeleton-view.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var EventListSkeletonView = ({ className, ariaLabel }) => {
-  const labels = (0, import_hooks8.useLabels)();
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-    "section",
-    {
-      className: cn("group/agg-skeleton", "flex w-full flex-col gap-5", className),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : labels.eventList.loading("events"),
-      "aria-busy": true,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("header", { className: "flex w-full flex-col items-start justify-between gap-3 md:flex-row md:flex-nowrap md:items-center md:gap-5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SkeletonBlock, { className: "h-7 w-[120px] rounded-agg-md" }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SkeletonBlock, { className: "h-8 w-full rounded-agg-md md:w-[400px]" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "grid grid-cols-1 gap-5 md:grid-cols-3", children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-          EventListItemSkeletonView,
-          {
-            isStandalone: false,
-            className: "w-full min-w-0 max-w-none"
-          },
-          index
-        )) })
-      ]
-    }
-  );
-};
-EventListSkeletonView.displayName = "EventListSkeletonView";
-
-// src/primitives/skeleton/views/event-list-item-details-skeleton-view.tsx
-var import_hooks9 = require("@agg-market/hooks");
-
-// src/events/item-details/event-list-item-details.constants.ts
-var detailsBaseCardClassName = "w-full overflow-hidden gap-6 p-5 md:gap-8 md:p-10";
-var eventListItemDetailsTimeRanges = [
-  "1H",
-  "6H",
-  "1D",
-  "1W",
-  "1M",
-  "ALL"
-];
-var lineColorByVenue = {
-  polymarket: "#2e5cff",
-  kalshi: "#00d295",
-  probable: "#f05923",
-  opinion: "#020205"
-};
-var fallbackLineColors = ["#2e5cff", "#00d295", "#f05923", "#020205"];
-
-// src/primitives/skeleton/views/event-list-item-details-skeleton-view.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var EventListItemDetailsSkeletonView = ({
-  className,
-  ariaLabel
-}) => {
-  const labels = (0, import_hooks9.useLabels)();
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-    Card,
-    {
-      className: cn("group/agg-skeleton", detailsBaseCardClassName, className),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : labels.eventItemDetails.loading,
-      "aria-busy": true,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex h-14 w-full items-center gap-3 justify-stretch", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "size-10! rounded-agg-lg" }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-6 w-fit flex-1 rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex w-full flex-col gap-4 md:gap-6", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex w-full flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex max-w-full gap-2 overflow-hidden", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-9 w-full max-w-[221px] rounded-agg-full md:w-[221px]" })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-[220px] w-full rounded-agg-xl md:h-[240px]" }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-5 w-[59px] rounded-agg-sm" }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SkeletonBlock, { className: "h-5 w-40 rounded-agg-sm" })
-            ] })
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-EventListItemDetailsSkeletonView.displayName = "EventListItemDetailsSkeletonView";
-
-// src/primitives/skeleton/views/market-details-skeleton-view.tsx
-var import_hooks10 = require("@agg-market/hooks");
-
-// src/events/market-details/market-details.constants.ts
-var marketDetailsBaseCardClassName = "w-full overflow-hidden rounded-agg-lg border border-agg-separator bg-agg-secondary text-agg-foreground shadow-none hover:shadow-none";
-
-// src/primitives/skeleton/views/market-details-skeleton-view.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var orderBookAskBarWidths = [
-  "w-[52px] md:w-[240px]",
-  "w-[48px] md:w-[200px]",
-  "w-[40px] md:w-[120px]",
-  "w-[36px] md:w-[60px]"
-];
-var orderBookBidBarWidths = [
-  "w-[36px] md:w-[60px]",
-  "w-[40px] md:w-[120px]",
-  "w-[48px] md:w-[200px]",
-  "w-[52px] md:w-[240px]"
-];
-var MarketDetailsHeaderSkeleton = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-3 px-4 py-3 md:px-5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex min-w-0 items-center gap-3 md:min-w-52 md:gap-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "size-12 rounded-agg-lg md:size-[60px]" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex min-w-0 flex-col gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-6 w-[132px] rounded-agg-sm" }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-4 w-[141px] rounded-agg-sm" })
-      ] })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-9 w-[60px] rounded-agg-md" }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex w-full gap-2 md:w-auto", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-9 w-full rounded-agg-full md:w-[135px]" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-9 w-full rounded-agg-full md:w-[131px]" })
-    ] })
-  ] });
-};
-var MarketDetailsTabsSkeleton = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex h-14 items-end px-4 md:px-5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex h-full flex-col items-end justify-end rounded-t-agg-lg", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "px-4 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-6 w-20 rounded-agg-sm" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-[3px] w-full rounded-t-agg-sm" })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex h-full flex-col justify-center", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "px-4 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-6 w-12 rounded-agg-sm" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "h-[3px] w-full" })
-    ] })
-  ] });
-};
-var MarketDetailsOrderBookRows = ({
-  side,
-  barWidths
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex flex-col gap-2", children: barWidths.map((barWidthClassName, index) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-[52px_1fr_1fr_52px] items-center gap-2 md:grid-cols-[88px_1fr_1fr_minmax(120px,220px)] md:gap-6", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center gap-1 md:gap-3", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-5 rounded-agg-sm" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-5 rounded-agg-sm" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: cn("h-2 rounded-agg-full", barWidthClassName) }) })
-    ] }),
-    index < barWidths.length - 1 ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "h-px w-full bg-agg-separator" }) : null
-  ] }, `${side}-row-${index}`)) });
-};
-var MarketDetailsOderbookSkeleton = ({
-  className
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: cn("flex flex-col gap-5", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MarketDetailsOrderBookRows, { side: "ask", barWidths: orderBookAskBarWidths })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MarketDetailsOrderBookRows, { side: "bid", barWidths: orderBookBidBarWidths })
-    ] })
-  ] });
-};
-var MarketDetailsSkeletonView = ({
-  className,
-  ariaLabel,
-  isDetailed
-}) => {
-  const labels = (0, import_hooks10.useLabels)();
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
-    Card,
-    {
-      className: cn("group/agg-skeleton", marketDetailsBaseCardClassName, className),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : labels.marketDetails.loading,
-      "aria-busy": true,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MarketDetailsHeaderSkeleton, {}),
-        isDetailed ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "h-px w-full bg-agg-separator" }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MarketDetailsTabsSkeleton, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "h-px w-full bg-agg-separator" }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MarketDetailsOderbookSkeleton, { className: "p-5" })
-        ] }) : null
-      ]
-    }
-  );
-};
-MarketDetailsSkeletonView.displayName = "MarketDetailsSkeletonView";
-
-// src/primitives/skeleton/views/place-order-skeleton-view.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var placeOrderCardClassName = "overflow-hidden rounded-agg-xl border border-agg-border bg-agg-secondary shadow-none hover:shadow-none";
-var TabsSkeletonBar = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex w-full items-end border-b border-agg-border", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col rounded-t-agg-lg", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "px-5 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-6 w-10 rounded-agg-sm" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-[3px] w-full rounded-t-agg-sm" })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "px-5 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-6 w-10 rounded-agg-sm" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "h-[3px] w-full" })
-    ] })
-  ] });
-};
-var ContentBody = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: cn("flex flex-col gap-6 p-5"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex min-w-0 items-center gap-3", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "size-12 shrink-0 rounded-agg-lg" }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-4 w-[92%] max-w-[240px] rounded-agg-sm" }),
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-4 w-[64%] max-w-[160px] rounded-agg-sm" })
-        ] })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-6 w-[92px] rounded-agg-sm" }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(TabsSkeletonBar, {})
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex w-full gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-5 w-[63px] rounded-agg-sm" }),
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-4 w-[118px] rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { className: cn("text-agg-3xl font-agg-bold leading-agg-9 text-agg-separator"), children: "$0" })
-      ] })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-12 w-full rounded-agg-full" }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SkeletonBlock, { className: "h-4 w-full max-w-[240px] self-center rounded-agg-sm" })
-  ] });
-};
-var PlaceOrderSkeletonView = ({
-  className,
-  ariaLabel
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    "div",
-    {
-      className: cn("group/agg-skeleton", "w-full", className),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : "Loading place order",
-      "aria-busy": true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex w-full items-end justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Card, { className: cn(placeOrderCardClassName, "w-full"), children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ContentBody, {}) }) })
-    }
-  );
-};
-PlaceOrderSkeletonView.displayName = "PlaceOrderSkeletonView";
-
-// src/primitives/skeleton/views/settlement-skeleton-view.tsx
-var import_hooks11 = require("@agg-market/hooks");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var SettlementSkeletonView = ({
-  className,
-  ariaLabel
-}) => {
-  const labels = (0, import_hooks11.useLabels)();
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-    Card,
-    {
-      className: cn(
-        "group/agg-skeleton",
-        "flex flex-col w-full gap-5 rounded-agg-xl border border-agg-separator bg-agg-secondary p-5 shadow-none hover:shadow-none",
-        className
-      ),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : labels.trading.settlementLoading,
-      "aria-busy": true,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex w-full items-center justify-between gap-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "h-4 w-[81px] rounded-agg-sm" }),
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "h-5 w-full max-w-[240px] rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "h-5 w-[200px] rounded-agg-sm" }),
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "h-4 w-full max-w-[320px] rounded-agg-sm" }),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "h-4 w-full max-w-[280px] rounded-agg-sm" })
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "h-px w-full bg-agg-separator" }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "h-5 w-[100px] rounded-agg-sm" })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-SettlementSkeletonView.displayName = "SettlementSkeletonView";
-
-// src/primitives/skeleton/skeleton.types.ts
-var skeletonViews = {
-  eventListItem: "event-list-item",
-  eventListItemDetails: "event-list-item-details",
-  marketDetailsMinified: "market-details-minified",
-  marketDetailsDetailed: "market-details-detailed",
-  eventList: "event-list",
-  settlement: "settlement",
-  placeOrder: "place-order"
-};
-
-// src/primitives/skeleton/index.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var Skeleton = ({ view, className, ariaLabel }) => {
-  if (view === skeletonViews.eventListItem) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(EventListItemSkeletonView, { className, ariaLabel, isStandalone: true });
-  }
-  if (view === skeletonViews.eventListItemDetails) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(EventListItemDetailsSkeletonView, { className, ariaLabel });
-  }
-  if (view === skeletonViews.marketDetailsMinified) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MarketDetailsSkeletonView, { className, ariaLabel, isDetailed: false });
-  }
-  if (view === skeletonViews.marketDetailsDetailed) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MarketDetailsSkeletonView, { className, ariaLabel, isDetailed: true });
-  }
-  if (view === skeletonViews.settlement) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SettlementSkeletonView, { className, ariaLabel });
-  }
-  if (view === skeletonViews.placeOrder) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PlaceOrderSkeletonView, { className, ariaLabel });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(EventListSkeletonView, { className, ariaLabel });
-};
-Skeleton.displayName = "Skeleton";
-
-// src/primitives/typography/typography.constants.ts
-var typographyVariantClasses = {
-  display: cn("agg-type-display"),
-  heading: cn("agg-type-heading"),
-  title: cn("agg-type-title"),
-  "title-strong": cn("agg-type-title-strong"),
-  "body-large": cn("agg-type-body-large"),
-  "body-large-strong": cn("agg-type-body-large-strong"),
-  body: cn("agg-type-body"),
-  "body-strong": cn("agg-type-body-strong"),
-  label: cn("agg-type-label"),
-  "label-strong": cn("agg-type-label-strong"),
-  "label-caps": cn("agg-type-label-caps"),
-  caption: cn("agg-type-caption"),
-  "caption-strong": cn("agg-type-caption-strong"),
-  "caption-caps": cn("agg-type-caption-caps"),
-  overline: cn("agg-type-overline")
-};
-
-// src/primitives/typography/index.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var Typography = ({
-  as: Component = "p",
-  variant = "body",
-  className,
-  children
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-    Component,
-    {
-      className: cn(
-        "group/agg-typography",
-        "text-agg-foreground",
-        typographyVariantClasses[variant],
-        className
-      ),
-      children
-    }
-  );
-};
-Typography.displayName = "Typography";
-
-// src/primitives/venue-logo/index.tsx
-var import_hooks12 = require("@agg-market/hooks");
-
-// src/primitives/icon/types.ts
-var getIconA11yProps = (title) => ({
-  role: title ? "img" : "presentation",
-  "aria-hidden": title ? void 0 : true
-});
-
-// src/primitives/venue-logo/logo-props.ts
-var DEFAULT_MONOCHROME_COLOR = "currentColor";
-var resolveLogoPrimaryColor = ({
-  brandColor,
-  isColor = true,
-  color
-}) => {
-  if (typeof color === "string" && color.trim())
-    return color;
-  if (!isColor)
-    return DEFAULT_MONOCHROME_COLOR;
-  return brandColor;
-};
-
-// src/primitives/venue-logo/svg/logo-kalshi.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var KALSHI_GREEN = "#18C590";
-var LogoKalshiIcon = (_a) => {
-  var _b = _a, {
-    title,
-    className,
-    isColor = true,
-    color
-  } = _b, props = __objRest(_b, [
-    "title",
-    "className",
-    "isColor",
-    "color"
-  ]);
-  const primaryColor = resolveLogoPrimaryColor({
-    brandColor: KALSHI_GREEN,
-    isColor,
-    color
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
-    "svg",
-    __spreadProps(__spreadValues(__spreadValues({
-      viewBox: "0 0 100 100",
-      className,
-      fill: "none"
-    }, getIconA11yProps(title)), props), {
-      children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("title", { children: title }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-          "path",
-          {
-            d: "M54.9798 47.579L79.4249 85.9995H58.2273L38.2531 52.9344V85.9995H20.4189V13.9995H38.2531V45.4356L59.6547 13.9995H78.7119L54.9798 47.579Z",
-            fill: primaryColor
-          }
-        )
-      ]
-    })
-  );
-};
-LogoKalshiIcon.displayName = "LogoKalshiIcon";
-
-// src/primitives/venue-logo/svg/logo-opinion.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
-var OPINION_BLACK = "#000000";
-var LogoOpinionIcon = (_a) => {
-  var _b = _a, {
-    title,
-    className,
-    isColor = true,
-    color
-  } = _b, props = __objRest(_b, [
-    "title",
-    "className",
-    "isColor",
-    "color"
-  ]);
-  const primaryColor = resolveLogoPrimaryColor({
-    brandColor: OPINION_BLACK,
-    isColor,
-    color
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
-    "svg",
-    __spreadProps(__spreadValues(__spreadValues({
-      viewBox: "0 0 100 100",
-      className,
-      fill: "none"
-    }, getIconA11yProps(title)), props), {
-      children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("title", { children: title }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-          "path",
-          {
-            d: "M51.8239 68.4603L56.9659 68.0094L58.8049 89.0576C61.1459 88.5314 63.4349 87.7952 65.6437 86.8578V68.1879H71.9955V83.4385C74.6496 81.6828 77.0863 79.619 79.2548 77.2898L80.0716 67.958L85.516 68.433C88.6185 62.4381 90.156 55.7558 89.9858 49.0072C89.8154 42.2584 87.9429 35.6623 84.542 29.8316L84.3394 32.1494L77.9876 31.5927L78.8042 22.2668C76.7468 20.1288 74.4594 18.225 71.9835 16.5902V31.9164H65.6317V13.1739C62.9224 12.0205 60.0929 11.173 57.1957 10.6473L59.0317 31.6441L53.8897 32.0949L51.9599 10.0482C51.3128 10.0179 50.6593 9.99976 50.006 9.99976C47.4581 9.99976 44.9161 10.2419 42.414 10.723L46.0438 31.3899L42.1297 32.0798L38.5304 11.6701C35.1755 12.6725 31.9677 14.1143 28.9905 15.9578L33.0435 31.0873L29.9705 31.9134L26.2018 17.8369C23.2938 19.9923 20.6902 22.5308 18.4615 25.3835L20.4246 30.7787L18.1833 31.5956L16.7707 27.7134C14.5111 31.0771 12.7772 34.7657 11.6287 38.652L12.2639 38.4221L20.4306 60.8471L18.1893 61.6641L10.8877 41.5963C9.21542 49.4012 9.91256 57.528 12.8896 64.9338C15.8667 72.3395 20.9879 78.6865 27.5961 83.1601L23.8031 68.9989L26.8762 68.1728L31.5162 85.4991C34.6952 87.1593 38.0844 88.3808 41.5914 89.1303L38.0132 68.7296L41.9301 68.0397L45.7684 89.8262C47.1811 89.9757 48.6007 90.0505 50.0212 90.0502C51.2583 90.0502 52.4863 89.9926 53.6963 89.8807L51.8239 68.4603ZM80.1017 37.8985L86.4385 38.4524L84.3605 62.2299L78.0087 61.6761L80.1017 37.8985ZM65.6528 38.1315H72.0046V61.9969H65.6528V38.1315ZM56.975 37.9501L59.053 61.7277L53.911 62.1785L51.8299 38.4009L56.975 37.9501ZM29.9976 62.003L23.8243 38.9486L26.8974 38.1255L33.0707 61.1649L29.9976 62.003ZM42.157 62.1603L38.0132 38.658L41.9301 37.9683L46.0709 61.4674L42.157 62.1603Z",
-            fill: primaryColor
-          }
-        )
-      ]
-    })
-  );
-};
-LogoOpinionIcon.displayName = "LogoOpinionIcon";
-
-// src/primitives/venue-logo/svg/logo-polymarket.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var POLYMARKET_BLUE = "#2E5CFF";
-var LogoPolymarketIcon = (_a) => {
-  var _b = _a, {
-    title,
-    className,
-    isColor = true,
-    color
-  } = _b, props = __objRest(_b, [
-    "title",
-    "className",
-    "isColor",
-    "color"
-  ]);
-  const primaryColor = resolveLogoPrimaryColor({
-    brandColor: POLYMARKET_BLUE,
-    isColor,
-    color
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-    "svg",
-    __spreadProps(__spreadValues(__spreadValues({
-      viewBox: "0 0 100 100",
-      className,
-      fill: "none"
-    }, getIconA11yProps(title)), props), {
-      children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("title", { children: title }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-          "path",
-          {
-            d: "M81.0904 84.2882C81.0904 87.9246 81.0904 89.7428 79.901 90.644C78.7119 91.5456 76.9613 91.0542 73.4603 90.0717L17.1975 74.2838C15.0881 73.6919 14.0332 73.3959 13.4233 72.5913C12.8135 71.7866 12.8135 70.6911 12.8135 68.5002V31.4998C12.8135 29.309 12.8135 28.2134 13.4233 27.4088C14.0332 26.6042 15.0881 26.3081 17.1975 25.7163L73.4603 9.92806C76.9613 8.94572 78.7119 8.45448 79.901 9.35587C81.0904 10.2573 81.0904 12.0755 81.0904 15.7119V84.2882ZM26.8451 69.1363L73.4308 82.2104V56.0637L26.8451 69.1363ZM20.4723 63.0711L67.0487 50L20.4723 36.929V63.0711ZM26.8446 30.8638L73.4308 43.9366V17.7896L26.8446 30.8638Z",
-            fill: primaryColor
-          }
-        )
-      ]
-    })
-  );
-};
-LogoPolymarketIcon.displayName = "LogoPolymarketIcon";
-
-// src/primitives/venue-logo/svg/logo-probable.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var PROBABLE_ORANGE = "#F05923";
-var LogoProbableIcon = (_a) => {
-  var _b = _a, {
-    title,
-    className,
-    isColor = true,
-    color
-  } = _b, props = __objRest(_b, [
-    "title",
-    "className",
-    "isColor",
-    "color"
-  ]);
-  const primaryColor = resolveLogoPrimaryColor({
-    brandColor: PROBABLE_ORANGE,
-    isColor,
-    color
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
-    "svg",
-    __spreadProps(__spreadValues(__spreadValues({
-      viewBox: "0 0 100 100",
-      className,
-      fill: "none"
-    }, getIconA11yProps(title)), props), {
-      children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("title", { children: title }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-          "path",
-          {
-            d: "M75.625 59.3489C75.6247 53.7323 71.0719 49.1792 65.4551 49.179H33.9209C28.3039 49.179 23.7503 53.7321 23.75 59.3489C23.75 64.9659 28.3038 69.5198 33.9209 69.5198H65.4551C71.0719 69.5195 75.625 64.9658 75.625 59.3489ZM90.625 59.3489C90.625 73.2501 79.3562 84.5195 65.4551 84.5198H33.9209C20.0196 84.5198 8.75 73.2502 8.75 59.3489C8.75026 45.4477 20.0198 34.179 33.9209 34.179H65.4551C79.3559 34.1792 90.6247 45.4478 90.625 59.3489Z",
-            fill: primaryColor
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "M90.9329 15.4546V30.4546H8.90234V15.4546H90.9329Z", fill: primaryColor }),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-          "path",
-          {
-            d: "M64.5742 51.3496C68.9894 51.3496 72.5742 54.9344 72.5742 59.3496C72.5742 63.7648 68.9894 67.3496 64.5742 67.3496C60.159 67.3496 56.5742 63.7648 56.5742 59.3496C56.5742 54.9344 60.159 51.3496 64.5742 51.3496Z",
-            fill: primaryColor
-          }
-        )
-      ]
-    })
-  );
-};
-LogoProbableIcon.displayName = "LogoProbableIcon";
-
-// src/primitives/venue-logo/venue-logo.constants.ts
-var venueLogoRegistry = {
-  kalshi: LogoKalshiIcon,
-  polymarket: LogoPolymarketIcon,
-  opinion: LogoOpinionIcon,
-  probable: LogoProbableIcon
-};
-var VENUE_LOGO_BASE_URL = "https://assets.snagsolutions.io/public/prediction-markets/logos";
-var venueLogoUrlRegistry = {
-  kalshi: `${VENUE_LOGO_BASE_URL}/kalshi.png`,
-  polymarket: `${VENUE_LOGO_BASE_URL}/polymarket.png`,
-  opinion: `${VENUE_LOGO_BASE_URL}/opinion.png`,
-  probable: `${VENUE_LOGO_BASE_URL}/probable.png`
-};
-var venueLogoNames = Object.keys(venueLogoRegistry);
-var sizeClasses2 = {
-  small: "h-4 w-4",
-  medium: "h-6 w-6",
-  large: "h-8 w-8"
-};
-
-// src/primitives/venue-logo/index.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var VenueLogo = ({
-  venue,
-  variant = "icon",
-  isColor = true,
-  isMonochromatic = false,
-  color,
-  size = "medium",
-  className,
-  ariaLabel,
-  title
-}) => {
-  const labels = (0, import_hooks12.useLabels)();
-  const sizeClass = sizeClasses2[size];
-  const resolvedLabel = ariaLabel != null ? ariaLabel : labels.venues[venue];
-  if (variant === "logo") {
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-      "img",
-      {
-        src: venueLogoUrlRegistry[venue],
-        alt: resolvedLabel,
-        title,
-        className: cn("shrink-0 rounded-agg-lg object-cover", sizeClass, className)
-      }
-    );
-  }
-  const Component = venueLogoRegistry[venue];
-  const resolvedIsColor = isMonochromatic ? false : isColor;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-    Component,
-    {
-      className: cn("group/agg-venue-logo", "shrink-0", sizeClass, className),
-      isColor: resolvedIsColor,
-      color,
-      "aria-label": resolvedLabel,
-      title
-    }
-  );
-};
-VenueLogo.displayName = "VenueLogo";
-
-// src/events/item/event-list-item.utils.ts
-var resolveEventListItemEvent = (fetchedEvent) => {
-  if (!fetchedEvent)
-    return void 0;
-  const mergedVenueMarkets = fetchedEvent.markets.flatMap(
-    (market) => market.venueMarkets
-  );
-  if (mergedVenueMarkets.length === 0)
-    return void 0;
-  return fetchedEvent;
-};
-var normalizeProbability = (value) => {
-  if (typeof value !== "number" || !Number.isFinite(value))
-    return void 0;
-  if (value < 0)
-    return 0;
-  if (value > 1)
-    return 1;
-  return value;
-};
-var hasDateLabel = (outcome) => {
-  return !!toDate(outcome.label);
-};
-var sortOutcomes = (outcomes) => {
-  if (outcomes.length <= 1)
-    return outcomes;
-  const now = Date.now();
-  if (outcomes.some(hasDateLabel)) {
-    return [...outcomes].sort((a, b) => {
-      var _a, _b, _c, _d;
-      const aDate = (_b = (_a = toDate(a.label)) == null ? void 0 : _a.getTime()) != null ? _b : 0;
-      const bDate = (_d = (_c = toDate(b.label)) == null ? void 0 : _c.getTime()) != null ? _d : 0;
-      return Math.abs(aDate - now) - Math.abs(bDate - now);
-    });
-  }
-  return [...outcomes].sort((a, b) => {
-    var _a, _b;
-    const aPrice = (_a = normalizeProbability(a.price)) != null ? _a : 0;
-    const bPrice = (_b = normalizeProbability(b.price)) != null ? _b : 0;
-    return bPrice - aPrice;
-  });
-};
-var resolveOutcomeTitle = (outcome) => {
-  if (outcome.title && outcome.title.trim())
-    return outcome.title;
-  return outcome.label;
-};
-var selectPrimaryVenueMarket = (venueMarkets) => {
-  if (venueMarkets.length === 0)
-    return void 0;
-  if (venueMarkets.length === 1)
-    return venueMarkets[0];
-  return [...venueMarkets].sort((a, b) => {
-    const aVolume = typeof a.volume === "number" ? a.volume : -1;
-    const bVolume = typeof b.volume === "number" ? b.volume : -1;
-    return bVolume - aVolume;
-  })[0];
-};
-var resolveTileTitle = (event, primaryVenueMarket, titleOverride) => {
-  if (typeof titleOverride === "string" && titleOverride.trim()) {
-    return titleOverride;
-  }
-  if (typeof (primaryVenueMarket == null ? void 0 : primaryVenueMarket.question) === "string" && primaryVenueMarket.question.trim()) {
-    return primaryVenueMarket.question;
-  }
-  return event.title;
-};
-var resolveTileImage = (event, primaryVenueMarket, imageOverride) => {
-  if (typeof imageOverride === "string" && imageOverride.trim()) {
-    return imageOverride;
-  }
-  if (typeof (primaryVenueMarket == null ? void 0 : primaryVenueMarket.image) === "string" && primaryVenueMarket.image.trim()) {
-    return primaryVenueMarket.image;
-  }
-  if (typeof event.image === "string" && event.image.trim()) {
-    return event.image;
-  }
-  return void 0;
-};
-var resolveVenueLabel = (venue, venueInfo, labels) => {
-  var _a, _b;
-  if (!venue)
-    return labels.eventItem.venueSingular;
-  return (_b = (_a = venueInfo == null ? void 0 : venueInfo[venue]) == null ? void 0 : _a.label) != null ? _b : labels.venues[venue];
-};
-
-// src/events/item-details/event-list-item-details.utils.ts
-var import_dayjs2 = __toESM(require("dayjs"));
-var normalizeLabel = (value) => {
-  return value.trim().toLowerCase();
-};
-var isDateLikeLabel = (value) => {
-  if (!value.trim())
-    return false;
-  return (0, import_dayjs2.default)(value).isValid();
-};
-var formatDateLabel = (value) => {
-  if (!isDateLikeLabel(value))
-    return value;
-  return (0, import_dayjs2.default)(value).format("MMM D, YYYY");
-};
-var getDefaultSelectedTimeRange = (value) => {
-  if (!value)
-    return "1M";
-  return value;
-};
-var getTimeWindowByRange = (range) => {
-  const endTs = (0, import_dayjs2.default)().unix();
-  if (range === "1H") {
-    return {
-      startTs: import_dayjs2.default.unix(endTs).subtract(1, "hour").unix(),
-      endTs,
-      intervalMinutes: 5
-    };
-  }
-  if (range === "6H") {
-    return {
-      startTs: import_dayjs2.default.unix(endTs).subtract(6, "hour").unix(),
-      endTs,
-      intervalMinutes: 15
-    };
-  }
-  if (range === "1D") {
-    return {
-      startTs: import_dayjs2.default.unix(endTs).subtract(1, "day").unix(),
-      endTs,
-      intervalMinutes: 30
-    };
-  }
-  if (range === "1W") {
-    return {
-      startTs: import_dayjs2.default.unix(endTs).subtract(7, "day").unix(),
-      endTs,
-      intervalMinutes: 60
-    };
-  }
-  if (range === "1M") {
-    return {
-      startTs: import_dayjs2.default.unix(endTs).subtract(1, "month").unix(),
-      endTs,
-      intervalMinutes: 240
-    };
-  }
-  return {
-    startTs: import_dayjs2.default.unix(endTs).subtract(6, "month").unix(),
-    endTs,
-    intervalMinutes: 720
-  };
-};
-var resolveOutcomeLabels = (venueMarkets) => {
-  var _a;
-  const primaryMarket = selectPrimaryVenueMarket(venueMarkets);
-  const initialLabels = ((_a = primaryMarket == null ? void 0 : primaryMarket.venueMarketOutcomes) != null ? _a : []).map(
-    (outcome) => resolveOutcomeTitle(outcome)
-  );
-  const labels = new Set(initialLabels);
-  venueMarkets.forEach((market) => {
-    sortOutcomes(market.venueMarketOutcomes).forEach((outcome) => {
-      labels.add(resolveOutcomeTitle(outcome));
-    });
-  });
-  return [...labels];
-};
-var resolveDefaultOutcomeLabel = (outcomeLabels) => {
-  return outcomeLabels[0];
-};
-var matchOutcomeByLabel = (outcome, selectedOutcomeLabel) => {
-  const normalizedSelectedLabel = normalizeLabel(selectedOutcomeLabel);
-  const resolvedTitle = resolveOutcomeTitle(outcome);
-  return normalizeLabel(resolvedTitle) === normalizedSelectedLabel || normalizeLabel(outcome.label) === normalizedSelectedLabel;
-};
-var resolveOutcomesByVenue = (venueMarkets, selectedOutcomeLabel) => {
-  return venueMarkets.map((market) => {
-    const matchedOutcome = sortOutcomes(market.venueMarketOutcomes).find((outcome) => {
-      return matchOutcomeByLabel(outcome, selectedOutcomeLabel);
-    });
-    if (!matchedOutcome)
-      return null;
-    return {
-      venue: market.venue,
-      market,
-      outcome: matchedOutcome
-    };
-  }).filter((item) => item != null);
-};
-var buildPriceHistoryGroups = (selectedOutcomes, fallbackMarketId) => {
-  const marketIdByVenue = /* @__PURE__ */ new Map();
-  selectedOutcomes.forEach(({ venue, market }) => {
-    var _a, _b;
-    const marketWithCanonicalId = market;
-    const canonicalMarketId = (_a = marketWithCanonicalId.marketId) != null ? _a : fallbackMarketId;
-    if (!canonicalMarketId)
-      return;
-    if (!marketIdByVenue.has(venue)) {
-      marketIdByVenue.set(venue, /* @__PURE__ */ new Set());
-    }
-    (_b = marketIdByVenue.get(venue)) == null ? void 0 : _b.add(canonicalMarketId);
-  });
-  return [...marketIdByVenue.entries()].map(([venue, marketIds]) => ({
-    venue,
-    venueMarketOutcomeIds: [...marketIds]
-  })).filter((group) => group.venueMarketOutcomeIds.length > 0);
-};
-var resolveSeriesColor = (venue, index) => {
-  var _a;
-  const colorFromVenue = lineColorByVenue[venue];
-  if (colorFromVenue)
-    return colorFromVenue;
-  return (_a = fallbackLineColors[index % fallbackLineColors.length]) != null ? _a : "#2e5cff";
-};
-
-// src/events/item-details/index.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var EventListItemDetailsLoadingState = ({
-  classNames,
-  ariaLabel
-}) => {
-  const labels = (0, import_hooks13.useLabels)();
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    Skeleton,
-    {
-      view: "event-list-item-details",
-      className: classNames == null ? void 0 : classNames.root,
-      ariaLabel: ariaLabel != null ? ariaLabel : labels.eventItemDetails.loading
-    }
-  );
-};
-var EventListItemDetailsUnavailableState = ({
-  classNames,
-  ariaLabel
-}) => {
-  const labels = (0, import_hooks13.useLabels)();
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    Card,
-    {
-      className: cn(detailsBaseCardClassName, classNames == null ? void 0 : classNames.root),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : labels.eventItemDetails.unavailableAria,
-      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: cn("flex flex-col gap-1", classNames == null ? void 0 : classNames.header), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "body-large-strong", className: cn("truncate", classNames == null ? void 0 : classNames.title), children: labels.eventItemDetails.unavailableTitle }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "body", className: "text-agg-muted-foreground", children: labels.eventItemDetails.unavailableDescription })
-      ] })
-    }
-  );
-};
-var probabilityModeOrder = ["yes", "no"];
-var clampProbability = (value) => {
-  if (value < 0)
-    return 0;
-  if (value > 1)
-    return 1;
-  return value;
-};
-var resolveAverageProbability = (values) => {
-  const validValues = values.filter((value) => value != null);
-  if (validValues.length === 0)
-    return void 0;
-  return validValues.reduce((sum, value) => sum + value, 0) / validValues.length;
-};
-var resolveOutcomeCandidateIds = (market, outcome) => {
-  var _a, _b;
-  const marketWithCanonicalId = market;
-  return [
-    outcome.id,
-    (_a = outcome.externalIdentifier) != null ? _a : void 0,
-    market.externalIdentifier,
-    (_b = marketWithCanonicalId.marketId) != null ? _b : void 0
-  ].filter((value) => typeof value === "string" && value.trim().length > 0);
-};
-var EventListItemDetailsGraphSection = ({
-  venueMarkets,
-  canonicalMarketId,
-  selectedOutcomeLabel,
-  onSelectedOutcomeLabelChange,
-  switchLabels,
-  isDateOutcomeMarket,
-  classNames,
-  showVenueLogo,
-  venueInfo,
-  formatPercent,
-  selectedTimeRange
-}) => {
-  const labels = (0, import_hooks13.useLabels)();
-  const [selectedVenue, setSelectedVenue] = (0, import_react3.useState)(null);
-  const [activeProbabilityMode, setActiveProbabilityMode] = (0, import_react3.useState)("yes");
-  const probabilityModeConfigs = (0, import_react3.useMemo)(() => {
-    if (isDateOutcomeMarket) {
-      return {
-        yes: {
-          switchLabel: switchLabels[0],
-          sourceOutcomeLabel: selectedOutcomeLabel,
-          transformProbability: (value) => value
-        },
-        no: {
-          switchLabel: switchLabels[1],
-          sourceOutcomeLabel: selectedOutcomeLabel,
-          transformProbability: (value) => 1 - value
-        }
-      };
-    }
-    return {
-      yes: {
-        switchLabel: switchLabels[0],
-        sourceOutcomeLabel: switchLabels[0],
-        transformProbability: (value) => value
-      },
-      no: {
-        switchLabel: switchLabels[1],
-        sourceOutcomeLabel: switchLabels[1],
-        transformProbability: (value) => value
-      }
-    };
-  }, [isDateOutcomeMarket, selectedOutcomeLabel, switchLabels]);
-  const selectedOutcomesByMode = (0, import_react3.useMemo)(() => {
-    return {
-      yes: resolveOutcomesByVenue(venueMarkets, probabilityModeConfigs.yes.sourceOutcomeLabel),
-      no: resolveOutcomesByVenue(venueMarkets, probabilityModeConfigs.no.sourceOutcomeLabel)
-    };
-  }, [
-    probabilityModeConfigs.no.sourceOutcomeLabel,
-    probabilityModeConfigs.yes.sourceOutcomeLabel,
-    venueMarkets
-  ]);
-  (0, import_react3.useEffect)(() => {
-    if (isDateOutcomeMarket) {
-      return;
-    }
-    const nextMode = selectedOutcomeLabel === probabilityModeConfigs.no.sourceOutcomeLabel ? "no" : "yes";
-    setActiveProbabilityMode(nextMode);
-  }, [isDateOutcomeMarket, probabilityModeConfigs.no.sourceOutcomeLabel, selectedOutcomeLabel]);
-  const normalizedVenueDataByMode = (0, import_react3.useMemo)(() => {
-    const buildModeData = (mode) => {
-      const modeConfig = probabilityModeConfigs[mode];
-      return selectedOutcomesByMode[mode].map((outcomeByVenue, index) => {
-        const rawProbability = normalizeProbability(outcomeByVenue.outcome.price);
-        const transformedProbability = rawProbability == null ? void 0 : clampProbability(modeConfig.transformProbability(rawProbability));
-        return {
-          venue: outcomeByVenue.venue,
-          venueLabel: resolveVenueLabel(outcomeByVenue.venue, venueInfo, labels),
-          market: outcomeByVenue.market,
-          outcome: outcomeByVenue.outcome,
-          probability: transformedProbability,
-          color: resolveSeriesColor(outcomeByVenue.venue, index)
-        };
-      });
-    };
-    return {
-      yes: buildModeData("yes"),
-      no: buildModeData("no")
-    };
-  }, [labels, probabilityModeConfigs, selectedOutcomesByMode, venueInfo]);
-  const allOutcomesForHistory = (0, import_react3.useMemo)(() => {
-    const outcomeByModeAndId = /* @__PURE__ */ new Map();
-    probabilityModeOrder.forEach((mode) => {
-      selectedOutcomesByMode[mode].forEach((outcomeByVenue) => {
-        outcomeByModeAndId.set(
-          `${outcomeByVenue.venue}:${outcomeByVenue.outcome.id}`,
-          outcomeByVenue
-        );
-      });
-    });
-    return [...outcomeByModeAndId.values()];
-  }, [selectedOutcomesByMode]);
-  const priceHistoryGroups = (0, import_react3.useMemo)(() => {
-    return buildPriceHistoryGroups(allOutcomesForHistory, canonicalMarketId);
-  }, [allOutcomesForHistory, canonicalMarketId]);
-  const timeWindow = (0, import_react3.useMemo)(() => {
-    return getTimeWindowByRange(selectedTimeRange);
-  }, [selectedTimeRange]);
-  const { data: priceHistoryData, isLoading: isPriceHistoryLoading } = (0, import_hooks13.usePriceHistory)(__spreadProps(__spreadValues({
-    groups: priceHistoryGroups
-  }, timeWindow), {
-    enabled: priceHistoryGroups.length > 0
-  }));
-  const priceHistoryByVenue = (0, import_react3.useMemo)(() => {
-    const historyByVenue = /* @__PURE__ */ new Map();
-    if (!(priceHistoryData == null ? void 0 : priceHistoryData.length)) {
-      return historyByVenue;
-    }
-    priceHistoryData.forEach((historyItem) => {
-      const venue = historyItem.venue;
-      const venueHistory = historyByVenue.get(venue);
-      if (venueHistory) {
-        venueHistory.push(historyItem);
-        return;
-      }
-      historyByVenue.set(venue, [historyItem]);
-    });
-    return historyByVenue;
-  }, [priceHistoryData]);
-  const chartSeriesByMode = (0, import_react3.useMemo)(() => {
-    const buildSeries = (mode) => {
-      const modeConfig = probabilityModeConfigs[mode];
-      const chartSeries = [];
-      normalizedVenueDataByMode[mode].forEach((venueData) => {
-        var _a;
-        const venueHistory = priceHistoryByVenue.get(venueData.venue);
-        if (!(venueHistory == null ? void 0 : venueHistory.length))
-          return;
-        const candidateIds = resolveOutcomeCandidateIds(venueData.market, venueData.outcome);
-        const matchingHistory = (_a = venueHistory.find((historyItem) => candidateIds.includes(historyItem.marketId))) != null ? _a : venueHistory.length === 1 ? venueHistory[0] : void 0;
-        if (!matchingHistory)
-          return;
-        const points = matchingHistory.points.map((point) => {
-          const probability = normalizeProbability(point.price);
-          if (probability == null || !Number.isFinite(point.timestamp))
-            return null;
-          return {
-            time: point.timestamp,
-            value: clampProbability(modeConfig.transformProbability(probability)) * 100
-          };
-        }).filter((point) => point != null);
-        if (points.length === 0)
-          return;
-        chartSeries.push({
-          id: `${mode}-${venueData.venue}-${matchingHistory.marketId}`,
-          venue: venueData.venue,
-          color: venueData.color,
-          points,
-          lineWidth: 2,
-          lineStyle: "solid"
-        });
-      });
-      return chartSeries;
-    };
-    return {
-      yes: buildSeries("yes"),
-      no: buildSeries("no")
-    };
-  }, [normalizedVenueDataByMode, priceHistoryByVenue, probabilityModeConfigs]);
-  const visibleChartSeries = (0, import_react3.useMemo)(() => {
-    const modeSeries = chartSeriesByMode[activeProbabilityMode];
-    if (!selectedVenue)
-      return modeSeries;
-    return modeSeries.filter((seriesItem) => seriesItem.venue === selectedVenue);
-  }, [activeProbabilityMode, chartSeriesByMode, selectedVenue]);
-  const segmentedDisplayItems = (0, import_react3.useMemo)(() => {
-    return probabilityModeOrder.map((mode) => {
-      const averageProbability = resolveAverageProbability(
-        normalizedVenueDataByMode[mode].map((venueData) => venueData.probability)
-      );
-      const suffix = averageProbability == null ? "" : ` ${formatPercent(averageProbability)}`;
-      const switchLabel = probabilityModeConfigs[mode].switchLabel;
-      return {
-        mode,
-        display: `${switchLabel}${suffix}`
-      };
-    });
-  }, [formatPercent, normalizedVenueDataByMode, probabilityModeConfigs]);
-  const activeModeVenueData = normalizedVenueDataByMode[activeProbabilityMode];
-  (0, import_react3.useEffect)(() => {
-    if (!selectedVenue) {
-      return;
-    }
-    if (activeModeVenueData.some((item) => item.venue === selectedVenue)) {
-      return;
-    }
-    setSelectedVenue(null);
-  }, [activeModeVenueData, selectedVenue]);
-  const handleProbabilityModeChange = (nextMode) => {
-    setActiveProbabilityMode(nextMode);
-    if (isDateOutcomeMarket) {
-      return;
-    }
-    onSelectedOutcomeLabelChange(probabilityModeConfigs[nextMode].sourceOutcomeLabel);
-  };
-  const handleVenueToggle = (venue) => {
-    setSelectedVenue((currentSelectedVenue) => {
-      if (currentSelectedVenue === venue)
-        return null;
-      return venue;
-    });
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    LineChart,
-    {
-      classNames: { root: classNames == null ? void 0 : classNames.chart },
-      series: visibleChartSeries,
-      height: 300,
-      isLoading: isPriceHistoryLoading,
-      showSeriesControls: activeModeVenueData.length > 0 || segmentedDisplayItems.length > 0,
-      renderSeriesControls: () => {
-        return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
-          "div",
-          {
-            className: cn("flex flex-row items-center justify-between gap-4", classNames == null ? void 0 : classNames.summary),
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                "div",
-                {
-                  className: cn(
-                    "flex min-w-0 gap-2 overflow-x-auto pb-1 md:flex-wrap md:overflow-visible md:pb-0",
-                    classNames == null ? void 0 : classNames.outcomeBadges
-                  ),
-                  children: activeModeVenueData.map((venueData) => {
-                    var _a;
-                    const text = venueData.probability == null ? "-" : formatPercent(venueData.probability);
-                    const isActiveVenue = selectedVenue === venueData.venue;
-                    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                      "button",
-                      {
-                        type: "button",
-                        "aria-label": `${venueData.venueLabel} ${text}`,
-                        "aria-pressed": isActiveVenue,
-                        className: cn(
-                          "rounded-agg-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-agg-primary focus-visible:ring-offset-2 focus-visible:ring-offset-agg-secondary-hover"
-                        ),
-                        children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                          Badge,
-                          {
-                            text,
-                            size: "large",
-                            prefix: showVenueLogo ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                              VenueLogo,
-                              {
-                                venue: venueData.venue,
-                                size: "small",
-                                title: (_a = venueInfo == null ? void 0 : venueInfo[venueData.venue]) == null ? void 0 : _a.label
-                              }
-                            ) : void 0,
-                            classNames: {
-                              root: cn("h-9 shrink-0 border-2 px-4 text-agg-base leading-agg-6")
-                            },
-                            isActive: isActiveVenue,
-                            onClick: (e) => {
-                              e.preventDefault();
-                              e.stopPropagation();
-                              handleVenueToggle(venueData.venue);
-                            }
-                          }
-                        )
-                      },
-                      `${activeProbabilityMode}-${venueData.market.id}-${venueData.outcome.id}`
-                    );
-                  })
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                SwitchButton,
-                {
-                  ariaLabel: labels.eventItemDetails.outcomeSelectorAria,
-                  className: cn("w-full md:w-fit", classNames == null ? void 0 : classNames.segmentedControl),
-                  value: activeProbabilityMode,
-                  onValueChange: handleProbabilityModeChange,
-                  options: segmentedDisplayItems.map((segmentedItem) => ({
-                    value: segmentedItem.mode,
-                    label: segmentedItem.display,
-                    ariaLabel: segmentedItem.display
-                  }))
-                }
-              )
-            ]
-          }
-        );
-      }
-    }
-  );
-};
-var EventListItemDetailsContent = ({
-  event,
-  title,
-  image,
-  showVenueLogo = true,
-  classNames,
-  venueInfo,
-  detailsStats,
-  ariaLabel,
-  defaultTimeRange
-}) => {
-  var _a, _b;
-  const config = (0, import_hooks13.useSdkUiConfig)();
-  const labels = (0, import_hooks13.useLabels)();
-  const venueMarkets = (0, import_react3.useMemo)(() => {
-    var _a2, _b2, _c;
-    return (_c = (_b2 = (_a2 = event.markets) == null ? void 0 : _a2[0]) == null ? void 0 : _b2.venueMarkets) != null ? _c : [];
-  }, [event.markets]);
-  const primaryVenueMarket = (0, import_react3.useMemo)(() => {
-    return selectPrimaryVenueMarket(venueMarkets);
-  }, [venueMarkets]);
-  const outcomeLabels = (0, import_react3.useMemo)(() => {
-    return resolveOutcomeLabels(venueMarkets);
-  }, [venueMarkets]);
-  const [selectedOutcomeLabel, setSelectedOutcomeLabel] = (0, import_react3.useState)(() => {
-    return resolveDefaultOutcomeLabel(outcomeLabels);
-  });
-  const [selectedTimeRange, setSelectedTimeRange] = (0, import_react3.useState)(() => {
-    return getDefaultSelectedTimeRange(defaultTimeRange);
-  });
-  (0, import_react3.useEffect)(() => {
-    setSelectedTimeRange(getDefaultSelectedTimeRange(defaultTimeRange));
-  }, [defaultTimeRange]);
-  const resolvedTitle = resolveTileTitle(event, primaryVenueMarket, title);
-  const resolvedImage = resolveTileImage(event, primaryVenueMarket, image);
-  const isDateOutcomeMarket = outcomeLabels.length > 2 && outcomeLabels.every(isDateLikeLabel);
-  const outcomeSelectorLabels = outcomeLabels;
-  const probabilityByLabel = (0, import_react3.useMemo)(() => {
-    return new Map(
-      outcomeLabels.map((label) => {
-        const outcomesByVenue = resolveOutcomesByVenue(venueMarkets, label);
-        const probabilities = outcomesByVenue.map((item) => normalizeProbability(item.outcome.price)).filter((value) => value != null);
-        if (probabilities.length === 0) {
-          return [label, void 0];
-        }
-        const averageProbability = probabilities.reduce((sum, value) => sum + value, 0) / probabilities.length;
-        return [label, averageProbability];
-      })
-    );
-  }, [outcomeLabels, venueMarkets]);
-  const mainOutcomeLabel = (0, import_react3.useMemo)(() => {
-    if (outcomeLabels.length === 0)
-      return void 0;
-    return [...outcomeLabels].sort((left, right) => {
-      var _a2, _b2;
-      const leftProbability = (_a2 = probabilityByLabel.get(left)) != null ? _a2 : -1;
-      const rightProbability = (_b2 = probabilityByLabel.get(right)) != null ? _b2 : -1;
-      return rightProbability - leftProbability;
-    })[0];
-  }, [outcomeLabels, probabilityByLabel]);
-  (0, import_react3.useEffect)(() => {
-    if (!outcomeLabels.length) {
-      setSelectedOutcomeLabel(void 0);
-      return;
-    }
-    if (selectedOutcomeLabel && outcomeLabels.includes(selectedOutcomeLabel)) {
-      return;
-    }
-    const fallbackOutcomeLabel = isDateOutcomeMarket ? resolveDefaultOutcomeLabel(outcomeLabels) : mainOutcomeLabel != null ? mainOutcomeLabel : resolveDefaultOutcomeLabel(outcomeLabels);
-    setSelectedOutcomeLabel(fallbackOutcomeLabel);
-  }, [isDateOutcomeMarket, mainOutcomeLabel, outcomeLabels, selectedOutcomeLabel]);
-  const switchLabels = (0, import_react3.useMemo)(() => {
-    var _a2, _b2;
-    if (isDateOutcomeMarket) {
-      return [labels.eventItemDetails.yes, labels.eventItemDetails.no];
-    }
-    const sortedOutcomeLabels = [...outcomeLabels].sort((left, right) => {
-      var _a3, _b3;
-      const leftProbability = (_a3 = probabilityByLabel.get(left)) != null ? _a3 : -1;
-      const rightProbability = (_b3 = probabilityByLabel.get(right)) != null ? _b3 : -1;
-      return rightProbability - leftProbability;
-    });
-    const firstLabel = (_a2 = sortedOutcomeLabels[0]) != null ? _a2 : labels.eventItemDetails.yes;
-    const secondLabel = (_b2 = sortedOutcomeLabels.find((label) => label !== firstLabel)) != null ? _b2 : firstLabel;
-    return [firstLabel, secondLabel];
-  }, [
-    isDateOutcomeMarket,
-    labels.eventItemDetails.no,
-    labels.eventItemDetails.yes,
-    outcomeLabels,
-    probabilityByLabel
-  ]);
-  const volumeLabel = (0, import_react3.useMemo)(() => {
-    var _a2;
-    const resolvedVolume = typeof event.volume === "number" ? event.volume : (_a2 = primaryVenueMarket == null ? void 0 : primaryVenueMarket.volume) != null ? _a2 : void 0;
-    if (typeof resolvedVolume !== "number")
-      return "";
-    return `${config.formatCompactCurrency(resolvedVolume)} ${labels.eventItemDetails.volumeSuffix}`;
-  }, [config, event.volume, labels.eventItemDetails.volumeSuffix, primaryVenueMarket == null ? void 0 : primaryVenueMarket.volume]);
-  if (!primaryVenueMarket || !selectedOutcomeLabel) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EventListItemDetailsUnavailableState, { classNames, ariaLabel });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
-    Card,
-    {
-      className: cn(detailsBaseCardClassName, classNames == null ? void 0 : classNames.root),
-      "aria-label": ariaLabel != null ? ariaLabel : resolvedTitle,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
-          "div",
-          {
-            className: cn(
-              "flex flex-row gap-3 md:gap-4",
-              "items-center justify-start",
-              classNames == null ? void 0 : classNames.header
-            ),
-            children: [
-              resolvedImage ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                "img",
-                {
-                  src: resolvedImage,
-                  alt: "",
-                  className: "size-10 rounded-agg-lg object-cover md:size-[60px]"
-                }
-              ) : null,
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-3", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                  Typography,
-                  {
-                    variant: "body-strong",
-                    className: cn(
-                      "min-w-0 text-agg-base font-agg-bold! leading-agg-6 md:text-agg-2xl md:leading-agg-8",
-                      "truncate text-wrap wrap-break-word line-clamp-2",
-                      classNames == null ? void 0 : classNames.title
-                    ),
-                    children: resolvedTitle
-                  }
-                ),
-                outcomeSelectorLabels.length > 2 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                  "div",
-                  {
-                    className: cn(
-                      "flex items-center gap-2 overflow-x-auto pb-1 md:flex-wrap md:overflow-visible md:pb-0",
-                      classNames == null ? void 0 : classNames.headerPills
-                    ),
-                    children: outcomeSelectorLabels.map((outcomeSelectorLabel) => {
-                      const isActive = outcomeSelectorLabel === selectedOutcomeLabel;
-                      const displayLabel = isDateLikeLabel(outcomeSelectorLabel) ? formatDateLabel(outcomeSelectorLabel) : outcomeSelectorLabel;
-                      return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                        Button,
-                        {
-                          size: "small",
-                          variant: "secondary",
-                          "aria-pressed": isActive,
-                          className: cn(
-                            "h-auto shrink-0 rounded-agg-full px-4 py-1.5 text-agg-sm leading-agg-5",
-                            "border-2",
-                            isActive ? "border-agg-primary bg-agg-secondary text-agg-foreground font-agg-bold" : "border-transparent bg-agg-secondary-hover text-agg-foreground font-agg-normal"
-                          ),
-                          onClick: () => setSelectedOutcomeLabel(outcomeSelectorLabel),
-                          children: displayLabel
-                        },
-                        outcomeSelectorLabel
-                      );
-                    })
-                  }
-                ) : null
-              ] })
-            ]
-          }
-        ),
-        detailsStats && detailsStats.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("flex flex-wrap items-start gap-4 md:gap-6", classNames == null ? void 0 : classNames.headerStats), children: detailsStats.map((statItem) => {
-          const deltaClassName = statItem.deltaTone === "positive" ? "text-agg-success!" : statItem.deltaTone === "negative" ? "text-agg-error!" : "text-agg-muted-foreground";
-          return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "caption-caps", className: "text-agg-muted-foreground", children: statItem.label }),
-            /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-baseline gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                Typography,
-                {
-                  variant: "body",
-                  className: "text-agg-lg leading-agg-7 text-agg-foreground",
-                  children: statItem.value
-                }
-              ),
-              statItem.delta ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "label", className: cn(deltaClassName), children: statItem.delta }) : null
-            ] })
-          ] }, `${statItem.label}-${statItem.value}`);
-        }) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-          EventListItemDetailsGraphSection,
-          {
-            venueMarkets,
-            canonicalMarketId: (_b = (_a = event.markets) == null ? void 0 : _a[0]) == null ? void 0 : _b.id,
-            selectedOutcomeLabel,
-            onSelectedOutcomeLabelChange: setSelectedOutcomeLabel,
-            switchLabels,
-            isDateOutcomeMarket,
-            classNames,
-            showVenueLogo,
-            venueInfo,
-            formatPercent: config.formatPercent,
-            selectedTimeRange
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: cn("flex flex-wrap items-center justify-between gap-4", classNames == null ? void 0 : classNames.footer), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "label", className: "text-agg-muted-foreground", children: volumeLabel || "-" }),
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("flex items-center gap-2 md:gap-3", classNames == null ? void 0 : classNames.timeRange), children: eventListItemDetailsTimeRanges.map((timeRange) => {
-            const isActive = timeRange === selectedTimeRange;
-            return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-              Button,
-              {
-                size: "small",
-                variant: "tertiary",
-                className: cn(
-                  "h-auto min-w-0 rounded-none px-0 py-0 text-agg-xs leading-agg-4 md:text-agg-sm md:leading-agg-5",
-                  "border-0 bg-transparent shadow-none",
-                  "hover:text-agg-foreground!",
-                  isActive ? "font-agg-bold! text-agg-foreground!" : "font-agg-normal! text-agg-muted-foreground!"
-                ),
-                "aria-pressed": isActive,
-                onClick: () => setSelectedTimeRange(timeRange),
-                children: timeRange === "ALL" ? labels.eventItemDetails.allTimeRange : timeRange
-              },
-              timeRange
-            );
-          }) })
-        ] })
-      ]
-    }
-  );
-};
-var EventListItemDetailsByEventId = (_a) => {
-  var _b = _a, {
-    eventId
-  } = _b, rest = __objRest(_b, [
-    "eventId"
-  ]);
-  const {
-    event: fetchedEvent,
-    isError,
-    isLoading
-  } = (0, import_hooks13.useEvent)(eventId, {
-    enabled: !!eventId
-  });
-  const resolvedEvent = (0, import_react3.useMemo)(() => {
-    return resolveEventListItemEvent(fetchedEvent);
-  }, [fetchedEvent]);
-  if (!eventId) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-      EventListItemDetailsUnavailableState,
-      {
-        classNames: rest.classNames,
-        ariaLabel: rest.ariaLabel
-      }
-    );
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EventListItemDetailsLoadingState, { classNames: rest.classNames, ariaLabel: rest.ariaLabel });
-  }
-  if (!resolvedEvent && !isError) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EventListItemDetailsLoadingState, { classNames: rest.classNames, ariaLabel: rest.ariaLabel });
-  }
-  if (!resolvedEvent) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-      EventListItemDetailsUnavailableState,
-      {
-        classNames: rest.classNames,
-        ariaLabel: rest.ariaLabel
-      }
-    );
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EventListItemDetailsContent, __spreadValues({ event: resolvedEvent }, rest));
-};
-var EventListItemDetails = (props) => {
-  if (props.isLoading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EventListItemDetailsLoadingState, { classNames: props.classNames, ariaLabel: props.ariaLabel });
-  }
-  if ("event" in props && props.event) {
-    const _a = props, { event } = _a, rest = __objRest(_a, ["event"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EventListItemDetailsContent, __spreadValues({ event }, rest));
-  }
-  if ("eventId" in props && typeof props.eventId === "string") {
-    const {
-      title: titleOverride,
-      image: imageOverride,
-      showVenueLogo: showVenueLogoOverride,
-      classNames,
-      venueInfo,
-      detailsStats,
-      ariaLabel: ariaLabelOverride,
-      defaultTimeRange: defaultTimeRangeOverride
-    } = props;
-    const byEventIdProps = {
-      eventId: props.eventId,
-      isLoading: false,
-      title: titleOverride,
-      image: imageOverride,
-      showVenueLogo: showVenueLogoOverride,
-      classNames,
-      venueInfo,
-      detailsStats,
-      ariaLabel: ariaLabelOverride,
-      defaultTimeRange: defaultTimeRangeOverride
-    };
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EventListItemDetailsByEventId, __spreadValues({}, byEventIdProps));
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    EventListItemDetailsUnavailableState,
-    {
-      classNames: props.classNames,
-      ariaLabel: props.ariaLabel
-    }
-  );
-};
-EventListItemDetails.displayName = "EventListItemDetails";
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  EventListItemDetails
-});