@evinvest/uikit 0.19.0 → 0.20.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 (267) hide show
  1. package/README.md +17 -5
  2. package/dist/components/accordion.js +136 -0
  3. package/dist/components/accordion.js.map +1 -0
  4. package/dist/components/alert-dialog.js +175 -0
  5. package/dist/components/alert-dialog.js.map +1 -0
  6. package/dist/components/alert.js +49 -0
  7. package/dist/components/alert.js.map +1 -0
  8. package/dist/components/avatar.js +54 -0
  9. package/dist/components/avatar.js.map +1 -0
  10. package/dist/components/badge.js +25 -0
  11. package/dist/components/badge.js.map +1 -0
  12. package/dist/components/band.js +75 -0
  13. package/dist/components/band.js.map +1 -0
  14. package/dist/components/breadcrumb.js +132 -0
  15. package/dist/components/breadcrumb.js.map +1 -0
  16. package/dist/components/button-group.js +61 -0
  17. package/dist/components/button-group.js.map +1 -0
  18. package/dist/components/button.js +55 -0
  19. package/dist/components/button.js.map +1 -0
  20. package/dist/components/calendar.js +226 -0
  21. package/dist/components/calendar.js.map +1 -0
  22. package/dist/components/card.js +98 -0
  23. package/dist/components/card.js.map +1 -0
  24. package/dist/components/carousel.js +262 -0
  25. package/dist/components/carousel.js.map +1 -0
  26. package/dist/components/chart.js +151 -0
  27. package/dist/components/chart.js.map +1 -0
  28. package/dist/components/checkbox.js +68 -0
  29. package/dist/components/checkbox.js.map +1 -0
  30. package/dist/components/collapsible.js +60 -0
  31. package/dist/components/collapsible.js.map +1 -0
  32. package/dist/components/command.js +274 -0
  33. package/dist/components/command.js.map +1 -0
  34. package/dist/components/container.js +18 -0
  35. package/dist/components/container.js.map +1 -0
  36. package/dist/components/context-menu.js +337 -0
  37. package/dist/components/context-menu.js.map +1 -0
  38. package/dist/components/date-time-picker.js +301 -0
  39. package/dist/components/date-time-picker.js.map +1 -0
  40. package/dist/components/dialog.js +207 -0
  41. package/dist/components/dialog.js.map +1 -0
  42. package/dist/components/drawer.js +351 -0
  43. package/dist/components/drawer.js.map +1 -0
  44. package/dist/components/dropdown-menu.js +356 -0
  45. package/dist/components/dropdown-menu.js.map +1 -0
  46. package/dist/components/empty.js +91 -0
  47. package/dist/components/empty.js.map +1 -0
  48. package/dist/components/field-context.js +30 -0
  49. package/dist/components/field-context.js.map +1 -0
  50. package/dist/components/field.js +216 -0
  51. package/dist/components/field.js.map +1 -0
  52. package/dist/components/footer.js +89 -0
  53. package/dist/components/footer.js.map +1 -0
  54. package/dist/components/form.js +101 -0
  55. package/dist/components/form.js.map +1 -0
  56. package/dist/components/hover-card.js +90 -0
  57. package/dist/components/hover-card.js.map +1 -0
  58. package/dist/components/info-tip.js +161 -0
  59. package/dist/components/info-tip.js.map +1 -0
  60. package/dist/components/input-group.js +124 -0
  61. package/dist/components/input-group.js.map +1 -0
  62. package/dist/components/input-otp.js +120 -0
  63. package/dist/components/input-otp.js.map +1 -0
  64. package/dist/components/input.js +26 -0
  65. package/dist/components/input.js.map +1 -0
  66. package/dist/components/item.js +167 -0
  67. package/dist/components/item.js.map +1 -0
  68. package/dist/components/kbd.js +29 -0
  69. package/dist/components/kbd.js.map +1 -0
  70. package/dist/components/label.js +11 -0
  71. package/dist/components/label.js.map +1 -0
  72. package/dist/components/logo.js +41 -0
  73. package/dist/components/logo.js.map +1 -0
  74. package/dist/components/menubar.js +330 -0
  75. package/dist/components/menubar.js.map +1 -0
  76. package/dist/components/native-select.js +62 -0
  77. package/dist/components/native-select.js.map +1 -0
  78. package/dist/components/navigation-menu.js +204 -0
  79. package/dist/components/navigation-menu.js.map +1 -0
  80. package/dist/components/pagination.js +138 -0
  81. package/dist/components/pagination.js.map +1 -0
  82. package/dist/components/popover.js +104 -0
  83. package/dist/components/popover.js.map +1 -0
  84. package/dist/components/progress.js +30 -0
  85. package/dist/components/progress.js.map +1 -0
  86. package/dist/components/radio-group.js +113 -0
  87. package/dist/components/radio-group.js.map +1 -0
  88. package/dist/components/resizable.js +193 -0
  89. package/dist/components/resizable.js.map +1 -0
  90. package/dist/components/scroll-area.js +40 -0
  91. package/dist/components/scroll-area.js.map +1 -0
  92. package/dist/components/section-descriptor.js +88 -0
  93. package/dist/components/section-descriptor.js.map +1 -0
  94. package/dist/components/select-chevron.js +25 -0
  95. package/dist/components/select-chevron.js.map +1 -0
  96. package/dist/components/select.js +288 -0
  97. package/dist/components/select.js.map +1 -0
  98. package/dist/components/separator.js +31 -0
  99. package/dist/components/separator.js.map +1 -0
  100. package/dist/components/sheet.js +200 -0
  101. package/dist/components/sheet.js.map +1 -0
  102. package/dist/components/sidebar.js +326 -0
  103. package/dist/components/sidebar.js.map +1 -0
  104. package/dist/components/skeleton.js +18 -0
  105. package/dist/components/skeleton.js.map +1 -0
  106. package/dist/components/slider.js +138 -0
  107. package/dist/components/slider.js.map +1 -0
  108. package/dist/components/sonner.js +319 -0
  109. package/dist/components/sonner.js.map +1 -0
  110. package/dist/components/spinner.js +23 -0
  111. package/dist/components/spinner.js.map +1 -0
  112. package/dist/components/status-screen.js +145 -0
  113. package/dist/components/status-screen.js.map +1 -0
  114. package/dist/components/switch.js +54 -0
  115. package/dist/components/switch.js.map +1 -0
  116. package/dist/components/table.js +124 -0
  117. package/dist/components/table.js.map +1 -0
  118. package/dist/components/tabs.js +133 -0
  119. package/dist/components/tabs.js.map +1 -0
  120. package/dist/components/terminal.js +206 -0
  121. package/dist/components/terminal.js.map +1 -0
  122. package/dist/components/textarea.js +22 -0
  123. package/dist/components/textarea.js.map +1 -0
  124. package/dist/components/toggle-group.js +105 -0
  125. package/dist/components/toggle-group.js.map +1 -0
  126. package/dist/components/toggle.js +53 -0
  127. package/dist/components/toggle.js.map +1 -0
  128. package/dist/components/tooltip.js +102 -0
  129. package/dist/components/tooltip.js.map +1 -0
  130. package/dist/generated/accent.js +27 -0
  131. package/dist/generated/accent.js.map +1 -0
  132. package/dist/generated/accordion.js +13 -0
  133. package/dist/generated/accordion.js.map +1 -0
  134. package/dist/generated/alert-dialog.js +15 -0
  135. package/dist/generated/alert-dialog.js.map +1 -0
  136. package/dist/generated/alert.js +16 -0
  137. package/dist/generated/alert.js.map +1 -0
  138. package/dist/generated/avatar.js +9 -0
  139. package/dist/generated/avatar.js.map +1 -0
  140. package/dist/generated/badge.js +13 -0
  141. package/dist/generated/badge.js.map +1 -0
  142. package/dist/generated/band.js +39 -0
  143. package/dist/generated/band.js.map +1 -0
  144. package/dist/generated/breadcrumb.js +15 -0
  145. package/dist/generated/breadcrumb.js.map +1 -0
  146. package/dist/generated/button-group.js +14 -0
  147. package/dist/generated/button-group.js.map +1 -0
  148. package/dist/generated/button.js +30 -0
  149. package/dist/generated/button.js.map +1 -0
  150. package/dist/generated/calendar.js +29 -0
  151. package/dist/generated/calendar.js.map +1 -0
  152. package/dist/generated/card.js +17 -0
  153. package/dist/generated/card.js.map +1 -0
  154. package/dist/generated/carousel.js +31 -0
  155. package/dist/generated/carousel.js.map +1 -0
  156. package/dist/generated/chart.js +9 -0
  157. package/dist/generated/chart.js.map +1 -0
  158. package/dist/generated/checkbox.js +7 -0
  159. package/dist/generated/checkbox.js.map +1 -0
  160. package/dist/generated/command.js +27 -0
  161. package/dist/generated/command.js.map +1 -0
  162. package/dist/generated/container.js +5 -0
  163. package/dist/generated/container.js.map +1 -0
  164. package/dist/generated/context-menu.js +19 -0
  165. package/dist/generated/context-menu.js.map +1 -0
  166. package/dist/generated/date-time-picker.js +15 -0
  167. package/dist/generated/date-time-picker.js.map +1 -0
  168. package/dist/generated/dialog.js +17 -0
  169. package/dist/generated/dialog.js.map +1 -0
  170. package/dist/generated/drawer.js +26 -0
  171. package/dist/generated/drawer.js.map +1 -0
  172. package/dist/generated/dropdown-menu.js +21 -0
  173. package/dist/generated/dropdown-menu.js.map +1 -0
  174. package/dist/generated/empty.js +20 -0
  175. package/dist/generated/empty.js.map +1 -0
  176. package/dist/generated/field.js +33 -0
  177. package/dist/generated/field.js.map +1 -0
  178. package/dist/generated/focus.js +5 -0
  179. package/dist/generated/focus.js.map +1 -0
  180. package/dist/generated/form.js +11 -0
  181. package/dist/generated/form.js.map +1 -0
  182. package/dist/generated/hover-card.js +5 -0
  183. package/dist/generated/hover-card.js.map +1 -0
  184. package/dist/generated/input-group.js +29 -0
  185. package/dist/generated/input-group.js.map +1 -0
  186. package/dist/generated/input-otp.js +15 -0
  187. package/dist/generated/input-otp.js.map +1 -0
  188. package/dist/generated/input.js +11 -0
  189. package/dist/generated/input.js.map +1 -0
  190. package/dist/generated/item.js +40 -0
  191. package/dist/generated/item.js.map +1 -0
  192. package/dist/generated/kbd.js +7 -0
  193. package/dist/generated/kbd.js.map +1 -0
  194. package/dist/generated/label.js +5 -0
  195. package/dist/generated/label.js.map +1 -0
  196. package/dist/generated/menubar.js +27 -0
  197. package/dist/generated/menubar.js.map +1 -0
  198. package/dist/generated/navigation-menu.js +19 -0
  199. package/dist/generated/navigation-menu.js.map +1 -0
  200. package/dist/generated/popover.js +5 -0
  201. package/dist/generated/popover.js.map +1 -0
  202. package/dist/generated/progress.js +7 -0
  203. package/dist/generated/progress.js.map +1 -0
  204. package/dist/generated/radio-group.js +7 -0
  205. package/dist/generated/radio-group.js.map +1 -0
  206. package/dist/generated/resizable.js +11 -0
  207. package/dist/generated/resizable.js.map +1 -0
  208. package/dist/generated/scroll-area.js +14 -0
  209. package/dist/generated/scroll-area.js.map +1 -0
  210. package/dist/generated/select.js +15 -0
  211. package/dist/generated/select.js.map +1 -0
  212. package/dist/generated/separator.js +10 -0
  213. package/dist/generated/separator.js.map +1 -0
  214. package/dist/generated/sheet.js +25 -0
  215. package/dist/generated/sheet.js.map +1 -0
  216. package/dist/generated/sidebar.js +41 -0
  217. package/dist/generated/sidebar.js.map +1 -0
  218. package/dist/generated/skeleton.js +5 -0
  219. package/dist/generated/skeleton.js.map +1 -0
  220. package/dist/generated/slider.js +11 -0
  221. package/dist/generated/slider.js.map +1 -0
  222. package/dist/generated/sonner.js +30 -0
  223. package/dist/generated/sonner.js.map +1 -0
  224. package/dist/generated/switch.js +7 -0
  225. package/dist/generated/switch.js.map +1 -0
  226. package/dist/generated/table.js +21 -0
  227. package/dist/generated/table.js.map +1 -0
  228. package/dist/generated/tabs.js +11 -0
  229. package/dist/generated/tabs.js.map +1 -0
  230. package/dist/generated/terminal.js +70 -0
  231. package/dist/generated/terminal.js.map +1 -0
  232. package/dist/generated/textarea.js +11 -0
  233. package/dist/generated/textarea.js.map +1 -0
  234. package/dist/generated/toggle.js +18 -0
  235. package/dist/generated/toggle.js.map +1 -0
  236. package/dist/generated/tooltip.js +5 -0
  237. package/dist/generated/tooltip.js.map +1 -0
  238. package/dist/index.d.ts +43 -10
  239. package/dist/index.js +73 -8805
  240. package/dist/lib/cn.js +12 -0
  241. package/dist/lib/cn.js.map +1 -0
  242. package/dist/lib/focus.js +5 -0
  243. package/dist/lib/focus.js.map +1 -0
  244. package/dist/primitives/dismissable-layer.js +35 -0
  245. package/dist/primitives/dismissable-layer.js.map +1 -0
  246. package/dist/primitives/focus-scope.js +58 -0
  247. package/dist/primitives/focus-scope.js.map +1 -0
  248. package/dist/primitives/merge-refs.js +13 -0
  249. package/dist/primitives/merge-refs.js.map +1 -0
  250. package/dist/primitives/portal.js +19 -0
  251. package/dist/primitives/portal.js.map +1 -0
  252. package/dist/primitives/presence.js +45 -0
  253. package/dist/primitives/presence.js.map +1 -0
  254. package/dist/primitives/slot.js +39 -0
  255. package/dist/primitives/slot.js.map +1 -0
  256. package/dist/primitives/use-controllable-state.js +24 -0
  257. package/dist/primitives/use-controllable-state.js.map +1 -0
  258. package/dist/primitives/use-floating.js +128 -0
  259. package/dist/primitives/use-floating.js.map +1 -0
  260. package/dist/primitives/use-hover-intent.js +50 -0
  261. package/dist/primitives/use-hover-intent.js.map +1 -0
  262. package/dist/primitives/use-roving-focus.js +40 -0
  263. package/dist/primitives/use-roving-focus.js.map +1 -0
  264. package/dist/primitives/walk-elements.js +13 -0
  265. package/dist/primitives/walk-elements.js.map +1 -0
  266. package/package.json +5 -4
  267. package/dist/index.js.map +0 -1
@@ -0,0 +1,124 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import * as React from "react";
3
+ import { cn } from "../lib/cn.js";
4
+ import {
5
+ TABLE,
6
+ TABLE_BODY,
7
+ TABLE_CAPTION,
8
+ TABLE_CELL,
9
+ TABLE_CONTAINER,
10
+ TABLE_FOOTER,
11
+ TABLE_HEAD,
12
+ TABLE_HEADER,
13
+ TABLE_ROW
14
+ } from "../generated/table.js";
15
+ function Table({ className, ...props }) {
16
+ return /* @__PURE__ */ jsx(
17
+ "div",
18
+ {
19
+ "data-slot": "table-container",
20
+ className: TABLE_CONTAINER,
21
+ children: /* @__PURE__ */ jsx(
22
+ "table",
23
+ {
24
+ "data-slot": "table",
25
+ className: cn(TABLE, className),
26
+ ...props
27
+ }
28
+ )
29
+ }
30
+ );
31
+ }
32
+ function TableHeader({
33
+ className,
34
+ ...props
35
+ }) {
36
+ return /* @__PURE__ */ jsx(
37
+ "thead",
38
+ {
39
+ "data-slot": "table-header",
40
+ className: cn(TABLE_HEADER, className),
41
+ ...props
42
+ }
43
+ );
44
+ }
45
+ function TableBody({
46
+ className,
47
+ ...props
48
+ }) {
49
+ return /* @__PURE__ */ jsx(
50
+ "tbody",
51
+ {
52
+ "data-slot": "table-body",
53
+ className: cn(TABLE_BODY, className),
54
+ ...props
55
+ }
56
+ );
57
+ }
58
+ function TableFooter({
59
+ className,
60
+ ...props
61
+ }) {
62
+ return /* @__PURE__ */ jsx(
63
+ "tfoot",
64
+ {
65
+ "data-slot": "table-footer",
66
+ className: cn(TABLE_FOOTER, className),
67
+ ...props
68
+ }
69
+ );
70
+ }
71
+ function TableRow({ className, ...props }) {
72
+ return /* @__PURE__ */ jsx(
73
+ "tr",
74
+ {
75
+ "data-slot": "table-row",
76
+ className: cn(TABLE_ROW, className),
77
+ ...props
78
+ }
79
+ );
80
+ }
81
+ function TableHead({ className, ...props }) {
82
+ return /* @__PURE__ */ jsx(
83
+ "th",
84
+ {
85
+ "data-slot": "table-head",
86
+ className: cn(TABLE_HEAD, className),
87
+ ...props
88
+ }
89
+ );
90
+ }
91
+ function TableCell({ className, ...props }) {
92
+ return /* @__PURE__ */ jsx(
93
+ "td",
94
+ {
95
+ "data-slot": "table-cell",
96
+ className: cn(TABLE_CELL, className),
97
+ ...props
98
+ }
99
+ );
100
+ }
101
+ function TableCaption({
102
+ className,
103
+ ...props
104
+ }) {
105
+ return /* @__PURE__ */ jsx(
106
+ "caption",
107
+ {
108
+ "data-slot": "table-caption",
109
+ className: cn(TABLE_CAPTION, className),
110
+ ...props
111
+ }
112
+ );
113
+ }
114
+ export {
115
+ Table,
116
+ TableBody,
117
+ TableCaption,
118
+ TableCell,
119
+ TableFooter,
120
+ TableHead,
121
+ TableHeader,
122
+ TableRow
123
+ };
124
+ //# sourceMappingURL=table.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/table.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport {\n TABLE,\n TABLE_BODY,\n TABLE_CAPTION,\n TABLE_CELL,\n TABLE_CONTAINER,\n TABLE_FOOTER,\n TABLE_HEAD,\n TABLE_HEADER,\n TABLE_ROW,\n} from \"../generated/table\";\n\nexport function Table({ className, ...props }: React.ComponentProps<\"table\">) {\n return (\n <div\n data-slot=\"table-container\"\n className={TABLE_CONTAINER}\n >\n <table\n data-slot=\"table\"\n className={cn(TABLE, className)}\n {...props}\n />\n </div>\n );\n}\n\nexport function TableHeader({\n className,\n ...props\n}: React.ComponentProps<\"thead\">) {\n return (\n <thead\n data-slot=\"table-header\"\n className={cn(TABLE_HEADER, className)}\n {...props}\n />\n );\n}\n\nexport function TableBody({\n className,\n ...props\n}: React.ComponentProps<\"tbody\">) {\n return (\n <tbody\n data-slot=\"table-body\"\n className={cn(TABLE_BODY, className)}\n {...props}\n />\n );\n}\n\nexport function TableFooter({\n className,\n ...props\n}: React.ComponentProps<\"tfoot\">) {\n return (\n <tfoot\n data-slot=\"table-footer\"\n className={cn(TABLE_FOOTER, className)}\n {...props}\n />\n );\n}\n\nexport function TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n return (\n <tr\n data-slot=\"table-row\"\n className={cn(TABLE_ROW, className)}\n {...props}\n />\n );\n}\n\nexport function TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n return (\n <th\n data-slot=\"table-head\"\n className={cn(TABLE_HEAD, className)}\n {...props}\n />\n );\n}\n\nexport function TableCell({ className, ...props }: React.ComponentProps<\"td\">) {\n return (\n <td\n data-slot=\"table-cell\"\n className={cn(TABLE_CELL, className)}\n {...props}\n />\n );\n}\n\nexport function TableCaption({\n className,\n ...props\n}: React.ComponentProps<\"caption\">) {\n return (\n <caption\n data-slot=\"table-caption\"\n className={cn(TABLE_CAPTION, className)}\n {...props}\n />\n );\n}\n"],"mappings":"AAoBM;AApBN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAAkC;AAC5E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,MAEX;AAAA,QAAC;AAAA;AAAA,UACC,aAAU;AAAA,UACV,WAAW,GAAG,OAAO,SAAS;AAAA,UAC7B,GAAG;AAAA;AAAA,MACN;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAAkC;AAChC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,cAAc,SAAS;AAAA,MACpC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,UAAU;AAAA,EACxB;AAAA,EACA,GAAG;AACL,GAAkC;AAChC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAAkC;AAChC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,cAAc,SAAS;AAAA,MACpC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,SAAS,EAAE,WAAW,GAAG,MAAM,GAA+B;AAC5E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,WAAW,SAAS;AAAA,MACjC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,UAAU,EAAE,WAAW,GAAG,MAAM,GAA+B;AAC7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,UAAU,EAAE,WAAW,GAAG,MAAM,GAA+B;AAC7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA,GAAG;AACL,GAAoC;AAClC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,eAAe,SAAS;AAAA,MACrC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
@@ -0,0 +1,133 @@
1
+ "use client";
2
+ import { jsx } from "react/jsx-runtime";
3
+ import * as React from "react";
4
+ import { cn } from "../lib/cn.js";
5
+ import { useControllableState } from "../primitives/use-controllable-state.js";
6
+ import { useRovingFocus } from "../primitives/use-roving-focus.js";
7
+ import { TABS_ROOT, TABS_LIST, TABS_TRIGGER, TABS_CONTENT } from "../generated/tabs.js";
8
+ const TabsContext = React.createContext(null);
9
+ function useTabs() {
10
+ const ctx = React.useContext(TabsContext);
11
+ if (!ctx) throw new Error("Tabs parts must be used within <Tabs>");
12
+ return ctx;
13
+ }
14
+ function Tabs({
15
+ className,
16
+ value,
17
+ defaultValue = "",
18
+ onValueChange,
19
+ orientation = "horizontal",
20
+ children,
21
+ ...props
22
+ }) {
23
+ const [active, setValue] = useControllableState({
24
+ ...value !== void 0 ? { value } : {},
25
+ defaultValue,
26
+ ...onValueChange ? { onChange: onValueChange } : {}
27
+ });
28
+ return /* @__PURE__ */ jsx(TabsContext.Provider, { value: { value: active, setValue, orientation }, children: /* @__PURE__ */ jsx(
29
+ "div",
30
+ {
31
+ "data-slot": "tabs",
32
+ "data-orientation": orientation,
33
+ className: cn(TABS_ROOT, className),
34
+ ...props,
35
+ children
36
+ }
37
+ ) });
38
+ }
39
+ function TabsList({
40
+ className,
41
+ children,
42
+ onKeyDown,
43
+ ...props
44
+ }) {
45
+ const { orientation } = useTabs();
46
+ const items = React.Children.toArray(children);
47
+ const { activeIndex, setActiveIndex, onKeyDown: rovingKeyDown } = useRovingFocus({
48
+ count: items.length,
49
+ orientation: orientation === "vertical" ? "vertical" : "horizontal"
50
+ });
51
+ return /* @__PURE__ */ jsx(
52
+ "div",
53
+ {
54
+ role: "tablist",
55
+ "data-slot": "tabs-list",
56
+ "aria-orientation": orientation,
57
+ className: cn(TABS_LIST, className),
58
+ onKeyDown: (e) => {
59
+ onKeyDown?.(e);
60
+ rovingKeyDown(e);
61
+ },
62
+ ...props,
63
+ children: items.map(
64
+ (child, index) => React.isValidElement(child) ? React.cloneElement(child, {
65
+ __index: index,
66
+ __isFocusItem: index === activeIndex,
67
+ __onFocusItem: () => setActiveIndex(index)
68
+ }) : child
69
+ )
70
+ }
71
+ );
72
+ }
73
+ function TabsTrigger({
74
+ className,
75
+ value,
76
+ onClick,
77
+ onFocus,
78
+ __isFocusItem,
79
+ __onFocusItem,
80
+ ...props
81
+ }) {
82
+ const { value: active, setValue } = useTabs();
83
+ const selected = active === value;
84
+ return /* @__PURE__ */ jsx(
85
+ "button",
86
+ {
87
+ type: "button",
88
+ role: "tab",
89
+ "data-slot": "tabs-trigger",
90
+ "data-state": selected ? "active" : "inactive",
91
+ "aria-selected": selected,
92
+ tabIndex: __isFocusItem ? 0 : -1,
93
+ className: cn(TABS_TRIGGER, className),
94
+ onClick: (e) => {
95
+ onClick?.(e);
96
+ __onFocusItem?.();
97
+ setValue(value);
98
+ },
99
+ onFocus: (e) => {
100
+ onFocus?.(e);
101
+ __onFocusItem?.();
102
+ },
103
+ ...props
104
+ }
105
+ );
106
+ }
107
+ function TabsContent({
108
+ className,
109
+ value,
110
+ children,
111
+ ...props
112
+ }) {
113
+ const { value: active } = useTabs();
114
+ if (active !== value) return null;
115
+ return /* @__PURE__ */ jsx(
116
+ "div",
117
+ {
118
+ role: "tabpanel",
119
+ "data-slot": "tabs-content",
120
+ "data-state": "active",
121
+ className: cn(TABS_CONTENT, className),
122
+ ...props,
123
+ children
124
+ }
125
+ );
126
+ }
127
+ export {
128
+ Tabs,
129
+ TabsContent,
130
+ TabsList,
131
+ TabsTrigger
132
+ };
133
+ //# sourceMappingURL=tabs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { useRovingFocus } from \"../primitives/use-roving-focus\";\nimport { TABS_ROOT, TABS_LIST, TABS_TRIGGER, TABS_CONTENT } from \"../generated/tabs\";\n\ntype TabsOrientation = \"horizontal\" | \"vertical\";\n\ninterface TabsContextValue {\n value: string;\n setValue: (next: string) => void;\n orientation: TabsOrientation;\n}\n\nconst TabsContext = React.createContext<TabsContextValue | null>(null);\n\nfunction useTabs(): TabsContextValue {\n const ctx = React.useContext(TabsContext);\n if (!ctx) throw new Error(\"Tabs parts must be used within <Tabs>\");\n return ctx;\n}\n\nexport interface TabsProps\n extends Omit<React.ComponentProps<\"div\">, \"onChange\"> {\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n orientation?: TabsOrientation;\n}\n\nexport function Tabs({\n className,\n value,\n defaultValue = \"\",\n onValueChange,\n orientation = \"horizontal\",\n children,\n ...props\n}: TabsProps) {\n const [active, setValue] = useControllableState<string>({\n ...(value !== undefined ? { value } : {}),\n defaultValue,\n ...(onValueChange ? { onChange: onValueChange } : {}),\n });\n return (\n <TabsContext.Provider value={{ value: active, setValue, orientation }}>\n <div\n data-slot=\"tabs\"\n data-orientation={orientation}\n className={cn(TABS_ROOT, className)}\n {...props}\n >\n {children}\n </div>\n </TabsContext.Provider>\n );\n}\n\nexport function TabsList({\n className,\n children,\n onKeyDown,\n ...props\n}: React.ComponentProps<\"div\">) {\n const { orientation } = useTabs();\n const items = React.Children.toArray(children);\n const { activeIndex, setActiveIndex, onKeyDown: rovingKeyDown } =\n useRovingFocus({\n count: items.length,\n orientation: orientation === \"vertical\" ? \"vertical\" : \"horizontal\",\n });\n return (\n <div\n role=\"tablist\"\n data-slot=\"tabs-list\"\n aria-orientation={orientation}\n className={cn(TABS_LIST, className)}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n rovingKeyDown(e);\n }}\n {...props}\n >\n {items.map((child, index) =>\n React.isValidElement(child)\n ? React.cloneElement(child as React.ReactElement<TabsTriggerInternal>, {\n __index: index,\n __isFocusItem: index === activeIndex,\n __onFocusItem: () => setActiveIndex(index),\n })\n : child,\n )}\n </div>\n );\n}\n\ninterface TabsTriggerInternal {\n __index?: number;\n __isFocusItem?: boolean;\n __onFocusItem?: () => void;\n}\n\nexport interface TabsTriggerProps\n extends React.ComponentProps<\"button\">,\n TabsTriggerInternal {\n value: string;\n}\n\nexport function TabsTrigger({\n className,\n value,\n onClick,\n onFocus,\n __isFocusItem,\n __onFocusItem,\n ...props\n}: TabsTriggerProps) {\n const { value: active, setValue } = useTabs();\n const selected = active === value;\n return (\n <button\n type=\"button\"\n role=\"tab\"\n data-slot=\"tabs-trigger\"\n data-state={selected ? \"active\" : \"inactive\"}\n aria-selected={selected}\n tabIndex={__isFocusItem ? 0 : -1}\n className={cn(TABS_TRIGGER, className)}\n onClick={(e) => {\n onClick?.(e);\n __onFocusItem?.();\n setValue(value);\n }}\n onFocus={(e) => {\n onFocus?.(e);\n __onFocusItem?.();\n }}\n {...props}\n />\n );\n}\n\nexport interface TabsContentProps extends React.ComponentProps<\"div\"> {\n value: string;\n}\n\nexport function TabsContent({\n className,\n value,\n children,\n ...props\n}: TabsContentProps) {\n const { value: active } = useTabs();\n if (active !== value) return null;\n return (\n <div\n role=\"tabpanel\"\n data-slot=\"tabs-content\"\n data-state=\"active\"\n className={cn(TABS_CONTENT, className)}\n {...props}\n >\n {children}\n </div>\n );\n}\n"],"mappings":"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","names":[]}
@@ -0,0 +1,206 @@
1
+ "use client";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import * as React from "react";
4
+ import { cn } from "../lib/cn.js";
5
+ import {
6
+ bookDepthClasses,
7
+ bookSideClasses,
8
+ OPEN_ORDERS_EMPTY,
9
+ ORDER_BOOK,
10
+ ORDER_BOOK_DEPTH,
11
+ ORDER_BOOK_HEAD,
12
+ ORDER_BOOK_PRICE,
13
+ ORDER_BOOK_ROW,
14
+ ORDER_BOOK_SPREAD,
15
+ ORDER_FORM,
16
+ ORDER_FORM_LABEL,
17
+ ORDER_FORM_ROW,
18
+ ORDER_FORM_SUBMIT_BASE,
19
+ ORDER_FORM_VALUE,
20
+ orderSideClasses,
21
+ TERMINAL_CHART,
22
+ TERMINAL_PANE,
23
+ TERMINAL_PANE_BODY,
24
+ TERMINAL_PANE_HEADER,
25
+ TERMINAL_ROOT,
26
+ TERMINAL_TICKER,
27
+ TERMINAL_TICKER_LABEL,
28
+ TERMINAL_TICKER_STAT,
29
+ TERMINAL_TICKER_VALUE,
30
+ terminalAreaClasses,
31
+ TRADES_TAPE_ROW
32
+ } from "../generated/terminal.js";
33
+ function Terminal({ className, ...props }) {
34
+ return /* @__PURE__ */ jsx("div", { "data-slot": "terminal", className: cn(TERMINAL_ROOT, className), ...props });
35
+ }
36
+ function TerminalPane({ area, className, ...props }) {
37
+ return /* @__PURE__ */ jsx(
38
+ "section",
39
+ {
40
+ "data-slot": "terminal-pane",
41
+ "data-area": area,
42
+ className: cn(TERMINAL_PANE, terminalAreaClasses[area], className),
43
+ ...props
44
+ }
45
+ );
46
+ }
47
+ function TerminalPaneHeader({ className, ...props }) {
48
+ return /* @__PURE__ */ jsx(
49
+ "header",
50
+ {
51
+ "data-slot": "terminal-pane-header",
52
+ className: cn(TERMINAL_PANE_HEADER, className),
53
+ ...props
54
+ }
55
+ );
56
+ }
57
+ function TerminalPaneBody({ className, ...props }) {
58
+ return /* @__PURE__ */ jsx("div", { "data-slot": "terminal-pane-body", className: cn(TERMINAL_PANE_BODY, className), ...props });
59
+ }
60
+ const TerminalChart = React.forwardRef(function TerminalChart2({ className, ...props }, ref) {
61
+ return /* @__PURE__ */ jsx(
62
+ "div",
63
+ {
64
+ ref,
65
+ "data-slot": "terminal-chart",
66
+ className: cn(TERMINAL_CHART, className),
67
+ ...props
68
+ }
69
+ );
70
+ });
71
+ function TerminalTicker({ className, ...props }) {
72
+ return /* @__PURE__ */ jsx(
73
+ "div",
74
+ {
75
+ "data-slot": "terminal-ticker",
76
+ "data-area": "ticker",
77
+ className: cn(TERMINAL_TICKER, terminalAreaClasses.ticker, className),
78
+ ...props
79
+ }
80
+ );
81
+ }
82
+ function TickerStat({ label, value, className, ...props }) {
83
+ return /* @__PURE__ */ jsxs("div", { "data-slot": "ticker-stat", className: TERMINAL_TICKER_STAT, ...props, children: [
84
+ /* @__PURE__ */ jsx("span", { className: TERMINAL_TICKER_LABEL, children: label }),
85
+ /* @__PURE__ */ jsx("span", { className: cn(TERMINAL_TICKER_VALUE, className), children: value })
86
+ ] });
87
+ }
88
+ function OrderBook({ className, ...props }) {
89
+ return /* @__PURE__ */ jsx("div", { "data-slot": "order-book", className: cn(ORDER_BOOK, className), ...props });
90
+ }
91
+ function OrderBookHead({ price, size, total, className, ...props }) {
92
+ return /* @__PURE__ */ jsxs("div", { "data-slot": "order-book-head", className: cn(ORDER_BOOK_HEAD, className), ...props, children: [
93
+ /* @__PURE__ */ jsx("span", { children: price }),
94
+ /* @__PURE__ */ jsx("span", { children: size }),
95
+ /* @__PURE__ */ jsx("span", { children: total })
96
+ ] });
97
+ }
98
+ function OrderBookRow({
99
+ side,
100
+ price,
101
+ size,
102
+ total,
103
+ depth = 0,
104
+ className,
105
+ ...props
106
+ }) {
107
+ return /* @__PURE__ */ jsxs(
108
+ "div",
109
+ {
110
+ "data-slot": "order-book-row",
111
+ "data-side": side,
112
+ className: cn(ORDER_BOOK_ROW, className),
113
+ ...props,
114
+ children: [
115
+ /* @__PURE__ */ jsx(
116
+ "span",
117
+ {
118
+ "aria-hidden": "true",
119
+ className: cn(ORDER_BOOK_DEPTH, bookDepthClasses[side]),
120
+ style: { width: `${depthPercent(depth)}%` }
121
+ }
122
+ ),
123
+ /* @__PURE__ */ jsx("span", { className: cn(ORDER_BOOK_PRICE, bookSideClasses[side]), children: price }),
124
+ /* @__PURE__ */ jsx("span", { children: size }),
125
+ /* @__PURE__ */ jsx("span", { children: total })
126
+ ]
127
+ }
128
+ );
129
+ }
130
+ function depthPercent(depth) {
131
+ if (Number.isNaN(depth)) return 0;
132
+ return Math.round(Math.min(1, Math.max(0, depth)) * 100);
133
+ }
134
+ function OrderBookSpread({ className, ...props }) {
135
+ return /* @__PURE__ */ jsx("div", { "data-slot": "order-book-spread", className: cn(ORDER_BOOK_SPREAD, className), ...props });
136
+ }
137
+ function TradesTapeRow({ side, price, size, time, className, ...props }) {
138
+ return /* @__PURE__ */ jsxs(
139
+ "div",
140
+ {
141
+ "data-slot": "trades-tape-row",
142
+ "data-side": side,
143
+ className: cn(TRADES_TAPE_ROW, className),
144
+ ...props,
145
+ children: [
146
+ /* @__PURE__ */ jsx("span", { className: cn(ORDER_BOOK_PRICE, bookSideClasses[side]), children: price }),
147
+ /* @__PURE__ */ jsx("span", { children: size }),
148
+ /* @__PURE__ */ jsx("span", { children: time })
149
+ ]
150
+ }
151
+ );
152
+ }
153
+ function OrderForm({ className, onSubmit, ...props }) {
154
+ return /* @__PURE__ */ jsx(
155
+ "form",
156
+ {
157
+ "data-slot": "order-form",
158
+ className: cn(ORDER_FORM, className),
159
+ onSubmit: (e) => {
160
+ e.preventDefault();
161
+ onSubmit?.(e);
162
+ },
163
+ ...props
164
+ }
165
+ );
166
+ }
167
+ function OrderFormRow({ label, value, className, ...props }) {
168
+ return /* @__PURE__ */ jsxs("div", { "data-slot": "order-form-row", className: cn(ORDER_FORM_ROW, className), ...props, children: [
169
+ /* @__PURE__ */ jsx("span", { className: ORDER_FORM_LABEL, children: label }),
170
+ /* @__PURE__ */ jsx("span", { className: ORDER_FORM_VALUE, children: value })
171
+ ] });
172
+ }
173
+ function OrderFormSubmit({ side = "buy", className, ...props }) {
174
+ return /* @__PURE__ */ jsx(
175
+ "button",
176
+ {
177
+ type: "submit",
178
+ "data-slot": "order-form-submit",
179
+ "data-side": side,
180
+ className: cn(ORDER_FORM_SUBMIT_BASE, orderSideClasses[side], className),
181
+ ...props
182
+ }
183
+ );
184
+ }
185
+ function OpenOrdersEmpty({ className, ...props }) {
186
+ return /* @__PURE__ */ jsx("div", { "data-slot": "open-orders-empty", className: cn(OPEN_ORDERS_EMPTY, className), ...props });
187
+ }
188
+ export {
189
+ OpenOrdersEmpty,
190
+ OrderBook,
191
+ OrderBookHead,
192
+ OrderBookRow,
193
+ OrderBookSpread,
194
+ OrderForm,
195
+ OrderFormRow,
196
+ OrderFormSubmit,
197
+ Terminal,
198
+ TerminalChart,
199
+ TerminalPane,
200
+ TerminalPaneBody,
201
+ TerminalPaneHeader,
202
+ TerminalTicker,
203
+ TickerStat,
204
+ TradesTapeRow
205
+ };
206
+ //# sourceMappingURL=terminal.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/terminal.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport {\n bookDepthClasses,\n bookSideClasses,\n OPEN_ORDERS_EMPTY,\n ORDER_BOOK,\n ORDER_BOOK_DEPTH,\n ORDER_BOOK_HEAD,\n ORDER_BOOK_PRICE,\n ORDER_BOOK_ROW,\n ORDER_BOOK_SPREAD,\n ORDER_FORM,\n ORDER_FORM_LABEL,\n ORDER_FORM_ROW,\n ORDER_FORM_SUBMIT_BASE,\n ORDER_FORM_VALUE,\n orderSideClasses,\n TERMINAL_CHART,\n TERMINAL_PANE,\n TERMINAL_PANE_BODY,\n TERMINAL_PANE_HEADER,\n TERMINAL_ROOT,\n TERMINAL_TICKER,\n TERMINAL_TICKER_LABEL,\n TERMINAL_TICKER_STAT,\n TERMINAL_TICKER_VALUE,\n terminalAreaClasses,\n TRADES_TAPE_ROW,\n type BookSide,\n type OrderSide,\n type TerminalArea,\n} from \"../generated/terminal\";\n\nexport type { BookSide, OrderSide, TerminalArea };\n\n/**\n * The trading terminal — an order book over an investment product's shares,\n * laid out like a spot exchange: ticker, then chart | book | order form, then\n * the trader's own orders. Every pane is a slot; the chart host is empty on\n * purpose (the plotting engine is the consumer's), the open-orders table is\n * `Table`, the tabs over it are `Tabs`.\n */\n\n/**\n * The frame: a phone stacks the panes in DOM order, `lg` and up places them\n * by `TerminalArea` on a viewport-bound grid.\n */\nexport function Terminal({ className, ...props }: React.ComponentProps<\"div\">) {\n return <div data-slot=\"terminal\" className={cn(TERMINAL_ROOT, className)} {...props} />;\n}\n\nexport interface TerminalPaneProps extends React.ComponentProps<\"section\"> {\n area: TerminalArea;\n}\n\n/**\n * One cell of the frame. `area` is where it sits on the desktop grid;\n * `TerminalPaneHeader` and `TerminalPaneBody` go inside.\n */\nexport function TerminalPane({ area, className, ...props }: TerminalPaneProps) {\n return (\n <section\n data-slot=\"terminal-pane\"\n data-area={area}\n className={cn(TERMINAL_PANE, terminalAreaClasses[area], className)}\n {...props}\n />\n );\n}\n\nexport function TerminalPaneHeader({ className, ...props }: React.ComponentProps<\"header\">) {\n return (\n <header\n data-slot=\"terminal-pane-header\"\n className={cn(TERMINAL_PANE_HEADER, className)}\n {...props}\n />\n );\n}\n\n/** The scrolling part of a pane. */\nexport function TerminalPaneBody({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div data-slot=\"terminal-pane-body\" className={cn(TERMINAL_PANE_BODY, className)} {...props} />\n );\n}\n\n/**\n * The sized host a plotting engine mounts into. Renders nothing itself; a\n * consumer mounts its chart on the element (via `ref`) or fills it with\n * children. `forwardRef` rather than a `ref` prop so the handle also reaches\n * the element under React 18, where function components drop `ref`.\n */\nexport const TerminalChart = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<\"div\">\n>(function TerminalChart({ className, ...props }, ref) {\n return (\n <div\n ref={ref}\n data-slot=\"terminal-chart\"\n className={cn(TERMINAL_CHART, className)}\n {...props}\n />\n );\n});\n\n/**\n * The strip across the top; holds `TickerStat`s. Already placed in the\n * `ticker` slot.\n */\nexport function TerminalTicker({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"terminal-ticker\"\n data-area=\"ticker\"\n className={cn(TERMINAL_TICKER, terminalAreaClasses.ticker, className)}\n {...props}\n />\n );\n}\n\nexport interface TickerStatProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n label: React.ReactNode;\n value: React.ReactNode;\n}\n\n/**\n * A labelled figure in the ticker. `className` lands on the figure, so a\n * change figure passes its valence colour there.\n */\nexport function TickerStat({ label, value, className, ...props }: TickerStatProps) {\n return (\n <div data-slot=\"ticker-stat\" className={TERMINAL_TICKER_STAT} {...props}>\n <span className={TERMINAL_TICKER_LABEL}>{label}</span>\n <span className={cn(TERMINAL_TICKER_VALUE, className)}>{value}</span>\n </div>\n );\n}\n\n/** The book: `OrderBookHead`, then ask rows, `OrderBookSpread`, bid rows. */\nexport function OrderBook({ className, ...props }: React.ComponentProps<\"div\">) {\n return <div data-slot=\"order-book\" className={cn(ORDER_BOOK, className)} {...props} />;\n}\n\nexport interface OrderBookHeadProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n price: React.ReactNode;\n size: React.ReactNode;\n total: React.ReactNode;\n}\n\n/** The three column captions — price, size, total — in the consumer's words. */\nexport function OrderBookHead({ price, size, total, className, ...props }: OrderBookHeadProps) {\n return (\n <div data-slot=\"order-book-head\" className={cn(ORDER_BOOK_HEAD, className)} {...props}>\n <span>{price}</span>\n <span>{size}</span>\n <span>{total}</span>\n </div>\n );\n}\n\nexport interface OrderBookRowProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n side: BookSide;\n price: React.ReactNode;\n size: React.ReactNode;\n total: React.ReactNode;\n /**\n * This level's cumulative size as a fraction of the deepest level shown\n * (`0..=1`); it sizes the bar behind the figures.\n */\n depth?: number;\n}\n\n/** One price level. */\nexport function OrderBookRow({\n side,\n price,\n size,\n total,\n depth = 0,\n className,\n ...props\n}: OrderBookRowProps) {\n return (\n <div\n data-slot=\"order-book-row\"\n data-side={side}\n className={cn(ORDER_BOOK_ROW, className)}\n {...props}\n >\n <span\n aria-hidden=\"true\"\n className={cn(ORDER_BOOK_DEPTH, bookDepthClasses[side])}\n style={{ width: `${depthPercent(depth)}%` }}\n />\n <span className={cn(ORDER_BOOK_PRICE, bookSideClasses[side])}>{price}</span>\n <span>{size}</span>\n <span>{total}</span>\n </div>\n );\n}\n\n/**\n * The bar is a CSS percentage, so the fraction is clamped and rounded once\n * here; a NaN from an empty book reads as no depth rather than as `NaN%`.\n */\nfunction depthPercent(depth: number): number {\n if (Number.isNaN(depth)) return 0;\n return Math.round(Math.min(1, Math.max(0, depth)) * 100);\n}\n\n/**\n * The line between asks and bids: the consumer passes the mid and the spread\n * as it wants them formatted.\n */\nexport function OrderBookSpread({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div data-slot=\"order-book-spread\" className={cn(ORDER_BOOK_SPREAD, className)} {...props} />\n );\n}\n\nexport interface TradesTapeRowProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n side: BookSide;\n price: React.ReactNode;\n size: React.ReactNode;\n time: React.ReactNode;\n}\n\n/** One print in the tape: price coloured by the aggressor's side, then size and time. */\nexport function TradesTapeRow({ side, price, size, time, className, ...props }: TradesTapeRowProps) {\n return (\n <div\n data-slot=\"trades-tape-row\"\n data-side={side}\n className={cn(TRADES_TAPE_ROW, className)}\n {...props}\n >\n <span className={cn(ORDER_BOOK_PRICE, bookSideClasses[side])}>{price}</span>\n <span>{size}</span>\n <span>{time}</span>\n </div>\n );\n}\n\n/**\n * The order form. Owns no state: the consumer wires the inputs and handles\n * `onSubmit`; the default is prevented here so a submit never navigates.\n */\nexport function OrderForm({ className, onSubmit, ...props }: React.ComponentProps<\"form\">) {\n return (\n <form\n data-slot=\"order-form\"\n className={cn(ORDER_FORM, className)}\n onSubmit={(e) => {\n e.preventDefault();\n onSubmit?.(e);\n }}\n {...props}\n />\n );\n}\n\nexport interface OrderFormRowProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n label: React.ReactNode;\n value: React.ReactNode;\n}\n\n/** A label / figure line in the order summary — cost, fee, what is available. */\nexport function OrderFormRow({ label, value, className, ...props }: OrderFormRowProps) {\n return (\n <div data-slot=\"order-form-row\" className={cn(ORDER_FORM_ROW, className)} {...props}>\n <span className={ORDER_FORM_LABEL}>{label}</span>\n <span className={ORDER_FORM_VALUE}>{value}</span>\n </div>\n );\n}\n\nexport interface OrderFormSubmitProps extends Omit<React.ComponentProps<\"button\">, \"type\"> {\n side?: OrderSide;\n}\n\n/** The submit, filled in the colour of the intent. */\nexport function OrderFormSubmit({ side = \"buy\", className, ...props }: OrderFormSubmitProps) {\n return (\n <button\n type=\"submit\"\n data-slot=\"order-form-submit\"\n data-side={side}\n className={cn(ORDER_FORM_SUBMIT_BASE, orderSideClasses[side], className)}\n {...props}\n />\n );\n}\n\n/** The open-orders pane with nothing in it. */\nexport function OpenOrdersEmpty({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div data-slot=\"open-orders-empty\" className={cn(OPEN_ORDERS_EMPTY, className)} {...props} />\n );\n}\n"],"mappings":"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","names":["TerminalChart"]}
@@ -0,0 +1,22 @@
1
+ "use client";
2
+ import { jsx } from "react/jsx-runtime";
3
+ import * as React from "react";
4
+ import { cn } from "../lib/cn.js";
5
+ import { TEXTAREA_BASE, textareaSizeClasses } from "../generated/textarea.js";
6
+ import { useFieldControlId } from "./field-context.js";
7
+ function Textarea({ className, id, size = "md", ...props }) {
8
+ return /* @__PURE__ */ jsx(
9
+ "textarea",
10
+ {
11
+ "data-slot": "textarea",
12
+ "data-size": size,
13
+ id: useFieldControlId(id),
14
+ className: cn(TEXTAREA_BASE, textareaSizeClasses[size], className),
15
+ ...props
16
+ }
17
+ );
18
+ }
19
+ export {
20
+ Textarea
21
+ };
22
+ //# sourceMappingURL=textarea.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/textarea.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { TEXTAREA_BASE, textareaSizeClasses, type TextareaSize } from \"../generated/textarea\";\nimport { useFieldControlId } from \"./field-context\";\n\nexport type { TextareaSize };\n\nexport interface TextareaProps extends React.ComponentProps<\"textarea\"> {\n size?: TextareaSize;\n}\n\nexport function Textarea({ className, id, size = \"md\", ...props }: TextareaProps) {\n return (\n <textarea\n data-slot=\"textarea\"\n data-size={size}\n id={useFieldControlId(id)}\n className={cn(TEXTAREA_BASE, textareaSizeClasses[size], className)}\n {...props}\n />\n );\n}\n"],"mappings":";AAeI;AAbJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,eAAe,2BAA8C;AACtE,SAAS,yBAAyB;AAQ3B,SAAS,SAAS,EAAE,WAAW,IAAI,OAAO,MAAM,GAAG,MAAM,GAAkB;AAChF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,aAAW;AAAA,MACX,IAAI,kBAAkB,EAAE;AAAA,MACxB,WAAW,GAAG,eAAe,oBAAoB,IAAI,GAAG,SAAS;AAAA,MAChE,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
@@ -0,0 +1,105 @@
1
+ "use client";
2
+ import { jsx } from "react/jsx-runtime";
3
+ import * as React from "react";
4
+ import { cn } from "../lib/cn.js";
5
+ import { useControllableState } from "../primitives/use-controllable-state.js";
6
+ import {
7
+ toggleVariants
8
+ } from "./toggle.js";
9
+ const ToggleGroupContext = React.createContext({
10
+ variant: "bare",
11
+ size: "md",
12
+ value: [],
13
+ toggle: () => {
14
+ }
15
+ });
16
+ function toArray(v) {
17
+ if (v === void 0) return [];
18
+ return Array.isArray(v) ? v : v === "" ? [] : [v];
19
+ }
20
+ function ToggleGroup({
21
+ className,
22
+ variant = "bare",
23
+ size = "md",
24
+ type = "single",
25
+ value,
26
+ defaultValue,
27
+ onValueChange,
28
+ children,
29
+ ...props
30
+ }) {
31
+ const [selected, setSelected] = useControllableState({
32
+ ...value !== void 0 ? { value: toArray(value) } : {},
33
+ defaultValue: toArray(defaultValue),
34
+ onChange: (next) => onValueChange?.(type === "single" ? next[0] ?? "" : next)
35
+ });
36
+ const toggle = React.useCallback(
37
+ (itemValue) => {
38
+ if (type === "single") {
39
+ setSelected(selected.includes(itemValue) ? [] : [itemValue]);
40
+ } else {
41
+ setSelected(
42
+ selected.includes(itemValue) ? selected.filter((v) => v !== itemValue) : [...selected, itemValue]
43
+ );
44
+ }
45
+ },
46
+ [type, selected, setSelected]
47
+ );
48
+ return /* @__PURE__ */ jsx(
49
+ "div",
50
+ {
51
+ "data-slot": "toggle-group",
52
+ "data-variant": variant,
53
+ "data-size": size,
54
+ className: cn(
55
+ "group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs",
56
+ className
57
+ ),
58
+ ...props,
59
+ children: /* @__PURE__ */ jsx(ToggleGroupContext.Provider, { value: { variant, size, value: selected, toggle }, children })
60
+ }
61
+ );
62
+ }
63
+ function ToggleGroupItem({
64
+ className,
65
+ children,
66
+ value,
67
+ variant,
68
+ size,
69
+ onClick,
70
+ ...props
71
+ }) {
72
+ const context = React.useContext(ToggleGroupContext);
73
+ const resolvedVariant = context.variant || variant || "bare";
74
+ const resolvedSize = context.size || size || "md";
75
+ const on = context.value.includes(value);
76
+ return /* @__PURE__ */ jsx(
77
+ "button",
78
+ {
79
+ type: "button",
80
+ "data-slot": "toggle-group-item",
81
+ "data-variant": resolvedVariant,
82
+ "data-size": resolvedSize,
83
+ "data-state": on ? "on" : "off",
84
+ "aria-pressed": on,
85
+ className: cn(
86
+ toggleVariants({ variant: resolvedVariant, size: resolvedSize }),
87
+ // `flex-auto`, not shadcn's `flex-1`: the group is `w-fit`, and basis-0 items
88
+ // make Chrome split it into equal columns, so a longer label overflows its cell.
89
+ "min-w-0 flex-auto shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l",
90
+ className
91
+ ),
92
+ onClick: (e) => {
93
+ onClick?.(e);
94
+ context.toggle(value);
95
+ },
96
+ ...props,
97
+ children
98
+ }
99
+ );
100
+ }
101
+ export {
102
+ ToggleGroup,
103
+ ToggleGroupItem
104
+ };
105
+ //# sourceMappingURL=toggle-group.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/toggle-group.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport {\n toggleVariants,\n type ToggleVariant,\n type ToggleSize,\n} from \"./toggle\";\n\ntype ToggleGroupContextValue = {\n variant: ToggleVariant;\n size: ToggleSize;\n value: string[];\n toggle: (itemValue: string) => void;\n};\n\nconst ToggleGroupContext = React.createContext<ToggleGroupContextValue>({\n variant: \"bare\",\n size: \"md\",\n value: [],\n toggle: () => {},\n});\n\nexport interface ToggleGroupProps\n extends Omit<React.ComponentProps<\"div\">, \"onChange\"> {\n variant?: ToggleVariant;\n size?: ToggleSize;\n type?: \"single\" | \"multiple\";\n value?: string | string[];\n defaultValue?: string | string[];\n onValueChange?: (value: string | string[]) => void;\n}\n\nfunction toArray(v: string | string[] | undefined): string[] {\n if (v === undefined) return [];\n return Array.isArray(v) ? v : v === \"\" ? [] : [v];\n}\n\nexport function ToggleGroup({\n className,\n variant = \"bare\",\n size = \"md\",\n type = \"single\",\n value,\n defaultValue,\n onValueChange,\n children,\n ...props\n}: ToggleGroupProps) {\n const [selected, setSelected] = useControllableState<string[]>({\n ...(value !== undefined ? { value: toArray(value) } : {}),\n defaultValue: toArray(defaultValue),\n onChange: (next) =>\n onValueChange?.(type === \"single\" ? (next[0] ?? \"\") : next),\n });\n\n const toggle = React.useCallback(\n (itemValue: string) => {\n if (type === \"single\") {\n setSelected(selected.includes(itemValue) ? [] : [itemValue]);\n } else {\n setSelected(\n selected.includes(itemValue)\n ? selected.filter((v) => v !== itemValue)\n : [...selected, itemValue],\n );\n }\n },\n [type, selected, setSelected],\n );\n\n return (\n <div\n data-slot=\"toggle-group\"\n data-variant={variant}\n data-size={size}\n className={cn(\n \"group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs\",\n className,\n )}\n {...props}\n >\n <ToggleGroupContext.Provider value={{ variant, size, value: selected, toggle }}>\n {children}\n </ToggleGroupContext.Provider>\n </div>\n );\n}\n\nexport interface ToggleGroupItemProps\n extends Omit<React.ComponentProps<\"button\">, \"value\" | \"onChange\"> {\n value: string;\n variant?: ToggleVariant;\n size?: ToggleSize;\n}\n\nexport function ToggleGroupItem({\n className,\n children,\n value,\n variant,\n size,\n onClick,\n ...props\n}: ToggleGroupItemProps) {\n const context = React.useContext(ToggleGroupContext);\n const resolvedVariant = context.variant || variant || \"bare\";\n const resolvedSize = context.size || size || \"md\";\n const on = context.value.includes(value);\n\n return (\n <button\n type=\"button\"\n data-slot=\"toggle-group-item\"\n data-variant={resolvedVariant}\n data-size={resolvedSize}\n data-state={on ? \"on\" : \"off\"}\n aria-pressed={on}\n className={cn(\n toggleVariants({ variant: resolvedVariant, size: resolvedSize }),\n // `flex-auto`, not shadcn's `flex-1`: the group is `w-fit`, and basis-0 items\n // make Chrome split it into equal columns, so a longer label overflows its cell.\n \"min-w-0 flex-auto shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l\",\n className,\n )}\n onClick={(e) => {\n onClick?.(e);\n context.toggle(value);\n }}\n {...props}\n >\n {children}\n </button>\n );\n}\n"],"mappings":";AAoFM;AAlFN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC;AAAA,EACE;AAAA,OAGK;AASP,MAAM,qBAAqB,MAAM,cAAuC;AAAA,EACtE,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO,CAAC;AAAA,EACR,QAAQ,MAAM;AAAA,EAAC;AACjB,CAAC;AAYD,SAAS,QAAQ,GAA4C;AAC3D,MAAI,MAAM,OAAW,QAAO,CAAC;AAC7B,SAAO,MAAM,QAAQ,CAAC,IAAI,IAAI,MAAM,KAAK,CAAC,IAAI,CAAC,CAAC;AAClD;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,CAAC,UAAU,WAAW,IAAI,qBAA+B;AAAA,IAC7D,GAAI,UAAU,SAAY,EAAE,OAAO,QAAQ,KAAK,EAAE,IAAI,CAAC;AAAA,IACvD,cAAc,QAAQ,YAAY;AAAA,IAClC,UAAU,CAAC,SACT,gBAAgB,SAAS,WAAY,KAAK,CAAC,KAAK,KAAM,IAAI;AAAA,EAC9D,CAAC;AAED,QAAM,SAAS,MAAM;AAAA,IACnB,CAAC,cAAsB;AACrB,UAAI,SAAS,UAAU;AACrB,oBAAY,SAAS,SAAS,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;AAAA,MAC7D,OAAO;AACL;AAAA,UACE,SAAS,SAAS,SAAS,IACvB,SAAS,OAAO,CAAC,MAAM,MAAM,SAAS,IACtC,CAAC,GAAG,UAAU,SAAS;AAAA,QAC7B;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,MAAM,UAAU,WAAW;AAAA,EAC9B;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,aAAW;AAAA,MACX,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,8BAAC,mBAAmB,UAAnB,EAA4B,OAAO,EAAE,SAAS,MAAM,OAAO,UAAU,OAAO,GAC1E,UACH;AAAA;AAAA,EACF;AAEJ;AASO,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAyB;AACvB,QAAM,UAAU,MAAM,WAAW,kBAAkB;AACnD,QAAM,kBAAkB,QAAQ,WAAW,WAAW;AACtD,QAAM,eAAe,QAAQ,QAAQ,QAAQ;AAC7C,QAAM,KAAK,QAAQ,MAAM,SAAS,KAAK;AAEvC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,aAAW;AAAA,MACX,cAAY,KAAK,OAAO;AAAA,MACxB,gBAAc;AAAA,MACd,WAAW;AAAA,QACT,eAAe,EAAE,SAAS,iBAAiB,MAAM,aAAa,CAAC;AAAA;AAAA;AAAA,QAG/D;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,CAAC,MAAM;AACd,kBAAU,CAAC;AACX,gBAAQ,OAAO,KAAK;AAAA,MACtB;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":[]}