@crewlethq/ui 0.2.0 → 0.3.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 (497) hide show
  1. package/README.md +1714 -14
  2. package/dist/Accordion/Accordion.d.ts +54 -0
  3. package/dist/Accordion/index.d.ts +4 -0
  4. package/dist/Accordion/index.js +6 -0
  5. package/dist/Accordion-ZI2WLD5C.css +87 -0
  6. package/dist/AddPill/AddPill.d.ts +114 -0
  7. package/dist/AddPill/index.d.ts +3 -0
  8. package/dist/AddPill/index.js +3 -0
  9. package/dist/AddPill-DFWXYLIQ.css +434 -0
  10. package/dist/Announcer/Announcer.d.ts +15 -0
  11. package/dist/Announcer/index.d.ts +2 -0
  12. package/dist/Announcer/index.js +3 -0
  13. package/dist/AppShell/AppShell.d.ts +193 -0
  14. package/dist/AppShell/index.d.ts +3 -0
  15. package/dist/AppShell/index.js +6 -0
  16. package/dist/AppShell-NVE6LHNI.css +395 -0
  17. package/dist/Avatar/Avatar.d.ts +104 -0
  18. package/dist/Avatar/index.d.ts +3 -0
  19. package/dist/Avatar/index.js +2 -0
  20. package/dist/Avatar-P2KRQM2B.css +156 -0
  21. package/dist/BrandLockup/BrandLockup.d.ts +41 -0
  22. package/dist/BrandLockup/index.d.ts +3 -0
  23. package/dist/BrandLockup/index.js +2 -0
  24. package/dist/BrandLockup-6ISDEHPJ.css +108 -0
  25. package/dist/Button/Button.d.ts +88 -0
  26. package/dist/Button/index.d.ts +3 -0
  27. package/dist/Button/index.js +3 -0
  28. package/dist/Button-D4J6B4MA.css +302 -0
  29. package/dist/CalendarGrid/CalendarGrid.d.ts +87 -0
  30. package/dist/CalendarGrid/index.d.ts +3 -0
  31. package/dist/CalendarGrid/index.js +2 -0
  32. package/dist/CalendarGrid-V6TQ5QKS.css +128 -0
  33. package/dist/Callout/Callout.d.ts +47 -0
  34. package/dist/Callout/index.d.ts +3 -0
  35. package/dist/Callout/index.js +2 -0
  36. package/dist/Callout-S7QDWHDL.css +111 -0
  37. package/dist/Canvas/Canvas.d.ts +234 -0
  38. package/dist/Canvas/geometry.d.ts +249 -0
  39. package/dist/Canvas/index.d.ts +5 -0
  40. package/dist/Canvas/index.js +8 -0
  41. package/dist/Canvas/layerNode.d.ts +20 -0
  42. package/dist/Canvas-Q6JETCWR.css +315 -0
  43. package/dist/Card/Card.d.ts +142 -0
  44. package/dist/Card/headerSlot.d.ts +65 -0
  45. package/dist/Card/index.d.ts +5 -0
  46. package/dist/Card/index.js +6 -0
  47. package/dist/Card-AHX3Q2JD.css +428 -0
  48. package/dist/Charts/ActivityStrip.d.ts +45 -0
  49. package/dist/Charts/BarList.d.ts +51 -0
  50. package/dist/Charts/Legend.d.ts +32 -0
  51. package/dist/Charts/StackedBar.d.ts +38 -0
  52. package/dist/Charts/TimeSeries.d.ts +92 -0
  53. package/dist/Charts/dataColor.d.ts +20 -0
  54. package/dist/Charts/index.d.ts +12 -0
  55. package/dist/Charts/index.js +3 -0
  56. package/dist/Charts-D7G2BSXH.css +277 -0
  57. package/dist/Checkbox/Checkbox.d.ts +45 -0
  58. package/dist/Checkbox/index.d.ts +3 -0
  59. package/dist/Checkbox/index.js +2 -0
  60. package/dist/Checkbox-VGW26YLQ.css +111 -0
  61. package/dist/CodeBlock/CodeBlock.d.ts +60 -0
  62. package/dist/CodeBlock/index.d.ts +3 -0
  63. package/dist/CodeBlock/index.js +7 -0
  64. package/dist/CodeBlock-U2W6NNVC.css +153 -0
  65. package/dist/Combobox/Combobox.d.ts +89 -0
  66. package/dist/Combobox/index.d.ts +3 -0
  67. package/dist/Combobox/index.js +8 -0
  68. package/dist/Combobox-4FUVYIE7.css +80 -0
  69. package/dist/CommandPalette/CommandPalette.d.ts +77 -0
  70. package/dist/CommandPalette/index.d.ts +3 -0
  71. package/dist/CommandPalette/index.js +11 -0
  72. package/dist/CommandPalette-CSJDUCQA.css +115 -0
  73. package/dist/Container/Container.d.ts +17 -0
  74. package/dist/Container/index.d.ts +3 -0
  75. package/dist/Container/index.js +2 -0
  76. package/dist/Container-3TSKMGNI.css +52 -0
  77. package/dist/Copyable/CopyButton.d.ts +54 -0
  78. package/dist/Copyable/Copyable.d.ts +34 -0
  79. package/dist/Copyable/index.d.ts +5 -0
  80. package/dist/Copyable/index.js +6 -0
  81. package/dist/Copyable-5PNRFOLS.css +125 -0
  82. package/dist/Count/Count.d.ts +24 -0
  83. package/dist/Count/index.d.ts +3 -0
  84. package/dist/Count/index.js +3 -0
  85. package/dist/Count-ZVCJ6VPD.css +20 -0
  86. package/dist/DataTable/CopyableCell.d.ts +12 -0
  87. package/dist/DataTable/DataTable.d.ts +615 -0
  88. package/dist/DataTable/RowActionsMenu.d.ts +7 -0
  89. package/dist/DataTable/index.d.ts +7 -0
  90. package/dist/DataTable/index.js +14 -0
  91. package/dist/DataTable-ITNACQ2X.css +2020 -0
  92. package/dist/DataView/DataView.d.ts +109 -0
  93. package/dist/DataView/DataViewToolbar.d.ts +87 -0
  94. package/dist/DataView/FilterAxisBar.d.ts +103 -0
  95. package/dist/DataView/columns.d.ts +35 -0
  96. package/dist/DataView/filters.d.ts +184 -0
  97. package/dist/DataView/index.d.ts +11 -0
  98. package/dist/DataView/index.js +25 -0
  99. package/dist/DataView-256YF32J.css +441 -0
  100. package/dist/DateTimePicker/DateTimePicker.d.ts +91 -0
  101. package/dist/DateTimePicker/index.d.ts +3 -0
  102. package/dist/DateTimePicker/index.js +9 -0
  103. package/dist/DateTimePicker-22VNXRWC.css +199 -0
  104. package/dist/DescriptionList/DescriptionList.d.ts +36 -0
  105. package/dist/DescriptionList/index.d.ts +3 -0
  106. package/dist/DescriptionList/index.js +2 -0
  107. package/dist/DescriptionList-YYY3V3O6.css +59 -0
  108. package/dist/DiffList/DiffList.d.ts +47 -0
  109. package/dist/DiffList/index.d.ts +3 -0
  110. package/dist/DiffList/index.js +3 -0
  111. package/dist/DiffList-3EX64AAE.css +94 -0
  112. package/dist/Disclosure/Disclosure.d.ts +56 -0
  113. package/dist/Disclosure/anatomy.d.ts +43 -0
  114. package/dist/Disclosure/index.d.ts +5 -0
  115. package/dist/Disclosure/index.js +6 -0
  116. package/dist/Disclosure-VKBJJIZ7.css +176 -0
  117. package/dist/EmptyState/EmptyState.d.ts +39 -0
  118. package/dist/EmptyState/index.d.ts +3 -0
  119. package/dist/EmptyState/index.js +3 -0
  120. package/dist/EmptyState-C6HRBGT7.css +73 -0
  121. package/dist/EmptyValue/EmptyValue.d.ts +31 -0
  122. package/dist/EmptyValue/index.d.ts +3 -0
  123. package/dist/EmptyValue/index.js +3 -0
  124. package/dist/EmptyValue-4B6ODXHT.css +12 -0
  125. package/dist/EntityChip/EntityChip.d.ts +40 -0
  126. package/dist/EntityChip/index.d.ts +3 -0
  127. package/dist/EntityChip/index.js +3 -0
  128. package/dist/EntityChip-LUCPZBBG.css +64 -0
  129. package/dist/ErrorBoundary/ErrorBoundary.d.ts +58 -0
  130. package/dist/ErrorBoundary/index.d.ts +3 -0
  131. package/dist/ErrorBoundary/index.js +4 -0
  132. package/dist/ErrorBoundary-ME36CQTA.css +59 -0
  133. package/dist/Eyebrow/Eyebrow.d.ts +18 -0
  134. package/dist/Eyebrow/index.d.ts +3 -0
  135. package/dist/Eyebrow/index.js +2 -0
  136. package/dist/Eyebrow-5NREGHQH.css +46 -0
  137. package/dist/FilterChip/FilterChip.d.ts +68 -0
  138. package/dist/FilterChip/index.d.ts +3 -0
  139. package/dist/FilterChip/index.js +3 -0
  140. package/dist/FilterChip-GTGLLOXE.css +107 -0
  141. package/dist/Fullscreen/index.d.ts +2 -0
  142. package/dist/Fullscreen/index.js +1 -0
  143. package/dist/Fullscreen/useFullscreen.d.ts +32 -0
  144. package/dist/IconButton/IconButton.d.ts +45 -0
  145. package/dist/IconButton/index.d.ts +3 -0
  146. package/dist/IconButton/index.js +3 -0
  147. package/dist/IconButton-VQGNMJDI.css +158 -0
  148. package/dist/ImageUpload/ImageUpload.d.ts +37 -0
  149. package/dist/ImageUpload/index.d.ts +3 -0
  150. package/dist/ImageUpload/index.js +3 -0
  151. package/dist/ImageUpload-HKFIZR6D.css +193 -0
  152. package/dist/InlineCode/InlineCode.d.ts +37 -0
  153. package/dist/InlineCode/index.d.ts +3 -0
  154. package/dist/InlineCode/index.js +2 -0
  155. package/dist/InlineCode-6WSR5COL.css +65 -0
  156. package/dist/Input/FormField.d.ts +61 -0
  157. package/dist/Input/FormRow.d.ts +6 -0
  158. package/dist/Input/FormSection.d.ts +28 -0
  159. package/dist/Input/Input.d.ts +98 -0
  160. package/dist/Input/Label.d.ts +31 -0
  161. package/dist/Input/ReadOnlyField.d.ts +30 -0
  162. package/dist/Input/Textarea.d.ts +16 -0
  163. package/dist/Input/index.d.ts +15 -0
  164. package/dist/Input/index.js +5 -0
  165. package/dist/Input-2PU5CPKK.css +616 -0
  166. package/dist/Kbd/Kbd.d.ts +40 -0
  167. package/dist/Kbd/index.d.ts +3 -0
  168. package/dist/Kbd/index.js +3 -0
  169. package/dist/Kbd-W66MXQI5.css +61 -0
  170. package/dist/Layer/LayerHost.d.ts +23 -0
  171. package/dist/Layer/index.d.ts +7 -0
  172. package/dist/Layer/index.js +3 -0
  173. package/dist/Layer/place.d.ts +63 -0
  174. package/dist/Layer/stack.d.ts +159 -0
  175. package/dist/Layer-NAFSGCFA.css +23 -0
  176. package/dist/Layout/Layout.d.ts +104 -0
  177. package/dist/Layout/index.d.ts +3 -0
  178. package/dist/Layout/index.js +2 -0
  179. package/dist/Layout-2ZCV3IGF.css +171 -0
  180. package/dist/Link/Link.d.ts +45 -0
  181. package/dist/Link/index.d.ts +3 -0
  182. package/dist/Link/index.js +3 -0
  183. package/dist/Link-6BEFNMN2.css +80 -0
  184. package/dist/List/List.d.ts +73 -0
  185. package/dist/List/index.d.ts +3 -0
  186. package/dist/List/index.js +3 -0
  187. package/dist/List-XTHESXLR.css +161 -0
  188. package/dist/ListInput/ListInput.d.ts +68 -0
  189. package/dist/ListInput/index.d.ts +3 -0
  190. package/dist/ListInput/index.js +10 -0
  191. package/dist/ListInput-O7LJKOIG.css +147 -0
  192. package/dist/Listbox/index.d.ts +5 -0
  193. package/dist/Listbox/index.js +2 -0
  194. package/dist/Listbox/useListbox.d.ts +97 -0
  195. package/dist/Listbox/useOptionKeys.d.ts +64 -0
  196. package/dist/Listbox-X2DOTSQA.css +110 -0
  197. package/dist/Menu/Menu.d.ts +118 -0
  198. package/dist/Menu/index.d.ts +3 -0
  199. package/dist/Menu/index.js +7 -0
  200. package/dist/Menu-6DE7I66I.css +222 -0
  201. package/dist/Meter/Meter.d.ts +49 -0
  202. package/dist/Meter/index.d.ts +3 -0
  203. package/dist/Meter/index.js +3 -0
  204. package/dist/Meter-SKOOXQBC.css +87 -0
  205. package/dist/Modal/ConfirmModal.d.ts +74 -0
  206. package/dist/Modal/Modal.d.ts +154 -0
  207. package/dist/Modal/index.d.ts +5 -0
  208. package/dist/Modal/index.js +8 -0
  209. package/dist/Modal-XYQJ4BL6.css +484 -0
  210. package/dist/NewItemsNotice/NewItemsNotice.d.ts +28 -0
  211. package/dist/NewItemsNotice/index.d.ts +3 -0
  212. package/dist/NewItemsNotice/index.js +4 -0
  213. package/dist/NewItemsNotice-T4DSSPVV.css +60 -0
  214. package/dist/OrgLabel/OrgLabel.d.ts +117 -0
  215. package/dist/OrgLabel/index.d.ts +3 -0
  216. package/dist/OrgLabel/index.js +2 -0
  217. package/dist/OrgLabel-D7U6QJZD.css +293 -0
  218. package/dist/OrgNode/OrgNode.d.ts +103 -0
  219. package/dist/OrgNode/index.d.ts +3 -0
  220. package/dist/OrgNode/index.js +3 -0
  221. package/dist/OrgNode-BT7T2Q2X.css +214 -0
  222. package/dist/OrgTable/OrgTable.d.ts +113 -0
  223. package/dist/OrgTable/index.d.ts +3 -0
  224. package/dist/OrgTable/index.js +11 -0
  225. package/dist/OrgTable-VWMFC3TB.css +360 -0
  226. package/dist/PageHeader/PageHeader.d.ts +35 -0
  227. package/dist/PageHeader/index.d.ts +3 -0
  228. package/dist/PageHeader/index.js +3 -0
  229. package/dist/PageHeader-6EYWQXRE.css +88 -0
  230. package/dist/Popover/Popover.d.ts +91 -0
  231. package/dist/Popover/index.d.ts +3 -0
  232. package/dist/Popover/index.js +4 -0
  233. package/dist/Popover-WJGCF3ZQ.css +185 -0
  234. package/dist/PricingCard/PricingCard.d.ts +56 -0
  235. package/dist/PricingCard/index.d.ts +3 -0
  236. package/dist/PricingCard/index.js +4 -0
  237. package/dist/PricingCard-JFI7RYXP.css +278 -0
  238. package/dist/Prose/Prose.d.ts +33 -0
  239. package/dist/Prose/index.d.ts +3 -0
  240. package/dist/Prose/index.js +2 -0
  241. package/dist/Prose-BTXNFT2Q.css +99 -0
  242. package/dist/RelativeTime/RelativeTime.d.ts +31 -0
  243. package/dist/RelativeTime/clock.d.ts +9 -0
  244. package/dist/RelativeTime/format.d.ts +38 -0
  245. package/dist/RelativeTime/index.d.ts +6 -0
  246. package/dist/RelativeTime/index.js +4 -0
  247. package/dist/RelativeTime-EBAQPGO2.css +10 -0
  248. package/dist/SearchTrigger/SearchTrigger.d.ts +29 -0
  249. package/dist/SearchTrigger/index.d.ts +3 -0
  250. package/dist/SearchTrigger/index.js +2 -0
  251. package/dist/SearchTrigger-QXOYAUUY.css +79 -0
  252. package/dist/Section/Section.d.ts +41 -0
  253. package/dist/Section/index.d.ts +3 -0
  254. package/dist/Section/index.js +3 -0
  255. package/dist/Section-QRUPRIQ2.css +127 -0
  256. package/dist/SegmentedControl/SegmentedControl.d.ts +68 -0
  257. package/dist/SegmentedControl/index.d.ts +4 -0
  258. package/dist/SegmentedControl/index.js +5 -0
  259. package/dist/SegmentedControl-X3BI3XU4.css +68 -0
  260. package/dist/Select/Select.d.ts +138 -0
  261. package/dist/Select/index.d.ts +3 -0
  262. package/dist/Select/index.js +5 -0
  263. package/dist/Select-2X77FSWR.css +350 -0
  264. package/dist/Shortcut/index.d.ts +2 -0
  265. package/dist/Shortcut/index.js +4 -0
  266. package/dist/Shortcut/useShortcut.d.ts +68 -0
  267. package/dist/SidebarNav/SidebarNav.d.ts +117 -0
  268. package/dist/SidebarNav/index.d.ts +3 -0
  269. package/dist/SidebarNav/index.js +3 -0
  270. package/dist/SidebarNav-QGSFKZYA.css +319 -0
  271. package/dist/Skeleton/Skeleton.d.ts +50 -0
  272. package/dist/Skeleton/index.d.ts +3 -0
  273. package/dist/Skeleton/index.js +3 -0
  274. package/dist/Skeleton-V735HRGM.css +421 -0
  275. package/dist/StatCard/StatCard.d.ts +56 -0
  276. package/dist/StatCard/index.d.ts +3 -0
  277. package/dist/StatCard/index.js +3 -0
  278. package/dist/StatCard-KYPKZUWX.css +111 -0
  279. package/dist/StatGroup/StatGroup.d.ts +20 -0
  280. package/dist/StatGroup/index.d.ts +3 -0
  281. package/dist/StatGroup/index.js +2 -0
  282. package/dist/StatGroup-TGB6AEKM.css +80 -0
  283. package/dist/StatusDot/StatusDot.d.ts +25 -0
  284. package/dist/StatusDot/index.d.ts +3 -0
  285. package/dist/StatusDot/index.js +2 -0
  286. package/dist/StatusDot-HA2L2FSX.css +84 -0
  287. package/dist/Switch/Switch.d.ts +38 -0
  288. package/dist/Switch/index.d.ts +3 -0
  289. package/dist/Switch/index.js +2 -0
  290. package/dist/Switch-U4OWK4CL.css +169 -0
  291. package/dist/Table/Table.d.ts +51 -0
  292. package/dist/Table/index.d.ts +3 -0
  293. package/dist/Table/index.js +3 -0
  294. package/dist/Table-MDOLVUAW.css +159 -0
  295. package/dist/Tabs/Tabs.d.ts +97 -0
  296. package/dist/Tabs/index.d.ts +3 -0
  297. package/dist/Tabs/index.js +4 -0
  298. package/dist/Tabs/roving.d.ts +36 -0
  299. package/dist/Tabs-VLICJFVB.css +275 -0
  300. package/dist/Tag/Tag.d.ts +107 -0
  301. package/dist/Tag/index.d.ts +3 -0
  302. package/dist/Tag/index.js +3 -0
  303. package/dist/Tag-VNZEYLB6.css +406 -0
  304. package/dist/TagGroup/TagGroup.d.ts +41 -0
  305. package/dist/TagGroup/index.d.ts +3 -0
  306. package/dist/TagGroup/index.js +4 -0
  307. package/dist/TagGroup-APC2EFH4.css +75 -0
  308. package/dist/TagsInput/TagsInput.d.ts +112 -0
  309. package/dist/TagsInput/index.d.ts +3 -0
  310. package/dist/TagsInput/index.js +10 -0
  311. package/dist/TagsInput-W4P36PRJ.css +168 -0
  312. package/dist/Text/Text.d.ts +67 -0
  313. package/dist/Text/index.d.ts +3 -0
  314. package/dist/Text/index.js +2 -0
  315. package/dist/Text-XIPYYZX2.css +154 -0
  316. package/dist/ThemeSwitcher/ThemeSwitcher.d.ts +47 -0
  317. package/dist/ThemeSwitcher/index.d.ts +4 -0
  318. package/dist/ThemeSwitcher/index.js +6 -0
  319. package/dist/ThemeSwitcher/preferences.d.ts +51 -0
  320. package/dist/TimeWindowPicker/TimeWindowPicker.d.ts +231 -0
  321. package/dist/TimeWindowPicker/index.d.ts +3 -0
  322. package/dist/TimeWindowPicker/index.js +13 -0
  323. package/dist/TimeWindowPicker/mask.d.ts +82 -0
  324. package/dist/TimeWindowPicker-7I7KWCMU.css +403 -0
  325. package/dist/Timeline/Timeline.d.ts +51 -0
  326. package/dist/Timeline/index.d.ts +3 -0
  327. package/dist/Timeline/index.js +3 -0
  328. package/dist/Timeline-27SYKOFX.css +144 -0
  329. package/dist/Toaster/Toaster.d.ts +108 -0
  330. package/dist/Toaster/index.d.ts +3 -0
  331. package/dist/Toaster/index.js +5 -0
  332. package/dist/Toaster-NVDCEIP5.css +306 -0
  333. package/dist/Toolbar/Toolbar.d.ts +62 -0
  334. package/dist/Toolbar/index.d.ts +3 -0
  335. package/dist/Toolbar/index.js +4 -0
  336. package/dist/Toolbar-IP6LXN45.css +48 -0
  337. package/dist/Tooltip/Tooltip.d.ts +51 -0
  338. package/dist/Tooltip/index.d.ts +3 -0
  339. package/dist/Tooltip/index.js +4 -0
  340. package/dist/Tooltip-LKQF7CE4.css +71 -0
  341. package/dist/Tree/index.d.ts +8 -0
  342. package/dist/Tree/index.js +1 -0
  343. package/dist/Tree/layout.d.ts +160 -0
  344. package/dist/Tree/model.d.ts +110 -0
  345. package/dist/Tree/useMeasuredSizes.d.ts +61 -0
  346. package/dist/Tree/useTreeState.d.ts +89 -0
  347. package/dist/TreeCanvas/TreeCanvas.d.ts +384 -0
  348. package/dist/TreeCanvas/index.d.ts +3 -0
  349. package/dist/TreeCanvas/index.js +10 -0
  350. package/dist/TreeCanvas/motion.d.ts +59 -0
  351. package/dist/TreeCanvas-WBNQPHC7.css +1098 -0
  352. package/dist/TreeGrid/TreeGrid.d.ts +142 -0
  353. package/dist/TreeGrid/index.d.ts +3 -0
  354. package/dist/TreeGrid/index.js +8 -0
  355. package/dist/TreeGrid-NSW7VMOX.css +132 -0
  356. package/dist/VisuallyHidden/VisuallyHidden.d.ts +23 -0
  357. package/dist/VisuallyHidden/index.d.ts +3 -0
  358. package/dist/VisuallyHidden/index.js +2 -0
  359. package/dist/VisuallyHidden-L552H7OA.css +21 -0
  360. package/dist/chunk-22O7LAW2.js +41 -0
  361. package/dist/chunk-23DHIMJA.js +38 -0
  362. package/dist/chunk-2EOKFKHX.js +263 -0
  363. package/dist/chunk-2PRH365R.js +74 -0
  364. package/dist/chunk-2ZQMA2WB.js +57 -0
  365. package/dist/chunk-3CZ7XAVY.js +139 -0
  366. package/dist/chunk-3EYF6HKB.js +135 -0
  367. package/dist/chunk-3ZP55QZE.js +40 -0
  368. package/dist/chunk-53DVJCVW.js +14 -0
  369. package/dist/chunk-5C5YMZQU.js +51 -0
  370. package/dist/chunk-5EKIWVOR.js +132 -0
  371. package/dist/chunk-5IMACPJS.js +495 -0
  372. package/dist/chunk-5KPQ6D7N.js +54 -0
  373. package/dist/chunk-5SDBMKUO.js +297 -0
  374. package/dist/chunk-5WS6L6FA.js +114 -0
  375. package/dist/chunk-7EM5T4ME.js +39 -0
  376. package/dist/chunk-7FZ53WDJ.js +163 -0
  377. package/dist/chunk-7HPRF5XN.js +525 -0
  378. package/dist/chunk-7RPGY3JE.js +43 -0
  379. package/dist/chunk-A2UXBCLO.js +48 -0
  380. package/dist/chunk-ARMRX2YV.js +96 -0
  381. package/dist/chunk-AV2DXAEL.js +27 -0
  382. package/dist/chunk-BHHIIK3M.js +17 -0
  383. package/dist/chunk-BZFWDIV6.js +9 -0
  384. package/dist/chunk-BZYDZBAN.js +123 -0
  385. package/dist/chunk-CMEE37QJ.js +628 -0
  386. package/dist/chunk-D3OADIM6.js +112 -0
  387. package/dist/chunk-DD5BBGBE.js +162 -0
  388. package/dist/chunk-EHMQQHYR.js +1652 -0
  389. package/dist/chunk-EN6K2IFA.js +256 -0
  390. package/dist/chunk-EPOOQZYA.js +118 -0
  391. package/dist/chunk-ESCO4XYW.js +144 -0
  392. package/dist/chunk-EUCC37WY.js +14 -0
  393. package/dist/chunk-EV6IMYJ6.js +62 -0
  394. package/dist/chunk-F27EPQ7D.js +68 -0
  395. package/dist/chunk-F4PJZ4ED.js +245 -0
  396. package/dist/chunk-F6OE5FH3.js +49 -0
  397. package/dist/chunk-FBZAKNSX.js +263 -0
  398. package/dist/chunk-FEFTGVMF.js +46 -0
  399. package/dist/chunk-G2QFRTJ2.js +823 -0
  400. package/dist/chunk-GHYY2WPF.js +907 -0
  401. package/dist/chunk-GTOUGQQK.js +147 -0
  402. package/dist/chunk-GUIF6Q6N.js +143 -0
  403. package/dist/chunk-GXQ3B46I.js +216 -0
  404. package/dist/chunk-H4FBTAYS.js +130 -0
  405. package/dist/chunk-HOXGBLEY.js +37 -0
  406. package/dist/chunk-HQNHV7D6.js +54 -0
  407. package/dist/chunk-HTDFCRJZ.js +92 -0
  408. package/dist/chunk-HZ5XZNPS.js +98 -0
  409. package/dist/chunk-IAJLHVUA.js +28 -0
  410. package/dist/chunk-IJ7QXNIJ.js +1 -0
  411. package/dist/chunk-ITHXJHBB.js +280 -0
  412. package/dist/chunk-JCSA3XVH.js +32 -0
  413. package/dist/chunk-KLJCCMF3.js +97 -0
  414. package/dist/chunk-LGCPQIOZ.js +49 -0
  415. package/dist/chunk-LWKJQTOM.js +77 -0
  416. package/dist/chunk-MNAXYY3R.js +215 -0
  417. package/dist/chunk-NN62JQLR.js +29 -0
  418. package/dist/chunk-NPZY6YYL.js +251 -0
  419. package/dist/chunk-NTRZGNEX.js +529 -0
  420. package/dist/chunk-O6232G37.js +273 -0
  421. package/dist/chunk-O67VF5MS.js +58 -0
  422. package/dist/chunk-ODEQTPFM.js +6 -0
  423. package/dist/chunk-PNFASD6F.js +98 -0
  424. package/dist/chunk-PQADV6P6.js +19 -0
  425. package/dist/chunk-PZSWF74H.js +15 -0
  426. package/dist/chunk-Q4ZPPART.js +26 -0
  427. package/dist/chunk-QNCVHRZL.js +17 -0
  428. package/dist/chunk-QVE4GJAT.js +15 -0
  429. package/dist/chunk-QYOFACSP.js +36 -0
  430. package/dist/chunk-RA2ULG6H.js +29 -0
  431. package/dist/chunk-RDGD7Z7I.js +350 -0
  432. package/dist/chunk-RK4XPHVG.js +16 -0
  433. package/dist/chunk-RSAQOKH3.js +38 -0
  434. package/dist/chunk-S2XHHEW4.js +84 -0
  435. package/dist/chunk-S4GZWSKR.js +137 -0
  436. package/dist/chunk-SFZOKW2G.js +52 -0
  437. package/dist/chunk-T7FKOJKW.js +221 -0
  438. package/dist/chunk-UG46QBLT.js +325 -0
  439. package/dist/chunk-UOGSZKLT.js +134 -0
  440. package/dist/chunk-V2XMNLMS.js +52 -0
  441. package/dist/chunk-V663QU4R.js +51 -0
  442. package/dist/chunk-W4ENKCXJ.js +40 -0
  443. package/dist/chunk-W5J7R5EB.js +107 -0
  444. package/dist/chunk-WNI2WSJF.js +27 -0
  445. package/dist/chunk-XDTYBF2F.js +36 -0
  446. package/dist/chunk-XN4JBAN3.js +32 -0
  447. package/dist/chunk-XV6WRMBC.js +211 -0
  448. package/dist/chunk-YLYOWZ4V.js +33 -0
  449. package/dist/chunk-YMWONFSI.js +170 -0
  450. package/dist/chunk-ZCR6YGQ4.js +1 -0
  451. package/dist/generated/index.d.ts +83 -0
  452. package/dist/generated/index.js +91 -0
  453. package/dist/index.d.ts +1 -1217
  454. package/dist/index.js +91 -4518
  455. package/dist/styles.css +14841 -4274
  456. package/dist/utils/cx.d.ts +10 -0
  457. package/dist/utils/headingLevel.d.ts +16 -0
  458. package/dist/utils/index.d.ts +6 -0
  459. package/dist/utils/index.js +4 -0
  460. package/dist/utils/tone.d.ts +25 -0
  461. package/dist/utils/useClipboard.d.ts +30 -0
  462. package/package.json +18 -10
  463. package/scripts/bundle-css.mjs +25 -0
  464. package/scripts/check-css-literals.mjs +166 -0
  465. package/scripts/check-css-variables.mjs +184 -0
  466. package/scripts/check-css.mjs +27 -0
  467. package/scripts/css-source.mjs +67 -0
  468. package/scripts/write-barrel.mjs +60 -0
  469. package/dist/Accordion-NIMJQIOI.css +0 -88
  470. package/dist/AppShell-ZW3NSFBP.css +0 -51
  471. package/dist/Avatar-V6NG6Q45.css +0 -67
  472. package/dist/Button-XGCTXXYP.css +0 -174
  473. package/dist/Callout-LEGDIMAM.css +0 -52
  474. package/dist/Card-BOZGBML7.css +0 -86
  475. package/dist/Checkbox-OCUICIIZ.css +0 -58
  476. package/dist/CodeBlock-IEMBNIQC.css +0 -90
  477. package/dist/Container-LTKBA2FW.css +0 -21
  478. package/dist/Copyable-IB57OTHZ.css +0 -123
  479. package/dist/DataTable-3GALZUW2.css +0 -1593
  480. package/dist/DateTimePicker-NMSSGVPK.css +0 -312
  481. package/dist/Eyebrow-AVBORAS2.css +0 -30
  482. package/dist/IconButton-GB4PJDG2.css +0 -82
  483. package/dist/ImageUpload-3HQDF2KC.css +0 -158
  484. package/dist/Input-ZHUTN7CU.css +0 -210
  485. package/dist/Kbd-Q77CDZY7.css +0 -23
  486. package/dist/Modal-FJVG66S4.css +0 -138
  487. package/dist/Popover-FUFULUE2.css +0 -123
  488. package/dist/PricingCard-NKYV3JHA.css +0 -238
  489. package/dist/Section-665ZIPG6.css +0 -20
  490. package/dist/Select-GPRF7PRB.css +0 -294
  491. package/dist/Skeleton-3WEFLRDN.css +0 -378
  492. package/dist/StatCard-RTJIVTRB.css +0 -50
  493. package/dist/Table-AR3TRY2E.css +0 -89
  494. package/dist/Tabs-XZ4JIH3E.css +0 -153
  495. package/dist/Tag-R5QDJLYJ.css +0 -163
  496. package/dist/TimeWindowPicker-L3G5Q7UT.css +0 -629
  497. package/dist/Toaster-2O65VOR4.css +0 -264
package/dist/index.d.ts CHANGED
@@ -1,1217 +1 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as react from 'react';
3
- import { HTMLAttributes, ReactNode, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, LabelHTMLAttributes, ReactElement, CSSProperties } from 'react';
4
-
5
- type AccordionType = 'single' | 'multiple';
6
- interface AccordionProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
7
- /** 'single' opens one item at a time; 'multiple' allows many. Defaults to 'single'. */
8
- type?: AccordionType;
9
- /** For type="single": allow closing the open item by activating it again. Defaults to true. */
10
- collapsible?: boolean;
11
- /** Uncontrolled initial open item(s). */
12
- defaultValue?: string | string[];
13
- /** Controlled open item(s). */
14
- value?: string | string[];
15
- onValueChange?: (value: string | string[]) => void;
16
- }
17
- interface AccordionItemProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
18
- /** Stable identifier for this item, used to track its open state. */
19
- value: string;
20
- /** The always-visible header content. */
21
- title: ReactNode;
22
- disabled?: boolean;
23
- }
24
- declare const AccordionItem: ({ value, title, disabled, className, children, ...rest }: AccordionItemProps) => react_jsx_runtime.JSX.Element;
25
- declare const Accordion: (({ type, collapsible, defaultValue, value, onValueChange, className, children, ...rest }: AccordionProps) => react_jsx_runtime.JSX.Element) & {
26
- Item: ({ value, title, disabled, className, children, ...rest }: AccordionItemProps) => react_jsx_runtime.JSX.Element;
27
- };
28
-
29
- interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
30
- /**
31
- * Sidebar slot. Rendered first; the slot's own CSS (typically
32
- * `position: fixed; left: 0; top: 0; width: 280px`) drives its
33
- * placement. AppShell reserves the matching horizontal gutter on
34
- * the content column via `sidebarWidth`.
35
- */
36
- sidebar?: ReactNode;
37
- /**
38
- * Top bar slot. Rendered next; the slot's own CSS (typically
39
- * `position: fixed; top: 0; left: 280px; right: 0`) drives its
40
- * placement. AppShell reserves the matching vertical gutter on
41
- * the content column via `topbarHeight`.
42
- */
43
- topbar?: ReactNode;
44
- /** Footer slot. Rendered at the bottom of the content column. */
45
- footer?: ReactNode;
46
- /** Main scrollable content. */
47
- children?: ReactNode;
48
- /**
49
- * Width reserved for a fixed-position sidebar, in pixels. The
50
- * content column's left margin is set to this value. Defaults
51
- * to 280, wide enough for a labelled navigation rail.
52
- */
53
- sidebarWidth?: number;
54
- /**
55
- * Height reserved for a fixed-position topbar, in pixels. The
56
- * content column's top padding is set to this value. Defaults
57
- * to 64, a single-row topbar.
58
- */
59
- topbarHeight?: number;
60
- }
61
- /**
62
- * AppShell composes the three permanent regions of a console app.
63
- *
64
- * Layout pattern:
65
- * - Sidebar is rendered as the first child; its own CSS is
66
- * responsible for positioning (typically `position: fixed`).
67
- * - Topbar is rendered second; same deal.
68
- * - The Main + Footer column receives `margin-left` and
69
- * `padding-top` set to the sidebar width and topbar height,
70
- * reserving the gutters the fixed slots overlay.
71
- *
72
- * This passive composition means an existing app can drop its
73
- * already-positioned Sidebar / Header into the slots without
74
- * changing the Sidebar / Header CSS one line. Future apps that
75
- * prefer flex/grid composition can build their own shell on top
76
- * of the same slot props.
77
- */
78
- declare const AppShell: ({ sidebar, topbar, footer, children, sidebarWidth, topbarHeight, className, style, ...rest }: AppShellProps) => react_jsx_runtime.JSX.Element;
79
-
80
- type AvatarShape = 'circle' | 'square';
81
- interface AvatarProps extends HTMLAttributes<HTMLElement> {
82
- /** Image source. When set, the avatar renders the image; otherwise it falls back to initials. */
83
- src?: string | undefined;
84
- /** Display name used for the initials fallback and the image alt text. */
85
- name?: string | undefined;
86
- /** Rendered width and height in pixels. */
87
- size?: number | undefined;
88
- /** Outline shape: "circle" for a round badge, "square" for rounded corners. Defaults to "circle". */
89
- shape?: AvatarShape | undefined;
90
- /**
91
- * Optional identity seed for the initials fallback. When set (and no image
92
- * is shown), the badge background is a stable colour hashed from this value
93
- * instead of the plain brand accent, so each identity keeps a distinct,
94
- * consistent colour. Has no effect when an image renders.
95
- */
96
- colorSeed?: string | undefined;
97
- }
98
- /**
99
- * Derive up to two uppercase initials from a name. Uses the first letter of
100
- * the first two words (for example "Carlos Diaz" becomes "CD", "Acme" becomes
101
- * "A"). Returns "?" when no usable name is provided.
102
- */
103
- declare const getInitials: (name?: string) => string;
104
- /**
105
- * Avatar, a round identity badge. Renders the supplied image cropped to a
106
- * circle, or an initials fallback derived from the name when no image is set.
107
- * If the image fails to load (for example a stale CDN URL), it degrades to the
108
- * initials fallback.
109
- */
110
- declare const Avatar: ({ src, name, size, shape, colorSeed, className, style, ...rest }: AvatarProps) => react_jsx_runtime.JSX.Element;
111
-
112
- type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'tertiary' | 'accent' | 'danger';
113
- type ButtonSize = 'small' | 'medium' | 'large';
114
- type ButtonShape = 'square' | 'pill';
115
- interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
116
- variant?: ButtonVariant;
117
- size?: ButtonSize;
118
- shape?: ButtonShape;
119
- leadingIcon?: ReactNode;
120
- /**
121
- * When true, render the single child element with the Button's styling
122
- * merged onto it instead of rendering a native <button>. Used to apply
123
- * Button styling to a <Link> or <a> while keeping their routing or
124
- * navigation semantics. Mirrors the Radix `asChild` API.
125
- */
126
- asChild?: boolean;
127
- /**
128
- * When true, replace the leading icon with a spinner and disable the
129
- * button. The label stays put, so a button does not change width or
130
- * lose its meaning mid-action.
131
- *
132
- * Ignored with `asChild`: a link has no pending state to show and
133
- * cannot be disabled.
134
- */
135
- loading?: boolean;
136
- }
137
- declare const Button: ({ variant, size, shape, leadingIcon, className, type, asChild, loading, disabled, children, ...rest }: ButtonProps) => react_jsx_runtime.JSX.Element;
138
-
139
- type CalloutVariant = 'info' | 'success' | 'warning' | 'danger';
140
- interface CalloutProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
141
- variant?: CalloutVariant;
142
- /** Optional bold lead-in rendered before the message. */
143
- title?: ReactNode;
144
- /** Optional leading icon (Material symbol, Icon, or any node). */
145
- icon?: ReactNode;
146
- }
147
- /**
148
- * Callout, an inline status banner for page-level feedback: an
149
- * unreachable backend, a permission gate, a destructive-action
150
- * warning. Sits in the content flow (unlike Toaster, which is for
151
- * transient notifications) and stays until the condition clears.
152
- */
153
- declare const Callout: ({ variant, title, icon, className, children, ...rest }: CalloutProps) => react_jsx_runtime.JSX.Element;
154
-
155
- type CardVariant = 'default' | 'elevated' | 'outlined' | 'subtle';
156
- type CardPadding = 'sm' | 'md' | 'lg';
157
- interface CardProps extends HTMLAttributes<HTMLDivElement> {
158
- variant?: CardVariant;
159
- /** Inner padding preset applied to the root surface (not header/body/footer slots). */
160
- padding?: CardPadding;
161
- /** Render as an interactive surface (hover state, pointer cursor, focus ring). */
162
- interactive?: boolean;
163
- }
164
- interface CardSectionProps extends HTMLAttributes<HTMLDivElement> {
165
- /** Optional padding override; defaults to inherit the Card's surface padding. */
166
- padding?: CardPadding;
167
- }
168
- interface CardTitleProps extends HTMLAttributes<HTMLHeadingElement> {
169
- as?: 'h2' | 'h3' | 'h4';
170
- }
171
- declare const Card: (({ variant, padding, interactive, className, children, ...rest }: CardProps) => react_jsx_runtime.JSX.Element) & {
172
- Header: ({ className, children, ...rest }: CardSectionProps) => react_jsx_runtime.JSX.Element;
173
- Body: ({ className, children, ...rest }: CardSectionProps) => react_jsx_runtime.JSX.Element;
174
- Footer: ({ className, children, ...rest }: CardSectionProps) => react_jsx_runtime.JSX.Element;
175
- Title: ({ as: As, className, children, ...rest }: CardTitleProps) => react_jsx_runtime.JSX.Element;
176
- Description: ({ className, children, ...rest }: HTMLAttributes<HTMLParagraphElement>) => react_jsx_runtime.JSX.Element;
177
- };
178
-
179
- interface CodeBlockProps {
180
- /** The code to display and copy. Trailing newline is trimmed. */
181
- code: string;
182
- /** Language label shown in the header when no filename is given (also set as a data attribute). */
183
- language?: string;
184
- /** Optional filename shown on the left of the header. */
185
- filename?: string;
186
- showLineNumbers?: boolean;
187
- /** Render the copy control. Defaults to true. */
188
- copyable?: boolean;
189
- /** Non-selectable per-line prompt prefix, e.g. "$" for shell commands. */
190
- prompt?: string;
191
- className?: string;
192
- }
193
- /**
194
- * CodeBlock, a monospace command or config block. Preserves whitespace,
195
- * scrolls horizontally rather than wrapping, and reuses Copyable for a
196
- * one-click copy of the full snippet.
197
- */
198
- declare const CodeBlock: ({ code, language, filename, showLineNumbers, copyable, prompt, className, }: CodeBlockProps) => react_jsx_runtime.JSX.Element;
199
-
200
- type ContainerSize = 'sm' | 'md' | 'lg' | 'xl';
201
- interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
202
- /** Max content width. sm 720, md 960, lg 1200, xl 1440 (px). */
203
- size?: ContainerSize;
204
- }
205
- /**
206
- * Container, the centered max-width wrapper that gives every page a
207
- * consistent measure and horizontal gutter. Pair with Section for the
208
- * vertical rhythm.
209
- */
210
- declare const Container: ({ size, className, children, ...rest }: ContainerProps) => react_jsx_runtime.JSX.Element;
211
-
212
- type CopyableVariant = 'chip' | 'inline' | 'block';
213
- interface CopyableProps {
214
- value: string | number | null | undefined;
215
- display?: string;
216
- variant?: CopyableVariant;
217
- monospace?: boolean;
218
- truncate?: boolean;
219
- truncateLength?: number;
220
- ariaLabel?: string;
221
- className?: string;
222
- }
223
- declare const Copyable: ({ value, display, variant, monospace, truncate, truncateLength, ariaLabel, className, }: CopyableProps) => react_jsx_runtime.JSX.Element | null;
224
-
225
- /**
226
- * DataTable, a feature-rich table primitive with two visual variants
227
- * (default and compact) sharing one data, sort, pagination and
228
- * persistence model.
229
- *
230
- * FEATURES:
231
- * - Resizable columns (drag column edges)
232
- * - Sortable columns (click headers)
233
- * - Column reordering (drag & drop in settings)
234
- * - Show/hide columns
235
- * - Customizable items per page
236
- * - localStorage persistence of all settings
237
- * - Custom cell rendering
238
- * - Row actions
239
- * - Responsive design
240
- * - Light/dark theme support
241
- *
242
- * BASIC USAGE:
243
- *
244
- * const columns = {
245
- * name: { label: 'Name', defaultWidth: 150 },
246
- * email: { label: 'Email', defaultWidth: 200 },
247
- * role: { label: 'Role', defaultWidth: 120 }
248
- * };
249
- *
250
- * <DataTable
251
- * data={users}
252
- * columns={columns}
253
- * storageKey="userTable"
254
- * onRowAction={(row) => handleDelete(row)}
255
- * getRowKey={(row) => row.id}
256
- * />
257
- *
258
- * CUSTOM RENDERING:
259
- *
260
- * const columns = {
261
- * status: {
262
- * label: 'Status',
263
- * render: (row, value) => (
264
- * <span style={{ color: value === 'active' ? 'green' : 'red' }}>
265
- * {value}
266
- * </span>
267
- * )
268
- * }
269
- * };
270
- *
271
- * @param {Object} props - Component properties
272
- * @param {Array} props.data - Array of data objects to display
273
- * @param {Object} props.columns - Column configuration
274
- * Each key is a column ID, value is an object with:
275
- * - label: string (required) - Display name
276
- * - render: function(row, value) - Custom render function
277
- * - sortable: boolean - Enable sorting (default: true)
278
- * - defaultVisible: boolean - Initially visible (default: true)
279
- * - defaultWidth: number - Width in pixels (default: 120)
280
- * @param {string} props.storageKey - Unique key for localStorage (required for persistence)
281
- * @param {Array} props.defaultColumnOrder - Initial column order (default: Object.keys(columns))
282
- * @param {number} props.defaultItemsPerPage - Initial items per page (default: 10)
283
- * @param {Array} props.itemsPerPageOptions - Available page size options (default: [5,10,20,50,100])
284
- * @param {function} props.onRowAction - Callback for action button (receives row data)
285
- * @param {string} props.actionLabel - Action button tooltip (default: 'Delete')
286
- * @param {string} props.actionIcon - Material icon name (default: 'delete')
287
- * @param {function} props.getRowKey - Get unique row identifier (default: row => row.id)
288
- * @param {string} props.emptyMessage - No data message (default: 'No data available')
289
- * @param {boolean} props.showActions - Show action column (default: true)
290
- * @param {string} props.className - Additional CSS class
291
- */
292
- interface DataTableColumn {
293
- label: ReactNode;
294
- render?: (row: any, value: any) => ReactNode;
295
- sortable?: boolean;
296
- defaultVisible?: boolean;
297
- defaultWidth?: number;
298
- /** Override the value used when sorting this column (defaults to row[key]). */
299
- sortValue?: (row: any) => any;
300
- /**
301
- * Cell alignment. Mostly used in the compact variant for numeric columns
302
- * that should hug the right edge.
303
- */
304
- align?: 'left' | 'right' | 'center';
305
- /**
306
- * Monospace cell content at a smaller font, suitable for opaque ids,
307
- * timestamps, and similar fixed-pitch values. Compact variant only.
308
- */
309
- mono?: boolean;
310
- /**
311
- * When true, the cell value is wrapped in a hover-revealed copy
312
- * affordance. The clipboard value defaults to String(row[key]) but
313
- * can be overridden via copyValue. Compact variant only.
314
- */
315
- copyable?: boolean;
316
- copyValue?: (row: any) => any;
317
- /**
318
- * Fixed pixel-or-string width applied directly to the <th>/<td>. A
319
- * column with `width` is locked at exactly that width; `defaultWidth`
320
- * is a starting width that resizing and the fit-to-container pass can
321
- * change.
322
- */
323
- width?: string | number;
324
- /**
325
- * Pin the column to the right edge of the scroll container so it
326
- * stays visible regardless of horizontal scroll or how the operator
327
- * resizes the surrounding data columns. Typical use is a trailing
328
- * row-action link or affordance that must always be reachable
329
- * without scrolling. Compact variant only; the default variant
330
- * already uses fixed widths that do not overflow.
331
- */
332
- sticky?: 'right';
333
- }
334
- interface DataTableSortState {
335
- key: string;
336
- direction: 'asc' | 'desc';
337
- }
338
- /**
339
- * Single action shown in the row-actions kebab menu. `rowActions` returns
340
- * a list of these per row; falsy entries are dropped, so a caller can
341
- * include an action conditionally with `condition && { ... }`.
342
- */
343
- interface DataTableRowAction {
344
- label: string;
345
- onClick?: () => void;
346
- icon?: string;
347
- variant?: 'default' | 'primary' | 'danger';
348
- disabled?: boolean;
349
- visible?: boolean;
350
- description?: string;
351
- divider?: 'before' | 'after';
352
- }
353
- type DataTableVariant = 'default' | 'compact';
354
- /**
355
- * Row density for the compact variant. The two presets cover the two
356
- * places a compact table usually sits:
357
- *
358
- * - 'compact' 13px font, 10/12px padding. For full-width list
359
- * pages where density matters more than air.
360
- * - 'comfortable' 14px font, 12/14px padding with extra outer
361
- * 24px on first/last cells. For tables inside a
362
- * section card, where the rows have to align with
363
- * the card's 24px inner padding.
364
- *
365
- * Has no effect on variant="default" since the default variant uses
366
- * its own resizable column widths.
367
- */
368
- type DataTableDensity = 'compact' | 'comfortable';
369
- interface DataTableProps {
370
- data?: any[];
371
- columns?: Record<string, DataTableColumn>;
372
- storageKey?: string;
373
- defaultColumnOrder?: string[] | null;
374
- defaultItemsPerPage?: number;
375
- itemsPerPageOptions?: number[];
376
- /**
377
- * Minimum column width, in pixels, that the resize handle will
378
- * honor. Operators can drag a column down to this width but no
379
- * further; trying to shrink past it pins the column at the floor.
380
- * Default 80px, which keeps short labels and the sort indicator
381
- * legible without being chatty.
382
- */
383
- minColumnWidth?: number;
384
- /**
385
- * Enable the per-column drag-to-resize handle on every header.
386
- * Defaults to true. Set to false on tables whose width should be
387
- * controlled entirely by the fit-to-container pass (read-mostly
388
- * lists, single-purpose tables that should not invite the
389
- * operator to reflow the row). When off, no resize handles
390
- * render anywhere on the table.
391
- */
392
- resizable?: boolean;
393
- onRowAction?: ((row: any) => void) | null;
394
- actionLabel?: string;
395
- actionIcon?: string;
396
- getRowKey?: (row: any) => string | number;
397
- /** Pulls the row key from a fixed property (alternative to getRowKey). */
398
- rowKey?: string;
399
- emptyMessage?: ReactNode;
400
- showActions?: boolean;
401
- className?: string;
402
- /**
403
- * Visual treatment.
404
- * - 'default': roomier cells with the settings cog in the Actions
405
- * column header; suited to directory-style tables an operator
406
- * reshapes and revisits.
407
- * - 'compact': lighter chrome, tight padding, uppercase headers,
408
- * full-row loading and error states, and the settings cog in the
409
- * toolbar instead of the header row. Designed for dense list pages
410
- * where the table sits inside an external Toolbar + Footer.
411
- * Both variants honour `resizable` and `settingsVariant`.
412
- */
413
- variant?: DataTableVariant;
414
- /**
415
- * Row density for the compact variant. Defaults to 'compact'.
416
- * See the DataTableDensity docs for what each preset paints.
417
- */
418
- density?: DataTableDensity;
419
- /**
420
- * Controlled sort state. When provided, the table delegates sort to
421
- * the caller (typical pairing: an external sort menu shares state
422
- * with the column headers). When omitted, sort is internal.
423
- */
424
- sort?: DataTableSortState | null;
425
- onSortChange?: (next: DataTableSortState | null) => void;
426
- /**
427
- * Multi-action menu per row. When supplied, an actions column is
428
- * appended on the right that renders a kebab popover. Takes precedence
429
- * over onRowAction (the single-button affordance).
430
- */
431
- rowActions?: (row: any) => Array<DataTableRowAction | null | undefined | false>;
432
- /** Dim rows the predicate marks as archived, with a left edge accent. */
433
- archivedPredicate?: (row: any) => boolean;
434
- archivedLabel?: string;
435
- /**
436
- * Skeleton loading state. While true and no rows are present, the
437
- * body renders shimmer bars inside the real table structure (one
438
- * bar per visible column) so column alignment, paddings, and row
439
- * heights match the data that replaces them, no layout shift when
440
- * the fetch lands. Tables that already have rows keep showing them
441
- * during a refresh.
442
- */
443
- loading?: boolean;
444
- /** Number of shimmer rows painted while loading. Default 5. */
445
- skeletonRows?: number;
446
- /** Renders a single full-row error message when truthy. Wins over empty. */
447
- error?: ReactNode;
448
- /** When false, skip the built-in items-per-page slicing (caller paginates). */
449
- paginated?: boolean;
450
- /** When false, the settings cog and Actions column header are suppressed. */
451
- showSettings?: boolean;
452
- /**
453
- * Fires when a row's surface is clicked. Used by click-to-detail tables
454
- * (an order row opening its detail page, a log entry opening a drawer).
455
- * The compact variant also flips the row's cursor to pointer when this
456
- * prop is supplied. The row-actions kebab menu stops propagation so
457
- * clicking the kebab does not also trigger the row navigation.
458
- */
459
- onRowClick?: (row: any) => void;
460
- /**
461
- * Optional secondary row rendered immediately below each main row,
462
- * spanning the full column width. Returning null skips it for that
463
- * row. Used by tree-like tables (for example API keys grouped under
464
- * their owner) where each entity owns an attached detail strip that
465
- * visually belongs to the main row but does not share its column
466
- * layout.
467
- */
468
- renderAccessoryRow?: (row: any) => ReactNode | null | undefined;
469
- /**
470
- * Slot rendered above the table header (and inside the same root
471
- * wrapper) for filter bars, search inputs, or batch-action toolbars.
472
- * uilet is intentionally agnostic about what goes here, the caller
473
- * composes whichever primitives match its domain (Select, Input,
474
- * datetime-local, etc.). The slot is rendered exactly once per
475
- * mount, regardless of pagination state.
476
- */
477
- renderToolbar?: ReactNode;
478
- /**
479
- * Clear-filters affordance for tables whose renderToolbar slot
480
- * carries filter controls. When onClearFilters is supplied and
481
- * filtersActive is true, a "Clear filters" link button renders at
482
- * the end of the filter slot; clicking it fires the callback so
483
- * the caller resets its own filter state. The button stays hidden
484
- * while filtersActive is false so an untouched toolbar carries no
485
- * dead control.
486
- */
487
- onClearFilters?: () => void;
488
- filtersActive?: boolean;
489
- /** Label override for the clear-filters button. */
490
- clearFiltersLabel?: string;
491
- /**
492
- * When supplied, each row becomes expandable. Clicking the row (or
493
- * its built-in chevron) toggles a detail panel rendered immediately
494
- * below the row, spanning the full column width. Returning null
495
- * from the function suppresses expansion for that row.
496
- *
497
- * Mutually exclusive with onRowClick (expansion takes the click);
498
- * combine with rowActions freely since the kebab stops propagation.
499
- * Single-row expansion only, opening one row closes the previous.
500
- */
501
- renderExpandedRow?: (row: any) => ReactNode | null | undefined;
502
- /** Optional initial expanded row key (resolved via the row-key resolver). */
503
- defaultExpandedKey?: string | number | null;
504
- /**
505
- * Cursor-pagination footer. When hasMore is true, the table renders
506
- * a centered "Load more" button below the rows that fires onLoadMore.
507
- * The button is disabled while loadingMore is true (label flips to
508
- * "Loading…"). When hasMore is false, no footer is rendered; the
509
- * terminal "End of feed" state is intentionally silent.
510
- *
511
- * Independent from the built-in client-side paginated prop: cursor
512
- * pagination is server-driven (caller fetches and appends rows),
513
- * client pagination slices a fully loaded dataset.
514
- */
515
- hasMore?: boolean;
516
- onLoadMore?: () => void;
517
- loadingMore?: boolean;
518
- loadMoreLabel?: string;
519
- /**
520
- * Optional table header rendered above the toolbar. The title is the
521
- * section name (e.g. "Projects"), the description is a one-line
522
- * explanation of what the rows represent, and icon is an optional
523
- * Material Symbols glyph name rendered to the left of the title
524
- * (the same icon, title and description header a settings card uses). Folding
525
- * them into the table primitive lets the entire surface, header +
526
- * toolbar + table, share the same card boundary and spacing without
527
- * each caller recomposing the `<header><h2/><p/></header>` pattern.
528
- *
529
- * When a header is present, the table's right-side controls
530
- * (pagination chevrons + settings cog) move ONTO the header row so
531
- * the section title and the controls share the same line. The
532
- * caller-supplied filter slot (renderToolbar) renders on its own
533
- * row below the header.
534
- */
535
- title?: ReactNode;
536
- description?: ReactNode;
537
- icon?: string;
538
- /**
539
- * Settings modal shape.
540
- * - 'compact': page-size radio list + Wrap lines toggle, Cancel/Confirm
541
- * footer. Right for the card-style tables that carry their own
542
- * title + description in the header (clean surface, no filter row).
543
- * - 'rich': items-per-page chip row + drag-to-reorder column list +
544
- * per-column visibility checkboxes. Right for tables that surface
545
- * filters in a toolbar and benefit from operator-driven layout
546
- * customisation (activity feeds, audit trails, access token lists).
547
- *
548
- * Default: when title / description / icon is set, the table uses
549
- * the compact modal (card-style); otherwise the rich modal. Pass an
550
- * explicit prop to override.
551
- */
552
- settingsVariant?: 'compact' | 'rich';
553
- /**
554
- * Initial value for the Wrap lines toggle (compact settings only).
555
- * When true, cells wrap their content with overflow-wrap: anywhere.
556
- * When false, cells stay on a single line and truncate with an
557
- * ellipsis. Persisted under `${storageKey}_wrapLines` when a
558
- * storageKey is provided.
559
- */
560
- defaultWrapLines?: boolean;
561
- }
562
- declare const DataTable: ({ data, columns, storageKey, defaultColumnOrder, defaultItemsPerPage, minColumnWidth, resizable, itemsPerPageOptions, onRowAction, actionLabel, actionIcon, getRowKey, rowKey, emptyMessage, showActions, className, variant, density, sort: sortProp, onSortChange, rowActions, archivedPredicate, archivedLabel, loading, skeletonRows, error, paginated, showSettings, onRowClick, renderAccessoryRow, renderToolbar, onClearFilters, filtersActive, clearFiltersLabel, renderExpandedRow, defaultExpandedKey, hasMore, onLoadMore, loadingMore, loadMoreLabel, title, description, icon, settingsVariant, defaultWrapLines, }: DataTableProps) => react_jsx_runtime.JSX.Element;
563
-
564
- interface CopyableCellProps {
565
- value: string | number | null | undefined;
566
- children?: ReactNode;
567
- ariaLabel?: string;
568
- }
569
- declare const CopyableCell: ({ value, children, ariaLabel }: CopyableCellProps) => react_jsx_runtime.JSX.Element;
570
-
571
- interface DateTimePickerProps {
572
- /** YYYY-MM-DDTHH:MM (matches <input type="datetime-local">). Empty string when unset. */
573
- value: string;
574
- onChange: (value: string) => void;
575
- placeholder?: string;
576
- /** Show the hour / minute inputs below the calendar. Defaults to true. */
577
- showTime?: boolean;
578
- /** Inclusive lower bound for selectable days, as a YYYY-MM-DD or full datetime-local string. */
579
- minDate?: string;
580
- /** Inclusive upper bound for selectable days. */
581
- maxDate?: string;
582
- /**
583
- * First day of the week in the calendar grid. 0 = Sunday (US default),
584
- * 1 = Monday (ISO 8601). Defaults to 0.
585
- */
586
- firstDayOfWeek?: 0 | 1;
587
- ariaLabel?: string;
588
- className?: string;
589
- disabled?: boolean;
590
- size?: 'sm' | 'md';
591
- }
592
- declare function DateTimePicker({ value, onChange, placeholder, showTime, minDate, maxDate, firstDayOfWeek, ariaLabel, className, disabled, size, }: DateTimePickerProps): react_jsx_runtime.JSX.Element;
593
-
594
- type EyebrowVariant = 'muted' | 'accent' | 'gradient';
595
- type EyebrowElement = 'span' | 'div' | 'p';
596
- interface EyebrowProps extends HTMLAttributes<HTMLElement> {
597
- /** Element to render. Defaults to an inline span. */
598
- as?: EyebrowElement;
599
- variant?: EyebrowVariant;
600
- }
601
- /**
602
- * Eyebrow (kicker), the small uppercase label that sits above a section
603
- * title to name the section. Monospace and tracked-out by default so it
604
- * reads as metadata rather than a heading.
605
- */
606
- declare const Eyebrow: ({ as: As, variant, className, children, ...rest }: EyebrowProps) => react_jsx_runtime.JSX.Element;
607
-
608
- type IconButtonSize = 'sm' | 'md';
609
- type IconButtonVariant = 'ghost' | 'ghost-brand' | 'ghost-danger' | 'soft-brand';
610
- interface IconButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
611
- size?: IconButtonSize;
612
- variant?: IconButtonVariant;
613
- /**
614
- * Required: icon-only buttons have no visible text label, so screen
615
- * readers need the aria-label to know what the button does.
616
- */
617
- 'aria-label': string;
618
- /**
619
- * Radix-style asChild: render the single child element with IconButton
620
- * classes merged in rather than wrapping in a native <button>. Useful
621
- * when the underlying control must be a <Link> or <a>.
622
- */
623
- asChild?: boolean;
624
- children?: ReactNode;
625
- }
626
- /**
627
- * IconButton: small square icon-only affordance. Distinct from
628
- * <Button> (the text-CTA primitive); IconButton has no label slot,
629
- * fixed-square dimensions (22 or 28 px), and is sized for a single
630
- * Material Symbol or equivalent inline SVG inside.
631
- *
632
- * Typical use: row-action gears, copy icons, drag handles, the
633
- * inline "+" / "×" affordances next to form labels.
634
- */
635
- declare const IconButton: ({ size, variant, className, type, asChild, children, ...rest }: IconButtonProps) => react_jsx_runtime.JSX.Element;
636
-
637
- interface ImageUploadProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> {
638
- /** Current image source. When set, the control shows the image and the overlay label reads "Change". */
639
- src?: string | undefined;
640
- /** Display name used for the initials fallback when no image is set. */
641
- name?: string | undefined;
642
- /** Rendered width and height in pixels. */
643
- size?: number | undefined;
644
- /** Outline shape passed through to the preview and fallback. Defaults to "circle". */
645
- shape?: AvatarShape | undefined;
646
- /** When true, the control is display only: no overlay, no remove button, no file picker. */
647
- readOnly?: boolean | undefined;
648
- /** When true, the control shows a spinner and ignores interaction while an upload is in flight. */
649
- uploading?: boolean | undefined;
650
- /** Accepted file types for the hidden file input. Defaults to "image/*". */
651
- accept?: string | undefined;
652
- /** Called with the raw selected File. The upload happens over the network, so no client-side encoding is performed. */
653
- onSelect: (file: File) => void;
654
- /** Called when the remove button is pressed. The button only renders when an image is set and the control is editable. */
655
- onRemove?: (() => void) | undefined;
656
- }
657
- /**
658
- * ImageUpload, a click-to-upload affordance built on top of Avatar. Shows the
659
- * current image (or an initials fallback), an overlay with a camera icon and
660
- * an "Upload" or "Change" label (shown on hover, or always while no image is
661
- * set), a hidden file input, a remove button, and an uploading state. One
662
- * primitive covers both square logos and round profile pictures.
663
- *
664
- * The selection callback hands back the raw File rather than a data URL because
665
- * the upload now happens over the network.
666
- */
667
- declare const ImageUpload: ({ src, name, size, shape, readOnly, uploading, accept, onSelect, onRemove, className, style, ...rest }: ImageUploadProps) => react_jsx_runtime.JSX.Element;
668
-
669
- interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
670
- /** The label beside the box. Always present: a checkbox without one
671
- * is only meaningful to somebody who can see what it sits next to. */
672
- label: ReactNode;
673
- /** A second line under the label, for the consequence of ticking it. */
674
- description?: ReactNode;
675
- /** Marks the choice as one that destroys something. */
676
- tone?: 'default' | 'danger';
677
- }
678
- declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLInputElement>>;
679
-
680
- type InputSize = 'sm' | 'md';
681
- interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
682
- inputSize?: InputSize;
683
- error?: boolean;
684
- containerClassName?: string;
685
- /**
686
- * Content drawn inside the field at its right edge, such as a keycap
687
- * hinting that Enter adds the value. It does not take the pointer, so a
688
- * click on it still focuses the field.
689
- */
690
- trailing?: ReactNode;
691
- }
692
- declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
693
-
694
- interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
695
- error?: boolean;
696
- /**
697
- * When true, the textarea height tracks its content. The element's
698
- * `overflow` is hidden and the `rows` attribute is ignored.
699
- */
700
- autoResize?: boolean;
701
- /**
702
- * Content drawn inside the field at its top right, such as a keycap
703
- * hinting that Enter adds the value. It does not take the pointer.
704
- */
705
- trailing?: ReactNode;
706
- }
707
- declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
708
-
709
- interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {
710
- required?: boolean | undefined;
711
- /** Optional action node (button, link) rendered inline next to the label text. */
712
- action?: ReactNode;
713
- }
714
- declare const Label: ({ required, action, className, children, ...rest }: LabelProps) => react_jsx_runtime.JSX.Element;
715
-
716
- interface FormFieldProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
717
- label?: ReactNode;
718
- required?: boolean;
719
- helper?: ReactNode;
720
- error?: ReactNode;
721
- /** Optional element rendered next to the label (e.g. an "Add" button). */
722
- labelAction?: ReactNode;
723
- /**
724
- * Provide the rendered control as a function so FormField can pipe the
725
- * generated id down to the control's `id` (and label's `htmlFor`) without
726
- * the caller hand-wiring them.
727
- */
728
- children: ((ctx: {
729
- id: string;
730
- describedBy: string | undefined;
731
- }) => ReactNode) | ReactNode;
732
- htmlFor?: string;
733
- }
734
- declare const FormField: ({ label, required, helper, error, labelAction, htmlFor, className, children, ...rest }: FormFieldProps) => react_jsx_runtime.JSX.Element;
735
-
736
- interface FormRowProps extends HTMLAttributes<HTMLDivElement> {
737
- /** Number of columns at desktop width. Collapses to 1 on small screens. */
738
- columns?: 1 | 2 | 3;
739
- }
740
- declare const FormRow: ({ columns, className, children, ...rest }: FormRowProps) => react_jsx_runtime.JSX.Element;
741
-
742
- interface KbdProps extends HTMLAttributes<HTMLElement> {
743
- /** Draws the keycap quieter, for a hint that sits inside a field. */
744
- subtle?: boolean | undefined;
745
- }
746
- /**
747
- * Kbd, a keyboard key drawn as a keycap. Used for shortcut hints and, inside
748
- * a field's trailing slot, to tell the operator that a key does something
749
- * here: "Enter" beside a field that adds a value to a list, for example.
750
- */
751
- declare const Kbd: ({ subtle, className, children, ...rest }: KbdProps) => react_jsx_runtime.JSX.Element;
752
-
753
- type ModalSize = 'sm' | 'md' | 'lg' | 'xl';
754
- interface ModalProps {
755
- /** Controls visibility. When false the modal renders nothing. */
756
- open: boolean;
757
- /** Called when the user requests to close (backdrop click, escape, or X). */
758
- onClose: () => void;
759
- /** Title shown in the header. */
760
- title?: ReactNode;
761
- /** Optional subtitle line beneath the title. */
762
- subtitle?: ReactNode;
763
- /** Footer content (typically Cancel / Confirm buttons). */
764
- footer?: ReactNode;
765
- /** Body content. */
766
- children?: ReactNode;
767
- /** Max-width preset. Defaults to `sm` (480px). */
768
- size?: ModalSize;
769
- /** When true (default), clicking the backdrop closes the modal. */
770
- closeOnBackdrop?: boolean;
771
- /** When false, the close X is hidden. */
772
- showCloseButton?: boolean;
773
- /** Extra class on the dialog frame. */
774
- className?: string;
775
- /** ID hooks for label / description (aria-labelledby / aria-describedby). */
776
- labelledBy?: string;
777
- describedBy?: string;
778
- }
779
- declare const Modal: ({ open, onClose, title, subtitle, footer, children, size, closeOnBackdrop, showCloseButton, className, labelledBy, describedBy, }: ModalProps) => react.ReactPortal | null;
780
-
781
- interface ConfirmModalProps {
782
- open: boolean;
783
- onClose: () => void;
784
- onConfirm: () => void | Promise<void>;
785
- title: ReactNode;
786
- message?: ReactNode;
787
- /** Body content shown below the message (extra context, fields, etc.). */
788
- children?: ReactNode;
789
- confirmLabel?: ReactNode;
790
- cancelLabel?: ReactNode;
791
- /** When true, the confirm button uses the danger variant. */
792
- destructive?: boolean;
793
- confirmVariant?: ButtonVariant;
794
- /** Disables the confirm button (e.g. while typing a confirmation phrase). */
795
- confirmDisabled?: boolean;
796
- /** Replaces the confirm label with a loading affordance and disables the modal. */
797
- submitting?: boolean;
798
- size?: ModalSize;
799
- }
800
- declare const ConfirmModal: ({ open, onClose, onConfirm, title, message, children, confirmLabel, cancelLabel, destructive, confirmVariant, confirmDisabled, submitting, size, }: ConfirmModalProps) => react_jsx_runtime.JSX.Element;
801
-
802
- type PopoverAlign = 'start' | 'end';
803
- type PopoverSide = 'top' | 'bottom';
804
- type PopoverWidth = 'auto' | 'match';
805
- interface PopoverProps {
806
- trigger: (open: boolean, toggle: () => void) => ReactElement;
807
- children: ReactNode | ((close: () => void) => ReactNode);
808
- align?: PopoverAlign;
809
- side?: PopoverSide;
810
- width?: PopoverWidth;
811
- className?: string;
812
- defaultOpen?: boolean;
813
- onOpenChange?: (open: boolean) => void;
814
- }
815
- declare function Popover({ trigger, children, align, side, width, className, defaultOpen, onOpenChange, }: PopoverProps): react_jsx_runtime.JSX.Element;
816
-
817
- type PricingCardTagVariant = 'neutral' | 'top' | 'save' | 'pending';
818
- /**
819
- * PricingCard is the canonical plan-tier card surface. It owns the
820
- * outer container (the selected, pending, unavailable and disabled
821
- * states, plus the interactive hover), and exposes compound parts
822
- * (`PricingCard.Header / Name / Tag / Price / Amount / Cadence /
823
- * PriceNote / Body / Footer`) so the caller composes the content.
824
- *
825
- * The card renders as a `<button>` by default so the entire surface
826
- * is clickable in a picker context. Pass `interactive={false}` for
827
- * a static display card (a pricing comparison) and the surface
828
- * renders as a `<div>` instead.
829
- */
830
- interface PricingCardProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'> {
831
- selected?: boolean;
832
- pending?: boolean;
833
- /**
834
- * Soft-disabled: the option is shown but cannot be chosen right now.
835
- * Click is suppressed and the interactive card is announced as
836
- * disabled through `aria-disabled` while staying focusable, so a
837
- * keyboard or screen reader user can still reach it and read why.
838
- * State that reason in the card content, since the dimmed surface
839
- * alone does not explain it.
840
- */
841
- unavailable?: boolean;
842
- /** Hard disabled. Click is suppressed. */
843
- disabled?: boolean;
844
- /** When false (default true), render a `<div>` instead of a `<button>`. */
845
- interactive?: boolean;
846
- }
847
- interface PricingCardRootProps extends PricingCardProps {
848
- children?: ReactNode;
849
- }
850
- interface TagProps$1 extends HTMLAttributes<HTMLSpanElement> {
851
- variant?: PricingCardTagVariant;
852
- }
853
- interface AmountProps extends HTMLAttributes<HTMLSpanElement> {
854
- /** Strikethrough; used to show the pre-discount price. */
855
- strike?: boolean;
856
- /** Highlighted with the discounted accent colour. */
857
- discounted?: boolean;
858
- }
859
- declare const PricingCard: react.ForwardRefExoticComponent<PricingCardRootProps & react.RefAttributes<HTMLButtonElement>> & {
860
- Header: ({ className, children, ...rest }: HTMLAttributes<HTMLDivElement>) => react_jsx_runtime.JSX.Element;
861
- Name: ({ className, children, ...rest }: HTMLAttributes<HTMLSpanElement>) => react_jsx_runtime.JSX.Element;
862
- Tag: ({ variant, className, children, ...rest }: TagProps$1) => react_jsx_runtime.JSX.Element;
863
- Price: ({ className, children, ...rest }: HTMLAttributes<HTMLDivElement>) => react_jsx_runtime.JSX.Element;
864
- Amount: ({ strike, discounted, className, children, ...rest }: AmountProps) => react_jsx_runtime.JSX.Element;
865
- Cadence: ({ className, children, ...rest }: HTMLAttributes<HTMLSpanElement>) => react_jsx_runtime.JSX.Element;
866
- PriceNote: ({ className, children, ...rest }: HTMLAttributes<HTMLSpanElement>) => react_jsx_runtime.JSX.Element;
867
- Body: ({ className, children, ...rest }: HTMLAttributes<HTMLDivElement>) => react_jsx_runtime.JSX.Element;
868
- Footer: ({ className, children, ...rest }: HTMLAttributes<HTMLDivElement>) => react_jsx_runtime.JSX.Element;
869
- Grid: ({ className, children, ...rest }: HTMLAttributes<HTMLDivElement>) => react_jsx_runtime.JSX.Element;
870
- };
871
-
872
- type SectionSpacing = 'none' | 'sm' | 'md' | 'lg';
873
- type SectionElement = 'section' | 'div' | 'header' | 'footer' | 'article';
874
- interface SectionProps extends HTMLAttributes<HTMLElement> {
875
- as?: SectionElement;
876
- /** Vertical padding preset. Defaults to md. */
877
- spacing?: SectionSpacing;
878
- }
879
- /**
880
- * Section, a semantic band with token-driven vertical rhythm. It owns the
881
- * spacing between page sections; pair with Container for the horizontal
882
- * measure. It deliberately ships no scroll-reveal, so consumers keep that
883
- * behavior local.
884
- */
885
- declare const Section: ({ as: As, spacing, className, children, ...rest }: SectionProps) => react_jsx_runtime.JSX.Element;
886
-
887
- type SelectValue = string | number;
888
- interface SelectOption {
889
- value: SelectValue;
890
- label: ReactNode;
891
- description?: ReactNode;
892
- disabled?: boolean;
893
- }
894
- type SelectSize = 'sm' | 'md';
895
- type SelectAlign = 'left' | 'right';
896
- interface SelectProps {
897
- id?: string;
898
- /**
899
- * Currently selected value(s). In single-select mode this is the
900
- * option's primitive value; in multi-select mode (multiple={true})
901
- * it is an array of selected values.
902
- */
903
- value: SelectValue | SelectValue[] | undefined;
904
- /**
905
- * Fired when the user picks (single-select) or toggles (multi-
906
- * select) an option. The first argument carries the new resolved
907
- * value: a scalar in single-select, an array in multi-select. The
908
- * second argument is the option the user clicked, useful when the
909
- * caller wants to log which one toggled.
910
- */
911
- onChange?: (value: SelectValue | SelectValue[], option: SelectOption) => void;
912
- options: SelectOption[];
913
- placeholder?: string;
914
- disabled?: boolean;
915
- className?: string;
916
- menuClassName?: string;
917
- size?: SelectSize;
918
- align?: SelectAlign;
919
- renderTrigger?: (option: SelectOption | null, ctx: {
920
- open: boolean;
921
- }) => ReactNode;
922
- renderOption?: (option: SelectOption, ctx: {
923
- active: boolean;
924
- selected: boolean;
925
- }) => ReactNode;
926
- ariaLabel?: string;
927
- name?: string;
928
- searchable?: boolean;
929
- searchPlaceholder?: string;
930
- /**
931
- * When true, the Select renders as a multi-select. The menu does
932
- * not close on pick; the trigger shows the selected count (or the
933
- * single label when only one is picked); the option list paints
934
- * checked boxes on selected rows. value MUST be an array in this
935
- * mode and onChange always receives an array.
936
- */
937
- multiple?: boolean;
938
- /**
939
- * Trigger-label override for multi-select. Receives the array of
940
- * selected options. Defaults to the count rule below:
941
- * - 0 selected: placeholder
942
- * - 1 selected: the option's label
943
- * - N selected: "N selected"
944
- */
945
- renderMultiLabel?: (selected: SelectOption[]) => ReactNode;
946
- }
947
- declare function Select({ id, value, onChange, options, placeholder, disabled, className, menuClassName, size, align, renderTrigger, renderOption, ariaLabel, name, searchable, searchPlaceholder, multiple, renderMultiLabel, }: SelectProps): react_jsx_runtime.JSX.Element;
948
-
949
- type SkeletonVariant = 'box' | 'text' | 'card' | 'grid' | 'list' | 'table' | 'info-grid' | 'pricing-card';
950
- type SkeletonGlow = 'blue' | 'green' | 'purple' | 'orange' | 'red';
951
- interface SkeletonProps {
952
- variant?: SkeletonVariant;
953
- /** Row count for `text`, `grid`, `list`, `table` and `info-grid`. */
954
- rows?: number;
955
- /** Column count for `table`, and for `grid` and `info-grid` (1 to 4). */
956
- columns?: number;
957
- /** Card count for `pricing-card`. */
958
- count?: number;
959
- /** Applied to the root element of every variant. */
960
- className?: string;
961
- /** Applied to the root element of every variant. */
962
- style?: CSSProperties;
963
- width?: number | string;
964
- height?: number | string;
965
- borderRadius?: number;
966
- marginTop?: number;
967
- marginBottom?: number;
968
- glowColor?: SkeletonGlow;
969
- animationDuration?: number;
970
- }
971
- /**
972
- * Loading placeholder. Every variant renders one root element carrying
973
- * `crewlet-skeleton`, a `crewlet-skeleton--<variant>` modifier, and the
974
- * caller's `className` and `style`. The placeholder is decorative, so it
975
- * is hidden from assistive technology; announce the loading state on the
976
- * region that is loading (for example with `aria-busy`).
977
- */
978
- declare const Skeleton: ({ variant, rows, columns, count, className, style, width, height, borderRadius, marginTop, marginBottom, glowColor, animationDuration, }: SkeletonProps) => react_jsx_runtime.JSX.Element;
979
-
980
- type StatCardTone = 'neutral' | 'brand' | 'success' | 'warning' | 'danger' | 'info';
981
- interface StatCardProps extends HTMLAttributes<HTMLDivElement> {
982
- /** Metric label, for example "Total Tokens". */
983
- label: ReactNode;
984
- /** The headline value, already formatted by the caller. */
985
- value: ReactNode;
986
- /** Optional secondary line under the label, for example "3 working, 4 idle". */
987
- sub?: ReactNode;
988
- /** Optional leading icon (Material symbol, Icon, or any node). */
989
- icon?: ReactNode;
990
- /** Tints the icon and value accent. Defaults to neutral. */
991
- tone?: StatCardTone;
992
- /** Renders a loading placeholder instead of the value. */
993
- loading?: boolean;
994
- }
995
- /**
996
- * StatCard, a compact key-metric tile for dashboards and rollup
997
- * headers: one value, one label, an optional sub-line and icon.
998
- */
999
- declare const StatCard: ({ label, value, sub, icon, tone, loading, className, ...rest }: StatCardProps) => react_jsx_runtime.JSX.Element;
1000
-
1001
- /**
1002
- * Reusable Table Component
1003
- *
1004
- * @param {Array<string>} headers - Array of column header names
1005
- * @param {Array<Array<string|ReactNode>>} data - 2D array of table data. Each row is an array of cell values
1006
- * @param {string} emptyMessage - Message to display when data is empty (default: "No data available")
1007
- * @param {Object} actionButton - Optional action button config with { label: string, onClick: function }
1008
- * @param {string} className - Additional CSS classes to apply to the wrapper
1009
- *
1010
- * @example
1011
- * <Table
1012
- * headers={['Name', 'Email', 'Role']}
1013
- * data={[
1014
- * ['John Doe', 'john@example.com', 'Admin'],
1015
- * ['Jane Smith', 'jane@example.com', 'User']
1016
- * ]}
1017
- * emptyMessage="No users found"
1018
- * actionButton={{
1019
- * label: 'View all users →',
1020
- * onClick: () => navigate('/users')
1021
- * }}
1022
- * />
1023
- */
1024
- interface TableActionButton {
1025
- label: ReactNode;
1026
- onClick: () => void;
1027
- }
1028
- interface TableProps {
1029
- headers: ReactNode[];
1030
- data: ReactNode[][];
1031
- emptyMessage?: ReactNode;
1032
- actionButton?: TableActionButton;
1033
- className?: string;
1034
- }
1035
- declare const Table: ({ headers, data, emptyMessage, actionButton, className, }: TableProps) => react_jsx_runtime.JSX.Element;
1036
-
1037
- type TabsVariant = 'pill' | 'underline';
1038
- type TabsSize = 'sm' | 'md';
1039
- interface TabsItem {
1040
- /** Stable identity used to compute the active class. */
1041
- value: string;
1042
- /** Visible label text or node. */
1043
- label: ReactNode;
1044
- /** Optional Material Symbols icon name. */
1045
- icon?: string;
1046
- disabled?: boolean;
1047
- /** Any extra props the consumer's renderItem needs to read. */
1048
- [key: string]: unknown;
1049
- }
1050
- interface TabsRenderItemProps {
1051
- item: TabsItem;
1052
- /**
1053
- * Base + state-modifier class for the tab. Apply this to the
1054
- * element you render so the variant chrome stays consistent.
1055
- * Already includes the is-active modifier when value + onValueChange
1056
- * are wired; in router mode the consumer appends its own is-active
1057
- * (NavLink's isActive callback) since URL-driven activeness is the
1058
- * source of truth and the primitive re-measures from whichever
1059
- * child carries .is-active.
1060
- */
1061
- className: string;
1062
- /** True when `value === item.value`. */
1063
- isActive: boolean;
1064
- /** Calls onValueChange?.(item.value) when invoked. */
1065
- onSelect: () => void;
1066
- /** Pre-rendered icon + label nodes for the tab body. */
1067
- children: ReactNode;
1068
- }
1069
- interface TabsProps {
1070
- items: TabsItem[];
1071
- variant?: TabsVariant;
1072
- size?: TabsSize;
1073
- /** Aria-label on the nav element wrapping the strip. */
1074
- ariaLabel?: string;
1075
- className?: string;
1076
- /** Currently active item value (controlled mode). */
1077
- value?: string;
1078
- /** Fires when a button-rendered tab is clicked. */
1079
- onValueChange?: (value: string) => void;
1080
- /**
1081
- * Override the per-item element renderer. Receives the item, the
1082
- * resolved className, an isActive flag, an onSelect handler, and
1083
- * the icon + label children. Useful for plugging in a router
1084
- * link (NavLink, Next.js Link) so navigation stays client-side.
1085
- */
1086
- renderItem?: (props: TabsRenderItemProps) => ReactNode;
1087
- }
1088
- declare function Tabs({ items, variant, size, ariaLabel, className, value, onValueChange, renderItem, }: TabsProps): react_jsx_runtime.JSX.Element;
1089
-
1090
- type TimeWindowMode = 'relative' | 'absolute';
1091
- type TimeWindowTimezone = 'local' | 'utc';
1092
- interface TimeWindowValue {
1093
- kind: TimeWindowMode;
1094
- /** Duration string for relative mode, e.g. '7d', '24h', '15m'. */
1095
- duration?: string;
1096
- /** Datetime-local string for absolute mode (YYYY-MM-DDTHH:MM:SS). */
1097
- from?: string;
1098
- to?: string;
1099
- /**
1100
- * How to interpret the absolute from/to strings when resolving
1101
- * to ISO 8601: 'local' (default) treats them as the operator's
1102
- * wall clock; 'utc' treats them as already-UTC. The selection
1103
- * persists with the value so a saved window round-trips cleanly.
1104
- */
1105
- timezone?: TimeWindowTimezone;
1106
- }
1107
- interface TimeWindowPickerProps {
1108
- value: TimeWindowValue;
1109
- onChange: (value: TimeWindowValue) => void;
1110
- /** Suppress the Relative tab. Defaults to true (shown). */
1111
- allowRelative?: boolean;
1112
- /** Suppress the Absolute tab. Defaults to true (shown). */
1113
- allowAbsolute?: boolean;
1114
- placeholder?: string;
1115
- ariaLabel?: string;
1116
- className?: string;
1117
- disabled?: boolean;
1118
- size?: 'sm' | 'md';
1119
- }
1120
- declare function parseTimeWindowDuration(s: string): number;
1121
- declare function resolveTimeWindow(value: TimeWindowValue): {
1122
- from: string | undefined;
1123
- to: string | undefined;
1124
- };
1125
- declare function TimeWindowPicker({ value, onChange, allowRelative, allowAbsolute, placeholder, ariaLabel, className, disabled, size, }: TimeWindowPickerProps): react_jsx_runtime.JSX.Element;
1126
-
1127
- type TagVariant = 'neutral' | 'info' | 'success' | 'warn' | 'danger' | 'brand';
1128
- type TagSize = 'sm' | 'md';
1129
- interface TagProps extends HTMLAttributes<HTMLSpanElement> {
1130
- variant?: TagVariant;
1131
- size?: TagSize;
1132
- /** Optional leading icon (Material symbol, Icon, or any node). */
1133
- leadingIcon?: ReactNode;
1134
- /** When set, renders a close button that fires this on click. Turns the Tag into a Chip. */
1135
- onRemove?: (() => void) | undefined;
1136
- /** ARIA label for the remove button. Defaults to "Remove tag". */
1137
- removeAriaLabel?: string;
1138
- /** Force a monospace font, for machine values such as IP addresses and CIDR ranges. */
1139
- monospace?: boolean;
1140
- }
1141
- declare const Tag: ({ variant, size, leadingIcon, onRemove, removeAriaLabel, monospace, className, children, ...rest }: TagProps) => react_jsx_runtime.JSX.Element;
1142
-
1143
- interface TagsInputProps {
1144
- /** Current list of tag values. */
1145
- value: string[];
1146
- /** Called with the next list when add / remove fires. */
1147
- onChange: (next: string[]) => void;
1148
- placeholder?: string;
1149
- /** Variant applied to each rendered Tag. */
1150
- tagVariant?: TagVariant;
1151
- /** Monospace flag forwarded to each Tag, for machine values such as IP addresses and CIDR ranges. */
1152
- monospace?: boolean;
1153
- /** Keys that submit the current input as a new tag. Defaults to Enter and comma. */
1154
- submitKeys?: string[];
1155
- /** Disable input + remove buttons. */
1156
- disabled?: boolean;
1157
- className?: string;
1158
- /** id forwarded to the underlying input (handy for `<label htmlFor>`). */
1159
- id?: string;
1160
- /** Reject duplicate values (case-insensitive). Defaults to true. */
1161
- dedupe?: boolean;
1162
- }
1163
- interface TagsInputHandle {
1164
- focus: () => void;
1165
- }
1166
- declare const TagsInput: react.ForwardRefExoticComponent<TagsInputProps & react.RefAttributes<TagsInputHandle>>;
1167
-
1168
- type ToastVariant = 'info' | 'success' | 'warn' | 'error';
1169
- interface ToastAction {
1170
- label: ReactNode;
1171
- onClick?: () => void;
1172
- href?: string;
1173
- /** Open external href in a new tab. */
1174
- external?: boolean;
1175
- }
1176
- interface Toast<TVariant extends string = string> {
1177
- /** Stable id used by the consumer to map dismiss requests. */
1178
- id: string | number;
1179
- /**
1180
- * Variant drives the icon and colour family. `info`, `success`, `warn` and
1181
- * `error` come with a default icon (and, except for `info`, a default
1182
- * title). Any other string, including `'quota'`, has no default icon or
1183
- * title, so pass `icon` and `title`, or `renderBody`. `'quota'` (a usage
1184
- * limit notice) is announced as an alert like `error`, and paints the icon
1185
- * the caller passes with the brand accent.
1186
- */
1187
- variant?: TVariant;
1188
- title?: ReactNode;
1189
- message?: ReactNode;
1190
- /** Milliseconds before auto-dismiss. 0 (or undefined → 0) means sticky. */
1191
- duration?: number;
1192
- /** Bump on dedup-replace to restart the progress bar animation. */
1193
- version?: number;
1194
- /** Standard inline action button. Can also be passed as a full ReactNode for full control. */
1195
- action?: ToastAction | ReactNode;
1196
- /** Optional icon name (Material symbol) or full ReactNode to override the variant icon. */
1197
- icon?: ReactNode;
1198
- /** Replace the standard body with a custom renderer, for a toast shape the standard layout does not cover (for example a limit notice with its own action). */
1199
- renderBody?: (ctx: {
1200
- onDismiss: () => void;
1201
- toast: Toast<TVariant>;
1202
- }) => ReactNode;
1203
- }
1204
- interface ToasterProps<TVariant extends string = string> {
1205
- toasts: Toast<TVariant>[];
1206
- onDismiss: (id: string | number) => void;
1207
- /** Override how an action with `href` renders, for apps that need a router-aware Link. */
1208
- renderAction?: (action: ToastAction, ctx: {
1209
- onDismiss: () => void;
1210
- }) => ReactNode;
1211
- /** Override the visible position. Defaults to bottom-right. */
1212
- position?: 'bottom-right' | 'top-right' | 'bottom-left' | 'top-left';
1213
- className?: string;
1214
- }
1215
- declare const Toaster: <TVariant extends string = string>({ toasts, onDismiss, renderAction, position, className, }: ToasterProps<TVariant>) => react_jsx_runtime.JSX.Element | null;
1216
-
1217
- export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, type AccordionType, AppShell, type AppShellProps, Avatar, type AvatarProps, type AvatarShape, Button, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonVariant, Callout, type CalloutProps, type CalloutVariant, Card, type CardPadding, type CardProps, type CardSectionProps, type CardTitleProps, type CardVariant, Checkbox, type CheckboxProps, CodeBlock, type CodeBlockProps, ConfirmModal, type ConfirmModalProps, Container, type ContainerProps, type ContainerSize, Copyable, CopyableCell, type CopyableCellProps, type CopyableProps, type CopyableVariant, DataTable, type DataTableColumn, type DataTableDensity, type DataTableProps, type DataTableRowAction, type DataTableSortState, type DataTableVariant, DateTimePicker, type DateTimePickerProps, Eyebrow, type EyebrowElement, type EyebrowProps, type EyebrowVariant, FormField, type FormFieldProps, FormRow, type FormRowProps, IconButton, type IconButtonProps, type IconButtonSize, type IconButtonVariant, ImageUpload, type ImageUploadProps, Input, type InputProps, type InputSize, Kbd, type KbdProps, Label, type LabelProps, Modal, type ModalProps, type ModalSize, Popover, type PopoverAlign, type PopoverProps, type PopoverSide, type PopoverWidth, PricingCard, type PricingCardProps, type PricingCardTagVariant, Section, type SectionElement, type SectionProps, type SectionSpacing, Select, type SelectAlign, type SelectOption, type SelectProps, type SelectSize, type SelectValue, Skeleton, type SkeletonGlow, type SkeletonProps, type SkeletonVariant, StatCard, type StatCardProps, type StatCardTone, Table, type TableActionButton, type TableProps, Tabs, type TabsItem, type TabsProps, type TabsRenderItemProps, type TabsSize, type TabsVariant, Tag, type TagProps, type TagSize, type TagVariant, TagsInput, type TagsInputHandle, type TagsInputProps, Textarea, type TextareaProps, type TimeWindowMode, TimeWindowPicker, type TimeWindowPickerProps, type TimeWindowValue, type Toast, type ToastAction, type ToastVariant, Toaster, type ToasterProps, getInitials, parseTimeWindowDuration, resolveTimeWindow };
1
+ export * from './generated/index.js';