@agg-market/ui 3.0.1 → 5.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 (60) hide show
  1. package/dist/chart.js +18 -5
  2. package/dist/chart.mjs +2 -2
  3. package/dist/{chunk-422MCIXV.mjs → chunk-34IRJYSU.mjs} +15 -11
  4. package/dist/{chunk-KUWTY4EM.mjs → chunk-3W7NBJLU.mjs} +1 -1
  5. package/dist/chunk-4343LYSH.mjs +45 -0
  6. package/dist/{chunk-RKCVOKE3.mjs → chunk-CTYJVVHJ.mjs} +26 -3
  7. package/dist/{chunk-MVJNQN7P.mjs → chunk-DHBHKIJR.mjs} +153 -94
  8. package/dist/{chunk-KRQFVMJE.mjs → chunk-GFBF2J3Y.mjs} +18 -25
  9. package/dist/{chunk-ZJJA4I3I.mjs → chunk-KIYMVWL4.mjs} +1 -1
  10. package/dist/{chunk-CTVMT3VL.mjs → chunk-LCZKSITC.mjs} +2 -2
  11. package/dist/chunk-M4RJHRFT.mjs +445 -0
  12. package/dist/{chunk-KSCSYCEF.mjs → chunk-MJHKBCXQ.mjs} +1 -1
  13. package/dist/{chunk-GHB3GOCW.mjs → chunk-MKVGQ7AS.mjs} +17 -21
  14. package/dist/{chunk-BN5VVHNV.mjs → chunk-OJVTGNIF.mjs} +17 -4
  15. package/dist/{chunk-FF3QYU26.mjs → chunk-Q6DGDBPV.mjs} +87 -26
  16. package/dist/{chunk-DCORNTCY.mjs → chunk-QDMHLRDY.mjs} +31 -62
  17. package/dist/{chunk-RGHA4PZH.mjs → chunk-T7TATHPD.mjs} +34 -10
  18. package/dist/chunk-XUCS575S.mjs +65 -0
  19. package/dist/event-list-item-details.js +1836 -407
  20. package/dist/event-list-item-details.mjs +10 -6
  21. package/dist/event-list-item.js +448 -279
  22. package/dist/event-list-item.mjs +6 -3
  23. package/dist/event-list.js +787 -627
  24. package/dist/event-list.mjs +7 -4
  25. package/dist/event-market-page.d.mts +1 -1
  26. package/dist/event-market-page.d.ts +1 -1
  27. package/dist/event-market-page.js +2684 -2572
  28. package/dist/event-market-page.mjs +12 -11
  29. package/dist/home-page.js +804 -644
  30. package/dist/home-page.mjs +8 -5
  31. package/dist/index.d.mts +3 -2
  32. package/dist/index.d.ts +3 -2
  33. package/dist/index.js +1344 -1177
  34. package/dist/index.mjs +23 -18
  35. package/dist/market-details.js +919 -757
  36. package/dist/market-details.mjs +9 -7
  37. package/dist/place-order.d.mts +1 -1
  38. package/dist/place-order.d.ts +1 -1
  39. package/dist/place-order.js +151 -189
  40. package/dist/place-order.mjs +2 -2
  41. package/dist/search.js +3 -0
  42. package/dist/search.mjs +2 -1
  43. package/dist/settlement.d.mts +1 -1
  44. package/dist/settlement.d.ts +1 -1
  45. package/dist/settlement.js +151 -189
  46. package/dist/settlement.mjs +2 -2
  47. package/dist/skeleton.js +151 -189
  48. package/dist/skeleton.mjs +1 -1
  49. package/dist/state-message.d.mts +16 -0
  50. package/dist/state-message.d.ts +16 -0
  51. package/dist/state-message.js +1629 -0
  52. package/dist/state-message.mjs +14 -0
  53. package/dist/styles.css +1 -1
  54. package/dist/switch-button.js +2 -2
  55. package/dist/switch-button.mjs +1 -1
  56. package/dist/tailwind.css +1 -1
  57. package/package.json +14 -2
  58. package/dist/chunk-V52WSZHQ.mjs +0 -482
  59. package/dist/{types-DkGlbmXq.d.mts → types-BImwqY4o.d.mts} +4 -4
  60. package/dist/{types-DkGlbmXq.d.ts → types-BImwqY4o.d.ts} +4 -4
@@ -1,482 +0,0 @@
1
- import {
2
- Card
3
- } from "./chunk-FO2QCB4Z.mjs";
4
- import {
5
- cn,
6
- getMotionClassName
7
- } from "./chunk-GJ4U5NCE.mjs";
8
-
9
- // src/primitives/skeleton/views/event-list-skeleton-view.tsx
10
- import { useLabels as useLabels2 } from "@agg-market/hooks";
11
-
12
- // src/primitives/skeleton/skeleton-block.tsx
13
- import { useSdkUiConfig } from "@agg-market/hooks";
14
- import { jsx } from "react/jsx-runtime";
15
- var SkeletonBlock = ({ className }) => {
16
- const { enableAnimations } = useSdkUiConfig();
17
- return /* @__PURE__ */ jsx(
18
- "div",
19
- {
20
- "aria-hidden": true,
21
- className: cn(
22
- "bg-agg-separator",
23
- getMotionClassName(enableAnimations, "animate-pulse"),
24
- className
25
- )
26
- }
27
- );
28
- };
29
- SkeletonBlock.displayName = "SkeletonBlock";
30
-
31
- // src/primitives/skeleton/views/event-list-item-skeleton-view.tsx
32
- import { useLabels } from "@agg-market/hooks";
33
-
34
- // src/events/item/event-list-item.constants.ts
35
- var baseCardClassName = "gap-3 overflow-hidden p-5 w-full";
36
-
37
- // src/primitives/skeleton/views/event-list-item-skeleton-view.tsx
38
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
39
- var EventListItemSkeletonView = ({
40
- className,
41
- ariaLabel,
42
- isStandalone = false
43
- }) => {
44
- const labels = useLabels();
45
- return /* @__PURE__ */ jsxs(
46
- Card,
47
- {
48
- className: cn("group/agg-skeleton", baseCardClassName, className),
49
- role: isStandalone ? "status" : void 0,
50
- "aria-label": isStandalone ? ariaLabel != null ? ariaLabel : labels.eventItem.loading : void 0,
51
- "aria-busy": isStandalone || void 0,
52
- "aria-hidden": isStandalone ? void 0 : true,
53
- children: [
54
- /* @__PURE__ */ jsxs("div", { className: "flex w-full items-start gap-3", children: [
55
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-10 w-10 rounded-agg-lg" }),
56
- /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-2", children: [
57
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-5 w-[82%] rounded-agg-sm" }),
58
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-5 w-[68%] rounded-agg-sm" })
59
- ] })
60
- ] }),
61
- /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-3", children: [0, 1].map((index) => /* @__PURE__ */ jsxs(
62
- "div",
63
- {
64
- className: "grid w-full grid-cols-[minmax(0,1fr)_auto_auto] items-center gap-3",
65
- children: [
66
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
67
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-4 w-10 rounded-agg-sm" }),
68
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-9 w-[101px] rounded-agg-full" })
69
- ]
70
- },
71
- index
72
- )) }),
73
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 text-agg-muted-foreground", children: [
74
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
75
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-4 w-36 rounded-agg-sm" }),
76
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
77
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "size-3 rounded-agg-full" }),
78
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "size-3 rounded-agg-full" }),
79
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "size-3 rounded-agg-full" })
80
- ] })
81
- ] }),
82
- /* @__PURE__ */ jsx2(SkeletonBlock, { className: "h-4 w-20 rounded-agg-sm" })
83
- ] })
84
- ]
85
- }
86
- );
87
- };
88
- EventListItemSkeletonView.displayName = "EventListItemSkeletonView";
89
-
90
- // src/primitives/skeleton/views/event-list-skeleton-view.tsx
91
- import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
92
- var EventListSkeletonView = ({ className, ariaLabel }) => {
93
- const labels = useLabels2();
94
- return /* @__PURE__ */ jsxs2(
95
- "section",
96
- {
97
- className: cn("group/agg-skeleton", "flex w-full flex-col gap-5", className),
98
- role: "status",
99
- "aria-label": ariaLabel != null ? ariaLabel : labels.eventList.loading("events"),
100
- "aria-busy": true,
101
- children: [
102
- /* @__PURE__ */ jsxs2("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: [
103
- /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-7 w-40 rounded-agg-sm" }),
104
- /* @__PURE__ */ jsxs2("div", { className: "flex max-w-full gap-2", children: [
105
- /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-10 w-20 rounded-agg-full" }),
106
- /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-10 w-20 rounded-agg-full" }),
107
- /* @__PURE__ */ jsx3(SkeletonBlock, { className: "h-10 w-24 rounded-agg-full" })
108
- ] })
109
- ] }),
110
- /* @__PURE__ */ jsx3("div", { className: "grid grid-cols-1 gap-5 md:grid-cols-3", children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsx3(
111
- EventListItemSkeletonView,
112
- {
113
- isStandalone: false,
114
- className: "w-full min-w-0 max-w-none"
115
- },
116
- index
117
- )) })
118
- ]
119
- }
120
- );
121
- };
122
- EventListSkeletonView.displayName = "EventListSkeletonView";
123
-
124
- // src/primitives/skeleton/views/event-list-item-details-skeleton-view.tsx
125
- import { useLabels as useLabels3 } from "@agg-market/hooks";
126
-
127
- // src/events/item-details/event-list-item-details.constants.ts
128
- var detailsBaseCardClassName = "w-full overflow-hidden gap-6 p-5 md:gap-8 md:p-10";
129
- var eventListItemDetailsTimeRanges = [
130
- "1H",
131
- "6H",
132
- "1D",
133
- "1W",
134
- "1M",
135
- "ALL"
136
- ];
137
- var lineColorByVenue = {
138
- polymarket: "#2e5cff",
139
- kalshi: "#00d295",
140
- probable: "#f05923",
141
- opinion: "#020205"
142
- };
143
- var fallbackLineColors = ["#2e5cff", "#00d295", "#f05923", "#020205"];
144
-
145
- // src/primitives/skeleton/views/event-list-item-details-skeleton-view.tsx
146
- import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
147
- var EventListItemDetailsSkeletonView = ({
148
- className,
149
- ariaLabel
150
- }) => {
151
- const labels = useLabels3();
152
- return /* @__PURE__ */ jsxs3(
153
- Card,
154
- {
155
- className: cn("group/agg-skeleton", detailsBaseCardClassName, className),
156
- role: "status",
157
- "aria-label": ariaLabel != null ? ariaLabel : labels.eventItemDetails.loading,
158
- "aria-busy": true,
159
- children: [
160
- /* @__PURE__ */ jsxs3("div", { className: "flex w-full items-start gap-3 md:gap-4", children: [
161
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "size-10 rounded-agg-lg md:size-[60px]" }),
162
- /* @__PURE__ */ jsxs3("div", { className: "flex flex-1 flex-col gap-2", children: [
163
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-5 w-[82%] rounded-agg-sm md:h-7 md:w-[55%]" }),
164
- /* @__PURE__ */ jsxs3("div", { className: "flex gap-2 overflow-hidden", children: [
165
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-8 w-28 rounded-agg-full" }),
166
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-8 w-28 rounded-agg-full" }),
167
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-8 w-28 rounded-agg-full" })
168
- ] })
169
- ] })
170
- ] }),
171
- /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-4", children: [
172
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-10 w-full rounded-agg-full md:w-[220px]" }),
173
- /* @__PURE__ */ jsxs3("div", { className: "flex gap-2 overflow-hidden", children: [
174
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" }),
175
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" }),
176
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" }),
177
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-9 w-20 rounded-agg-full" })
178
- ] })
179
- ] }),
180
- /* @__PURE__ */ jsx4("div", { className: "h-[300px] w-full rounded-agg-xl", children: /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-full w-full rounded-agg-xl" }) }),
181
- /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between", children: [
182
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-5 w-24 rounded-agg-sm" }),
183
- /* @__PURE__ */ jsx4(SkeletonBlock, { className: "h-5 w-40 rounded-agg-sm" })
184
- ] })
185
- ]
186
- }
187
- );
188
- };
189
- EventListItemDetailsSkeletonView.displayName = "EventListItemDetailsSkeletonView";
190
-
191
- // src/primitives/skeleton/views/market-details-skeleton-view.tsx
192
- import { useLabels as useLabels4 } from "@agg-market/hooks";
193
-
194
- // src/events/market-details/market-details.constants.ts
195
- var marketDetailsBaseCardClassName = "w-full overflow-hidden rounded-agg-lg border border-agg-separator bg-agg-secondary text-agg-foreground shadow-none hover:shadow-none";
196
- var getMarketDetailsTabs = (labels) => {
197
- return [
198
- { value: "order-book", label: labels.marketDetails.tabs.orderBook },
199
- { value: "graph", label: labels.marketDetails.tabs.graph }
200
- ];
201
- };
202
- var marketDetailsDefaultIsOpened = false;
203
- var orderBookRowLimitDefault = 4;
204
-
205
- // src/primitives/skeleton/views/market-details-skeleton-view.tsx
206
- import { Fragment, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
207
- var MarketDetailsSkeletonView = ({
208
- className,
209
- ariaLabel,
210
- isDetailed
211
- }) => {
212
- const labels = useLabels4();
213
- return /* @__PURE__ */ jsxs4(
214
- Card,
215
- {
216
- className: cn("group/agg-skeleton", marketDetailsBaseCardClassName, className),
217
- role: "status",
218
- "aria-label": ariaLabel != null ? ariaLabel : labels.marketDetails.loading,
219
- "aria-busy": true,
220
- children: [
221
- /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-3 p-4 md:px-5 md:py-4", children: [
222
- /* @__PURE__ */ jsxs4("div", { className: "flex items-center justify-between gap-4", children: [
223
- /* @__PURE__ */ jsxs4("div", { className: "flex min-w-0 items-center gap-3 md:gap-4", children: [
224
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "size-12 rounded-agg-lg md:size-[60px]" }),
225
- /* @__PURE__ */ jsxs4("div", { className: "flex min-w-0 flex-col gap-2", children: [
226
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-6 w-40 rounded-agg-sm" }),
227
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 w-28 rounded-agg-sm" })
228
- ] })
229
- ] }),
230
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-8 w-16 rounded-agg-sm" })
231
- ] }),
232
- /* @__PURE__ */ jsxs4("div", { className: "flex gap-2", children: [
233
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-10 flex-1 rounded-agg-full" }),
234
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-10 flex-1 rounded-agg-full" })
235
- ] })
236
- ] }),
237
- isDetailed ? /* @__PURE__ */ jsxs4(Fragment, { children: [
238
- /* @__PURE__ */ jsx5("div", { className: "h-px w-full bg-agg-separator" }),
239
- /* @__PURE__ */ jsx5("div", { className: "flex h-14 items-end", children: /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-full w-full rounded-none" }) }),
240
- /* @__PURE__ */ jsx5("div", { className: "h-px w-full bg-agg-separator" }),
241
- /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-4 p-5", children: [
242
- /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-3", children: [
243
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 w-12 rounded-agg-sm" }),
244
- [0, 1, 2, 3].map((index) => /* @__PURE__ */ jsxs4(
245
- "div",
246
- {
247
- className: "grid grid-cols-[52px_1fr_1fr_52px] items-center gap-2",
248
- children: [
249
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
250
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
251
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
252
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-2 rounded-agg-full" })
253
- ]
254
- },
255
- `ask-${index}`
256
- ))
257
- ] }),
258
- /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-3", children: [
259
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 w-12 rounded-agg-sm" }),
260
- [0, 1, 2, 3].map((index) => /* @__PURE__ */ jsxs4(
261
- "div",
262
- {
263
- className: "grid grid-cols-[52px_1fr_1fr_52px] items-center gap-2",
264
- children: [
265
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
266
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
267
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-4 rounded-agg-sm" }),
268
- /* @__PURE__ */ jsx5(SkeletonBlock, { className: "h-2 rounded-agg-full" })
269
- ]
270
- },
271
- `bid-${index}`
272
- ))
273
- ] })
274
- ] })
275
- ] }) : null
276
- ]
277
- }
278
- );
279
- };
280
- MarketDetailsSkeletonView.displayName = "MarketDetailsSkeletonView";
281
-
282
- // src/primitives/skeleton/views/place-order-skeleton-view.tsx
283
- import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
284
- var placeOrderCardClassName = "overflow-hidden rounded-agg-xl border border-agg-border bg-agg-secondary shadow-none hover:shadow-none";
285
- var ContentBody = () => {
286
- return /* @__PURE__ */ jsxs5("div", { className: cn("flex flex-col gap-6 p-5"), children: [
287
- /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
288
- /* @__PURE__ */ jsxs5("div", { className: "flex items-start justify-between gap-5", children: [
289
- /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
290
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-12 w-12 shrink-0 rounded-agg-lg" }),
291
- /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
292
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-[92%] rounded-agg-sm" }),
293
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-[80%] rounded-agg-sm" })
294
- ] })
295
- ] }),
296
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-6 w-6 rounded-agg-sm" })
297
- ] }),
298
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-28 rounded-agg-sm" })
299
- ] }),
300
- /* @__PURE__ */ jsx6("div", { className: "flex h-11 items-end border-b border-agg-separator", children: /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-8", children: [
301
- /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
302
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-10 rounded-agg-sm" }),
303
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-[3px] w-12 rounded-t-agg-sm" })
304
- ] }),
305
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-10 rounded-agg-sm" })
306
- ] }) }),
307
- /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-4", children: [
308
- /* @__PURE__ */ jsxs5("div", { className: "flex gap-2", children: [
309
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" }),
310
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-11 flex-1 rounded-agg-full" })
311
- ] }),
312
- /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between gap-4", children: [
313
- /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
314
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-6 w-20 rounded-agg-sm" }),
315
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-4 w-28 rounded-agg-sm" })
316
- ] }),
317
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-9 w-28 rounded-agg-sm" })
318
- ] })
319
- ] }),
320
- /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
321
- /* @__PURE__ */ jsx6("div", { className: "rounded-agg-lg border border-agg-trade-highlight-border bg-agg-trade-highlight-surface p-3", children: /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-3", children: [
322
- [0, 1].map((index) => /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-3", children: [
323
- /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between gap-4", children: [
324
- /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
325
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "size-4 rounded-agg-full" }),
326
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-24 rounded-agg-sm" })
327
- ] }),
328
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-5 w-10 rounded-agg-sm" })
329
- ] }),
330
- index === 0 ? /* @__PURE__ */ jsx6("div", { className: "h-px w-full bg-agg-trade-highlight-border" }) : null
331
- ] }, `place-order-route-${index}`)),
332
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "mx-auto h-5 w-40 rounded-agg-sm" })
333
- ] }) }),
334
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-4 w-36 rounded-agg-sm" })
335
- ] }),
336
- /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between gap-4", children: [
337
- /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
338
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-6 w-20 rounded-agg-sm" }),
339
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-4 w-24 rounded-agg-sm" })
340
- ] }),
341
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-9 w-36 rounded-agg-sm" })
342
- ] }),
343
- /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-4 w-[88%] self-center rounded-agg-sm" })
344
- ] });
345
- };
346
- var PlaceOrderSkeletonView = ({
347
- className,
348
- ariaLabel
349
- }) => {
350
- return /* @__PURE__ */ jsx6(
351
- "div",
352
- {
353
- className: cn("group/agg-skeleton", "w-full", className),
354
- role: "status",
355
- "aria-label": ariaLabel != null ? ariaLabel : "Loading place order",
356
- "aria-busy": true,
357
- children: /* @__PURE__ */ jsx6("div", { className: "flex w-full items-end justify-center", children: /* @__PURE__ */ jsxs5(
358
- Card,
359
- {
360
- className: cn(
361
- placeOrderCardClassName,
362
- "w-full max-w-[400px] rounded-t-agg-xl rounded-b-none border-b-0"
363
- ),
364
- children: [
365
- /* @__PURE__ */ jsx6(ContentBody, {}),
366
- /* @__PURE__ */ jsx6("div", { className: "border-t border-agg-separator bg-agg-secondary p-4", children: /* @__PURE__ */ jsx6(SkeletonBlock, { className: "h-12 w-full rounded-agg-full" }) })
367
- ]
368
- }
369
- ) })
370
- }
371
- );
372
- };
373
- PlaceOrderSkeletonView.displayName = "PlaceOrderSkeletonView";
374
-
375
- // src/primitives/skeleton/views/settlement-skeleton-view.tsx
376
- import { useLabels as useLabels5 } from "@agg-market/hooks";
377
- import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
378
- var SettlementSkeletonView = ({
379
- className,
380
- ariaLabel
381
- }) => {
382
- const labels = useLabels5();
383
- return /* @__PURE__ */ jsxs6(
384
- Card,
385
- {
386
- className: cn(
387
- "group/agg-skeleton",
388
- "flex flex-col w-full gap-5 rounded-agg-xl border border-agg-separator bg-agg-secondary p-5 shadow-none hover:shadow-none",
389
- className
390
- ),
391
- role: "status",
392
- "aria-label": ariaLabel != null ? ariaLabel : labels.trading.settlementLoading,
393
- "aria-busy": true,
394
- children: [
395
- /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-1 md:flex-row md:items-center md:justify-between md:gap-4", children: [
396
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-20 rounded-agg-sm" }),
397
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-5 w-full max-w-80 rounded-agg-sm" })
398
- ] }),
399
- /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2", children: [
400
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-5 w-52 rounded-agg-sm" }),
401
- /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2", children: [
402
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[88%] rounded-agg-sm" }),
403
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[84%] rounded-agg-sm" }),
404
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[80%] rounded-agg-sm" }),
405
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[74%] rounded-agg-sm" })
406
- ] })
407
- ] }),
408
- /* @__PURE__ */ jsx7("div", { className: "h-px w-full bg-agg-separator" }),
409
- /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-3", children: [
410
- /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2", children: [
411
- /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
412
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "size-4 rounded-agg-full" }),
413
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-5 w-24 rounded-agg-sm" }),
414
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-4 rounded-agg-sm" })
415
- ] }),
416
- /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2 pl-6", children: [
417
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-full rounded-agg-sm" }),
418
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[92%] rounded-agg-sm" }),
419
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-[34%] rounded-agg-sm" })
420
- ] })
421
- ] }),
422
- [0, 1, 2].map((index) => /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
423
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "size-4 rounded-agg-full" }),
424
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-5 w-20 rounded-agg-sm" }),
425
- /* @__PURE__ */ jsx7(SkeletonBlock, { className: "h-4 w-4 rounded-agg-sm" })
426
- ] }, `settlement-venue-${index}`))
427
- ] })
428
- ]
429
- }
430
- );
431
- };
432
- SettlementSkeletonView.displayName = "SettlementSkeletonView";
433
-
434
- // src/primitives/skeleton/skeleton.types.ts
435
- var skeletonViews = {
436
- eventListItem: "event-list-item",
437
- eventListItemDetails: "event-list-item-details",
438
- marketDetailsMinified: "market-details-minified",
439
- marketDetailsDetailed: "market-details-detailed",
440
- eventList: "event-list",
441
- settlement: "settlement",
442
- placeOrder: "place-order"
443
- };
444
-
445
- // src/primitives/skeleton/index.tsx
446
- import { jsx as jsx8 } from "react/jsx-runtime";
447
- var Skeleton = ({ view, className, ariaLabel }) => {
448
- if (view === skeletonViews.eventListItem) {
449
- return /* @__PURE__ */ jsx8(EventListItemSkeletonView, { className, ariaLabel, isStandalone: true });
450
- }
451
- if (view === skeletonViews.eventListItemDetails) {
452
- return /* @__PURE__ */ jsx8(EventListItemDetailsSkeletonView, { className, ariaLabel });
453
- }
454
- if (view === skeletonViews.marketDetailsMinified) {
455
- return /* @__PURE__ */ jsx8(MarketDetailsSkeletonView, { className, ariaLabel, isDetailed: false });
456
- }
457
- if (view === skeletonViews.marketDetailsDetailed) {
458
- return /* @__PURE__ */ jsx8(MarketDetailsSkeletonView, { className, ariaLabel, isDetailed: true });
459
- }
460
- if (view === skeletonViews.settlement) {
461
- return /* @__PURE__ */ jsx8(SettlementSkeletonView, { className, ariaLabel });
462
- }
463
- if (view === skeletonViews.placeOrder) {
464
- return /* @__PURE__ */ jsx8(PlaceOrderSkeletonView, { className, ariaLabel });
465
- }
466
- return /* @__PURE__ */ jsx8(EventListSkeletonView, { className, ariaLabel });
467
- };
468
- Skeleton.displayName = "Skeleton";
469
-
470
- export {
471
- baseCardClassName,
472
- detailsBaseCardClassName,
473
- eventListItemDetailsTimeRanges,
474
- lineColorByVenue,
475
- fallbackLineColors,
476
- marketDetailsBaseCardClassName,
477
- getMarketDetailsTabs,
478
- marketDetailsDefaultIsOpened,
479
- orderBookRowLimitDefault,
480
- skeletonViews,
481
- Skeleton
482
- };
@@ -285,20 +285,20 @@ declare const placeOrderViewModelSchema: z.ZodObject<{
285
285
  actionLabel?: string | undefined;
286
286
  }>>;
287
287
  }, "strip", z.ZodTypeAny, {
288
+ title: string;
288
289
  result: {
289
290
  value: string;
290
291
  label: string;
291
292
  tone: "default" | "success";
292
293
  hint: string;
293
294
  };
294
- title: string;
295
+ actionLabel: string;
295
296
  outcomes: {
296
297
  id: string;
297
298
  label: string;
298
299
  priceLabel: string;
299
300
  }[];
300
301
  activeTab: "buy" | "sell";
301
- actionLabel: string;
302
302
  marketDate: string | Date;
303
303
  buyLabel: string;
304
304
  sellLabel: string;
@@ -328,20 +328,20 @@ declare const placeOrderViewModelSchema: z.ZodObject<{
328
328
  marketImageUrl?: string | undefined;
329
329
  isDismissible?: boolean | undefined;
330
330
  }, {
331
+ title: string;
331
332
  result: {
332
333
  value: string;
333
334
  label: string;
334
335
  tone: "default" | "success";
335
336
  hint: string;
336
337
  };
337
- title: string;
338
+ actionLabel: string;
338
339
  outcomes: {
339
340
  id: string;
340
341
  label: string;
341
342
  priceLabel: string;
342
343
  }[];
343
344
  activeTab: "buy" | "sell";
344
- actionLabel: string;
345
345
  marketDate: string | Date;
346
346
  buyLabel: string;
347
347
  sellLabel: string;
@@ -285,20 +285,20 @@ declare const placeOrderViewModelSchema: z.ZodObject<{
285
285
  actionLabel?: string | undefined;
286
286
  }>>;
287
287
  }, "strip", z.ZodTypeAny, {
288
+ title: string;
288
289
  result: {
289
290
  value: string;
290
291
  label: string;
291
292
  tone: "default" | "success";
292
293
  hint: string;
293
294
  };
294
- title: string;
295
+ actionLabel: string;
295
296
  outcomes: {
296
297
  id: string;
297
298
  label: string;
298
299
  priceLabel: string;
299
300
  }[];
300
301
  activeTab: "buy" | "sell";
301
- actionLabel: string;
302
302
  marketDate: string | Date;
303
303
  buyLabel: string;
304
304
  sellLabel: string;
@@ -328,20 +328,20 @@ declare const placeOrderViewModelSchema: z.ZodObject<{
328
328
  marketImageUrl?: string | undefined;
329
329
  isDismissible?: boolean | undefined;
330
330
  }, {
331
+ title: string;
331
332
  result: {
332
333
  value: string;
333
334
  label: string;
334
335
  tone: "default" | "success";
335
336
  hint: string;
336
337
  };
337
- title: string;
338
+ actionLabel: string;
338
339
  outcomes: {
339
340
  id: string;
340
341
  label: string;
341
342
  priceLabel: string;
342
343
  }[];
343
344
  activeTab: "buy" | "sell";
344
- actionLabel: string;
345
345
  marketDate: string | Date;
346
346
  buyLabel: string;
347
347
  sellLabel: string;