@agg-build/ui 1.0.0

package/dist/types/events/item-details/event-list-item-details.utils.d.ts

@@ -0,0 +1,75 @@
+import type { ChartTimeRange, MarketChartCandle, MarketChartData, ScaledCandlePoint, Venue, VenueMarket, VenueMarketOutcome } from "@agg-build/hooks";
+import type { LineChartPoint } from "../../primitives/chart";
+export type OutcomeByVenue = {
+    venue: VenueMarket["venue"];
+    market: VenueMarket;
+    outcome: VenueMarketOutcome;
+};
+export type OutcomeSelectorItem = {
+    key: string;
+    label: string;
+    displayLabel: string;
+};
+export declare const sortOutcomeSelectorOutcomes: (outcomes: VenueMarketOutcome[]) => VenueMarketOutcome[];
+export declare const isDateLikeLabel: (value: string) => boolean;
+export declare const formatDateLabel: (value: string) => string;
+export declare const formatXAxisDateLabel: (timestamp: number) => string;
+/**
+ * Returns the time window for the given range in seconds.
+ *
+ * @param range The time range.
+ * @returns The time window.
+ */
+export declare const getTimeWindowByRange: (range: ChartTimeRange) => {
+    startTs: number;
+    endTs: number;
+    intervalMinutes: number;
+};
+export declare const resolveOutcomeLabels: (venueMarkets: VenueMarket[]) => string[];
+export declare const resolveOutcomeSelectorItems: (venueMarkets: VenueMarket[]) => OutcomeSelectorItem[];
+export declare const resolveDefaultOutcomeLabel: (outcomeLabels: string[]) => string | undefined;
+export declare const matchOutcomeByLabel: (outcome: VenueMarketOutcome, selectedOutcomeLabel: string) => boolean;
+export declare const resolveOutcomesByVenue: (venueMarkets: VenueMarket[], selectedOutcomeLabel: string) => OutcomeByVenue[];
+export declare const resolveOutcomePercentValue: (outcome: VenueMarketOutcome) => number | undefined;
+export declare const buildPriceHistoryGroups: (selectedOutcomes: OutcomeByVenue[], fallbackMarketId?: string) => Array<{
+    venue: Venue;
+    venueMarketOutcomeIds: string[];
+}>;
+export declare const resolveSeriesColor: (venue: VenueMarket["venue"] | string, index: number, isDarkTheme?: boolean) => string;
+/**
+ * Convert scaled candle points (from useLiveCandleOverlay) to LineChartPoint[].
+ * Maps candle close → line chart value. Used as a fallback when orderbook history
+ * is unavailable but candlestick data exists.
+ */
+export declare const scaledCandlesToLineChartPoints: (candles: ScaledCandlePoint[]) => LineChartPoint[];
+export declare const resolveCanonicalMarketId: (venueMarkets: Array<Pick<VenueMarket, "marketId">>, fallbackMarketId?: string | null) => string | undefined;
+export declare const toChartDisplayValue: (value: number | undefined, transformProbability: (value: number) => number) => number | undefined;
+export declare const marketChartCandleToLineChartPoint: (candle: MarketChartCandle, transformProbability: (value: number) => number) => LineChartPoint;
+export declare const marketChartCandleToScaledCandlePoint: (candle: MarketChartCandle, transformProbability: (value: number) => number) => ScaledCandlePoint;
+export declare const resolveMarketChartVenueSeries: ({ chartData, transformProbability, }: {
+    chartData: MarketChartData | null | undefined;
+    transformProbability: (value: number) => number;
+}) => Array<{
+    venue: string;
+    points: LineChartPoint[];
+}>;
+export declare const aggregateMarketChartCandles: (candles: MarketChartCandle[]) => MarketChartCandle[];
+export declare const resolveMarketChartDisplaySeries: ({ chartData, selectedVenue, transformProbability, }: {
+    chartData: MarketChartData | null | undefined;
+    selectedVenue?: string | null;
+    transformProbability: (value: number) => number;
+}) => Array<{
+    venue: string;
+    points: LineChartPoint[];
+}>;
+export declare const clampProbability: (value: number) => number;
+export declare const resolveAverageProbability: (values: Array<number | undefined>) => number | undefined;
+export declare const resolveMarketChartLiveState: ({ chartData, selectedVenue, transformProbability, }: {
+    chartData: MarketChartData | null | undefined;
+    selectedVenue?: string | null;
+    transformProbability: (value: number) => number;
+}) => {
+    liveCandle: ScaledCandlePoint | null;
+    lineValue: number | undefined;
+    live: boolean;
+};

package/dist/types/events/item-details/index.d.mts

@@ -0,0 +1,8 @@
+import type { EventListItemDetailsProps } from "./event-list-item-details.types";
+export type { EventListItemDetailsClassNames, EventListItemDetailsEvent, EventListItemDetailsProps, EventListItemDetailsStat, EventListItemDetailsTimeRange, EventListItemDetailsWithEventIdProps, } from "./event-list-item-details.types";
+export { SettlementSummary } from "./settlement-summary";
+export type { SettlementSummaryProps } from "./settlement-summary";
+export declare const EventListItemDetails: {
+    (props: EventListItemDetailsProps): JSX.Element;
+    displayName: string;
+};

package/dist/types/events/item-details/index.d.ts

@@ -0,0 +1,8 @@
+import type { EventListItemDetailsProps } from "./event-list-item-details.types";
+export type { EventListItemDetailsClassNames, EventListItemDetailsEvent, EventListItemDetailsProps, EventListItemDetailsStat, EventListItemDetailsTimeRange, EventListItemDetailsWithEventIdProps, } from "./event-list-item-details.types";
+export { SettlementSummary } from "./settlement-summary";
+export type { SettlementSummaryProps } from "./settlement-summary";
+export declare const EventListItemDetails: {
+    (props: EventListItemDetailsProps): JSX.Element;
+    displayName: string;
+};

package/dist/types/events/item-details/settlement-summary.d.mts

@@ -0,0 +1,9 @@
+export type SettlementSummaryProps = {
+    content: string | null | undefined;
+    onToggle?: (expanded: boolean) => void;
+    className?: string;
+};
+export declare const SettlementSummary: {
+    ({ content, onToggle, className, }: SettlementSummaryProps): JSX.Element | null;
+    displayName: string;
+};

package/dist/types/events/item-details/settlement-summary.d.ts

@@ -0,0 +1,9 @@
+export type SettlementSummaryProps = {
+    content: string | null | undefined;
+    onToggle?: (expanded: boolean) => void;
+    className?: string;
+};
+export declare const SettlementSummary: {
+    ({ content, onToggle, className, }: SettlementSummaryProps): JSX.Element | null;
+    displayName: string;
+};

package/dist/types/events/list/event-list-tabs.d.mts

@@ -0,0 +1,44 @@
+import { type MutableRefObject } from "react";
+import { type TabsOverflowBehavior } from "../../primitives/tabs";
+import type { EventListTab, EventListTabValue } from "./event-list.types";
+export type EventListTabsProps = {
+    /** Override the canonical tab list. Disabled-venue filtering is still applied. */
+    tabs?: EventListTab[];
+    /** Currently selected tab value. */
+    activeTab: EventListTabValue;
+    /** Called when the active tab changes (including auto-fallback when the active tab disappears). */
+    onTabChange: (value: EventListTabValue) => void;
+    /** Accessible label forwarded to the underlying Tabs primitive. */
+    ariaLabel?: string;
+    /** Custom class name applied to the Tabs root. */
+    className?: string;
+    /** Behavior used when tabs overflow horizontally. */
+    overflowBehavior?: TabsOverflowBehavior;
+};
+/**
+ * Returns the canonical event list tabs, filtered by the partner's `disabledVenues`.
+ * Use when a parent needs to read tab metadata (e.g., to derive `venues` /
+ * `matchStatus` for a query) and still wants the same list rendered by `EventListTabs`.
+ */
+export declare const useEventListTabs: (tabs?: EventListTab[]) => EventListTab[];
+/**
+ * Canonical event list tab control. Renders the same tab list, icons,
+ * ordering, and active styling everywhere event list tabs appear.
+ */
+export declare const EventListTabs: {
+    ({ tabs, activeTab, onTabChange, ariaLabel, className, overflowBehavior, }: EventListTabsProps): JSX.Element;
+    displayName: string;
+};
+export type EventListTabsHeaderOverflowResult<THeader extends HTMLElement, TTitle extends HTMLElement> = {
+    headerRef: MutableRefObject<THeader | null>;
+    titleRef: MutableRefObject<TTitle | null>;
+    shouldUseSelectOverflow: boolean;
+};
+/**
+ * Detects when the title + tabs row no longer fits and returns
+ * `shouldUseSelectOverflow` so the consumer can switch the canonical
+ * `EventListTabs` to its select fallback. Wire `headerRef` to the row
+ * element and `titleRef` to the title element. Pass `recomputeOn` (e.g.
+ * the resolved tab list) to re-measure when tab content changes.
+ */
+export declare const useEventListTabsHeaderOverflow: <THeader extends HTMLElement = HTMLElement, TTitle extends HTMLElement = HTMLElement>(recomputeOn?: unknown) => EventListTabsHeaderOverflowResult<THeader, TTitle>;

package/dist/types/events/list/event-list-tabs.d.ts

@@ -0,0 +1,44 @@
+import { type MutableRefObject } from "react";
+import { type TabsOverflowBehavior } from "../../primitives/tabs";
+import type { EventListTab, EventListTabValue } from "./event-list.types";
+export type EventListTabsProps = {
+    /** Override the canonical tab list. Disabled-venue filtering is still applied. */
+    tabs?: EventListTab[];
+    /** Currently selected tab value. */
+    activeTab: EventListTabValue;
+    /** Called when the active tab changes (including auto-fallback when the active tab disappears). */
+    onTabChange: (value: EventListTabValue) => void;
+    /** Accessible label forwarded to the underlying Tabs primitive. */
+    ariaLabel?: string;
+    /** Custom class name applied to the Tabs root. */
+    className?: string;
+    /** Behavior used when tabs overflow horizontally. */
+    overflowBehavior?: TabsOverflowBehavior;
+};
+/**
+ * Returns the canonical event list tabs, filtered by the partner's `disabledVenues`.
+ * Use when a parent needs to read tab metadata (e.g., to derive `venues` /
+ * `matchStatus` for a query) and still wants the same list rendered by `EventListTabs`.
+ */
+export declare const useEventListTabs: (tabs?: EventListTab[]) => EventListTab[];
+/**
+ * Canonical event list tab control. Renders the same tab list, icons,
+ * ordering, and active styling everywhere event list tabs appear.
+ */
+export declare const EventListTabs: {
+    ({ tabs, activeTab, onTabChange, ariaLabel, className, overflowBehavior, }: EventListTabsProps): JSX.Element;
+    displayName: string;
+};
+export type EventListTabsHeaderOverflowResult<THeader extends HTMLElement, TTitle extends HTMLElement> = {
+    headerRef: MutableRefObject<THeader | null>;
+    titleRef: MutableRefObject<TTitle | null>;
+    shouldUseSelectOverflow: boolean;
+};
+/**
+ * Detects when the title + tabs row no longer fits and returns
+ * `shouldUseSelectOverflow` so the consumer can switch the canonical
+ * `EventListTabs` to its select fallback. Wire `headerRef` to the row
+ * element and `titleRef` to the title element. Pass `recomputeOn` (e.g.
+ * the resolved tab list) to re-measure when tab content changes.
+ */
+export declare const useEventListTabsHeaderOverflow: <THeader extends HTMLElement = HTMLElement, TTitle extends HTMLElement = HTMLElement>(recomputeOn?: unknown) => EventListTabsHeaderOverflowResult<THeader, TTitle>;

package/dist/types/events/list/event-list.constants.d.mts

@@ -0,0 +1,4 @@
+import type { AggUiLabels } from "@agg-build/hooks";
+import type { EventListTab } from "./event-list.types";
+export declare const DEFAULT_EVENTS_LIMIT = 50;
+export declare const getDefaultEventListTabs: (labels: AggUiLabels) => EventListTab[];

package/dist/types/events/list/event-list.constants.d.ts

@@ -0,0 +1,4 @@
+import type { AggUiLabels } from "@agg-build/hooks";
+import type { EventListTab } from "./event-list.types";
+export declare const DEFAULT_EVENTS_LIMIT = 50;
+export declare const getDefaultEventListTabs: (labels: AggUiLabels) => EventListTab[];

package/dist/types/events/list/event-list.types.d.mts

@@ -0,0 +1,48 @@
+import type { UseVenueEventsOptions } from "@agg-build/hooks";
+import type { MatchStatus, Venue } from "@agg-build/sdk";
+import type { MutableRefObject } from "react";
+import type { IconName } from "../../primitives/icon";
+import type { VenueLogoName } from "../../primitives/venue-logo";
+import type { VenueEventWithMarkets, VenueMarket, VenueMarketOutcome } from "../item";
+export type EventListTabValue = "matched" | `${Venue}` | (string & {});
+/** Exposes EventList internal state for snapshot capture by parent components. */
+export type EventListStateRef = {
+    venueTab: EventListTabValue;
+    loadedPageCount: number;
+};
+export type EventListTab = {
+    value: EventListTabValue;
+    label: string;
+    iconName?: IconName;
+    venueLogo?: VenueLogoName;
+    venues?: UseVenueEventsOptions["venues"];
+    disabled?: boolean;
+    isComingSoon?: boolean;
+    matchStatus?: MatchStatus[];
+};
+export type EventListProps = {
+    /** Section title displayed above the event list. */
+    title: string;
+    /** Maximum number of events requested per page. */
+    limit?: number;
+    /** Max number of cards shown before truncation or progressive reveal. */
+    maxVisibleItems?: number;
+    /** Search phrase forwarded to the events query. */
+    search?: UseVenueEventsOptions["search"];
+    /** Category filters applied to the events query. */
+    categoryIds?: UseVenueEventsOptions["categoryIds"];
+    /** Called when an event card body is clicked. */
+    onEventClick?: (event?: VenueEventWithMarkets) => void;
+    /** Called when an outcome price badge is clicked. Use to navigate to the event with a preselected market and outcome. */
+    onMarketClick?: (event: VenueEventWithMarkets, market: VenueMarket, outcome: VenueMarketOutcome) => void;
+    /** Returns an href for each market outcome badge, enabling native browser link behavior (cmd/ctrl-click → new tab). */
+    getMarketHref?: (event: VenueEventWithMarkets, market: VenueMarket, outcome: VenueMarketOutcome) => string;
+    /** Returns an href for each event card, enabling native browser link behaviors (cmd/ctrl-click → new tab). */
+    getEventHref?: (event: VenueEventWithMarkets) => string;
+    /** Venue tab value to restore on mount (from navigation snapshot). */
+    initialVenueTab?: EventListTabValue;
+    /** Number of infinite query pages to eagerly prefetch on mount (from navigation snapshot). */
+    initialLoadedPageCount?: number;
+    /** Ref that EventList writes its internal state to, so parents can read it for snapshot capture. */
+    stateRef?: MutableRefObject<EventListStateRef | null>;
+};

package/dist/types/events/list/event-list.types.d.ts

@@ -0,0 +1,48 @@
+import type { UseVenueEventsOptions } from "@agg-build/hooks";
+import type { MatchStatus, Venue } from "@agg-build/sdk";
+import type { MutableRefObject } from "react";
+import type { IconName } from "../../primitives/icon";
+import type { VenueLogoName } from "../../primitives/venue-logo";
+import type { VenueEventWithMarkets, VenueMarket, VenueMarketOutcome } from "../item";
+export type EventListTabValue = "matched" | `${Venue}` | (string & {});
+/** Exposes EventList internal state for snapshot capture by parent components. */
+export type EventListStateRef = {
+    venueTab: EventListTabValue;
+    loadedPageCount: number;
+};
+export type EventListTab = {
+    value: EventListTabValue;
+    label: string;
+    iconName?: IconName;
+    venueLogo?: VenueLogoName;
+    venues?: UseVenueEventsOptions["venues"];
+    disabled?: boolean;
+    isComingSoon?: boolean;
+    matchStatus?: MatchStatus[];
+};
+export type EventListProps = {
+    /** Section title displayed above the event list. */
+    title: string;
+    /** Maximum number of events requested per page. */
+    limit?: number;
+    /** Max number of cards shown before truncation or progressive reveal. */
+    maxVisibleItems?: number;
+    /** Search phrase forwarded to the events query. */
+    search?: UseVenueEventsOptions["search"];
+    /** Category filters applied to the events query. */
+    categoryIds?: UseVenueEventsOptions["categoryIds"];
+    /** Called when an event card body is clicked. */
+    onEventClick?: (event?: VenueEventWithMarkets) => void;
+    /** Called when an outcome price badge is clicked. Use to navigate to the event with a preselected market and outcome. */
+    onMarketClick?: (event: VenueEventWithMarkets, market: VenueMarket, outcome: VenueMarketOutcome) => void;
+    /** Returns an href for each market outcome badge, enabling native browser link behavior (cmd/ctrl-click → new tab). */
+    getMarketHref?: (event: VenueEventWithMarkets, market: VenueMarket, outcome: VenueMarketOutcome) => string;
+    /** Returns an href for each event card, enabling native browser link behaviors (cmd/ctrl-click → new tab). */
+    getEventHref?: (event: VenueEventWithMarkets) => string;
+    /** Venue tab value to restore on mount (from navigation snapshot). */
+    initialVenueTab?: EventListTabValue;
+    /** Number of infinite query pages to eagerly prefetch on mount (from navigation snapshot). */
+    initialLoadedPageCount?: number;
+    /** Ref that EventList writes its internal state to, so parents can read it for snapshot capture. */
+    stateRef?: MutableRefObject<EventListStateRef | null>;
+};

package/dist/types/events/list/event-list.utils.d.mts

@@ -0,0 +1,19 @@
+import { type UseVenueEventsOptions, type VenueMarket } from "@agg-build/hooks";
+import type { EventListItemEvent, VenueEventWithMarkets } from "../item/event-list-item.types";
+import type { EventListTab, EventListTabValue } from "./event-list.types";
+/** Filter out events that are not open or have no open venue markets. */
+export declare const filterOpenEvents: (events: VenueEventWithMarkets[]) => VenueEventWithMarkets[];
+export declare const sortEventsByVolumeDesc: (events: VenueEventWithMarkets[]) => VenueEventWithMarkets[];
+export type EventLifecycleGroup = {
+    open: VenueEventWithMarkets[];
+    upcoming: VenueEventWithMarkets[];
+    resolved: VenueEventWithMarkets[];
+};
+export declare const splitEventsByLifecycle: (events: VenueEventWithMarkets[]) => EventLifecycleGroup;
+export declare const mapEventToEventListItemEvent: (event: VenueEventWithMarkets) => EventListItemEvent | null;
+export declare const filterEventsByTabValue: (events: VenueEventWithMarkets[], _tabValue: EventListTabValue) => VenueEventWithMarkets[];
+/** Filter markets to only those with status "open" or undefined (treated as open). */
+export declare const filterOpenMarkets: (markets: VenueMarket[]) => VenueMarket[];
+/** Sort markets by YES odds descending, preserving input order for ties and missing values. */
+export declare const sortMarketsByYesOddsDesc: (markets: VenueMarket[]) => VenueMarket[];
+export declare const resolveTabVenus: (tab: EventListTab | undefined, visibleVenues?: readonly string[]) => UseVenueEventsOptions["venues"] | undefined;

package/dist/types/events/list/event-list.utils.d.ts

@@ -0,0 +1,19 @@
+import { type UseVenueEventsOptions, type VenueMarket } from "@agg-build/hooks";
+import type { EventListItemEvent, VenueEventWithMarkets } from "../item/event-list-item.types";
+import type { EventListTab, EventListTabValue } from "./event-list.types";
+/** Filter out events that are not open or have no open venue markets. */
+export declare const filterOpenEvents: (events: VenueEventWithMarkets[]) => VenueEventWithMarkets[];
+export declare const sortEventsByVolumeDesc: (events: VenueEventWithMarkets[]) => VenueEventWithMarkets[];
+export type EventLifecycleGroup = {
+    open: VenueEventWithMarkets[];
+    upcoming: VenueEventWithMarkets[];
+    resolved: VenueEventWithMarkets[];
+};
+export declare const splitEventsByLifecycle: (events: VenueEventWithMarkets[]) => EventLifecycleGroup;
+export declare const mapEventToEventListItemEvent: (event: VenueEventWithMarkets) => EventListItemEvent | null;
+export declare const filterEventsByTabValue: (events: VenueEventWithMarkets[], _tabValue: EventListTabValue) => VenueEventWithMarkets[];
+/** Filter markets to only those with status "open" or undefined (treated as open). */
+export declare const filterOpenMarkets: (markets: VenueMarket[]) => VenueMarket[];
+/** Sort markets by YES odds descending, preserving input order for ties and missing values. */
+export declare const sortMarketsByYesOddsDesc: (markets: VenueMarket[]) => VenueMarket[];
+export declare const resolveTabVenus: (tab: EventListTab | undefined, visibleVenues?: readonly string[]) => UseVenueEventsOptions["venues"] | undefined;

package/dist/types/events/list/index.d.mts

@@ -0,0 +1,6 @@
+import type { EventListProps } from "./event-list.types";
+export type { EventListProps, EventListStateRef } from "./event-list.types";
+export declare const EventList: {
+    ({ title, limit, maxVisibleItems, search, categoryIds, onEventClick, onMarketClick, getMarketHref, getEventHref, initialVenueTab, initialLoadedPageCount, stateRef, }: EventListProps): JSX.Element;
+    displayName: string;
+};

package/dist/types/events/list/index.d.ts

@@ -0,0 +1,6 @@
+import type { EventListProps } from "./event-list.types";
+export type { EventListProps, EventListStateRef } from "./event-list.types";
+export declare const EventList: {
+    ({ title, limit, maxVisibleItems, search, categoryIds, onEventClick, onMarketClick, getMarketHref, getEventHref, initialVenueTab, initialLoadedPageCount, stateRef, }: EventListProps): JSX.Element;
+    displayName: string;
+};

package/dist/types/events/market-details/index.d.mts

@@ -0,0 +1,12 @@
+import type { MarketDetailsListProps, MarketDetailsProps } from "./market-details.types";
+export type { MarketDetailsClassNames, MarketDetailsContentProps, MarketDetailsListProps, MarketDetailsMetaRow, MarketDetailsOrderBookRow, MarketDetailsProps, MarketDetailsTab, } from "./market-details.types";
+export { collectEligibleVenueOutcomeIds, collectEligibleVenueOutcomes, mergeVenueOutcomeOrderbooks, } from "./orderbook-aggregation";
+export type { AggregatedOrderbookRows, EligibleVenueOutcome } from "./orderbook-aggregation";
+export declare const MarketDetails: {
+    ({ isOpened, ...props }: MarketDetailsProps): JSX.Element;
+    displayName: string;
+};
+export declare const MarketDetailsList: {
+    ({ eventId, markets: providedMarkets, eventTradingState, onClick, onExpandedMarketChange, defaultTab, classNames, live, }: MarketDetailsListProps): JSX.Element;
+    displayName: string;
+};

package/dist/types/events/market-details/index.d.ts

@@ -0,0 +1,12 @@
+import type { MarketDetailsListProps, MarketDetailsProps } from "./market-details.types";
+export type { MarketDetailsClassNames, MarketDetailsContentProps, MarketDetailsListProps, MarketDetailsMetaRow, MarketDetailsOrderBookRow, MarketDetailsProps, MarketDetailsTab, } from "./market-details.types";
+export { collectEligibleVenueOutcomeIds, collectEligibleVenueOutcomes, mergeVenueOutcomeOrderbooks, } from "./orderbook-aggregation";
+export type { AggregatedOrderbookRows, EligibleVenueOutcome } from "./orderbook-aggregation";
+export declare const MarketDetails: {
+    ({ isOpened, ...props }: MarketDetailsProps): JSX.Element;
+    displayName: string;
+};
+export declare const MarketDetailsList: {
+    ({ eventId, markets: providedMarkets, eventTradingState, onClick, onExpandedMarketChange, defaultTab, classNames, live, }: MarketDetailsListProps): JSX.Element;
+    displayName: string;
+};

package/dist/types/events/market-details/market-details-outcome-button.d.mts

@@ -0,0 +1,13 @@
+import type { MarketDetailsHeaderOutcomeItem } from "./market-details.types";
+type MarketDetailsOutcomeButtonProps = {
+    ariaControls?: string;
+    enableAnimations: boolean;
+    isSelected: boolean;
+    item: MarketDetailsHeaderOutcomeItem;
+    onSelect: (label: string) => void;
+};
+export declare const MarketDetailsOutcomeButton: {
+    ({ ariaControls, enableAnimations, isSelected, item, onSelect, }: MarketDetailsOutcomeButtonProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/types/events/market-details/market-details-outcome-button.d.ts

@@ -0,0 +1,13 @@
+import type { MarketDetailsHeaderOutcomeItem } from "./market-details.types";
+type MarketDetailsOutcomeButtonProps = {
+    ariaControls?: string;
+    enableAnimations: boolean;
+    isSelected: boolean;
+    item: MarketDetailsHeaderOutcomeItem;
+    onSelect: (label: string) => void;
+};
+export declare const MarketDetailsOutcomeButton: {
+    ({ ariaControls, enableAnimations, isSelected, item, onSelect, }: MarketDetailsOutcomeButtonProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/types/events/market-details/market-details.constants.d.mts

@@ -0,0 +1,9 @@
+import type { AggUiLabels } from "@agg-build/hooks";
+import type { MarketDetailsTab } from "./market-details.types";
+export declare const marketDetailsBaseCardClassName = "w-full overflow-hidden rounded-agg-lg border border-agg-separator bg-agg-secondary text-agg-foreground shadow-none hover:shadow-none";
+export declare const getMarketDetailsTabs: (labels: AggUiLabels) => {
+    value: MarketDetailsTab;
+    label: string;
+}[];
+export declare const marketDetailsDefaultIsOpened = false;
+export declare const orderBookRowLimitDefault = 4;

package/dist/types/events/market-details/market-details.constants.d.ts

@@ -0,0 +1,9 @@
+import type { AggUiLabels } from "@agg-build/hooks";
+import type { MarketDetailsTab } from "./market-details.types";
+export declare const marketDetailsBaseCardClassName = "w-full overflow-hidden rounded-agg-lg border border-agg-separator bg-agg-secondary text-agg-foreground shadow-none hover:shadow-none";
+export declare const getMarketDetailsTabs: (labels: AggUiLabels) => {
+    value: MarketDetailsTab;
+    label: string;
+}[];
+export declare const marketDetailsDefaultIsOpened = false;
+export declare const orderBookRowLimitDefault = 4;

package/dist/types/events/market-details/market-details.types.d.mts

@@ -0,0 +1,143 @@
+import type { EventTradingState, VenueMarket } from "@agg-build/hooks";
+import type React from "react";
+import type { VenueLogoName } from "../../primitives/venue-logo/venue-logo.types";
+export type MarketDetailsTab = "order-book" | "graph" | "other";
+export type MarketDetailsClassNames = Partial<{
+    root: string;
+    header: string;
+    tabs: string;
+    content: string;
+    orderBook: string;
+    graph: string;
+    footer: string;
+}>;
+export type MarketDetailsBaseProps = {
+    /** Market ID used to fetch or match the active market details. */
+    marketId?: string;
+    /** Title shown in the market details header. */
+    title?: string;
+    /** Optional image shown alongside the market header content. */
+    image?: string | null;
+    /** Whether the accordion item should start opened. */
+    defaultIsOpened?: boolean;
+    /** Controlled open state for the market details accordion item. */
+    isOpened?: boolean;
+    /** Called when the market details accordion is opened. */
+    onOpenChange?: (marketId: string) => void;
+    /** Called when the market details surface is clicked. */
+    onClick?: (market?: VenueMarket) => void;
+    /** Default tab shown when the details open. */
+    defaultTab?: MarketDetailsTab;
+    /** Default outcome label used for order book and graph context. */
+    defaultOutcomeLabel?: string;
+    /** Number of order book rows to show per side. */
+    orderBookDepth?: number;
+    /** Accessible label applied to the market details surface. */
+    ariaLabel?: string;
+    /** Class name overrides for market details layout slots. */
+    classNames?: MarketDetailsClassNames;
+    /** Custom content rendered in the "other" tab. */
+    otherContent?: React.ReactNode;
+    /** Whether the market details should render a loading state. */
+    isLoading?: boolean;
+    /** Override live WS subscriptions for chart and orderbook hooks.
+     *  Set to `false` when a parent component already manages subscriptions
+     *  (e.g. useEventOrderbookData on the event page).
+     *  Defaults to the global `enableLiveUpdates` feature flag. */
+    live?: boolean;
+};
+export type MarketDetailsLoadingProps = MarketDetailsBaseProps & {
+    /** Forces the market details component into its loading state. */
+    isLoading: true;
+    /** Prevents passing prefetched markets while loading. */
+    venueMarkets?: never;
+    /** Legacy event prop is not supported in loading mode. */
+    event?: never;
+    /** Optional event ID used to fetch market details while loading. */
+    eventId?: string;
+};
+export type MarketDetailsWithMarketsProps = MarketDetailsBaseProps & {
+    /** Venue markets to display. Replaces the old event-based data source. */
+    venueMarkets: VenueMarket[];
+    /** Legacy event prop is intentionally unsupported. */
+    event?: never;
+    /** Prevents mixing prefetched markets with event ID fetching. */
+    eventId?: never;
+    /** Marks the market details component as loaded. */
+    isLoading?: false;
+    /**
+     * Optional REST midpoints keyed by outcome id. Used as a fallback when the
+     * live (WebSocket) cache has no data for an outcome — typically because the
+     * card is not the selected market and therefore isn't on the WS feed.
+     */
+    midpointsFallback?: Map<string, number>;
+};
+export type MarketDetailsProps = MarketDetailsLoadingProps | MarketDetailsWithMarketsProps;
+export type MarketDetailsContentProps = MarketDetailsBaseProps & {
+    /** Prefetched venue markets rendered by the content component. */
+    venueMarkets: VenueMarket[];
+    /** See MarketDetailsWithMarketsProps.midpointsFallback. */
+    midpointsFallback?: Map<string, number>;
+};
+export type MarketDetailsListClassNames = Partial<{
+    root: string;
+    item: string;
+}>;
+export type MarketDetailsListProps = {
+    /** Venue event ID to fetch all markets for. */
+    eventId?: string;
+    /** Prefetched markets to render instead of fetching by event ID. */
+    markets?: VenueMarket[];
+    /** Shared event-level trading state passed from the page when already derived. */
+    eventTradingState?: EventTradingState;
+    /** Called when the expanded market changes. */
+    onExpandedMarketChange?: (marketId: string | null) => void;
+    /** Called when a market is clicked. */
+    onClick?: (market: VenueMarket) => void;
+    /** Default tab to display. */
+    defaultTab?: MarketDetailsTab;
+    /** Class names for the market details list. */
+    classNames?: MarketDetailsListClassNames;
+    /** Override live WS subscriptions for child MarketDetails.
+     *  Set to `false` when a parent manages subscriptions centrally. */
+    live?: boolean;
+};
+export type MarketDetailsOrderBookTone = "positive" | "negative";
+export type MarketDetailsOutcomeTone = MarketDetailsOrderBookTone;
+export type MarketDetailsHeaderOutcomeItem = {
+    id: string;
+    label: string;
+    probability: number | undefined;
+    tone: MarketDetailsOutcomeTone;
+    venue: VenueLogoName;
+};
+export type MarketDetailsOrderBookRow = {
+    id: string;
+    venues: VenueLogoName[];
+    price: number;
+    size: number;
+    total: number;
+    tone: MarketDetailsOrderBookTone;
+    barScale: number;
+    venueBreakdown?: Partial<Record<VenueLogoName, number>>;
+    sourceOutcomeIds?: string[];
+};
+export type MarketDetailsMetaRow = {
+    label: string;
+    value: string;
+};
+export type UnifiedOrderBookEntry = {
+    kind: "ask";
+    row: MarketDetailsOrderBookRow;
+    cumulativeDepth: number;
+    unifiedBarScale: number;
+} | {
+    kind: "bid";
+    row: MarketDetailsOrderBookRow;
+    cumulativeDepth: number;
+    unifiedBarScale: number;
+} | {
+    kind: "spread";
+    midPrice: number | null;
+    spread: number | null;
+};