@agg-market/ui 6.0.0 → 8.0.0

package/dist/chunk-UBBOLLOS.mjs

@@ -1,999 +0,0 @@
-import {
-  Select
-} from "./chunk-MHCHR65A.mjs";
-import {
-  __objRest,
-  __spreadProps,
-  __spreadValues,
-  cn,
-  getMotionClassName,
-  getScrollBehavior
-} from "./chunk-HI4EEDN5.mjs";
-
-// src/primitives/card/index.tsx
-import { useSdkUiConfig } from "@agg-market/hooks";
-import { jsx } from "react/jsx-runtime";
-var Card = (_a) => {
-  var _b = _a, { className, onClick } = _b, props = __objRest(_b, ["className", "onClick"]);
-  const { enableAnimations } = useSdkUiConfig();
-  return /* @__PURE__ */ 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/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/views/event-list-skeleton-view.tsx
-import { useLabels as useLabels2 } from "@agg-market/hooks";
-
-// src/primitives/skeleton/skeleton-block.tsx
-import { useSdkUiConfig as useSdkUiConfig2 } from "@agg-market/hooks";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var SkeletonBlock = ({ className }) => {
-  const { enableAnimations } = useSdkUiConfig2();
-  return /* @__PURE__ */ jsx2(
-    "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
-import { useLabels } from "@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
-import { jsx as jsx3, jsxs } from "react/jsx-runtime";
-var EventListItemSkeletonView = ({
-  className,
-  ariaLabel,
-  isStandalone = false
-}) => {
-  const labels = useLabels();
-  const outcomeTitleWidths = ["w-40", "w-[200px]"];
-  return /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex h-14 w-full items-center gap-3 justify-stretch", children: [
-          /* @__PURE__ */ jsx3(SkeletonBlock, { className: "size-10! rounded-agg-lg" }),
-          /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-6 w-fit flex-1 rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ jsx3("div", { className: "flex flex-col gap-3", children: outcomeTitleWidths.map((outcomeTitleWidth, index) => /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between gap-3", children: [
-          /* @__PURE__ */ jsx3(SkeletonBlock, { className: cn("h-5 rounded-agg-sm", outcomeTitleWidth) }),
-          /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" })
-        ] }, index)) }),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-5 text-agg-muted-foreground", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-            /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-5 w-[100px] rounded-agg-sm" }),
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ jsx3(SkeletonBlock, { className: "size-[14px] rounded-agg-sm" }),
-              /* @__PURE__ */ jsx3(SkeletonBlock, { className: "size-[14px] rounded-agg-sm" })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
-        ] })
-      ]
-    }
-  );
-};
-EventListItemSkeletonView.displayName = "EventListItemSkeletonView";
-
-// src/primitives/skeleton/views/event-list-skeleton-view.tsx
-import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
-var EventListSkeletonView = ({ className, ariaLabel }) => {
-  const labels = useLabels2();
-  return /* @__PURE__ */ jsxs2(
-    "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__ */ jsxs2("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__ */ jsx4(SkeletonBlock, { className: "h-7 w-[120px] rounded-agg-md" }),
-          /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-8 w-full rounded-agg-md md:w-[400px]" })
-        ] }),
-        /* @__PURE__ */ jsx4("div", { className: "grid grid-cols-1 gap-5 md:grid-cols-3", children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsx4(
-          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
-import { useLabels as useLabels3 } from "@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
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-var EventListItemDetailsSkeletonView = ({
-  className,
-  ariaLabel
-}) => {
-  const labels = useLabels3();
-  return /* @__PURE__ */ jsxs3(
-    Card,
-    {
-      className: cn("group/agg-skeleton", detailsBaseCardClassName, className),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : labels.eventItemDetails.loading,
-      "aria-busy": true,
-      children: [
-        /* @__PURE__ */ jsxs3("div", { className: "flex h-14 w-full items-center gap-3 justify-stretch", children: [
-          /* @__PURE__ */ jsx5(SkeletonBlock, { className: "size-10! rounded-agg-lg" }),
-          /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-6 w-fit flex-1 rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ jsxs3("div", { className: "flex w-full flex-col gap-4 md:gap-6", children: [
-          /* @__PURE__ */ jsxs3("div", { className: "flex w-full flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
-            /* @__PURE__ */ jsxs3("div", { className: "flex max-w-full gap-2 overflow-hidden", children: [
-              /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" }),
-              /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" }),
-              /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" })
-            ] }),
-            /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-9 w-full max-w-[221px] rounded-agg-full md:w-[221px]" })
-          ] }),
-          /* @__PURE__ */ jsxs3("div", { className: "flex w-full flex-col gap-3", children: [
-            /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-[220px] w-full rounded-agg-xl md:h-[240px]" }),
-            /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-5 w-[59px] rounded-agg-sm" }),
-              /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-5 w-40 rounded-agg-sm" })
-            ] })
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-EventListItemDetailsSkeletonView.displayName = "EventListItemDetailsSkeletonView";
-
-// src/primitives/skeleton/views/market-details-skeleton-view.tsx
-import { useLabels as useLabels4 } from "@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";
-var getMarketDetailsTabs = (labels) => {
-  return [
-    { value: "order-book", label: labels.marketDetails.tabs.orderBook },
-    { value: "graph", label: labels.marketDetails.tabs.graph }
-  ];
-};
-var marketDetailsDefaultIsOpened = false;
-var orderBookRowLimitDefault = 4;
-
-// src/primitives/skeleton/views/market-details-skeleton-view.tsx
-import { Fragment, jsx as jsx6, jsxs as jsxs4 } from "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__ */ jsxs4("div", { className: "flex flex-wrap items-center justify-between gap-3 px-4 py-3 md:px-5", children: [
-    /* @__PURE__ */ jsxs4("div", { className: "flex min-w-0 items-center gap-3 md:min-w-52 md:gap-4", children: [
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "size-12 rounded-agg-lg md:size-[60px]" }),
-      /* @__PURE__ */ jsxs4("div", { className: "flex min-w-0 flex-col gap-2", children: [
-        /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-6 w-[132px] rounded-agg-sm" }),
-        /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-4 w-[141px] rounded-agg-sm" })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-9 w-[60px] rounded-agg-md" }),
-    /* @__PURE__ */ jsxs4("div", { className: "flex w-full gap-2 md:w-auto", children: [
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-9 w-full rounded-agg-full md:w-[135px]" }),
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-9 w-full rounded-agg-full md:w-[131px]" })
-    ] })
-  ] });
-};
-var MarketDetailsTabsSkeleton = () => {
-  return /* @__PURE__ */ jsxs4("div", { className: "flex h-14 items-end px-4 md:px-5", children: [
-    /* @__PURE__ */ jsxs4("div", { className: "flex h-full flex-col items-end justify-end rounded-t-agg-lg", children: [
-      /* @__PURE__ */ jsx6("div", { className: "px-4 py-3", children: /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-6 w-20 rounded-agg-sm" }) }),
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-[3px] w-full rounded-t-agg-sm" })
-    ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "flex h-full flex-col justify-center", children: [
-      /* @__PURE__ */ jsx6("div", { className: "px-4 py-3", children: /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-6 w-12 rounded-agg-sm" }) }),
-      /* @__PURE__ */ jsx6("div", { className: "h-[3px] w-full" })
-    ] })
-  ] });
-};
-var MarketDetailsOrderBookRows = ({
-  side,
-  barWidths
-}) => {
-  return /* @__PURE__ */ jsx6("div", { className: "flex flex-col gap-2", children: barWidths.map((barWidthClassName, index) => /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ jsxs4("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__ */ jsxs4("div", { className: "flex items-center gap-1 md:gap-3", children: [
-        /* @__PURE__ */ jsx6(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
-        /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
-      ] }),
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 rounded-agg-sm" }),
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 rounded-agg-sm" }),
-      /* @__PURE__ */ jsx6("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx6(SkeletonBlock, { className: cn("h-2 rounded-agg-full", barWidthClassName) }) })
-    ] }),
-    index < barWidths.length - 1 ? /* @__PURE__ */ jsx6("div", { className: "h-px w-full bg-agg-separator" }) : null
-  ] }, `${side}-row-${index}`)) });
-};
-var MarketDetailsOderbookSkeleton = ({
-  className
-}) => {
-  return /* @__PURE__ */ jsxs4("div", { className: cn("flex flex-col gap-5", className), children: [
-    /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
-      /* @__PURE__ */ jsx6(MarketDetailsOrderBookRows, { side: "ask", barWidths: orderBookAskBarWidths })
-    ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
-      /* @__PURE__ */ jsx6(MarketDetailsOrderBookRows, { side: "bid", barWidths: orderBookBidBarWidths })
-    ] })
-  ] });
-};
-var MarketDetailsSkeletonView = ({
-  className,
-  ariaLabel,
-  isDetailed
-}) => {
-  const labels = useLabels4();
-  return /* @__PURE__ */ jsxs4(
-    Card,
-    {
-      className: cn("group/agg-skeleton", marketDetailsBaseCardClassName, className),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : labels.marketDetails.loading,
-      "aria-busy": true,
-      children: [
-        /* @__PURE__ */ jsx6(MarketDetailsHeaderSkeleton, {}),
-        isDetailed ? /* @__PURE__ */ jsxs4(Fragment, { children: [
-          /* @__PURE__ */ jsx6("div", { className: "h-px w-full bg-agg-separator" }),
-          /* @__PURE__ */ jsx6(MarketDetailsTabsSkeleton, {}),
-          /* @__PURE__ */ jsx6("div", { className: "h-px w-full bg-agg-separator" }),
-          /* @__PURE__ */ jsx6(MarketDetailsOderbookSkeleton, { className: "p-5" })
-        ] }) : null
-      ]
-    }
-  );
-};
-MarketDetailsSkeletonView.displayName = "MarketDetailsSkeletonView";
-
-// src/primitives/skeleton/views/place-order-skeleton-view.tsx
-import { jsx as jsx7, jsxs as jsxs5 } from "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__ */ jsxs5("div", { className: "flex w-full items-end border-b border-agg-border", children: [
-    /* @__PURE__ */ jsxs5("div", { className: "flex flex-col rounded-t-agg-lg", children: [
-      /* @__PURE__ */ jsx7("div", { className: "px-5 py-2", children: /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-6 w-10 rounded-agg-sm" }) }),
-      /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-[3px] w-full rounded-t-agg-sm" })
-    ] }),
-    /* @__PURE__ */ jsxs5("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsx7("div", { className: "px-5 py-2", children: /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-6 w-10 rounded-agg-sm" }) }),
-      /* @__PURE__ */ jsx7("div", { className: "h-[3px] w-full" })
-    ] })
-  ] });
-};
-var ContentBody = () => {
-  return /* @__PURE__ */ jsxs5("div", { className: cn("flex flex-col gap-6 p-5"), children: [
-    /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 items-center gap-3", children: [
-        /* @__PURE__ */ jsx7(SkeletonBlock, { className: "size-12 shrink-0 rounded-agg-lg" }),
-        /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
-          /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[92%] max-w-[240px] rounded-agg-sm" }),
-          /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[64%] max-w-[160px] rounded-agg-sm" })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-6 w-[92px] rounded-agg-sm" }),
-      /* @__PURE__ */ jsx7(TabsSkeletonBar, {})
-    ] }),
-    /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-4", children: [
-      /* @__PURE__ */ jsxs5("div", { className: "flex w-full gap-2", children: [
-        /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" }),
-        /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" })
-      ] }),
-      /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between gap-4", children: [
-        /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-5 w-[63px] rounded-agg-sm" }),
-          /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[118px] rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ jsx7("p", { className: cn("text-agg-3xl font-agg-bold leading-agg-9 text-agg-separator"), children: "$0" })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-12 w-full rounded-agg-full" }),
-    /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-full max-w-[240px] self-center rounded-agg-sm" })
-  ] });
-};
-var PlaceOrderSkeletonView = ({
-  className,
-  ariaLabel
-}) => {
-  return /* @__PURE__ */ jsx7(
-    "div",
-    {
-      className: cn("group/agg-skeleton", "w-full", className),
-      role: "status",
-      "aria-label": ariaLabel != null ? ariaLabel : "Loading place order",
-      "aria-busy": true,
-      children: /* @__PURE__ */ jsx7("div", { className: "flex w-full items-end justify-center", children: /* @__PURE__ */ jsx7(Card, { className: cn(placeOrderCardClassName, "w-full"), children: /* @__PURE__ */ jsx7(ContentBody, {}) }) })
-    }
-  );
-};
-PlaceOrderSkeletonView.displayName = "PlaceOrderSkeletonView";
-
-// src/primitives/skeleton/views/settlement-skeleton-view.tsx
-import { useLabels as useLabels5 } from "@agg-market/hooks";
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
-var SettlementSkeletonView = ({
-  className,
-  ariaLabel
-}) => {
-  const labels = useLabels5();
-  return /* @__PURE__ */ jsxs6(
-    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__ */ jsxs6("div", { className: "flex w-full items-center justify-between gap-4", children: [
-          /* @__PURE__ */ jsx8(SkeletonBlock, { className: "h-4 w-[81px] rounded-agg-sm" }),
-          /* @__PURE__ */ jsx8(SkeletonBlock, { className: "h-5 w-full max-w-[240px] rounded-agg-sm" })
-        ] }),
-        /* @__PURE__ */ jsxs6("div", { className: "flex w-full flex-col gap-3", children: [
-          /* @__PURE__ */ jsx8(SkeletonBlock, { className: "h-5 w-[200px] rounded-agg-sm" }),
-          /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2", children: [
-            /* @__PURE__ */ jsx8(SkeletonBlock, { className: "h-4 w-full max-w-[320px] rounded-agg-sm" }),
-            /* @__PURE__ */ jsx8(SkeletonBlock, { className: "h-4 w-full max-w-[280px] rounded-agg-sm" })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx8("div", { className: "h-px w-full bg-agg-separator" }),
-        /* @__PURE__ */ jsxs6("div", { className: "flex w-full flex-col gap-3", children: [
-          /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx8(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
-            /* @__PURE__ */ jsx8(SkeletonBlock, { className: "h-5 w-[100px] rounded-agg-sm" })
-          ] }),
-          /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx8(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
-            /* @__PURE__ */ jsx8(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-SettlementSkeletonView.displayName = "SettlementSkeletonView";
-
-// src/primitives/skeleton/index.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
-var Skeleton = ({ view, className, ariaLabel }) => {
-  if (view === skeletonViews.eventListItem) {
-    return /* @__PURE__ */ jsx9(EventListItemSkeletonView, { className, ariaLabel, isStandalone: true });
-  }
-  if (view === skeletonViews.eventListItemDetails) {
-    return /* @__PURE__ */ jsx9(EventListItemDetailsSkeletonView, { className, ariaLabel });
-  }
-  if (view === skeletonViews.marketDetailsMinified) {
-    return /* @__PURE__ */ jsx9(MarketDetailsSkeletonView, { className, ariaLabel, isDetailed: false });
-  }
-  if (view === skeletonViews.marketDetailsDetailed) {
-    return /* @__PURE__ */ jsx9(MarketDetailsSkeletonView, { className, ariaLabel, isDetailed: true });
-  }
-  if (view === skeletonViews.settlement) {
-    return /* @__PURE__ */ jsx9(SettlementSkeletonView, { className, ariaLabel });
-  }
-  if (view === skeletonViews.placeOrder) {
-    return /* @__PURE__ */ jsx9(PlaceOrderSkeletonView, { className, ariaLabel });
-  }
-  return /* @__PURE__ */ jsx9(EventListSkeletonView, { className, ariaLabel });
-};
-Skeleton.displayName = "Skeleton";
-
-// src/primitives/tabs/index.tsx
-import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { useLabels as useLabels6, useSdkUiConfig as useSdkUiConfig3 } from "@agg-market/hooks";
-
-// src/primitives/tabs/tabs.utils.ts
-var findNextEnabledIndex = (items, startIndex, direction) => {
-  var _a;
-  if (items.length === 0)
-    return -1;
-  for (let step = 1; step <= items.length; step += 1) {
-    const nextIndex = (startIndex + direction * step + items.length) % items.length;
-    if (!((_a = items[nextIndex]) == null ? void 0 : _a.disabled))
-      return nextIndex;
-  }
-  return -1;
-};
-var findEdgeEnabledIndex = (items, direction) => {
-  var _a;
-  if (direction === 1) {
-    return items.findIndex((item) => !item.disabled);
-  }
-  for (let index = items.length - 1; index >= 0; index -= 1) {
-    if (!((_a = items[index]) == null ? void 0 : _a.disabled))
-      return index;
-  }
-  return -1;
-};
-
-// src/primitives/tabs/index.tsx
-import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
-var mobileTabsMediaQuery = "(max-width: 512px)";
-var getTabButtonClassName = ({
-  enableAnimations,
-  isBarVariant,
-  isActive,
-  isDisabled,
-  size
-}) => {
-  const isSmall = size === "s";
-  return cn(
-    "cursor-pointer disabled:cursor-not-allowed",
-    "relative inline-flex h-full shrink-0 items-center justify-center gap-2 font-agg-sans",
-    isBarVariant ? "hover:text-agg-foreground hover:bg-agg-secondary-hover" : "hover:text-agg-foreground hover:font-bold",
-    getMotionClassName(
-      enableAnimations,
-      "transition-[colors] duration-300 ease-in-out motion-reduce:transition-none"
-    ),
-    isBarVariant ? cn(
-      "min-w-20 overflow-hidden border-r border-agg-separator last:border-r-0",
-      isSmall ? "px-3 text-agg-sm leading-agg-5" : "px-4 text-agg-base leading-agg-6"
-    ) : cn(isSmall ? "px-4 text-agg-sm leading-agg-5" : "px-5 text-agg-base leading-agg-6"),
-    isBarVariant && isActive && "font-agg-bold text-agg-primary",
-    isBarVariant && !isActive && "font-agg-normal text-agg-foreground",
-    !isBarVariant && isActive && "font-agg-bold text-agg-primary",
-    !isBarVariant && !isActive && "font-agg-normal text-agg-foreground",
-    isDisabled && "cursor-not-allowed opacity-60"
-  );
-};
-var Tabs = ({
-  items,
-  value,
-  onChange,
-  variant = "bar",
-  size = "m",
-  overflowBehavior,
-  ariaLabel,
-  className,
-  classNames
-}) => {
-  const labels = useLabels6();
-  const { enableAnimations } = useSdkUiConfig3();
-  const buttonRefs = useRef([]);
-  const dragStateRef = useRef({
-    isPointerDown: false,
-    isDragging: false,
-    pointerId: null,
-    startClientX: 0,
-    startClientY: 0,
-    startScrollLeft: 0
-  });
-  const suppressClickRef = useRef(false);
-  const resolvedAriaLabel = ariaLabel != null ? ariaLabel : labels.common.tabsAria;
-  const [isMobileViewport, setIsMobileViewport] = useState(false);
-  const [isDraggingTabs, setIsDraggingTabs] = useState(false);
-  const [activeUnderlineStyle, setActiveUnderlineStyle] = useState({
-    transform: "translateX(0px)",
-    width: 0,
-    opacity: 0
-  });
-  const [scrollAffordanceState, setScrollAffordanceState] = useState({
-    showStart: false,
-    showEnd: false
-  });
-  const tabListRef = useRef(null);
-  const isBarVariant = variant === "bar";
-  const resolvedOverflowBehavior = useMemo(() => {
-    if (overflowBehavior)
-      return overflowBehavior;
-    if (!isBarVariant)
-      return "scroll";
-    return isMobileViewport ? "select" : "scroll";
-  }, [isBarVariant, isMobileViewport, overflowBehavior]);
-  const shouldUseOverflowScroll = resolvedOverflowBehavior === "scroll";
-  const shouldUseOverflowSelect = resolvedOverflowBehavior === "select";
-  useEffect(() => {
-    if (typeof window === "undefined")
-      return;
-    const mediaQueryList = window.matchMedia(mobileTabsMediaQuery);
-    const handleMediaQueryChange = (event) => {
-      setIsMobileViewport(event.matches);
-    };
-    handleMediaQueryChange(mediaQueryList);
-    if (typeof mediaQueryList.addEventListener === "function") {
-      mediaQueryList.addEventListener("change", handleMediaQueryChange);
-      return () => {
-        mediaQueryList.removeEventListener("change", handleMediaQueryChange);
-      };
-    }
-    mediaQueryList.addListener(handleMediaQueryChange);
-    return () => {
-      mediaQueryList.removeListener(handleMediaQueryChange);
-    };
-  }, []);
-  const updateScrollAffordances = useCallback(() => {
-    if (!shouldUseOverflowScroll) {
-      setScrollAffordanceState({
-        showStart: false,
-        showEnd: false
-      });
-      return;
-    }
-    const tabListElement = tabListRef.current;
-    if (!tabListElement)
-      return;
-    const maxScrollLeft = tabListElement.scrollWidth - tabListElement.clientWidth;
-    setScrollAffordanceState({
-      showStart: tabListElement.scrollLeft > 4,
-      showEnd: maxScrollLeft - tabListElement.scrollLeft > 4
-    });
-  }, [shouldUseOverflowScroll]);
-  const renderedItems = items;
-  const selectItems = useMemo(() => {
-    return items.map((item) => ({
-      value: item.value,
-      label: item.label,
-      disabled: item.disabled
-    }));
-  }, [items]);
-  const isSelectDisabled = !items.some((item) => !item.disabled);
-  const handleSelect = (nextValue) => {
-    if (nextValue === value)
-      return;
-    onChange(nextValue);
-  };
-  const handleMoveFocus = (index) => {
-    var _a;
-    if (index < 0)
-      return;
-    const nextItem = renderedItems[index];
-    if (!nextItem)
-      return;
-    handleSelect(nextItem.value);
-    (_a = buttonRefs.current[index]) == null ? void 0 : _a.focus();
-  };
-  const handleKeyDown = (event, index) => {
-    switch (event == null ? void 0 : event.key) {
-      case "ArrowRight": {
-        event == null ? void 0 : event.preventDefault();
-        handleMoveFocus(findNextEnabledIndex(renderedItems, index, 1));
-        return;
-      }
-      case "ArrowLeft": {
-        event == null ? void 0 : event.preventDefault();
-        handleMoveFocus(findNextEnabledIndex(renderedItems, index, -1));
-        return;
-      }
-      case "Home": {
-        event == null ? void 0 : event.preventDefault();
-        handleMoveFocus(findEdgeEnabledIndex(renderedItems, 1));
-        return;
-      }
-      case "End": {
-        event == null ? void 0 : event.preventDefault();
-        handleMoveFocus(findEdgeEnabledIndex(renderedItems, -1));
-        return;
-      }
-      default:
-        return;
-    }
-  };
-  const tabListClassName = cn(
-    "inline-flex items-stretch bg-agg-secondary",
-    shouldUseOverflowScroll ? cn(
-      "overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
-      getMotionClassName(enableAnimations, "scroll-smooth")
-    ) : "overflow-x-auto",
-    isBarVariant ? "h-8 rounded-agg-sm border border-agg-separator" : "h-12 border-b border-agg-separator -mb-[1px]",
-    shouldUseOverflowScroll && "select-none",
-    shouldUseOverflowScroll && !isBarVariant && "snap-x snap-mandatory",
-    shouldUseOverflowScroll && (isDraggingTabs ? "cursor-grabbing" : "cursor-grab")
-  );
-  const handleTabListWheel = (event) => {
-    if (!shouldUseOverflowScroll)
-      return;
-    const tabListElement = event.currentTarget;
-    if (tabListElement.scrollWidth <= tabListElement.clientWidth)
-      return;
-    if (Math.abs(event.deltaX) > Math.abs(event.deltaY))
-      return;
-    event.preventDefault();
-    tabListElement.scrollLeft += event.deltaY;
-  };
-  const handleTabListPointerDown = (event) => {
-    if (!shouldUseOverflowScroll)
-      return;
-    if (event.pointerType !== "mouse")
-      return;
-    if (event.button !== 0)
-      return;
-    const tabListElement = tabListRef.current;
-    if (!tabListElement)
-      return;
-    if (tabListElement.scrollWidth <= tabListElement.clientWidth)
-      return;
-    dragStateRef.current = {
-      isPointerDown: true,
-      isDragging: false,
-      pointerId: event.pointerId,
-      startClientX: event.clientX,
-      startClientY: event.clientY,
-      startScrollLeft: tabListElement.scrollLeft
-    };
-  };
-  const handleTabListPointerMove = (event) => {
-    if (!shouldUseOverflowScroll)
-      return;
-    const dragState = dragStateRef.current;
-    const tabListElement = tabListRef.current;
-    if (!dragState.isPointerDown)
-      return;
-    if (dragState.pointerId !== event.pointerId)
-      return;
-    if (!tabListElement)
-      return;
-    const deltaX = event.clientX - dragState.startClientX;
-    const deltaY = event.clientY - dragState.startClientY;
-    const horizontalDistance = Math.abs(deltaX);
-    const verticalDistance = Math.abs(deltaY);
-    const hasExceededDragThreshold = horizontalDistance > 10 && horizontalDistance > verticalDistance;
-    if (hasExceededDragThreshold && !dragState.isDragging) {
-      dragState.isDragging = true;
-      setIsDraggingTabs(true);
-      tabListElement.setPointerCapture(event.pointerId);
-    }
-    if (!dragState.isDragging)
-      return;
-    event.preventDefault();
-    tabListElement.scrollLeft = dragState.startScrollLeft - deltaX;
-  };
-  const handleEndTabListDrag = (event) => {
-    const dragState = dragStateRef.current;
-    const tabListElement = tabListRef.current;
-    if (!dragState.isPointerDown)
-      return;
-    if (dragState.pointerId !== event.pointerId)
-      return;
-    if (tabListElement == null ? void 0 : tabListElement.hasPointerCapture(event.pointerId)) {
-      tabListElement.releasePointerCapture(event.pointerId);
-    }
-    if (dragState.isDragging) {
-      suppressClickRef.current = true;
-      window.setTimeout(() => {
-        suppressClickRef.current = false;
-      }, 0);
-    }
-    dragStateRef.current = {
-      isPointerDown: false,
-      isDragging: false,
-      pointerId: null,
-      startClientX: 0,
-      startClientY: 0,
-      startScrollLeft: 0
-    };
-    setIsDraggingTabs(false);
-  };
-  const handleTabListClickCapture = (event) => {
-    if (!suppressClickRef.current)
-      return;
-    event == null ? void 0 : event.preventDefault();
-    event == null ? void 0 : event.stopPropagation();
-    suppressClickRef.current = false;
-  };
-  const updateActiveUnderline = useCallback(() => {
-    if (isBarVariant) {
-      setActiveUnderlineStyle({
-        transform: "translateX(0px)",
-        width: 0,
-        opacity: 0
-      });
-      return;
-    }
-    const activeIndex = renderedItems.findIndex((item) => item.value === value);
-    const activeButton = activeIndex >= 0 ? buttonRefs.current[activeIndex] : null;
-    if (!activeButton || !tabListRef.current) {
-      setActiveUnderlineStyle((currentStyle) => __spreadProps(__spreadValues({}, currentStyle), {
-        opacity: 0
-      }));
-      return;
-    }
-    setActiveUnderlineStyle({
-      transform: `translateX(${activeButton.offsetLeft}px)`,
-      width: activeButton.offsetWidth,
-      opacity: 1
-    });
-  }, [isBarVariant, renderedItems, value]);
-  useLayoutEffect(() => {
-    updateActiveUnderline();
-  }, [updateActiveUnderline]);
-  useEffect(() => {
-    if (isBarVariant || !shouldUseOverflowScroll)
-      return;
-    const tabListElement = tabListRef.current;
-    if (!tabListElement)
-      return;
-    const handleScroll = () => {
-      updateActiveUnderline();
-      updateScrollAffordances();
-    };
-    tabListElement.addEventListener("scroll", handleScroll, { passive: true });
-    updateScrollAffordances();
-    return () => {
-      tabListElement.removeEventListener("scroll", handleScroll);
-    };
-  }, [isBarVariant, shouldUseOverflowScroll, updateActiveUnderline, updateScrollAffordances]);
-  useEffect(() => {
-    if (!shouldUseOverflowScroll)
-      return;
-    updateScrollAffordances();
-  }, [renderedItems, shouldUseOverflowScroll, updateScrollAffordances, value]);
-  useEffect(() => {
-    if (isBarVariant && !shouldUseOverflowScroll)
-      return;
-    if (typeof ResizeObserver === "undefined")
-      return;
-    const tabListElement = tabListRef.current;
-    if (!tabListElement)
-      return;
-    const resizeObserver = new ResizeObserver(() => {
-      updateActiveUnderline();
-      updateScrollAffordances();
-    });
-    resizeObserver.observe(tabListElement);
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, [isBarVariant, shouldUseOverflowScroll, updateActiveUnderline, updateScrollAffordances]);
-  useEffect(() => {
-    if (!shouldUseOverflowScroll)
-      return;
-    const tabListElement = tabListRef.current;
-    if (!tabListElement)
-      return;
-    const activeIndex = renderedItems.findIndex((item) => item.value === value);
-    const activeButton = activeIndex >= 0 ? buttonRefs.current[activeIndex] : null;
-    if (!activeButton)
-      return;
-    if (tabListElement.scrollWidth - tabListElement.clientWidth <= 1)
-      return;
-    const currentScrollLeft = tabListElement.scrollLeft;
-    const currentScrollRight = currentScrollLeft + tabListElement.clientWidth;
-    const activeButtonLeft = activeButton.offsetLeft;
-    const activeButtonRight = activeButtonLeft + activeButton.offsetWidth;
-    let nextScrollLeft = currentScrollLeft;
-    if (activeButtonLeft < currentScrollLeft) {
-      nextScrollLeft = activeButtonLeft;
-    } else if (activeButtonRight > currentScrollRight) {
-      nextScrollLeft = activeButtonRight - tabListElement.clientWidth;
-    }
-    if (Math.abs(nextScrollLeft - currentScrollLeft) < 1)
-      return;
-    tabListElement.scrollTo({
-      left: Math.max(0, nextScrollLeft),
-      behavior: getScrollBehavior(enableAnimations)
-    });
-  }, [enableAnimations, renderedItems, shouldUseOverflowScroll, value]);
-  if (shouldUseOverflowSelect) {
-    return /* @__PURE__ */ jsx10("div", { className: cn("w-full", className, classNames == null ? void 0 : classNames.root), children: /* @__PURE__ */ jsx10(
-      Select,
-      {
-        ariaLabel,
-        className: "w-full",
-        disabled: isSelectDisabled,
-        items: selectItems,
-        onChange: handleSelect,
-        value
-      }
-    ) });
-  }
-  return /* @__PURE__ */ jsxs7(
-    "div",
-    {
-      className: cn(
-        "group/agg-tabs",
-        "relative max-w-full items-stretch font-agg-sans bg-agg-secondary",
-        "inline-flex",
-        className,
-        classNames == null ? void 0 : classNames.root
-      ),
-      children: [
-        /* @__PURE__ */ jsxs7(
-          "div",
-          {
-            ref: tabListRef,
-            role: "tablist",
-            "aria-label": resolvedAriaLabel,
-            className: cn("relative", tabListClassName, classNames == null ? void 0 : classNames.tabList),
-            onClickCapture: handleTabListClickCapture,
-            onPointerCancel: handleEndTabListDrag,
-            onPointerDown: handleTabListPointerDown,
-            onPointerMove: handleTabListPointerMove,
-            onPointerUp: handleEndTabListDrag,
-            onWheel: handleTabListWheel,
-            children: [
-              renderedItems.map((item, index) => {
-                const isActive = item.value === value;
-                return /* @__PURE__ */ jsxs7(
-                  "button",
-                  {
-                    ref: (buttonElement) => {
-                      buttonRefs.current[index] = buttonElement;
-                    },
-                    type: "button",
-                    role: "tab",
-                    tabIndex: isActive ? 0 : -1,
-                    "aria-selected": isActive,
-                    "aria-label": item.label,
-                    disabled: item.disabled,
-                    onClick: (e) => {
-                      e.preventDefault();
-                      e.stopPropagation();
-                      handleSelect(item.value);
-                    },
-                    onKeyDown: (event) => handleKeyDown(event, index),
-                    className: cn(
-                      getTabButtonClassName({
-                        enableAnimations,
-                        isBarVariant,
-                        isActive,
-                        isDisabled: !!item.disabled,
-                        size
-                      }),
-                      shouldUseOverflowScroll && !isBarVariant && "snap-start"
-                    ),
-                    children: [
-                      isBarVariant ? /* @__PURE__ */ jsx10(Fragment2, { children: /* @__PURE__ */ jsx10(
-                        "span",
-                        {
-                          "aria-hidden": true,
-                          className: cn(
-                            "pointer-events-none absolute inset-px origin-bottom rounded-[2px] bg-agg-secondary-hover",
-                            getMotionClassName(
-                              enableAnimations,
-                              "transition-[transform,opacity] duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] motion-reduce:transition-none"
-                            ),
-                            isActive ? "scale-y-100 opacity-100" : "scale-y-0 opacity-0"
-                          )
-                        }
-                      ) }) : null,
-                      item.icon ? /* @__PURE__ */ jsx10("span", { className: "relative z-10 inline-flex shrink-0 items-center justify-center", children: item.icon }) : null,
-                      /* @__PURE__ */ jsx10("span", { className: "relative z-10 truncate whitespace-nowrap [&::first-letter]:uppercase", children: item.label })
-                    ]
-                  },
-                  item.value
-                );
-              }),
-              !isBarVariant ? /* @__PURE__ */ jsx10(
-                "span",
-                {
-                  "aria-hidden": true,
-                  className: cn(
-                    "pointer-events-none absolute bottom-0 left-0 rounded-t-agg-sm bg-agg-primary",
-                    getMotionClassName(
-                      enableAnimations,
-                      "transition-[transform,width,opacity] duration-300 ease-in-out"
-                    ),
-                    "h-[3px]"
-                  ),
-                  style: activeUnderlineStyle
-                }
-              ) : null
-            ]
-          }
-        ),
-        shouldUseOverflowScroll && !isBarVariant ? /* @__PURE__ */ jsxs7(Fragment2, { children: [
-          /* @__PURE__ */ jsx10(
-            "span",
-            {
-              "aria-hidden": true,
-              className: cn(
-                "pointer-events-none absolute top-0 bottom-0 left-8 z-10 w-12 md:w-18 bg-linear-to-r from-agg-secondary via-agg-secondary to-transparent",
-                getMotionClassName(enableAnimations, "transition-opacity duration-200"),
-                scrollAffordanceState.showStart ? "opacity-100" : "opacity-0"
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx10(
-            "span",
-            {
-              "aria-hidden": true,
-              className: cn(
-                "pointer-events-none absolute top-0 right-8 bottom-0 z-10 w-12 md:w-18 bg-linear-to-l from-agg-secondary via-agg-secondary to-transparent",
-                getMotionClassName(enableAnimations, "transition-opacity duration-200"),
-                scrollAffordanceState.showEnd ? "opacity-100" : "opacity-0"
-              )
-            }
-          )
-        ] }) : null
-      ]
-    }
-  );
-};
-Tabs.displayName = "Tabs";
-
-export {
-  Card,
-  baseCardClassName,
-  detailsBaseCardClassName,
-  eventListItemDetailsTimeRanges,
-  lineColorByVenue,
-  fallbackLineColors,
-  marketDetailsBaseCardClassName,
-  getMarketDetailsTabs,
-  marketDetailsDefaultIsOpened,
-  orderBookRowLimitDefault,
-  MarketDetailsOderbookSkeleton,
-  skeletonViews,
-  Skeleton,
-  Tabs
-};