@agg-market/ui 3.0.0 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/dist/chart.js +18 -5
  2. package/dist/chart.mjs +2 -2
  3. package/dist/{chunk-LK5D3ZTK.mjs → chunk-3QLOUBDJ.mjs} +1 -1
  4. package/dist/{chunk-4KMFDCAH.mjs → chunk-3W7NBJLU.mjs} +2 -2
  5. package/dist/{chunk-KCPDVBIZ.mjs → chunk-4S3I6X7F.mjs} +14 -13
  6. package/dist/{chunk-OA2IZ3VW.mjs → chunk-5ADMXO3Y.mjs} +1 -1
  7. package/dist/{chunk-7NISYVSJ.mjs → chunk-6JG6I5AY.mjs} +1 -1
  8. package/dist/{chunk-TA7LKYKP.mjs → chunk-DCORNTCY.mjs} +1 -1
  9. package/dist/{chunk-QYZKC7KG.mjs → chunk-GNSPZ53C.mjs} +87 -86
  10. package/dist/{chunk-422MCIXV.mjs → chunk-HOXTJ742.mjs} +15 -11
  11. package/dist/{chunk-KFOATMAE.mjs → chunk-JNH64AKR.mjs} +32 -25
  12. package/dist/{chunk-DL7STJQ5.mjs → chunk-LA3FBBSJ.mjs} +3 -3
  13. package/dist/{chunk-CTVMT3VL.mjs → chunk-LCZKSITC.mjs} +2 -2
  14. package/dist/chunk-M4RJHRFT.mjs +445 -0
  15. package/dist/{chunk-D5FTFSKL.mjs → chunk-MBHTXNHX.mjs} +4 -4
  16. package/dist/{chunk-O46OFVH6.mjs → chunk-MJHKBCXQ.mjs} +2 -2
  17. package/dist/{chunk-2MJY6RVY.mjs → chunk-NH2G3POM.mjs} +1 -1
  18. package/dist/{chunk-BEDUFOIG.mjs → chunk-OH56VUYK.mjs} +6 -20
  19. package/dist/{chunk-BN5VVHNV.mjs → chunk-OJVTGNIF.mjs} +17 -4
  20. package/dist/{chunk-6425RRBI.mjs → chunk-P2PJBO5C.mjs} +1 -1
  21. package/dist/{chunk-D7JTOGYP.mjs → chunk-PORVP72S.mjs} +22 -2
  22. package/dist/{chunk-5GDNWQZS.mjs → chunk-QLMVKLNJ.mjs} +1 -1
  23. package/dist/{chunk-GHB3GOCW.mjs → chunk-QM7CGMFG.mjs} +5 -21
  24. package/dist/connect-button.js +22 -2
  25. package/dist/connect-button.mjs +2 -2
  26. package/dist/deposit-modal.js +22 -2
  27. package/dist/deposit-modal.mjs +2 -2
  28. package/dist/event-list-item-details.js +235 -243
  29. package/dist/event-list-item-details.mjs +7 -7
  30. package/dist/event-list-item.js +178 -210
  31. package/dist/event-list-item.mjs +4 -4
  32. package/dist/event-list.js +181 -225
  33. package/dist/event-list.mjs +5 -5
  34. package/dist/event-market-page.d.mts +1 -1
  35. package/dist/event-market-page.d.ts +1 -1
  36. package/dist/event-market-page.js +498 -576
  37. package/dist/event-market-page.mjs +11 -12
  38. package/dist/home-page.js +181 -225
  39. package/dist/home-page.mjs +6 -6
  40. package/dist/index.d.mts +3 -3
  41. package/dist/index.d.ts +3 -3
  42. package/dist/index.js +331 -347
  43. package/dist/index.mjs +21 -21
  44. package/dist/market-details.d.mts +1 -1
  45. package/dist/market-details.d.ts +1 -1
  46. package/dist/market-details.js +345 -417
  47. package/dist/market-details.mjs +7 -8
  48. package/dist/onboarding-modal.js +35 -14
  49. package/dist/onboarding-modal.mjs +2 -2
  50. package/dist/place-order.d.mts +1 -1
  51. package/dist/place-order.d.ts +1 -1
  52. package/dist/place-order.js +173 -191
  53. package/dist/place-order.mjs +3 -3
  54. package/dist/profile-modal.js +22 -2
  55. package/dist/profile-modal.mjs +2 -2
  56. package/dist/search.d.mts +1 -1
  57. package/dist/search.d.ts +1 -1
  58. package/dist/search.js +22 -2
  59. package/dist/search.mjs +2 -2
  60. package/dist/settlement.d.mts +1 -1
  61. package/dist/settlement.d.ts +1 -1
  62. package/dist/settlement.js +173 -191
  63. package/dist/settlement.mjs +3 -3
  64. package/dist/skeleton.js +151 -189
  65. package/dist/skeleton.mjs +1 -1
  66. package/dist/styles.css +1 -1
  67. package/dist/switch-button.js +2 -2
  68. package/dist/switch-button.mjs +1 -1
  69. package/dist/tailwind.css +1 -1
  70. package/dist/user-profile-page.d.mts +1 -1
  71. package/dist/user-profile-page.d.ts +1 -1
  72. package/dist/user-profile-page.js +22 -2
  73. package/dist/user-profile-page.mjs +2 -2
  74. package/dist/venue-logo.d.mts +3 -2
  75. package/dist/venue-logo.d.ts +3 -2
  76. package/dist/venue-logo.js +22 -2
  77. package/dist/venue-logo.mjs +1 -1
  78. package/dist/{venue-logo.types-HRf1yBLD.d.mts → venue-logo.types-CGUc22ly.d.mts} +3 -1
  79. package/dist/{venue-logo.types-D8Cu2rAm.d.ts → venue-logo.types-Dqr39S1-.d.ts} +3 -1
  80. package/dist/withdraw-modal.js +22 -2
  81. package/dist/withdraw-modal.mjs +2 -2
  82. package/package.json +2 -2
  83. package/dist/chunk-V52WSZHQ.mjs +0 -482
  84. package/dist/{types-JBf1DZlH.d.ts → types-DkGlbmXq.d.mts} +2 -2
  85. package/dist/{types-JBf1DZlH.d.mts → types-DkGlbmXq.d.ts} +2 -2
@@ -1579,6 +1579,7 @@ var EventListItemSkeletonView = ({
1579
1579
  isStandalone = false
1580
1580
  }) => {
1581
1581
  const labels = (0, import_hooks4.useLabels)();
1582
+ const outcomeTitleWidths = ["w-40", "w-[200px]"];
1582
1583
  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
1583
1584
  Card,
1584
1585
  {
@@ -1588,35 +1589,23 @@ var EventListItemSkeletonView = ({
1588
1589
  "aria-busy": isStandalone || void 0,
1589
1590
  "aria-hidden": isStandalone ? void 0 : true,
1590
1591
  children: [
1591
- /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex w-full items-start gap-3", children: [
1592
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-10 w-10 rounded-agg-lg" }),
1593
- /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex flex-1 flex-col gap-2", children: [
1594
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-5 w-[82%] rounded-agg-sm" }),
1595
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-5 w-[68%] rounded-agg-sm" })
1596
- ] })
1592
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex h-14 w-full items-center gap-3 justify-stretch", children: [
1593
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "size-10! rounded-agg-lg" }),
1594
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-6 w-fit flex-1 rounded-agg-sm" })
1597
1595
  ] }),
1598
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex flex-col gap-3", children: [0, 1].map((index) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
1599
- "div",
1600
- {
1601
- className: "grid w-full grid-cols-[minmax(0,1fr)_auto_auto] items-center gap-3",
1602
- children: [
1603
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
1604
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
1605
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-9 w-[101px] rounded-agg-full" })
1606
- ]
1607
- },
1608
- index
1609
- )) }),
1610
- /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center justify-between gap-2 text-agg-muted-foreground", children: [
1611
- /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center gap-2", children: [
1612
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-4 w-36 rounded-agg-sm" }),
1596
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex flex-col gap-3", children: outcomeTitleWidths.map((outcomeTitleWidth, index) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex w-full items-center justify-between gap-3", children: [
1597
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: cn("h-5 rounded-agg-sm", outcomeTitleWidth) }),
1598
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" })
1599
+ ] }, index)) }),
1600
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center justify-between gap-5 text-agg-muted-foreground", children: [
1601
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
1602
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-5 w-[100px] rounded-agg-sm" }),
1613
1603
  /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center gap-1", children: [
1614
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "size-3 rounded-agg-full" }),
1615
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "size-3 rounded-agg-full" }),
1616
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "size-3 rounded-agg-full" })
1604
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "size-[14px] rounded-agg-sm" }),
1605
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "size-[14px] rounded-agg-sm" })
1617
1606
  ] })
1618
1607
  ] }),
1619
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-4 w-20 rounded-agg-sm" })
1608
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
1620
1609
  ] })
1621
1610
  ]
1622
1611
  }
@@ -1636,13 +1625,9 @@ var EventListSkeletonView = ({ className, ariaLabel }) => {
1636
1625
  "aria-label": ariaLabel != null ? ariaLabel : labels.eventList.loading("events"),
1637
1626
  "aria-busy": true,
1638
1627
  children: [
1639
- /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("header", { className: "flex w-full flex-col items-start justify-between gap-2 md:flex-row md:flex-nowrap md:items-center md:gap-4", children: [
1640
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(SkeletonBlock, { className: "h-7 w-40 rounded-agg-sm" }),
1641
- /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex max-w-full gap-2", children: [
1642
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(SkeletonBlock, { className: "h-10 w-20 rounded-agg-full" }),
1643
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(SkeletonBlock, { className: "h-10 w-20 rounded-agg-full" }),
1644
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(SkeletonBlock, { className: "h-10 w-24 rounded-agg-full" })
1645
- ] })
1628
+ /* @__PURE__ */ (0, import_jsx_runtime47.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: [
1629
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(SkeletonBlock, { className: "h-7 w-[120px] rounded-agg-md" }),
1630
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(SkeletonBlock, { className: "h-8 w-full rounded-agg-md md:w-[400px]" })
1646
1631
  ] }),
1647
1632
  /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "grid grid-cols-1 gap-5 md:grid-cols-3", children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
1648
1633
  EventListItemSkeletonView,
@@ -1679,30 +1664,26 @@ var EventListItemDetailsSkeletonView = ({
1679
1664
  "aria-label": ariaLabel != null ? ariaLabel : labels.eventItemDetails.loading,
1680
1665
  "aria-busy": true,
1681
1666
  children: [
1682
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex w-full items-start gap-3 md:gap-4", children: [
1683
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "size-10 rounded-agg-lg md:size-[60px]" }),
1684
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex flex-1 flex-col gap-2", children: [
1685
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-5 w-[82%] rounded-agg-sm md:h-7 md:w-[55%]" }),
1686
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex gap-2 overflow-hidden", children: [
1687
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-8 w-28 rounded-agg-full" }),
1688
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-8 w-28 rounded-agg-full" }),
1689
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-8 w-28 rounded-agg-full" })
1690
- ] })
1691
- ] })
1667
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex h-14 w-full items-center gap-3 justify-stretch", children: [
1668
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "size-10! rounded-agg-lg" }),
1669
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-6 w-fit flex-1 rounded-agg-sm" })
1692
1670
  ] }),
1693
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex flex-col gap-4", children: [
1694
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-10 w-full rounded-agg-full md:w-[220px]" }),
1695
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex gap-2 overflow-hidden", children: [
1696
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" }),
1697
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" }),
1698
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" }),
1699
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" })
1671
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex w-full flex-col gap-4 md:gap-6", children: [
1672
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex w-full flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
1673
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex max-w-full gap-2 overflow-hidden", children: [
1674
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" }),
1675
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" }),
1676
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-[100px] rounded-agg-full" })
1677
+ ] }),
1678
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-9 w-full max-w-[221px] rounded-agg-full md:w-[221px]" })
1679
+ ] }),
1680
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
1681
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-[220px] w-full rounded-agg-xl md:h-[240px]" }),
1682
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex items-center justify-between", children: [
1683
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-5 w-[59px] rounded-agg-sm" }),
1684
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-5 w-40 rounded-agg-sm" })
1685
+ ] })
1700
1686
  ] })
1701
- ] }),
1702
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "h-[300px] w-full rounded-agg-xl", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-full w-full rounded-agg-xl" }) }),
1703
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex items-center justify-between", children: [
1704
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-5 w-24 rounded-agg-sm" }),
1705
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SkeletonBlock, { className: "h-5 w-40 rounded-agg-sm" })
1706
1687
  ] })
1707
1688
  ]
1708
1689
  }
@@ -1718,6 +1699,77 @@ var marketDetailsBaseCardClassName = "w-full overflow-hidden rounded-agg-lg bord
1718
1699
 
1719
1700
  // src/primitives/skeleton/views/market-details-skeleton-view.tsx
1720
1701
  var import_jsx_runtime49 = require("react/jsx-runtime");
1702
+ var orderBookAskBarWidths = [
1703
+ "w-[52px] md:w-[240px]",
1704
+ "w-[48px] md:w-[200px]",
1705
+ "w-[40px] md:w-[120px]",
1706
+ "w-[36px] md:w-[60px]"
1707
+ ];
1708
+ var orderBookBidBarWidths = [
1709
+ "w-[36px] md:w-[60px]",
1710
+ "w-[40px] md:w-[120px]",
1711
+ "w-[48px] md:w-[200px]",
1712
+ "w-[52px] md:w-[240px]"
1713
+ ];
1714
+ var MarketDetailsHeaderSkeleton = () => {
1715
+ return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-3 px-4 py-3 md:px-5", children: [
1716
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex min-w-0 items-center gap-3 md:min-w-52 md:gap-4", children: [
1717
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "size-12 rounded-agg-lg md:size-[60px]" }),
1718
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex min-w-0 flex-col gap-2", children: [
1719
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-6 w-[132px] rounded-agg-sm" }),
1720
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 w-[141px] rounded-agg-sm" })
1721
+ ] })
1722
+ ] }),
1723
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-9 w-[60px] rounded-agg-md" }),
1724
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex w-full gap-2 md:w-auto", children: [
1725
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-9 w-full rounded-agg-full md:w-[135px]" }),
1726
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-9 w-full rounded-agg-full md:w-[131px]" })
1727
+ ] })
1728
+ ] });
1729
+ };
1730
+ var MarketDetailsTabsSkeleton = () => {
1731
+ return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex h-14 items-end px-4 md:px-5", children: [
1732
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex h-full flex-col items-end justify-end rounded-t-agg-lg", children: [
1733
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "px-4 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-6 w-20 rounded-agg-sm" }) }),
1734
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-[3px] w-full rounded-t-agg-sm" })
1735
+ ] }),
1736
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex h-full flex-col justify-center", children: [
1737
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "px-4 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-6 w-12 rounded-agg-sm" }) }),
1738
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "h-[3px] w-full" })
1739
+ ] })
1740
+ ] });
1741
+ };
1742
+ var MarketDetailsOrderBookRows = ({
1743
+ side,
1744
+ barWidths
1745
+ }) => {
1746
+ return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "flex flex-col gap-2", children: barWidths.map((barWidthClassName, index) => /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-2", children: [
1747
+ /* @__PURE__ */ (0, import_jsx_runtime49.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: [
1748
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex items-center gap-1 md:gap-3", children: [
1749
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
1750
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
1751
+ ] }),
1752
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-5 rounded-agg-sm" }),
1753
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-5 rounded-agg-sm" }),
1754
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "flex justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: cn("h-2 rounded-agg-full", barWidthClassName) }) })
1755
+ ] }),
1756
+ index < barWidths.length - 1 ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "h-px w-full bg-agg-separator" }) : null
1757
+ ] }, `${side}-row-${index}`)) });
1758
+ };
1759
+ var MarketDetailsOderbookSkeleton = ({
1760
+ className
1761
+ }) => {
1762
+ return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: cn("flex flex-col gap-5", className), children: [
1763
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-2", children: [
1764
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
1765
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MarketDetailsOrderBookRows, { side: "ask", barWidths: orderBookAskBarWidths })
1766
+ ] }),
1767
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-2", children: [
1768
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
1769
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MarketDetailsOrderBookRows, { side: "bid", barWidths: orderBookBidBarWidths })
1770
+ ] })
1771
+ ] });
1772
+ };
1721
1773
  var MarketDetailsSkeletonView = ({
1722
1774
  className,
1723
1775
  ariaLabel,
@@ -1732,60 +1784,12 @@ var MarketDetailsSkeletonView = ({
1732
1784
  "aria-label": ariaLabel != null ? ariaLabel : labels.marketDetails.loading,
1733
1785
  "aria-busy": true,
1734
1786
  children: [
1735
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-3 p-4 md:px-5 md:py-4", children: [
1736
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
1737
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex min-w-0 items-center gap-3 md:gap-4", children: [
1738
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "size-12 rounded-agg-lg md:size-[60px]" }),
1739
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex min-w-0 flex-col gap-2", children: [
1740
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-6 w-40 rounded-agg-sm" }),
1741
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 w-28 rounded-agg-sm" })
1742
- ] })
1743
- ] }),
1744
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-8 w-16 rounded-agg-sm" })
1745
- ] }),
1746
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex gap-2", children: [
1747
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-10 flex-1 rounded-agg-full" }),
1748
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-10 flex-1 rounded-agg-full" })
1749
- ] })
1750
- ] }),
1787
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MarketDetailsHeaderSkeleton, {}),
1751
1788
  isDetailed ? /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
1752
1789
  /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "h-px w-full bg-agg-separator" }),
1753
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "flex h-14 items-end", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-full w-full rounded-none" }) }),
1790
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MarketDetailsTabsSkeleton, {}),
1754
1791
  /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "h-px w-full bg-agg-separator" }),
1755
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-4 p-5", children: [
1756
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-3", children: [
1757
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 w-12 rounded-agg-sm" }),
1758
- [0, 1, 2, 3].map((index) => /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
1759
- "div",
1760
- {
1761
- className: "grid grid-cols-[52px_1fr_1fr_52px] items-center gap-2",
1762
- children: [
1763
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
1764
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
1765
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
1766
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-2 rounded-agg-full" })
1767
- ]
1768
- },
1769
- `ask-${index}`
1770
- ))
1771
- ] }),
1772
- /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-3", children: [
1773
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 w-12 rounded-agg-sm" }),
1774
- [0, 1, 2, 3].map((index) => /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
1775
- "div",
1776
- {
1777
- className: "grid grid-cols-[52px_1fr_1fr_52px] items-center gap-2",
1778
- children: [
1779
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
1780
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
1781
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
1782
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(SkeletonBlock, { className: "h-2 rounded-agg-full" })
1783
- ]
1784
- },
1785
- `bid-${index}`
1786
- ))
1787
- ] })
1788
- ] })
1792
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(MarketDetailsOderbookSkeleton, { className: "p-5" })
1789
1793
  ] }) : null
1790
1794
  ]
1791
1795
  }
@@ -1796,65 +1800,46 @@ MarketDetailsSkeletonView.displayName = "MarketDetailsSkeletonView";
1796
1800
  // src/primitives/skeleton/views/place-order-skeleton-view.tsx
1797
1801
  var import_jsx_runtime50 = require("react/jsx-runtime");
1798
1802
  var placeOrderCardClassName = "overflow-hidden rounded-agg-xl border border-agg-border bg-agg-secondary shadow-none hover:shadow-none";
1803
+ var TabsSkeletonBar = () => {
1804
+ return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex w-full items-end border-b border-agg-border", children: [
1805
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col rounded-t-agg-lg", children: [
1806
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "px-5 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-6 w-10 rounded-agg-sm" }) }),
1807
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-[3px] w-full rounded-t-agg-sm" })
1808
+ ] }),
1809
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col", children: [
1810
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "px-5 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-6 w-10 rounded-agg-sm" }) }),
1811
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "h-[3px] w-full" })
1812
+ ] })
1813
+ ] });
1814
+ };
1799
1815
  var ContentBody = () => {
1800
1816
  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cn("flex flex-col gap-6 p-5"), children: [
1801
1817
  /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-2", children: [
1802
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-start justify-between gap-5", children: [
1803
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
1804
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-12 w-12 shrink-0 rounded-agg-lg" }),
1805
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
1806
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-[92%] rounded-agg-sm" }),
1807
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-[80%] rounded-agg-sm" })
1808
- ] })
1809
- ] }),
1810
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-6 w-6 rounded-agg-sm" })
1818
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex min-w-0 items-center gap-3", children: [
1819
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "size-12 shrink-0 rounded-agg-lg" }),
1820
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
1821
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-[92%] max-w-[240px] rounded-agg-sm" }),
1822
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-[64%] max-w-[160px] rounded-agg-sm" })
1823
+ ] })
1811
1824
  ] }),
1812
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-28 rounded-agg-sm" })
1825
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-6 w-[92px] rounded-agg-sm" }),
1826
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(TabsSkeletonBar, {})
1813
1827
  ] }),
1814
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex h-11 items-end border-b border-agg-separator", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center gap-8", children: [
1815
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-2", children: [
1816
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-10 rounded-agg-sm" }),
1817
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-[3px] w-12 rounded-t-agg-sm" })
1818
- ] }),
1819
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-10 rounded-agg-sm" })
1820
- ] }) }),
1821
1828
  /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-4", children: [
1822
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex gap-2", children: [
1829
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex w-full gap-2", children: [
1823
1830
  /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" }),
1824
1831
  /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" })
1825
1832
  ] }),
1826
1833
  /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
1827
1834
  /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-2", children: [
1828
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-6 w-20 rounded-agg-sm" }),
1829
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-28 rounded-agg-sm" })
1835
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-[63px] rounded-agg-sm" }),
1836
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-[118px] rounded-agg-sm" })
1830
1837
  ] }),
1831
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-9 w-28 rounded-agg-sm" })
1838
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: cn("text-agg-3xl font-agg-bold leading-agg-9 text-agg-separator"), children: "$0" })
1832
1839
  ] })
1833
1840
  ] }),
1834
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-2", children: [
1835
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "rounded-agg-lg border border-agg-trade-highlight-border bg-agg-trade-highlight-surface p-3", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-3", children: [
1836
- [0, 1].map((index) => /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-3", children: [
1837
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
1838
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center gap-2", children: [
1839
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-full" }),
1840
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-24 rounded-agg-sm" })
1841
- ] }),
1842
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-5 w-10 rounded-agg-sm" })
1843
- ] }),
1844
- index === 0 ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "h-px w-full bg-agg-trade-highlight-border" }) : null
1845
- ] }, `place-order-route-${index}`)),
1846
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "mx-auto h-5 w-40 rounded-agg-sm" })
1847
- ] }) }),
1848
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-36 rounded-agg-sm" })
1849
- ] }),
1850
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
1851
- /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col gap-2", children: [
1852
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-6 w-20 rounded-agg-sm" }),
1853
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-24 rounded-agg-sm" })
1854
- ] }),
1855
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-9 w-36 rounded-agg-sm" })
1856
- ] }),
1857
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-[88%] self-center rounded-agg-sm" })
1841
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-12 w-full rounded-agg-full" }),
1842
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-4 w-full max-w-[240px] self-center rounded-agg-sm" })
1858
1843
  ] });
1859
1844
  };
1860
1845
  var PlaceOrderSkeletonView = ({
@@ -1868,19 +1853,7 @@ var PlaceOrderSkeletonView = ({
1868
1853
  role: "status",
1869
1854
  "aria-label": ariaLabel != null ? ariaLabel : "Loading place order",
1870
1855
  "aria-busy": true,
1871
- children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex w-full items-end justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
1872
- Card,
1873
- {
1874
- className: cn(
1875
- placeOrderCardClassName,
1876
- "w-full max-w-[400px] rounded-t-agg-xl rounded-b-none border-b-0"
1877
- ),
1878
- children: [
1879
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ContentBody, {}),
1880
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "border-t border-agg-separator bg-agg-secondary p-4", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(SkeletonBlock, { className: "h-12 w-full rounded-agg-full" }) })
1881
- ]
1882
- }
1883
- ) })
1856
+ children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex w-full items-end justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Card, { className: cn(placeOrderCardClassName, "w-full"), children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ContentBody, {}) }) })
1884
1857
  }
1885
1858
  );
1886
1859
  };
@@ -1906,38 +1879,27 @@ var SettlementSkeletonView = ({
1906
1879
  "aria-label": ariaLabel != null ? ariaLabel : labels.trading.settlementLoading,
1907
1880
  "aria-busy": true,
1908
1881
  children: [
1909
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex flex-col gap-1 md:flex-row md:items-center md:justify-between md:gap-4", children: [
1910
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-20 rounded-agg-sm" }),
1911
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-full max-w-80 rounded-agg-sm" })
1882
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex w-full items-center justify-between gap-4", children: [
1883
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-[81px] rounded-agg-sm" }),
1884
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-full max-w-[240px] rounded-agg-sm" })
1912
1885
  ] }),
1913
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex flex-col gap-2", children: [
1914
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-52 rounded-agg-sm" }),
1886
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
1887
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-[200px] rounded-agg-sm" }),
1915
1888
  /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex flex-col gap-2", children: [
1916
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-[88%] rounded-agg-sm" }),
1917
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-[84%] rounded-agg-sm" }),
1918
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-[80%] rounded-agg-sm" }),
1919
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-[74%] rounded-agg-sm" })
1889
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-full max-w-[320px] rounded-agg-sm" }),
1890
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-full max-w-[280px] rounded-agg-sm" })
1920
1891
  ] })
1921
1892
  ] }),
1922
1893
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "h-px w-full bg-agg-separator" }),
1923
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex flex-col gap-3", children: [
1924
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex flex-col gap-2", children: [
1925
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex items-center gap-2", children: [
1926
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-full" }),
1927
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-24 rounded-agg-sm" }),
1928
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-4 rounded-agg-sm" })
1929
- ] }),
1930
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex flex-col gap-2 pl-6", children: [
1931
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-full rounded-agg-sm" }),
1932
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-[92%] rounded-agg-sm" }),
1933
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-[34%] rounded-agg-sm" })
1934
- ] })
1894
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
1895
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex items-center gap-2", children: [
1896
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
1897
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-[100px] rounded-agg-sm" })
1935
1898
  ] }),
1936
- [0, 1, 2].map((index) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex items-center gap-2", children: [
1937
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-full" }),
1938
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-20 rounded-agg-sm" }),
1939
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-4 w-4 rounded-agg-sm" })
1940
- ] }, `settlement-venue-${index}`))
1899
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex items-center gap-2", children: [
1900
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "size-4 rounded-agg-sm" }),
1901
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SkeletonBlock, { className: "h-5 w-[60px] rounded-agg-sm" })
1902
+ ] })
1941
1903
  ] })
1942
1904
  ]
1943
1905
  }
@@ -2860,6 +2822,13 @@ var venueLogoRegistry = {
2860
2822
  opinion: LogoOpinionIcon,
2861
2823
  probable: LogoProbableIcon
2862
2824
  };
2825
+ var VENUE_LOGO_BASE_URL = "https://assets.snagsolutions.io/public/prediction-markets/logos";
2826
+ var venueLogoUrlRegistry = {
2827
+ kalshi: `${VENUE_LOGO_BASE_URL}/kalshi.png`,
2828
+ polymarket: `${VENUE_LOGO_BASE_URL}/polymarket.png`,
2829
+ opinion: `${VENUE_LOGO_BASE_URL}/opinion.png`,
2830
+ probable: `${VENUE_LOGO_BASE_URL}/probable.png`
2831
+ };
2863
2832
  var venueLogoNames = Object.keys(venueLogoRegistry);
2864
2833
  var sizeClasses2 = {
2865
2834
  small: "h-4 w-4",
@@ -2871,6 +2840,7 @@ var sizeClasses2 = {
2871
2840
  var import_jsx_runtime59 = require("react/jsx-runtime");
2872
2841
  var VenueLogo = ({
2873
2842
  venue,
2843
+ variant = "icon",
2874
2844
  isColor = true,
2875
2845
  isMonochromatic = false,
2876
2846
  color,
@@ -2880,8 +2850,20 @@ var VenueLogo = ({
2880
2850
  title
2881
2851
  }) => {
2882
2852
  const labels = (0, import_hooks11.useLabels)();
2883
- const Component = venueLogoRegistry[venue];
2884
2853
  const sizeClass = sizeClasses2[size];
2854
+ const resolvedLabel = ariaLabel != null ? ariaLabel : labels.venues[venue];
2855
+ if (variant === "logo") {
2856
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
2857
+ "img",
2858
+ {
2859
+ src: venueLogoUrlRegistry[venue],
2860
+ alt: resolvedLabel,
2861
+ title,
2862
+ className: cn("shrink-0 rounded-agg-lg object-cover", sizeClass, className)
2863
+ }
2864
+ );
2865
+ }
2866
+ const Component = venueLogoRegistry[venue];
2885
2867
  const resolvedIsColor = isMonochromatic ? false : isColor;
2886
2868
  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
2887
2869
  Component,
@@ -2889,7 +2871,7 @@ var VenueLogo = ({
2889
2871
  className: cn("group/agg-venue-logo", "shrink-0", sizeClass, className),
2890
2872
  isColor: resolvedIsColor,
2891
2873
  color,
2892
- "aria-label": ariaLabel != null ? ariaLabel : labels.venues[venue],
2874
+ "aria-label": resolvedLabel,
2893
2875
  title
2894
2876
  }
2895
2877
  );
@@ -1,11 +1,11 @@
1
1
  import {
2
2
  PlaceOrder
3
- } from "./chunk-O46OFVH6.mjs";
3
+ } from "./chunk-MJHKBCXQ.mjs";
4
4
  import "./chunk-OBCHURW5.mjs";
5
5
  import "./chunk-S3H63TQ5.mjs";
6
6
  import "./chunk-YJA5VQW6.mjs";
7
- import "./chunk-V52WSZHQ.mjs";
8
- import "./chunk-D7JTOGYP.mjs";
7
+ import "./chunk-M4RJHRFT.mjs";
8
+ import "./chunk-PORVP72S.mjs";
9
9
  import "./chunk-PZTHM6WG.mjs";
10
10
  import "./chunk-NDG43KGL.mjs";
11
11
  import "./chunk-BNDFQPHF.mjs";
@@ -1920,6 +1920,13 @@ var venueLogoRegistry = {
1920
1920
  opinion: LogoOpinionIcon,
1921
1921
  probable: LogoProbableIcon
1922
1922
  };
1923
+ var VENUE_LOGO_BASE_URL = "https://assets.snagsolutions.io/public/prediction-markets/logos";
1924
+ var venueLogoUrlRegistry = {
1925
+ kalshi: `${VENUE_LOGO_BASE_URL}/kalshi.png`,
1926
+ polymarket: `${VENUE_LOGO_BASE_URL}/polymarket.png`,
1927
+ opinion: `${VENUE_LOGO_BASE_URL}/opinion.png`,
1928
+ probable: `${VENUE_LOGO_BASE_URL}/probable.png`
1929
+ };
1923
1930
  var venueLogoLabels = {
1924
1931
  kalshi: "Kalshi",
1925
1932
  polymarket: "Polymarket",
@@ -2079,6 +2086,7 @@ var import_hooks4 = require("@agg-market/hooks");
2079
2086
  var import_jsx_runtime50 = require("react/jsx-runtime");
2080
2087
  var VenueLogo = ({
2081
2088
  venue,
2089
+ variant = "icon",
2082
2090
  isColor = true,
2083
2091
  isMonochromatic = false,
2084
2092
  color,
@@ -2088,8 +2096,20 @@ var VenueLogo = ({
2088
2096
  title
2089
2097
  }) => {
2090
2098
  const labels = (0, import_hooks4.useLabels)();
2091
- const Component = venueLogoRegistry[venue];
2092
2099
  const sizeClass = sizeClasses2[size];
2100
+ const resolvedLabel = ariaLabel != null ? ariaLabel : labels.venues[venue];
2101
+ if (variant === "logo") {
2102
+ return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
2103
+ "img",
2104
+ {
2105
+ src: venueLogoUrlRegistry[venue],
2106
+ alt: resolvedLabel,
2107
+ title,
2108
+ className: cn("shrink-0 rounded-agg-lg object-cover", sizeClass, className)
2109
+ }
2110
+ );
2111
+ }
2112
+ const Component = venueLogoRegistry[venue];
2093
2113
  const resolvedIsColor = isMonochromatic ? false : isColor;
2094
2114
  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
2095
2115
  Component,
@@ -2097,7 +2117,7 @@ var VenueLogo = ({
2097
2117
  className: cn("group/agg-venue-logo", "shrink-0", sizeClass, className),
2098
2118
  isColor: resolvedIsColor,
2099
2119
  color,
2100
- "aria-label": ariaLabel != null ? ariaLabel : labels.venues[venue],
2120
+ "aria-label": resolvedLabel,
2101
2121
  title
2102
2122
  }
2103
2123
  );
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  ProfileModal
3
- } from "./chunk-LK5D3ZTK.mjs";
3
+ } from "./chunk-3QLOUBDJ.mjs";
4
4
  import "./chunk-5K7VXAYM.mjs";
5
- import "./chunk-D7JTOGYP.mjs";
5
+ import "./chunk-PORVP72S.mjs";
6
6
  import "./chunk-PZTHM6WG.mjs";
7
7
  import "./chunk-NDG43KGL.mjs";
8
8
  import "./chunk-BNDFQPHF.mjs";
package/dist/search.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { InputHTMLAttributes } from 'react';
2
- import { V as VenueLogoName } from './venue-logo.types-HRf1yBLD.mjs';
2
+ import { V as VenueLogoName } from './venue-logo.types-CGUc22ly.mjs';
3
3
  import '@agg-market/hooks';
4
4
  import './types-BVj9ky9P.mjs';
5
5
 
package/dist/search.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { InputHTMLAttributes } from 'react';
2
- import { V as VenueLogoName } from './venue-logo.types-D8Cu2rAm.js';
2
+ import { V as VenueLogoName } from './venue-logo.types-Dqr39S1-.js';
3
3
  import '@agg-market/hooks';
4
4
  import './types-BVj9ky9P.js';
5
5