@brijbyte/agentic-ui 0.0.1-beta → 0.0.2

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 (375) hide show
  1. package/README.md +808 -0
  2. package/dist/accordion/accordion.css +85 -0
  3. package/dist/accordion/accordion.d.ts +28 -0
  4. package/dist/accordion/accordion.d.ts.map +1 -0
  5. package/dist/accordion/accordion.js +51 -0
  6. package/dist/accordion/accordion.js.map +1 -0
  7. package/dist/accordion/accordion.module.css.d.ts +2 -0
  8. package/dist/accordion/accordion.module.js +14 -0
  9. package/dist/accordion/accordion.module.js.map +1 -0
  10. package/dist/accordion/index.d.ts +3 -0
  11. package/dist/accordion/index.js +4 -0
  12. package/dist/accordion/parts.d.ts +28 -0
  13. package/dist/accordion/parts.d.ts.map +1 -0
  14. package/dist/accordion/parts.js +55 -0
  15. package/dist/accordion/parts.js.map +1 -0
  16. package/dist/alert-dialog/alert-dialog.css +84 -0
  17. package/dist/alert-dialog/alert-dialog.d.ts +44 -0
  18. package/dist/alert-dialog/alert-dialog.d.ts.map +1 -0
  19. package/dist/alert-dialog/alert-dialog.js +46 -0
  20. package/dist/alert-dialog/alert-dialog.js.map +1 -0
  21. package/dist/alert-dialog/alert-dialog.module.css.d.ts +2 -0
  22. package/dist/alert-dialog/alert-dialog.module.js +14 -0
  23. package/dist/alert-dialog/alert-dialog.module.js.map +1 -0
  24. package/dist/alert-dialog/index.d.ts +3 -0
  25. package/dist/alert-dialog/index.js +4 -0
  26. package/dist/alert-dialog/parts.d.ts +28 -0
  27. package/dist/alert-dialog/parts.d.ts.map +1 -0
  28. package/dist/alert-dialog/parts.js +62 -0
  29. package/dist/alert-dialog/parts.js.map +1 -0
  30. package/dist/badge/badge.css +66 -0
  31. package/dist/badge/badge.d.ts +20 -0
  32. package/dist/badge/badge.d.ts.map +1 -0
  33. package/dist/badge/badge.js +21 -0
  34. package/dist/badge/badge.js.map +1 -0
  35. package/dist/badge/badge.module.css.d.ts +2 -0
  36. package/dist/badge/badge.module.js +16 -0
  37. package/dist/badge/badge.module.js.map +1 -0
  38. package/dist/badge/index.d.ts +2 -0
  39. package/dist/badge/index.js +3 -0
  40. package/dist/button/button.css +242 -0
  41. package/dist/button/button.d.ts +28 -0
  42. package/dist/button/button.d.ts.map +1 -0
  43. package/dist/button/button.js +34 -0
  44. package/dist/button/button.js.map +1 -0
  45. package/dist/button/button.module.css.d.ts +2 -0
  46. package/dist/button/button.module.js +27 -0
  47. package/dist/button/button.module.js.map +1 -0
  48. package/dist/button/index.d.ts +2 -0
  49. package/dist/button/index.js +3 -0
  50. package/dist/card/card.css +64 -0
  51. package/dist/card/card.d.ts +41 -0
  52. package/dist/card/card.d.ts.map +1 -0
  53. package/dist/card/card.js +50 -0
  54. package/dist/card/card.js.map +1 -0
  55. package/dist/card/card.module.css.d.ts +2 -0
  56. package/dist/card/card.module.js +15 -0
  57. package/dist/card/card.module.js.map +1 -0
  58. package/dist/card/index.d.ts +2 -0
  59. package/dist/card/index.js +3 -0
  60. package/dist/checkbox/checkbox.css +72 -0
  61. package/dist/checkbox/checkbox.d.ts +29 -0
  62. package/dist/checkbox/checkbox.d.ts.map +1 -0
  63. package/dist/checkbox/checkbox.js +40 -0
  64. package/dist/checkbox/checkbox.js.map +1 -0
  65. package/dist/checkbox/checkbox.module.css.d.ts +2 -0
  66. package/dist/checkbox/checkbox.module.js +11 -0
  67. package/dist/checkbox/checkbox.module.js.map +1 -0
  68. package/dist/checkbox/index.d.ts +3 -0
  69. package/dist/checkbox/index.js +4 -0
  70. package/dist/checkbox/parts.d.ts +20 -0
  71. package/dist/checkbox/parts.d.ts.map +1 -0
  72. package/dist/checkbox/parts.js +51 -0
  73. package/dist/checkbox/parts.js.map +1 -0
  74. package/dist/collapsible/collapsible.css +88 -0
  75. package/dist/collapsible/collapsible.d.ts +24 -0
  76. package/dist/collapsible/collapsible.d.ts.map +1 -0
  77. package/dist/collapsible/collapsible.js +44 -0
  78. package/dist/collapsible/collapsible.js.map +1 -0
  79. package/dist/collapsible/collapsible.module.css.d.ts +2 -0
  80. package/dist/collapsible/collapsible.module.js +12 -0
  81. package/dist/collapsible/collapsible.module.js.map +1 -0
  82. package/dist/collapsible/index.d.ts +3 -0
  83. package/dist/collapsible/index.js +4 -0
  84. package/dist/collapsible/parts.d.ts +23 -0
  85. package/dist/collapsible/parts.d.ts.map +1 -0
  86. package/dist/collapsible/parts.js +44 -0
  87. package/dist/collapsible/parts.js.map +1 -0
  88. package/dist/context-menu/context-menu.css +151 -0
  89. package/dist/context-menu/context-menu.d.ts +36 -0
  90. package/dist/context-menu/context-menu.d.ts.map +1 -0
  91. package/dist/context-menu/context-menu.js +54 -0
  92. package/dist/context-menu/context-menu.js.map +1 -0
  93. package/dist/context-menu/context-menu.module.css.d.ts +2 -0
  94. package/dist/context-menu/context-menu.module.js +18 -0
  95. package/dist/context-menu/context-menu.module.js.map +1 -0
  96. package/dist/context-menu/index.d.ts +3 -0
  97. package/dist/context-menu/index.js +4 -0
  98. package/dist/context-menu/parts.d.ts +38 -0
  99. package/dist/context-menu/parts.d.ts.map +1 -0
  100. package/dist/context-menu/parts.js +91 -0
  101. package/dist/context-menu/parts.js.map +1 -0
  102. package/dist/dialog/dialog.css +125 -0
  103. package/dist/dialog/dialog.d.ts +40 -0
  104. package/dist/dialog/dialog.d.ts.map +1 -0
  105. package/dist/dialog/dialog.js +57 -0
  106. package/dist/dialog/dialog.js.map +1 -0
  107. package/dist/dialog/dialog.module.css.d.ts +2 -0
  108. package/dist/dialog/dialog.module.js +17 -0
  109. package/dist/dialog/dialog.module.js.map +1 -0
  110. package/dist/dialog/index.d.ts +3 -0
  111. package/dist/dialog/index.js +4 -0
  112. package/dist/dialog/parts.d.ts +38 -0
  113. package/dist/dialog/parts.d.ts.map +1 -0
  114. package/dist/dialog/parts.js +75 -0
  115. package/dist/dialog/parts.js.map +1 -0
  116. package/dist/drawer/drawer.css +253 -0
  117. package/dist/drawer/drawer.d.ts +38 -0
  118. package/dist/drawer/drawer.d.ts.map +1 -0
  119. package/dist/drawer/drawer.js +87 -0
  120. package/dist/drawer/drawer.js.map +1 -0
  121. package/dist/drawer/drawer.module.css.d.ts +2 -0
  122. package/dist/drawer/drawer.module.js +20 -0
  123. package/dist/drawer/drawer.module.js.map +1 -0
  124. package/dist/drawer/index.d.ts +3 -0
  125. package/dist/drawer/index.js +4 -0
  126. package/dist/drawer/parts.d.ts +58 -0
  127. package/dist/drawer/parts.d.ts.map +1 -0
  128. package/dist/drawer/parts.js +107 -0
  129. package/dist/drawer/parts.js.map +1 -0
  130. package/dist/index.css +2701 -0
  131. package/dist/index.d.ts +39 -0
  132. package/dist/index.js +62 -0
  133. package/dist/input/index.d.ts +2 -0
  134. package/dist/input/index.js +3 -0
  135. package/dist/input/input.css +103 -0
  136. package/dist/input/input.d.ts +17 -0
  137. package/dist/input/input.d.ts.map +1 -0
  138. package/dist/input/input.js +37 -0
  139. package/dist/input/input.js.map +1 -0
  140. package/dist/input/input.module.css.d.ts +2 -0
  141. package/dist/input/input.module.js +18 -0
  142. package/dist/input/input.module.js.map +1 -0
  143. package/dist/layer-order.css +22 -0
  144. package/dist/menu/index.d.ts +4 -0
  145. package/dist/menu/index.js +5 -0
  146. package/dist/menu/menu.css +154 -0
  147. package/dist/menu/menu.d.ts +50 -0
  148. package/dist/menu/menu.d.ts.map +1 -0
  149. package/dist/menu/menu.js +69 -0
  150. package/dist/menu/menu.js.map +1 -0
  151. package/dist/menu/menu.module.css.d.ts +2 -0
  152. package/dist/menu/menu.module.js +19 -0
  153. package/dist/menu/menu.module.js.map +1 -0
  154. package/dist/menu/menuitemshortcut.d.ts +9 -0
  155. package/dist/menu/menuitemshortcut.d.ts.map +1 -0
  156. package/dist/menu/menuitemshortcut.js +15 -0
  157. package/dist/menu/menuitemshortcut.js.map +1 -0
  158. package/dist/menu/parts.d.ts +39 -0
  159. package/dist/menu/parts.d.ts.map +1 -0
  160. package/dist/menu/parts.js +76 -0
  161. package/dist/menu/parts.js.map +1 -0
  162. package/dist/number-field/index.d.ts +3 -0
  163. package/dist/number-field/index.js +4 -0
  164. package/dist/number-field/number-field.css +111 -0
  165. package/dist/number-field/number-field.d.ts +31 -0
  166. package/dist/number-field/number-field.d.ts.map +1 -0
  167. package/dist/number-field/number-field.js +78 -0
  168. package/dist/number-field/number-field.js.map +1 -0
  169. package/dist/number-field/number-field.module.css.d.ts +2 -0
  170. package/dist/number-field/number-field.module.js +16 -0
  171. package/dist/number-field/number-field.module.js.map +1 -0
  172. package/dist/number-field/parts.d.ts +38 -0
  173. package/dist/number-field/parts.d.ts.map +1 -0
  174. package/dist/number-field/parts.js +74 -0
  175. package/dist/number-field/parts.js.map +1 -0
  176. package/dist/progress/index.d.ts +3 -0
  177. package/dist/progress/index.js +4 -0
  178. package/dist/progress/parts.d.ts +20 -0
  179. package/dist/progress/parts.d.ts.map +1 -0
  180. package/dist/progress/parts.js +42 -0
  181. package/dist/progress/parts.js.map +1 -0
  182. package/dist/progress/progress.css +71 -0
  183. package/dist/progress/progress.d.ts +27 -0
  184. package/dist/progress/progress.d.ts.map +1 -0
  185. package/dist/progress/progress.js +27 -0
  186. package/dist/progress/progress.js.map +1 -0
  187. package/dist/progress/progress.module.css.d.ts +2 -0
  188. package/dist/progress/progress.module.js +19 -0
  189. package/dist/progress/progress.module.js.map +1 -0
  190. package/dist/reset.css +91 -0
  191. package/dist/select/index.d.ts +3 -0
  192. package/dist/select/index.js +4 -0
  193. package/dist/select/parts.d.ts +65 -0
  194. package/dist/select/parts.d.ts.map +1 -0
  195. package/dist/select/parts.js +134 -0
  196. package/dist/select/parts.js.map +1 -0
  197. package/dist/select/select.css +157 -0
  198. package/dist/select/select.d.ts +41 -0
  199. package/dist/select/select.d.ts.map +1 -0
  200. package/dist/select/select.js +89 -0
  201. package/dist/select/select.js.map +1 -0
  202. package/dist/select/select.module.css.d.ts +2 -0
  203. package/dist/select/select.module.js +17 -0
  204. package/dist/select/select.module.js.map +1 -0
  205. package/dist/separator/index.d.ts +2 -0
  206. package/dist/separator/index.js +3 -0
  207. package/dist/separator/separator.css +16 -0
  208. package/dist/separator/separator.d.ts +16 -0
  209. package/dist/separator/separator.d.ts.map +1 -0
  210. package/dist/separator/separator.js +17 -0
  211. package/dist/separator/separator.js.map +1 -0
  212. package/dist/separator/separator.module.css.d.ts +2 -0
  213. package/dist/separator/separator.module.js +6 -0
  214. package/dist/separator/separator.module.js.map +1 -0
  215. package/dist/slider/index.d.ts +3 -0
  216. package/dist/slider/index.js +4 -0
  217. package/dist/slider/parts.d.ts +38 -0
  218. package/dist/slider/parts.d.ts.map +1 -0
  219. package/dist/slider/parts.js +69 -0
  220. package/dist/slider/parts.js.map +1 -0
  221. package/dist/slider/slider.css +97 -0
  222. package/dist/slider/slider.d.ts +38 -0
  223. package/dist/slider/slider.d.ts.map +1 -0
  224. package/dist/slider/slider.js +41 -0
  225. package/dist/slider/slider.js.map +1 -0
  226. package/dist/slider/slider.module.css.d.ts +2 -0
  227. package/dist/slider/slider.module.js +15 -0
  228. package/dist/slider/slider.module.js.map +1 -0
  229. package/dist/styles/reset.css +69 -0
  230. package/dist/styles/tokens.css +276 -0
  231. package/dist/switch/index.d.ts +3 -0
  232. package/dist/switch/index.js +4 -0
  233. package/dist/switch/parts.d.ts +18 -0
  234. package/dist/switch/parts.d.ts.map +1 -0
  235. package/dist/switch/parts.js +39 -0
  236. package/dist/switch/parts.js.map +1 -0
  237. package/dist/switch/switch.css +64 -0
  238. package/dist/switch/switch.d.ts +28 -0
  239. package/dist/switch/switch.d.ts.map +1 -0
  240. package/dist/switch/switch.js +26 -0
  241. package/dist/switch/switch.js.map +1 -0
  242. package/dist/switch/switch.module.css.d.ts +2 -0
  243. package/dist/switch/switch.module.js +11 -0
  244. package/dist/switch/switch.module.js.map +1 -0
  245. package/dist/tabs/index.d.ts +3 -0
  246. package/dist/tabs/index.js +4 -0
  247. package/dist/tabs/parts.d.ts +23 -0
  248. package/dist/tabs/parts.d.ts.map +1 -0
  249. package/dist/tabs/parts.js +48 -0
  250. package/dist/tabs/parts.js.map +1 -0
  251. package/dist/tabs/tabs.css +86 -0
  252. package/dist/tabs/tabs.d.ts +28 -0
  253. package/dist/tabs/tabs.d.ts.map +1 -0
  254. package/dist/tabs/tabs.js +30 -0
  255. package/dist/tabs/tabs.js.map +1 -0
  256. package/dist/tabs/tabs.module.css.d.ts +2 -0
  257. package/dist/tabs/tabs.module.js +11 -0
  258. package/dist/tabs/tabs.module.js.map +1 -0
  259. package/dist/tailwind-theme.css +142 -0
  260. package/dist/toast/index.d.ts +3 -0
  261. package/dist/toast/index.js +4 -0
  262. package/dist/toast/parts.d.ts +33 -0
  263. package/dist/toast/parts.d.ts.map +1 -0
  264. package/dist/toast/parts.js +62 -0
  265. package/dist/toast/parts.js.map +1 -0
  266. package/dist/toast/toast.css +207 -0
  267. package/dist/toast/toast.d.ts +43 -0
  268. package/dist/toast/toast.d.ts.map +1 -0
  269. package/dist/toast/toast.js +156 -0
  270. package/dist/toast/toast.js.map +1 -0
  271. package/dist/toast/toast.module.css.d.ts +2 -0
  272. package/dist/toast/toast.module.js +25 -0
  273. package/dist/toast/toast.module.js.map +1 -0
  274. package/dist/tokens.css +404 -0
  275. package/dist/tooltip/index.d.ts +3 -0
  276. package/dist/tooltip/index.js +4 -0
  277. package/dist/tooltip/parts.d.ts +23 -0
  278. package/dist/tooltip/parts.d.ts.map +1 -0
  279. package/dist/tooltip/parts.js +53 -0
  280. package/dist/tooltip/parts.js.map +1 -0
  281. package/dist/tooltip/tooltip.css +60 -0
  282. package/dist/tooltip/tooltip.d.ts +22 -0
  283. package/dist/tooltip/tooltip.d.ts.map +1 -0
  284. package/dist/tooltip/tooltip.js +23 -0
  285. package/dist/tooltip/tooltip.js.map +1 -0
  286. package/dist/tooltip/tooltip.module.css.d.ts +2 -0
  287. package/dist/tooltip/tooltip.module.js +10 -0
  288. package/dist/tooltip/tooltip.module.js.map +1 -0
  289. package/package.json +153 -4
  290. package/src/accordion/accordion.module.css +75 -0
  291. package/src/accordion/accordion.tsx +50 -0
  292. package/src/accordion/index.ts +6 -0
  293. package/src/accordion/parts.tsx +68 -0
  294. package/src/alert-dialog/alert-dialog.module.css +91 -0
  295. package/src/alert-dialog/alert-dialog.tsx +69 -0
  296. package/src/alert-dialog/index.ts +7 -0
  297. package/src/alert-dialog/parts.tsx +73 -0
  298. package/src/badge/badge.module.css +60 -0
  299. package/src/badge/badge.tsx +19 -0
  300. package/src/badge/index.ts +3 -0
  301. package/src/button/button.module.css +229 -0
  302. package/src/button/button.tsx +67 -0
  303. package/src/button/index.ts +3 -0
  304. package/src/card/card.module.css +56 -0
  305. package/src/card/card.tsx +54 -0
  306. package/src/card/index.ts +3 -0
  307. package/src/checkbox/checkbox.module.css +69 -0
  308. package/src/checkbox/checkbox.tsx +38 -0
  309. package/src/checkbox/index.ts +6 -0
  310. package/src/checkbox/parts.tsx +54 -0
  311. package/src/collapsible/collapsible.module.css +81 -0
  312. package/src/collapsible/collapsible.tsx +38 -0
  313. package/src/collapsible/index.ts +6 -0
  314. package/src/collapsible/parts.tsx +52 -0
  315. package/src/context-menu/context-menu.module.css +168 -0
  316. package/src/context-menu/context-menu.tsx +75 -0
  317. package/src/context-menu/index.ts +21 -0
  318. package/src/context-menu/parts.tsx +99 -0
  319. package/src/css.d.ts +8 -0
  320. package/src/dialog/dialog.module.css +116 -0
  321. package/src/dialog/dialog.tsx +73 -0
  322. package/src/dialog/index.ts +13 -0
  323. package/src/dialog/parts.tsx +96 -0
  324. package/src/drawer/drawer.module.css +240 -0
  325. package/src/drawer/drawer.tsx +96 -0
  326. package/src/drawer/index.ts +24 -0
  327. package/src/drawer/parts.tsx +122 -0
  328. package/src/index.ts +237 -0
  329. package/src/input/index.ts +3 -0
  330. package/src/input/input.module.css +93 -0
  331. package/src/input/input.tsx +39 -0
  332. package/src/menu/index.ts +7 -0
  333. package/src/menu/menu.module.css +142 -0
  334. package/src/menu/menu.tsx +108 -0
  335. package/src/menu/menuitemshortcut.tsx +9 -0
  336. package/src/menu/parts.tsx +90 -0
  337. package/src/number-field/index.ts +20 -0
  338. package/src/number-field/number-field.module.css +98 -0
  339. package/src/number-field/number-field.tsx +75 -0
  340. package/src/number-field/parts.tsx +91 -0
  341. package/src/progress/index.ts +6 -0
  342. package/src/progress/parts.tsx +51 -0
  343. package/src/progress/progress.module.css +61 -0
  344. package/src/progress/progress.tsx +42 -0
  345. package/src/select/index.ts +30 -0
  346. package/src/select/parts.tsx +171 -0
  347. package/src/select/select.module.css +146 -0
  348. package/src/select/select.tsx +98 -0
  349. package/src/separator/index.ts +3 -0
  350. package/src/separator/separator.module.css +14 -0
  351. package/src/separator/separator.tsx +20 -0
  352. package/src/slider/index.ts +14 -0
  353. package/src/slider/parts.tsx +90 -0
  354. package/src/slider/slider.module.css +110 -0
  355. package/src/slider/slider.tsx +68 -0
  356. package/src/styles/layer-order.css +22 -0
  357. package/src/styles/reset.css +91 -0
  358. package/src/styles/tailwind-theme.css +142 -0
  359. package/src/styles/tokens.css +404 -0
  360. package/src/switch/index.ts +6 -0
  361. package/src/switch/parts.tsx +44 -0
  362. package/src/switch/switch.module.css +57 -0
  363. package/src/switch/switch.tsx +33 -0
  364. package/src/tabs/index.ts +6 -0
  365. package/src/tabs/parts.tsx +48 -0
  366. package/src/tabs/tabs.module.css +79 -0
  367. package/src/tabs/tabs.tsx +48 -0
  368. package/src/toast/index.ts +6 -0
  369. package/src/toast/parts.tsx +76 -0
  370. package/src/toast/toast.module.css +212 -0
  371. package/src/toast/toast.tsx +129 -0
  372. package/src/tooltip/index.ts +6 -0
  373. package/src/tooltip/parts.tsx +62 -0
  374. package/src/tooltip/tooltip.module.css +56 -0
  375. package/src/tooltip/tooltip.tsx +30 -0
@@ -0,0 +1,85 @@
1
+ @layer components {
2
+ .root_XcG3ua {
3
+ border: var(--border-width-base) solid var(--color-line);
4
+ border-radius: var(--radius-lg);
5
+ flex-direction: column;
6
+ gap: 0;
7
+ display: flex;
8
+ overflow: hidden;
9
+ }
10
+
11
+ .item_XcG3ua {
12
+ border-bottom: var(--border-width-base) solid var(--color-line-subtle);
13
+ }
14
+
15
+ .item_XcG3ua:last-child {
16
+ border-bottom: none;
17
+ }
18
+
19
+ .header_XcG3ua {
20
+ align-items: center;
21
+ display: flex;
22
+ }
23
+
24
+ .trigger_XcG3ua {
25
+ justify-content: space-between;
26
+ align-items: center;
27
+ gap: var(--space-2);
28
+ padding: var(--space-3) var(--space-4);
29
+ font-family: var(--font-mono);
30
+ font-size: var(--font-size-sm);
31
+ font-weight: var(--font-weight-medium);
32
+ color: var(--color-primary);
33
+ cursor: pointer;
34
+ text-align: left;
35
+ transition: background-color var(--duration-fast) var(--easing-standard),
36
+ color var(--duration-fast) var(--easing-standard);
37
+ user-select: none;
38
+ background: none;
39
+ border: none;
40
+ outline: none;
41
+ flex: 1;
42
+ display: flex;
43
+ }
44
+
45
+ .trigger_XcG3ua:hover {
46
+ background-color: var(--color-hover);
47
+ }
48
+
49
+ .trigger_XcG3ua:focus-visible {
50
+ box-shadow: inset var(--shadow-focus);
51
+ }
52
+
53
+ .trigger_XcG3ua[data-disabled] {
54
+ opacity: .44;
55
+ cursor: not-allowed;
56
+ }
57
+
58
+ .trigger-icon_XcG3ua {
59
+ color: var(--color-tertiary);
60
+ transition: transform var(--duration-normal) var(--easing-standard);
61
+ flex-shrink: 0;
62
+ }
63
+
64
+ .trigger_XcG3ua[data-panel-open] .trigger-icon_XcG3ua {
65
+ transform: rotate(180deg);
66
+ }
67
+
68
+ .panel_XcG3ua {
69
+ height: var(--accordion-panel-height);
70
+ transition: height var(--duration-normal) var(--easing-standard);
71
+ overflow: hidden;
72
+ }
73
+
74
+ .panel_XcG3ua[data-starting-style], .panel_XcG3ua[data-ending-style] {
75
+ height: 0;
76
+ }
77
+
78
+ .panel-content_XcG3ua {
79
+ padding: var(--space-2) var(--space-4) var(--space-4);
80
+ font-family: var(--font-mono);
81
+ font-size: var(--font-size-sm);
82
+ color: var(--color-secondary);
83
+ line-height: var(--line-height-relaxed);
84
+ }
85
+ }
@@ -0,0 +1,28 @@
1
+ import { ReactNode } from "react";
2
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
3
+ import styles from "./accordion.module.css";
4
+
5
+ //#region src/accordion/accordion.d.ts
6
+ interface AccordionItem {
7
+ value: string;
8
+ header: ReactNode;
9
+ content: ReactNode;
10
+ disabled?: boolean;
11
+ }
12
+ interface AccordionProps {
13
+ items: AccordionItem[];
14
+ multiple?: boolean;
15
+ defaultValue?: string[];
16
+ value?: string[];
17
+ onValueChange?: (value: string[]) => void;
18
+ className?: string;
19
+ }
20
+ declare function Accordion({
21
+ items,
22
+ className,
23
+ multiple,
24
+ ...props
25
+ }: AccordionProps): react_jsx_runtime0.JSX.Element;
26
+ //#endregion
27
+ export { Accordion, AccordionItem, AccordionProps, styles };
28
+ //# sourceMappingURL=accordion.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"accordion.d.ts","names":[],"sources":["../../src/accordion/accordion.tsx"],"mappings":";;;;;UAIiB,aAAA;EACf,KAAA;EACA,MAAA,EAAQ,SAAA;EACR,OAAA,EAAS,SAAA;EACT,QAAA;AAAA;AAAA,UAGe,cAAA;EACf,KAAA,EAAO,aAAA;EACP,QAAA;EACA,YAAA;EACA,KAAA;EACA,aAAA,IAAiB,KAAA;EACjB,SAAA;AAAA;AAAA,iBAWc,SAAA,CAAA;EAAY,KAAA;EAAO,SAAA;EAAW,QAAA;EAAA,GAAoB;AAAA,GAAS,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}
@@ -0,0 +1,51 @@
1
+ import accordion_module_default from "./accordion.module.js";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import { Accordion } from "@base-ui/react/accordion";
4
+ //#region src/accordion/accordion.tsx
5
+ function ChevronIcon() {
6
+ return /* @__PURE__ */ jsx("svg", {
7
+ width: "12",
8
+ height: "12",
9
+ viewBox: "0 0 12 12",
10
+ fill: "none",
11
+ children: /* @__PURE__ */ jsx("path", {
12
+ d: "M2.5 4.5L6 8L9.5 4.5",
13
+ stroke: "currentColor",
14
+ strokeWidth: "1.5",
15
+ strokeLinecap: "round",
16
+ strokeLinejoin: "round"
17
+ })
18
+ });
19
+ }
20
+ function Accordion$1({ items, className, multiple = true, ...props }) {
21
+ return /* @__PURE__ */ jsx(Accordion.Root, {
22
+ className: `${accordion_module_default.root} ${className ?? ""}`,
23
+ multiple,
24
+ ...props,
25
+ children: items.map((item) => /* @__PURE__ */ jsxs(Accordion.Item, {
26
+ value: item.value,
27
+ className: accordion_module_default.item,
28
+ disabled: item.disabled ?? false,
29
+ children: [/* @__PURE__ */ jsx(Accordion.Header, {
30
+ className: accordion_module_default.header,
31
+ children: /* @__PURE__ */ jsxs(Accordion.Trigger, {
32
+ className: accordion_module_default.trigger,
33
+ children: [item.header, /* @__PURE__ */ jsx("span", {
34
+ className: accordion_module_default["trigger-icon"],
35
+ children: /* @__PURE__ */ jsx(ChevronIcon, {})
36
+ })]
37
+ })
38
+ }), /* @__PURE__ */ jsx(Accordion.Panel, {
39
+ className: accordion_module_default.panel,
40
+ children: /* @__PURE__ */ jsx("div", {
41
+ className: accordion_module_default["panel-content"],
42
+ children: item.content
43
+ })
44
+ })]
45
+ }, item.value))
46
+ });
47
+ }
48
+ //#endregion
49
+ export { Accordion$1 as Accordion };
50
+
51
+ //# sourceMappingURL=accordion.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"accordion.js","names":["Accordion","BaseAccordion","styles"],"sources":["../../src/accordion/accordion.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Accordion as BaseAccordion } from \"@base-ui/react/accordion\";\nimport styles from \"./accordion.module.css\";\n\nexport interface AccordionItem {\n value: string;\n header: ReactNode;\n content: ReactNode;\n disabled?: boolean;\n}\n\nexport interface AccordionProps {\n items: AccordionItem[];\n multiple?: boolean;\n defaultValue?: string[];\n value?: string[];\n onValueChange?: (value: string[]) => void;\n className?: string;\n}\n\nfunction ChevronIcon() {\n return (\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\n <path d=\"M2.5 4.5L6 8L9.5 4.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n );\n}\n\nexport function Accordion({ items, className, multiple = true, ...props }: AccordionProps) {\n return (\n <BaseAccordion.Root className={`${styles.root} ${className ?? \"\"}`} multiple={multiple} {...props}>\n {items.map((item) => (\n <BaseAccordion.Item key={item.value} value={item.value} className={styles.item} disabled={item.disabled ?? false}>\n <BaseAccordion.Header className={styles.header}>\n <BaseAccordion.Trigger className={styles.trigger}>\n {item.header}\n <span className={styles[\"trigger-icon\"]}>\n <ChevronIcon />\n </span>\n </BaseAccordion.Trigger>\n </BaseAccordion.Header>\n <BaseAccordion.Panel className={styles.panel}>\n <div className={styles[\"panel-content\"]}>{item.content}</div>\n </BaseAccordion.Panel>\n </BaseAccordion.Item>\n ))}\n </BaseAccordion.Root>\n );\n}\nexport { styles as AccordionStyles };\n"],"mappings":";;;;AAoBA,SAAS,cAAc;AACrB,QACE,oBAAC,OAAD;EAAK,OAAM;EAAK,QAAO;EAAK,SAAQ;EAAY,MAAK;YACnD,oBAAC,QAAD;GAAM,GAAE;GAAuB,QAAO;GAAe,aAAY;GAAM,eAAc;GAAQ,gBAAe;GAAU,CAAA;EAClH,CAAA;;AAIV,SAAgBA,YAAU,EAAE,OAAO,WAAW,WAAW,MAAM,GAAG,SAAyB;AACzF,QACE,oBAACC,UAAc,MAAf;EAAoB,WAAW,GAAGC,yBAAO,KAAK,GAAG,aAAa;EAAgB;EAAU,GAAI;YACzF,MAAM,KAAK,SACV,qBAACD,UAAc,MAAf;GAAqC,OAAO,KAAK;GAAO,WAAWC,yBAAO;GAAM,UAAU,KAAK,YAAY;aAA3G,CACE,oBAACD,UAAc,QAAf;IAAsB,WAAWC,yBAAO;cACtC,qBAACD,UAAc,SAAf;KAAuB,WAAWC,yBAAO;eAAzC,CACG,KAAK,QACN,oBAAC,QAAD;MAAM,WAAWA,yBAAO;gBACtB,oBAAC,aAAD,EAAe,CAAA;MACV,CAAA,CACe;;IACH,CAAA,EACvB,oBAACD,UAAc,OAAf;IAAqB,WAAWC,yBAAO;cACrC,oBAAC,OAAD;KAAK,WAAWA,yBAAO;eAAmB,KAAK;KAAc,CAAA;IACzC,CAAA,CACH;KAZI,KAAK,MAYT,CACrB;EACiB,CAAA"}
@@ -0,0 +1,2 @@
1
+ declare const styles: Record<string, string | undefined>;
2
+ export default styles;
@@ -0,0 +1,14 @@
1
+ //#region src/accordion/accordion.module.css
2
+ var accordion_module_default = {
3
+ "header": "header_XcG3ua",
4
+ "item": "item_XcG3ua",
5
+ "panel": "panel_XcG3ua",
6
+ "panel-content": "panel-content_XcG3ua",
7
+ "root": "root_XcG3ua",
8
+ "trigger": "trigger_XcG3ua",
9
+ "trigger-icon": "trigger-icon_XcG3ua"
10
+ };
11
+ //#endregion
12
+ export { accordion_module_default as default };
13
+
14
+ //# sourceMappingURL=accordion.module.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"accordion.module.js","names":[],"sources":["../../src/accordion/accordion.module.css"],"sourcesContent":["@layer components {\n .root {\n display: flex;\n flex-direction: column;\n gap: 0;\n border: var(--border-width-base) solid var(--color-line);\n border-radius: var(--radius-lg);\n overflow: hidden;\n }\n .item {\n border-bottom: var(--border-width-base) solid var(--color-line-subtle);\n }\n .item:last-child {\n border-bottom: none;\n }\n .header {\n display: flex;\n align-items: center;\n }\n .trigger {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--space-2);\n padding: var(--space-3) var(--space-4);\n font-family: var(--font-mono);\n font-size: var(--font-size-sm);\n font-weight: var(--font-weight-medium);\n color: var(--color-primary);\n background: none;\n border: none;\n cursor: pointer;\n outline: none;\n text-align: left;\n transition:\n background-color var(--duration-fast) var(--easing-standard),\n color var(--duration-fast) var(--easing-standard);\n user-select: none;\n }\n .trigger:hover {\n background-color: var(--color-hover);\n }\n .trigger:focus-visible {\n box-shadow: inset var(--shadow-focus);\n }\n .trigger[data-disabled] {\n opacity: 0.44;\n cursor: not-allowed;\n }\n .trigger-icon {\n color: var(--color-tertiary);\n flex-shrink: 0;\n transition: transform var(--duration-normal) var(--easing-standard);\n }\n .trigger[data-panel-open] .trigger-icon {\n transform: rotate(180deg);\n }\n .panel {\n height: var(--accordion-panel-height);\n overflow: hidden;\n transition: height var(--duration-normal) var(--easing-standard);\n }\n .panel[data-starting-style],\n .panel[data-ending-style] {\n height: 0;\n }\n .panel-content {\n padding: var(--space-2) var(--space-4) var(--space-4);\n font-family: var(--font-mono);\n font-size: var(--font-size-sm);\n color: var(--color-secondary);\n line-height: var(--line-height-relaxed);\n }\n}\n"],"mappings":";AAcA,IAAA,2BAAE;CAAA,UAAA;CAAA,QAAA;CAAA,SAAA;CAAA,iBAAA;CAAA,QAAA;CAAA,WAAA;CAAA,gBAAA;CAAA"}
@@ -0,0 +1,3 @@
1
+ import { Accordion, AccordionItem, AccordionProps, styles } from "./accordion.js";
2
+ import { AccordionHeader, AccordionHeaderProps, AccordionItem as AccordionItem$1, AccordionItemProps, AccordionPanel, AccordionPanelProps, AccordionTrigger, AccordionTriggerProps } from "./parts.js";
3
+ export { Accordion, AccordionHeader, type AccordionHeaderProps, type AccordionItem, AccordionItem$1 as AccordionItemPart, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, styles as AccordionStyles, AccordionTrigger, type AccordionTriggerProps };
@@ -0,0 +1,4 @@
1
+ import accordion_module_default from "./accordion.module.js";
2
+ import { Accordion } from "./accordion.js";
3
+ import { AccordionHeader, AccordionItem, AccordionPanel, AccordionTrigger } from "./parts.js";
4
+ export { Accordion, AccordionHeader, AccordionItem as AccordionItemPart, AccordionPanel, accordion_module_default as AccordionStyles, AccordionTrigger };
@@ -0,0 +1,28 @@
1
+ import * as react from "react";
2
+ import { ComponentPropsWithoutRef } from "react";
3
+ import { Accordion } from "@base-ui/react/accordion";
4
+
5
+ //#region src/accordion/parts.d.ts
6
+ type BaseItemProps = ComponentPropsWithoutRef<typeof Accordion.Item>;
7
+ type BaseHeaderProps = ComponentPropsWithoutRef<typeof Accordion.Header>;
8
+ type BaseTriggerProps = ComponentPropsWithoutRef<typeof Accordion.Trigger>;
9
+ type BasePanelProps = ComponentPropsWithoutRef<typeof Accordion.Panel>;
10
+ interface AccordionItemProps extends Omit<BaseItemProps, "className"> {
11
+ className?: string;
12
+ }
13
+ interface AccordionHeaderProps extends Omit<BaseHeaderProps, "className"> {
14
+ className?: string;
15
+ }
16
+ interface AccordionTriggerProps extends Omit<BaseTriggerProps, "className"> {
17
+ className?: string;
18
+ }
19
+ interface AccordionPanelProps extends Omit<BasePanelProps, "className"> {
20
+ className?: string;
21
+ }
22
+ declare const AccordionItem: react.ForwardRefExoticComponent<AccordionItemProps & react.RefAttributes<HTMLDivElement>>;
23
+ declare const AccordionHeader: react.ForwardRefExoticComponent<AccordionHeaderProps & react.RefAttributes<HTMLHeadingElement>>;
24
+ declare const AccordionTrigger: react.ForwardRefExoticComponent<AccordionTriggerProps & react.RefAttributes<HTMLElement>>;
25
+ declare const AccordionPanel: react.ForwardRefExoticComponent<AccordionPanelProps & react.RefAttributes<HTMLDivElement>>;
26
+ //#endregion
27
+ export { AccordionHeader, AccordionHeaderProps, AccordionItem, AccordionItemProps, AccordionPanel, AccordionPanelProps, AccordionTrigger, AccordionTriggerProps };
28
+ //# sourceMappingURL=parts.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"parts.d.ts","names":[],"sources":["../../src/accordion/parts.tsx"],"mappings":";;;;;KAuBK,aAAA,GAAgB,wBAAA,QAAgC,SAAA,CAAc,IAAA;AAAA,KAC9D,eAAA,GAAkB,wBAAA,QAAgC,SAAA,CAAc,MAAA;AAAA,KAChE,gBAAA,GAAmB,wBAAA,QAAgC,SAAA,CAAc,OAAA;AAAA,KACjE,cAAA,GAAiB,wBAAA,QAAgC,SAAA,CAAc,KAAA;AAAA,UAEnD,kBAAA,SAA2B,IAAA,CAAK,aAAA;EAC/C,SAAA;AAAA;AAAA,UAEe,oBAAA,SAA6B,IAAA,CAAK,eAAA;EACjD,SAAA;AAAA;AAAA,UAEe,qBAAA,SAA8B,IAAA,CAAK,gBAAA;EAClD,SAAA;AAAA;AAAA,UAEe,mBAAA,SAA4B,IAAA,CAAK,cAAA;EAChD,SAAA;AAAA;AAAA,cAGW,aAAA,EAAa,KAAA,CAAA,yBAAA,CAAA,kBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAOb,eAAA,EAAe,KAAA,CAAA,yBAAA,CAAA,oBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,kBAAA;AAAA,cAOf,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,WAAA;AAAA,cAOhB,cAAA,EAAc,KAAA,CAAA,yBAAA,CAAA,mBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA"}
@@ -0,0 +1,55 @@
1
+ import accordion_module_default from "./accordion.module.js";
2
+ import { forwardRef } from "react";
3
+ import { jsx } from "react/jsx-runtime";
4
+ import { Accordion } from "@base-ui/react/accordion";
5
+ //#region src/accordion/parts.tsx
6
+ /**
7
+ * Styled primitives for Accordion.
8
+ *
9
+ * @example
10
+ * ```tsx
11
+ * import { Accordion } from '@base-ui/react/accordion';
12
+ * import { AccordionItem, AccordionHeader, AccordionTrigger, AccordionPanel } from '@brijbyte/agentic-ui/accordion';
13
+ *
14
+ * <Accordion.Root defaultValue={['a']}>
15
+ * <AccordionItem value="a">
16
+ * <AccordionHeader>
17
+ * <AccordionTrigger>Section A</AccordionTrigger>
18
+ * </AccordionHeader>
19
+ * <AccordionPanel>Content A</AccordionPanel>
20
+ * </AccordionItem>
21
+ * </Accordion.Root>
22
+ * ```
23
+ */
24
+ const AccordionItem = forwardRef(function AccordionItem({ className, ...props }, ref) {
25
+ return /* @__PURE__ */ jsx(Accordion.Item, {
26
+ ref,
27
+ className: `${accordion_module_default.item} ${className ?? ""}`,
28
+ ...props
29
+ });
30
+ });
31
+ const AccordionHeader = forwardRef(function AccordionHeader({ className, ...props }, ref) {
32
+ return /* @__PURE__ */ jsx(Accordion.Header, {
33
+ ref,
34
+ className: `${accordion_module_default.header} ${className ?? ""}`,
35
+ ...props
36
+ });
37
+ });
38
+ const AccordionTrigger = forwardRef(function AccordionTrigger({ className, ...props }, ref) {
39
+ return /* @__PURE__ */ jsx(Accordion.Trigger, {
40
+ ref,
41
+ className: `${accordion_module_default.trigger} ${className ?? ""}`,
42
+ ...props
43
+ });
44
+ });
45
+ const AccordionPanel = forwardRef(function AccordionPanel({ className, ...props }, ref) {
46
+ return /* @__PURE__ */ jsx(Accordion.Panel, {
47
+ ref,
48
+ className: `${accordion_module_default.panel} ${className ?? ""}`,
49
+ ...props
50
+ });
51
+ });
52
+ //#endregion
53
+ export { AccordionHeader, AccordionItem, AccordionPanel, AccordionTrigger };
54
+
55
+ //# sourceMappingURL=parts.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"parts.js","names":["BaseAccordion","styles"],"sources":["../../src/accordion/parts.tsx"],"sourcesContent":["/**\n * Styled primitives for Accordion.\n *\n * @example\n * ```tsx\n * import { Accordion } from '@base-ui/react/accordion';\n * import { AccordionItem, AccordionHeader, AccordionTrigger, AccordionPanel } from '@brijbyte/agentic-ui/accordion';\n *\n * <Accordion.Root defaultValue={['a']}>\n * <AccordionItem value=\"a\">\n * <AccordionHeader>\n * <AccordionTrigger>Section A</AccordionTrigger>\n * </AccordionHeader>\n * <AccordionPanel>Content A</AccordionPanel>\n * </AccordionItem>\n * </Accordion.Root>\n * ```\n */\nimport { forwardRef } from \"react\";\nimport type { ComponentRef, ComponentPropsWithoutRef } from \"react\";\nimport { Accordion as BaseAccordion } from \"@base-ui/react/accordion\";\nimport styles from \"./accordion.module.css\";\n\ntype BaseItemProps = ComponentPropsWithoutRef<typeof BaseAccordion.Item>;\ntype BaseHeaderProps = ComponentPropsWithoutRef<typeof BaseAccordion.Header>;\ntype BaseTriggerProps = ComponentPropsWithoutRef<typeof BaseAccordion.Trigger>;\ntype BasePanelProps = ComponentPropsWithoutRef<typeof BaseAccordion.Panel>;\n\nexport interface AccordionItemProps extends Omit<BaseItemProps, \"className\"> {\n className?: string;\n}\nexport interface AccordionHeaderProps extends Omit<BaseHeaderProps, \"className\"> {\n className?: string;\n}\nexport interface AccordionTriggerProps extends Omit<BaseTriggerProps, \"className\"> {\n className?: string;\n}\nexport interface AccordionPanelProps extends Omit<BasePanelProps, \"className\"> {\n className?: string;\n}\n\nexport const AccordionItem = forwardRef<ComponentRef<typeof BaseAccordion.Item>, AccordionItemProps>(function AccordionItem(\n { className, ...props },\n ref,\n) {\n return <BaseAccordion.Item ref={ref} className={`${styles.item} ${className ?? \"\"}`} {...props} />;\n});\n\nexport const AccordionHeader = forwardRef<ComponentRef<typeof BaseAccordion.Header>, AccordionHeaderProps>(function AccordionHeader(\n { className, ...props },\n ref,\n) {\n return <BaseAccordion.Header ref={ref} className={`${styles.header} ${className ?? \"\"}`} {...props} />;\n});\n\nexport const AccordionTrigger = forwardRef<ComponentRef<typeof BaseAccordion.Trigger>, AccordionTriggerProps>(function AccordionTrigger(\n { className, ...props },\n ref,\n) {\n return <BaseAccordion.Trigger ref={ref} className={`${styles.trigger} ${className ?? \"\"}`} {...props} />;\n});\n\nexport const AccordionPanel = forwardRef<ComponentRef<typeof BaseAccordion.Panel>, AccordionPanelProps>(function AccordionPanel(\n { className, ...props },\n ref,\n) {\n return <BaseAccordion.Panel ref={ref} className={`${styles.panel} ${className ?? \"\"}`} {...props} />;\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAyCA,MAAa,gBAAgB,WAAwE,SAAS,cAC5G,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACA,UAAc,MAAf;EAAyB;EAAK,WAAW,GAAGC,yBAAO,KAAK,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EAClG;AAEF,MAAa,kBAAkB,WAA4E,SAAS,gBAClH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,UAAc,QAAf;EAA2B;EAAK,WAAW,GAAGC,yBAAO,OAAO,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACtG;AAEF,MAAa,mBAAmB,WAA8E,SAAS,iBACrH,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,UAAc,SAAf;EAA4B;EAAK,WAAW,GAAGC,yBAAO,QAAQ,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACxG;AAEF,MAAa,iBAAiB,WAA0E,SAAS,eAC/G,EAAE,WAAW,GAAG,SAChB,KACA;AACA,QAAO,oBAACD,UAAc,OAAf;EAA0B;EAAK,WAAW,GAAGC,yBAAO,MAAM,GAAG,aAAa;EAAM,GAAI;EAAS,CAAA;EACpG"}
@@ -0,0 +1,84 @@
1
+ @layer components {
2
+ .backdrop_xocxMW {
3
+ min-height: 100dvh;
4
+ z-index: var(--z-overlay);
5
+ transition: opacity var(--duration-slow) var(--easing-standard);
6
+ background-color: #0000007a;
7
+ position: fixed;
8
+ inset: 0;
9
+
10
+ @supports (-webkit-touch-callout: none) {
11
+ position: absolute;
12
+ }
13
+ }
14
+
15
+ .backdrop_xocxMW[data-starting-style], .backdrop_xocxMW[data-ending-style] {
16
+ opacity: 0;
17
+ }
18
+
19
+ .popup_xocxMW {
20
+ z-index: var(--z-modal);
21
+ background-color: var(--color-elevated);
22
+ border: var(--border-width-base) solid var(--color-line);
23
+ border-radius: var(--radius-2xl);
24
+ box-shadow: var(--shadow-xl);
25
+ padding: var(--space-5) var(--space-6);
26
+ width: min(380px, calc(100vw - var(--space-8)));
27
+ gap: var(--space-3);
28
+ transition: opacity .2s var(--easing-ease-out),
29
+ transform .2s var(--easing-spring);
30
+ outline: none;
31
+ flex-direction: column;
32
+ display: flex;
33
+ position: fixed;
34
+ top: 50%;
35
+ left: 50%;
36
+ overflow: hidden;
37
+ transform: translate(-50%, -50%);
38
+ }
39
+
40
+ .popup_xocxMW[data-starting-style] {
41
+ opacity: 0;
42
+ transform: translate(-50%, -48%) scale(.96);
43
+ }
44
+
45
+ .popup_xocxMW[data-ending-style] {
46
+ opacity: 0;
47
+ transition: opacity .15s var(--easing-ease-in),
48
+ transform .15s var(--easing-ease-in);
49
+ transform: translate(-50%, -50%) scale(.98);
50
+ }
51
+
52
+ .header_xocxMW {
53
+ gap: var(--space-1-5);
54
+ flex-direction: column;
55
+ display: flex;
56
+ }
57
+
58
+ .icon_xocxMW {
59
+ margin-bottom: var(--space-1);
60
+ }
61
+
62
+ .title_xocxMW {
63
+ font-family: var(--font-sans);
64
+ font-size: var(--font-size-lg);
65
+ font-weight: var(--font-weight-bold);
66
+ color: var(--color-primary);
67
+ line-height: var(--line-height-tight);
68
+ }
69
+
70
+ .description_xocxMW {
71
+ font-family: var(--font-sans);
72
+ font-size: var(--font-size-md);
73
+ color: var(--color-secondary);
74
+ line-height: var(--line-height-relaxed);
75
+ }
76
+
77
+ .actions_xocxMW {
78
+ justify-content: flex-end;
79
+ align-items: center;
80
+ gap: var(--space-2);
81
+ padding-top: var(--space-1);
82
+ display: flex;
83
+ }
84
+ }
@@ -0,0 +1,44 @@
1
+ import { ReactElement, ReactNode } from "react";
2
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
3
+ import styles from "./alert-dialog.module.css";
4
+
5
+ //#region src/alert-dialog/alert-dialog.d.ts
6
+ interface AlertAction {
7
+ label: ReactNode;
8
+ /** Called when the action button is clicked. The dialog closes automatically. */
9
+ onAction?: () => void;
10
+ /** Renders as a filled accent button — use for the primary confirm action. */
11
+ primary?: boolean;
12
+ /** Renders as a soft destructive button. Sits on the left when combined with other actions. */
13
+ destructive?: boolean;
14
+ }
15
+ interface AlertDialogProps {
16
+ open?: boolean;
17
+ defaultOpen?: boolean;
18
+ onOpenChange?: (open: boolean, eventDetails: unknown) => void;
19
+ trigger?: ReactElement;
20
+ /** Optional icon shown above the title. */
21
+ icon?: ReactNode;
22
+ title: ReactNode;
23
+ description?: ReactNode;
24
+ /**
25
+ * Action buttons rendered right-aligned.
26
+ * Use `primary: true` for the confirm action (solid), leave unset for cancel (outline).
27
+ * Use `destructive: true` to apply destructive tone to the confirm action.
28
+ */
29
+ actions: AlertAction[];
30
+ className?: string;
31
+ }
32
+ declare function AlertDialog({
33
+ trigger,
34
+ icon,
35
+ title,
36
+ description,
37
+ actions,
38
+ className,
39
+ onOpenChange,
40
+ ...props
41
+ }: AlertDialogProps): react_jsx_runtime0.JSX.Element;
42
+ //#endregion
43
+ export { AlertAction, AlertDialog, AlertDialogProps, styles };
44
+ //# sourceMappingURL=alert-dialog.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"alert-dialog.d.ts","names":[],"sources":["../../src/alert-dialog/alert-dialog.tsx"],"mappings":";;;;;UAKiB,WAAA;EACf,KAAA,EAAO,SAAA;;EAEP,QAAA;EAH0B;EAK1B,OAAA;EAJgB;EAMhB,WAAA;AAAA;AAAA,UAGe,gBAAA;EACf,IAAA;EACA,WAAA;EACA,YAAA,IAAgB,IAAA,WAAe,YAAA;EAC/B,OAAA,GAAU,YAAA;EAJK;EAMf,IAAA,GAAO,SAAA;EACP,KAAA,EAAO,SAAA;EACP,WAAA,GAAc,SAAA;EAFP;;;;;EAQP,OAAA,EAAS,WAAA;EACT,SAAA;AAAA;AAAA,iBAGc,WAAA,CAAA;EAAc,OAAA;EAAS,IAAA;EAAM,KAAA;EAAO,WAAA;EAAa,OAAA;EAAS,SAAA;EAAW,YAAA;EAAA,GAAiB;AAAA,GAAS,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
@@ -0,0 +1,46 @@
1
+ import { Button } from "../button/button.js";
2
+ import alert_dialog_module_default from "./alert-dialog.module.js";
3
+ import { AlertDialog } from "@base-ui/react/alert-dialog";
4
+ import { jsx, jsxs } from "react/jsx-runtime";
5
+ //#region src/alert-dialog/alert-dialog.tsx
6
+ function AlertDialog$1({ trigger, icon, title, description, actions, className, onOpenChange, ...props }) {
7
+ return /* @__PURE__ */ jsxs(AlertDialog.Root, {
8
+ onOpenChange,
9
+ ...props,
10
+ children: [trigger && /* @__PURE__ */ jsx(AlertDialog.Trigger, { render: trigger }), /* @__PURE__ */ jsxs(AlertDialog.Portal, { children: [/* @__PURE__ */ jsx(AlertDialog.Backdrop, { className: alert_dialog_module_default.backdrop }), /* @__PURE__ */ jsxs(AlertDialog.Popup, {
11
+ className: `${alert_dialog_module_default.popup} ${className ?? ""}`,
12
+ children: [/* @__PURE__ */ jsxs("div", {
13
+ className: alert_dialog_module_default.header,
14
+ children: [
15
+ icon && /* @__PURE__ */ jsx("div", {
16
+ className: alert_dialog_module_default.icon,
17
+ children: icon
18
+ }),
19
+ /* @__PURE__ */ jsx(AlertDialog.Title, {
20
+ className: alert_dialog_module_default.title,
21
+ children: title
22
+ }),
23
+ description && /* @__PURE__ */ jsx(AlertDialog.Description, {
24
+ className: alert_dialog_module_default.description,
25
+ children: description
26
+ })
27
+ ]
28
+ }), /* @__PURE__ */ jsx("div", {
29
+ className: alert_dialog_module_default.actions,
30
+ children: actions.map((action, i) => /* @__PURE__ */ jsx(AlertDialog.Close, {
31
+ render: /* @__PURE__ */ jsx(Button, {
32
+ variant: action.primary ? "solid" : "outline",
33
+ tone: action.destructive ? "destructive" : "primary",
34
+ size: "sm",
35
+ onClick: action.onAction
36
+ }),
37
+ children: action.label
38
+ }, i))
39
+ })]
40
+ })] })]
41
+ });
42
+ }
43
+ //#endregion
44
+ export { AlertDialog$1 as AlertDialog };
45
+
46
+ //# sourceMappingURL=alert-dialog.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"alert-dialog.js","names":["AlertDialog","BaseAlertDialog","styles"],"sources":["../../src/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import type { ReactNode, ReactElement } from \"react\";\nimport { AlertDialog as BaseAlertDialog } from \"@base-ui/react/alert-dialog\";\nimport { Button } from \"../button/button\";\nimport styles from \"./alert-dialog.module.css\";\n\nexport interface AlertAction {\n label: ReactNode;\n /** Called when the action button is clicked. The dialog closes automatically. */\n onAction?: () => void;\n /** Renders as a filled accent button — use for the primary confirm action. */\n primary?: boolean;\n /** Renders as a soft destructive button. Sits on the left when combined with other actions. */\n destructive?: boolean;\n}\n\nexport interface AlertDialogProps {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean, eventDetails: unknown) => void;\n trigger?: ReactElement;\n /** Optional icon shown above the title. */\n icon?: ReactNode;\n title: ReactNode;\n description?: ReactNode;\n /**\n * Action buttons rendered right-aligned.\n * Use `primary: true` for the confirm action (solid), leave unset for cancel (outline).\n * Use `destructive: true` to apply destructive tone to the confirm action.\n */\n actions: AlertAction[];\n className?: string;\n}\n\nexport function AlertDialog({ trigger, icon, title, description, actions, className, onOpenChange, ...props }: AlertDialogProps) {\n return (\n <BaseAlertDialog.Root onOpenChange={onOpenChange as never} {...props}>\n {trigger && <BaseAlertDialog.Trigger render={trigger} />}\n <BaseAlertDialog.Portal>\n <BaseAlertDialog.Backdrop className={styles.backdrop} />\n <BaseAlertDialog.Popup className={`${styles.popup} ${className ?? \"\"}`}>\n <div className={styles.header}>\n {icon && <div className={styles.icon}>{icon}</div>}\n <BaseAlertDialog.Title className={styles.title}>{title}</BaseAlertDialog.Title>\n {description && <BaseAlertDialog.Description className={styles.description}>{description}</BaseAlertDialog.Description>}\n </div>\n <div className={styles.actions}>\n {actions.map((action, i) => (\n <BaseAlertDialog.Close\n key={i}\n render={\n <Button\n variant={action.primary ? \"solid\" : \"outline\"}\n tone={action.destructive ? \"destructive\" : \"primary\"}\n size=\"sm\"\n onClick={action.onAction}\n />\n }\n >\n {action.label}\n </BaseAlertDialog.Close>\n ))}\n </div>\n </BaseAlertDialog.Popup>\n </BaseAlertDialog.Portal>\n </BaseAlertDialog.Root>\n );\n}\n\nexport { styles as AlertDialogStyles };\n"],"mappings":";;;;;AAiCA,SAAgBA,cAAY,EAAE,SAAS,MAAM,OAAO,aAAa,SAAS,WAAW,cAAc,GAAG,SAA2B;AAC/H,QACE,qBAACC,YAAgB,MAAjB;EAAoC;EAAuB,GAAI;YAA/D,CACG,WAAW,oBAACA,YAAgB,SAAjB,EAAyB,QAAQ,SAAW,CAAA,EACxD,qBAACA,YAAgB,QAAjB,EAAA,UAAA,CACE,oBAACA,YAAgB,UAAjB,EAA0B,WAAWC,4BAAO,UAAY,CAAA,EACxD,qBAACD,YAAgB,OAAjB;GAAuB,WAAW,GAAGC,4BAAO,MAAM,GAAG,aAAa;aAAlE,CACE,qBAAC,OAAD;IAAK,WAAWA,4BAAO;cAAvB;KACG,QAAQ,oBAAC,OAAD;MAAK,WAAWA,4BAAO;gBAAO;MAAW,CAAA;KAClD,oBAACD,YAAgB,OAAjB;MAAuB,WAAWC,4BAAO;gBAAQ;MAA8B,CAAA;KAC9E,eAAe,oBAACD,YAAgB,aAAjB;MAA6B,WAAWC,4BAAO;gBAAc;MAA0C,CAAA;KACnH;OACN,oBAAC,OAAD;IAAK,WAAWA,4BAAO;cACpB,QAAQ,KAAK,QAAQ,MACpB,oBAACD,YAAgB,OAAjB;KAEE,QACE,oBAAC,QAAD;MACE,SAAS,OAAO,UAAU,UAAU;MACpC,MAAM,OAAO,cAAc,gBAAgB;MAC3C,MAAK;MACL,SAAS,OAAO;MAChB,CAAA;eAGH,OAAO;KACc,EAXjB,EAWiB,CACxB;IACE,CAAA,CACgB;KACD,EAAA,CAAA,CACJ"}
@@ -0,0 +1,2 @@
1
+ declare const styles: Record<string, string | undefined>;
2
+ export default styles;
@@ -0,0 +1,14 @@
1
+ //#region src/alert-dialog/alert-dialog.module.css
2
+ var alert_dialog_module_default = {
3
+ "actions": "actions_xocxMW",
4
+ "backdrop": "backdrop_xocxMW",
5
+ "description": "description_xocxMW",
6
+ "header": "header_xocxMW",
7
+ "icon": "icon_xocxMW",
8
+ "popup": "popup_xocxMW",
9
+ "title": "title_xocxMW"
10
+ };
11
+ //#endregion
12
+ export { alert_dialog_module_default as default };
13
+
14
+ //# sourceMappingURL=alert-dialog.module.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"alert-dialog.module.js","names":[],"sources":["../../src/alert-dialog/alert-dialog.module.css"],"sourcesContent":["@layer components {\n .backdrop {\n position: fixed;\n inset: 0;\n min-height: 100dvh;\n background-color: rgba(0, 0, 0, 0.48);\n z-index: var(--z-overlay);\n transition: opacity var(--duration-slow) var(--easing-standard);\n\n @supports (-webkit-touch-callout: none) {\n position: absolute;\n }\n }\n\n .backdrop[data-starting-style],\n .backdrop[data-ending-style] {\n opacity: 0;\n }\n\n .popup {\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: var(--z-modal);\n background-color: var(--color-elevated);\n border: var(--border-width-base) solid var(--color-line);\n border-radius: var(--radius-2xl);\n box-shadow: var(--shadow-xl);\n padding: var(--space-5) var(--space-6);\n width: min(380px, calc(100vw - var(--space-8)));\n outline: none;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n gap: var(--space-3);\n transition:\n opacity 200ms var(--easing-ease-out),\n transform 200ms var(--easing-spring);\n }\n\n .popup[data-starting-style] {\n opacity: 0;\n transform: translate(-50%, -48%) scale(0.96);\n }\n\n .popup[data-ending-style] {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.98);\n transition:\n opacity 150ms var(--easing-ease-in),\n transform 150ms var(--easing-ease-in);\n }\n\n /* ─── Header ──────────────────────────────────────────────────── */\n\n .header {\n display: flex;\n flex-direction: column;\n gap: var(--space-1-5);\n }\n\n .icon {\n margin-bottom: var(--space-1);\n }\n\n .title {\n font-family: var(--font-sans);\n font-size: var(--font-size-lg);\n font-weight: var(--font-weight-bold);\n color: var(--color-primary);\n line-height: var(--line-height-tight);\n }\n\n .description {\n font-family: var(--font-sans);\n font-size: var(--font-size-md);\n color: var(--color-secondary);\n line-height: var(--line-height-relaxed);\n }\n\n /* ─── Actions ─────────────────────────────────────────────────── */\n\n .actions {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: var(--space-2);\n padding-top: var(--space-1);\n }\n}\n"],"mappings":";AAcA,IAAA,8BAAY;CAAI,WAAU;CAAM,YAAA;CAAA,eAAA;CAAA,UAAA;CAAA,QAAA;CAAA,SAAA;CAAA,SAAA;CAAA"}
@@ -0,0 +1,3 @@
1
+ import { AlertAction, AlertDialog, AlertDialogProps, styles } from "./alert-dialog.js";
2
+ import { AlertDialogBackdrop, AlertDialogBackdropProps, AlertDialogDescription, AlertDialogDescriptionProps, AlertDialogPopup, AlertDialogPopupProps, AlertDialogTitle, AlertDialogTitleProps } from "./parts.js";
3
+ export { type AlertAction, AlertDialog, AlertDialogBackdrop, type AlertDialogBackdropProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogPopup, type AlertDialogPopupProps, type AlertDialogProps, styles as AlertDialogStyles, AlertDialogTitle, type AlertDialogTitleProps };
@@ -0,0 +1,4 @@
1
+ import alert_dialog_module_default from "./alert-dialog.module.js";
2
+ import { AlertDialog } from "./alert-dialog.js";
3
+ import { AlertDialogBackdrop, AlertDialogDescription, AlertDialogPopup, AlertDialogTitle } from "./parts.js";
4
+ export { AlertDialog, AlertDialogBackdrop, AlertDialogDescription, AlertDialogPopup, alert_dialog_module_default as AlertDialogStyles, AlertDialogTitle };
@@ -0,0 +1,28 @@
1
+ import { AlertDialog } from "@base-ui/react/alert-dialog";
2
+ import * as react from "react";
3
+ import { ComponentPropsWithoutRef } from "react";
4
+
5
+ //#region src/alert-dialog/parts.d.ts
6
+ type BaseBackdropProps = ComponentPropsWithoutRef<typeof AlertDialog.Backdrop>;
7
+ type BasePopupProps = ComponentPropsWithoutRef<typeof AlertDialog.Popup>;
8
+ type BaseTitleProps = ComponentPropsWithoutRef<typeof AlertDialog.Title>;
9
+ type BaseDescriptionProps = ComponentPropsWithoutRef<typeof AlertDialog.Description>;
10
+ interface AlertDialogBackdropProps extends Omit<BaseBackdropProps, "className"> {
11
+ className?: string;
12
+ }
13
+ interface AlertDialogPopupProps extends Omit<BasePopupProps, "className"> {
14
+ className?: string;
15
+ }
16
+ interface AlertDialogTitleProps extends Omit<BaseTitleProps, "className"> {
17
+ className?: string;
18
+ }
19
+ interface AlertDialogDescriptionProps extends Omit<BaseDescriptionProps, "className"> {
20
+ className?: string;
21
+ }
22
+ declare const AlertDialogBackdrop: react.ForwardRefExoticComponent<AlertDialogBackdropProps & react.RefAttributes<HTMLDivElement>>;
23
+ declare const AlertDialogPopup: react.ForwardRefExoticComponent<AlertDialogPopupProps & react.RefAttributes<HTMLDivElement>>;
24
+ declare const AlertDialogTitle: react.ForwardRefExoticComponent<AlertDialogTitleProps & react.RefAttributes<HTMLHeadingElement>>;
25
+ declare const AlertDialogDescription: react.ForwardRefExoticComponent<AlertDialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
26
+ //#endregion
27
+ export { AlertDialogBackdrop, AlertDialogBackdropProps, AlertDialogDescription, AlertDialogDescriptionProps, AlertDialogPopup, AlertDialogPopupProps, AlertDialogTitle, AlertDialogTitleProps };
28
+ //# sourceMappingURL=parts.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"parts.d.ts","names":[],"sources":["../../src/alert-dialog/parts.tsx"],"mappings":";;;;;KA8BK,iBAAA,GAAoB,wBAAA,QAAgC,WAAA,CAAgB,QAAA;AAAA,KACpE,cAAA,GAAiB,wBAAA,QAAgC,WAAA,CAAgB,KAAA;AAAA,KACjE,cAAA,GAAiB,wBAAA,QAAgC,WAAA,CAAgB,KAAA;AAAA,KACjE,oBAAA,GAAuB,wBAAA,QAAgC,WAAA,CAAgB,WAAA;AAAA,UAE3D,wBAAA,SAAiC,IAAA,CAAK,iBAAA;EACrD,SAAA;AAAA;AAAA,UAEe,qBAAA,SAA8B,IAAA,CAAK,cAAA;EAClD,SAAA;AAAA;AAAA,UAEe,qBAAA,SAA8B,IAAA,CAAK,cAAA;EAClD,SAAA;AAAA;AAAA,UAEe,2BAAA,SAAoC,IAAA,CAAK,oBAAA;EACxD,SAAA;AAAA;AAAA,cAGW,mBAAA,EAAmB,KAAA,CAAA,yBAAA,CAAA,wBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAMnB,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAOhB,gBAAA,EAAgB,KAAA,CAAA,yBAAA,CAAA,qBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,kBAAA;AAAA,cAOhB,sBAAA,EAAsB,KAAA,CAAA,yBAAA,CAAA,2BAAA,GAAA,KAAA,CAAA,aAAA,CAAA,oBAAA"}
@@ -0,0 +1,62 @@
1
+ import alert_dialog_module_default from "./alert-dialog.module.js";
2
+ import { AlertDialog } from "@base-ui/react/alert-dialog";
3
+ import { forwardRef } from "react";
4
+ import { jsx } from "react/jsx-runtime";
5
+ //#region src/alert-dialog/parts.tsx
6
+ /**
7
+ * Styled primitives for AlertDialog.
8
+ *
9
+ * @example
10
+ * ```tsx
11
+ * import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';
12
+ * import { Button } from '@brijbyte/agentic-ui/button';
13
+ * import { AlertDialogBackdrop, AlertDialogPopup, AlertDialogTitle, AlertDialogDescription } from '@brijbyte/agentic-ui/alert-dialog';
14
+ *
15
+ * <BaseAlertDialog.Root>
16
+ * <BaseAlertDialog.Trigger render={<button>Open</button>} />
17
+ * <BaseAlertDialog.Portal>
18
+ * <AlertDialogBackdrop />
19
+ * <AlertDialogPopup>
20
+ * <AlertDialogTitle>Delete account?</AlertDialogTitle>
21
+ * <AlertDialogDescription>This cannot be undone.</AlertDialogDescription>
22
+ * <div>
23
+ * <BaseAlertDialog.Close render={<Button variant="soft" tone="destructive" size="sm" />}>Delete</BaseAlertDialog.Close>
24
+ * <BaseAlertDialog.Close render={<Button variant="outline" size="sm" />}>Cancel</BaseAlertDialog.Close>
25
+ * </div>
26
+ * </AlertDialogPopup>
27
+ * </BaseAlertDialog.Portal>
28
+ * </BaseAlertDialog.Root>
29
+ * ```
30
+ */
31
+ const AlertDialogBackdrop = forwardRef(function AlertDialogBackdrop({ className, ...props }, ref) {
32
+ return /* @__PURE__ */ jsx(AlertDialog.Backdrop, {
33
+ ref,
34
+ className: `${alert_dialog_module_default.backdrop} ${className ?? ""}`,
35
+ ...props
36
+ });
37
+ });
38
+ const AlertDialogPopup = forwardRef(function AlertDialogPopup({ className, ...props }, ref) {
39
+ return /* @__PURE__ */ jsx(AlertDialog.Popup, {
40
+ ref,
41
+ className: `${alert_dialog_module_default.popup} ${className ?? ""}`,
42
+ ...props
43
+ });
44
+ });
45
+ const AlertDialogTitle = forwardRef(function AlertDialogTitle({ className, ...props }, ref) {
46
+ return /* @__PURE__ */ jsx(AlertDialog.Title, {
47
+ ref,
48
+ className: `${alert_dialog_module_default.title} ${className ?? ""}`,
49
+ ...props
50
+ });
51
+ });
52
+ const AlertDialogDescription = forwardRef(function AlertDialogDescription({ className, ...props }, ref) {
53
+ return /* @__PURE__ */ jsx(AlertDialog.Description, {
54
+ ref,
55
+ className: `${alert_dialog_module_default.description} ${className ?? ""}`,
56
+ ...props
57
+ });
58
+ });
59
+ //#endregion
60
+ export { AlertDialogBackdrop, AlertDialogDescription, AlertDialogPopup, AlertDialogTitle };
61
+
62
+ //# sourceMappingURL=parts.js.map