@shipfox/react-ui 0.15.0 → 0.17.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 (641) hide show
  1. package/dist/components/button-group/button-group.stories.js +4 -4
  2. package/dist/components/card/card.d.ts +24 -0
  3. package/dist/components/card/card.js +56 -0
  4. package/dist/components/card/card.stories.js +216 -0
  5. package/dist/components/card/index.d.ts +2 -0
  6. package/dist/components/card/index.js +3 -0
  7. package/dist/components/dashboard/components/charts/bar-chart.d.ts +30 -0
  8. package/dist/components/dashboard/components/charts/bar-chart.js +150 -0
  9. package/dist/components/dashboard/components/charts/bar-chart.stories.js +287 -0
  10. package/dist/components/dashboard/components/charts/chart-tooltip.d.ts +14 -0
  11. package/dist/components/dashboard/components/charts/chart-tooltip.js +46 -0
  12. package/dist/components/dashboard/components/charts/colors.d.ts +12 -0
  13. package/dist/components/dashboard/components/charts/colors.js +20 -0
  14. package/dist/components/dashboard/components/charts/index.d.ts +6 -0
  15. package/dist/components/dashboard/components/charts/index.js +7 -0
  16. package/dist/components/dashboard/components/charts/line-chart.d.ts +28 -0
  17. package/dist/components/dashboard/components/charts/line-chart.js +152 -0
  18. package/dist/components/dashboard/components/charts/line-chart.stories.js +257 -0
  19. package/dist/components/dashboard/components/charts/utils.d.ts +13 -0
  20. package/dist/components/dashboard/components/charts/utils.js +18 -0
  21. package/dist/components/dashboard/components/dashboard-alert.d.ts +8 -0
  22. package/dist/components/dashboard/components/dashboard-alert.js +24 -0
  23. package/dist/components/dashboard/components/kpi-card.d.ts +15 -0
  24. package/dist/components/dashboard/components/kpi-card.js +77 -0
  25. package/dist/components/dashboard/components/mobile-sidebar.d.ts +19 -0
  26. package/dist/components/dashboard/components/mobile-sidebar.js +50 -0
  27. package/dist/components/dashboard/components/organization-selector.d.ts +24 -1
  28. package/dist/components/dashboard/components/organization-selector.js +93 -70
  29. package/dist/components/dashboard/components/sidebar.d.ts +24 -0
  30. package/dist/components/dashboard/components/sidebar.js +218 -0
  31. package/dist/components/dashboard/context/dashboard-context.d.ts +70 -0
  32. package/dist/components/dashboard/context/dashboard-context.js +175 -0
  33. package/dist/components/dashboard/context/index.d.ts +8 -0
  34. package/dist/components/dashboard/context/index.js +6 -0
  35. package/dist/components/dashboard/context/types.d.ts +50 -0
  36. package/dist/components/dashboard/context/types.js +7 -0
  37. package/dist/components/dashboard/context/utils.d.ts +28 -0
  38. package/dist/components/dashboard/context/utils.js +53 -0
  39. package/dist/components/dashboard/dashboard.d.ts +27 -1
  40. package/dist/components/dashboard/dashboard.js +76 -36
  41. package/dist/components/dashboard/filters/expression-filter-bar.d.ts +42 -0
  42. package/dist/components/dashboard/filters/expression-filter-bar.js +80 -0
  43. package/dist/components/dashboard/filters/index.d.ts +6 -0
  44. package/dist/components/dashboard/filters/index.js +5 -0
  45. package/dist/components/dashboard/index.d.ts +25 -1
  46. package/dist/components/dashboard/index.js +22 -1
  47. package/dist/components/dashboard/pages/analytics-page.d.ts +20 -0
  48. package/dist/components/dashboard/pages/analytics-page.js +258 -0
  49. package/dist/components/dashboard/pages/index.d.ts +6 -0
  50. package/dist/components/dashboard/pages/index.js +6 -0
  51. package/dist/components/dashboard/pages/jobs-page.d.ts +20 -0
  52. package/dist/components/dashboard/pages/jobs-page.js +56 -0
  53. package/dist/components/dashboard/table/index.d.ts +6 -0
  54. package/dist/components/dashboard/table/index.js +5 -0
  55. package/dist/components/dashboard/table/table-wrapper.d.ts +104 -0
  56. package/dist/components/dashboard/table/table-wrapper.js +93 -0
  57. package/dist/components/dashboard/toolbar/filter-button.d.ts +12 -0
  58. package/dist/components/dashboard/toolbar/filter-button.js +124 -0
  59. package/dist/components/dashboard/toolbar/index.d.ts +13 -0
  60. package/dist/components/dashboard/toolbar/index.js +10 -0
  61. package/dist/components/dashboard/toolbar/page-toolbar.d.ts +75 -0
  62. package/dist/components/dashboard/toolbar/page-toolbar.js +208 -0
  63. package/dist/components/dashboard/toolbar/toolbar-actions.d.ts +52 -0
  64. package/dist/components/dashboard/toolbar/toolbar-actions.js +51 -0
  65. package/dist/components/dashboard/toolbar/toolbar-search.d.ts +21 -0
  66. package/dist/components/dashboard/toolbar/toolbar-search.js +123 -0
  67. package/dist/components/dashboard/toolbar/view-dropdown.d.ts +11 -0
  68. package/dist/components/dashboard/toolbar/view-dropdown.js +113 -0
  69. package/dist/components/empty-state/empty-state.d.ts +10 -0
  70. package/dist/components/empty-state/empty-state.js +40 -0
  71. package/dist/components/empty-state/empty-state.stories.js +74 -0
  72. package/dist/components/empty-state/index.d.ts +2 -0
  73. package/dist/components/empty-state/index.js +3 -0
  74. package/dist/components/index.d.ts +4 -0
  75. package/dist/components/index.js +4 -0
  76. package/dist/components/modal/modal.js +3 -3
  77. package/dist/components/search/search-inline.js +1 -1
  78. package/dist/components/search/search-modal.js +13 -7
  79. package/dist/components/select/select.d.ts +3 -1
  80. package/dist/components/select/select.js +2 -1
  81. package/dist/components/sheet/index.d.ts +2 -0
  82. package/dist/components/sheet/index.js +3 -0
  83. package/dist/components/sheet/sheet.d.ts +33 -0
  84. package/dist/components/sheet/sheet.js +163 -0
  85. package/dist/components/sheet/sheet.stories.js +368 -0
  86. package/dist/components/table/data-table.d.ts +19 -2
  87. package/dist/components/table/data-table.js +89 -72
  88. package/dist/components/table/table.js +1 -1
  89. package/dist/components/table/table.stories.components.js +6 -28
  90. package/dist/styles.css +1 -1
  91. package/package.json +12 -4
  92. package/.storybook/main.ts +0 -35
  93. package/.storybook/preview.tsx +0 -66
  94. package/.storybook/vitest.setup.ts +0 -4
  95. package/.turbo/turbo-build.log +0 -19
  96. package/.turbo/turbo-check.log +0 -6
  97. package/.turbo/turbo-type.log +0 -5
  98. package/CHANGELOG.md +0 -114
  99. package/argos.config.ts +0 -33
  100. package/dist/build-css-entry.js.map +0 -1
  101. package/dist/colors.stories.conts.d.ts.map +0 -1
  102. package/dist/colors.stories.conts.js.map +0 -1
  103. package/dist/colors.stories.js.map +0 -1
  104. package/dist/components/alert/alert.d.ts.map +0 -1
  105. package/dist/components/alert/alert.js.map +0 -1
  106. package/dist/components/alert/alert.stories.js.map +0 -1
  107. package/dist/components/alert/index.d.ts.map +0 -1
  108. package/dist/components/alert/index.js.map +0 -1
  109. package/dist/components/avatar/avatar-group.d.ts.map +0 -1
  110. package/dist/components/avatar/avatar-group.js.map +0 -1
  111. package/dist/components/avatar/avatar.d.ts.map +0 -1
  112. package/dist/components/avatar/avatar.js.map +0 -1
  113. package/dist/components/avatar/avatar.stories.js.map +0 -1
  114. package/dist/components/avatar/index.d.ts.map +0 -1
  115. package/dist/components/avatar/index.js.map +0 -1
  116. package/dist/components/badge/badge.d.ts.map +0 -1
  117. package/dist/components/badge/badge.js.map +0 -1
  118. package/dist/components/badge/badge.stories.js.map +0 -1
  119. package/dist/components/badge/icon-badge.d.ts.map +0 -1
  120. package/dist/components/badge/icon-badge.js.map +0 -1
  121. package/dist/components/badge/index.d.ts.map +0 -1
  122. package/dist/components/badge/index.js.map +0 -1
  123. package/dist/components/badge/status-badge.d.ts.map +0 -1
  124. package/dist/components/badge/status-badge.js.map +0 -1
  125. package/dist/components/badge/user-badge.d.ts.map +0 -1
  126. package/dist/components/badge/user-badge.js.map +0 -1
  127. package/dist/components/button/button-link.d.ts.map +0 -1
  128. package/dist/components/button/button-link.js.map +0 -1
  129. package/dist/components/button/button-link.stories.js.map +0 -1
  130. package/dist/components/button/button.d.ts.map +0 -1
  131. package/dist/components/button/button.js.map +0 -1
  132. package/dist/components/button/button.stories.js.map +0 -1
  133. package/dist/components/button/icon-button.d.ts.map +0 -1
  134. package/dist/components/button/icon-button.js.map +0 -1
  135. package/dist/components/button/icon-button.stories.js.map +0 -1
  136. package/dist/components/button/index.d.ts.map +0 -1
  137. package/dist/components/button/index.js.map +0 -1
  138. package/dist/components/button-group/button-group.d.ts.map +0 -1
  139. package/dist/components/button-group/button-group.js.map +0 -1
  140. package/dist/components/button-group/button-group.stories.js.map +0 -1
  141. package/dist/components/button-group/index.d.ts.map +0 -1
  142. package/dist/components/button-group/index.js.map +0 -1
  143. package/dist/components/calendar/calendar.d.ts.map +0 -1
  144. package/dist/components/calendar/calendar.js.map +0 -1
  145. package/dist/components/calendar/index.d.ts.map +0 -1
  146. package/dist/components/calendar/index.js.map +0 -1
  147. package/dist/components/checkbox/checkbox-label.d.ts.map +0 -1
  148. package/dist/components/checkbox/checkbox-label.js.map +0 -1
  149. package/dist/components/checkbox/checkbox-links.d.ts.map +0 -1
  150. package/dist/components/checkbox/checkbox-links.js.map +0 -1
  151. package/dist/components/checkbox/checkbox.d.ts.map +0 -1
  152. package/dist/components/checkbox/checkbox.js.map +0 -1
  153. package/dist/components/checkbox/checkbox.stories.js.map +0 -1
  154. package/dist/components/checkbox/index.d.ts.map +0 -1
  155. package/dist/components/checkbox/index.js.map +0 -1
  156. package/dist/components/code-block/code-block-footer.d.ts.map +0 -1
  157. package/dist/components/code-block/code-block-footer.js.map +0 -1
  158. package/dist/components/code-block/code-block.d.ts.map +0 -1
  159. package/dist/components/code-block/code-block.js.map +0 -1
  160. package/dist/components/code-block/code-block.stories.js.map +0 -1
  161. package/dist/components/code-block/code-content.d.ts.map +0 -1
  162. package/dist/components/code-block/code-content.js.map +0 -1
  163. package/dist/components/code-block/code-copy-button.d.ts.map +0 -1
  164. package/dist/components/code-block/code-copy-button.js.map +0 -1
  165. package/dist/components/code-block/code-tabs.d.ts.map +0 -1
  166. package/dist/components/code-block/code-tabs.js.map +0 -1
  167. package/dist/components/code-block/index.d.ts.map +0 -1
  168. package/dist/components/code-block/index.js.map +0 -1
  169. package/dist/components/command/command.d.ts.map +0 -1
  170. package/dist/components/command/command.js.map +0 -1
  171. package/dist/components/command/command.stories.js.map +0 -1
  172. package/dist/components/command/index.d.ts.map +0 -1
  173. package/dist/components/command/index.js.map +0 -1
  174. package/dist/components/confetti/confetti.d.ts.map +0 -1
  175. package/dist/components/confetti/confetti.js.map +0 -1
  176. package/dist/components/confetti/confetti.stories.js.map +0 -1
  177. package/dist/components/confetti/index.d.ts.map +0 -1
  178. package/dist/components/confetti/index.js.map +0 -1
  179. package/dist/components/dashboard/components/analytics-content.d.ts +0 -2
  180. package/dist/components/dashboard/components/analytics-content.d.ts.map +0 -1
  181. package/dist/components/dashboard/components/analytics-content.js +0 -180
  182. package/dist/components/dashboard/components/analytics-content.js.map +0 -1
  183. package/dist/components/dashboard/components/animated-logo.d.ts.map +0 -1
  184. package/dist/components/dashboard/components/animated-logo.js.map +0 -1
  185. package/dist/components/dashboard/components/complete-setup-button.d.ts.map +0 -1
  186. package/dist/components/dashboard/components/complete-setup-button.js.map +0 -1
  187. package/dist/components/dashboard/components/jobs-content.d.ts +0 -2
  188. package/dist/components/dashboard/components/jobs-content.d.ts.map +0 -1
  189. package/dist/components/dashboard/components/jobs-content.js +0 -69
  190. package/dist/components/dashboard/components/jobs-content.js.map +0 -1
  191. package/dist/components/dashboard/components/mobile-menu.d.ts.map +0 -1
  192. package/dist/components/dashboard/components/mobile-menu.js.map +0 -1
  193. package/dist/components/dashboard/components/organization-selector.d.ts.map +0 -1
  194. package/dist/components/dashboard/components/organization-selector.js.map +0 -1
  195. package/dist/components/dashboard/components/top-menu.d.ts.map +0 -1
  196. package/dist/components/dashboard/components/top-menu.js.map +0 -1
  197. package/dist/components/dashboard/components/topbar-button.d.ts.map +0 -1
  198. package/dist/components/dashboard/components/topbar-button.js.map +0 -1
  199. package/dist/components/dashboard/components/topbar.d.ts.map +0 -1
  200. package/dist/components/dashboard/components/topbar.js.map +0 -1
  201. package/dist/components/dashboard/components/user-profile.d.ts.map +0 -1
  202. package/dist/components/dashboard/components/user-profile.js.map +0 -1
  203. package/dist/components/dashboard/dashboard.d.ts.map +0 -1
  204. package/dist/components/dashboard/dashboard.js.map +0 -1
  205. package/dist/components/dashboard/dashboard.stories.js.map +0 -1
  206. package/dist/components/dashboard/index.d.ts.map +0 -1
  207. package/dist/components/dashboard/index.js.map +0 -1
  208. package/dist/components/date-picker/date-picker.d.ts.map +0 -1
  209. package/dist/components/date-picker/date-picker.js.map +0 -1
  210. package/dist/components/date-picker/date-picker.stories.js.map +0 -1
  211. package/dist/components/date-picker/index.d.ts.map +0 -1
  212. package/dist/components/date-picker/index.js.map +0 -1
  213. package/dist/components/date-time-range-picker/date-time-range-picker.d.ts.map +0 -1
  214. package/dist/components/date-time-range-picker/date-time-range-picker.js.map +0 -1
  215. package/dist/components/date-time-range-picker/index.d.ts.map +0 -1
  216. package/dist/components/date-time-range-picker/index.js.map +0 -1
  217. package/dist/components/dot-grid/dot-grid.d.ts.map +0 -1
  218. package/dist/components/dot-grid/dot-grid.js.map +0 -1
  219. package/dist/components/dot-grid/index.d.ts.map +0 -1
  220. package/dist/components/dot-grid/index.js.map +0 -1
  221. package/dist/components/dropdown-menu/dropdown-menu.d.ts.map +0 -1
  222. package/dist/components/dropdown-menu/dropdown-menu.js.map +0 -1
  223. package/dist/components/dropdown-menu/dropdown-menu.stories.js.map +0 -1
  224. package/dist/components/dropdown-menu/index.d.ts.map +0 -1
  225. package/dist/components/dropdown-menu/index.js.map +0 -1
  226. package/dist/components/dynamic-item/dynamic-item.d.ts.map +0 -1
  227. package/dist/components/dynamic-item/dynamic-item.js.map +0 -1
  228. package/dist/components/dynamic-item/dynamic-item.stories.js.map +0 -1
  229. package/dist/components/dynamic-item/index.d.ts.map +0 -1
  230. package/dist/components/dynamic-item/index.js.map +0 -1
  231. package/dist/components/form/form.d.ts.map +0 -1
  232. package/dist/components/form/form.js.map +0 -1
  233. package/dist/components/form/form.stories.js.map +0 -1
  234. package/dist/components/form/index.d.ts.map +0 -1
  235. package/dist/components/form/index.js.map +0 -1
  236. package/dist/components/icon/custom/badge.d.ts.map +0 -1
  237. package/dist/components/icon/custom/badge.js.map +0 -1
  238. package/dist/components/icon/custom/check-circle-solid.d.ts.map +0 -1
  239. package/dist/components/icon/custom/check-circle-solid.js.map +0 -1
  240. package/dist/components/icon/custom/circle-dotted-line.d.ts.map +0 -1
  241. package/dist/components/icon/custom/circle-dotted-line.js.map +0 -1
  242. package/dist/components/icon/custom/component-fill.d.ts.map +0 -1
  243. package/dist/components/icon/custom/component-fill.js.map +0 -1
  244. package/dist/components/icon/custom/component-line.d.ts.map +0 -1
  245. package/dist/components/icon/custom/component-line.js.map +0 -1
  246. package/dist/components/icon/custom/ellipse-mini-solid.d.ts.map +0 -1
  247. package/dist/components/icon/custom/ellipse-mini-solid.js.map +0 -1
  248. package/dist/components/icon/custom/index.d.ts.map +0 -1
  249. package/dist/components/icon/custom/index.js.map +0 -1
  250. package/dist/components/icon/custom/info-tooltip-fill.d.ts.map +0 -1
  251. package/dist/components/icon/custom/info-tooltip-fill.js.map +0 -1
  252. package/dist/components/icon/custom/resize.d.ts.map +0 -1
  253. package/dist/components/icon/custom/resize.js.map +0 -1
  254. package/dist/components/icon/custom/shipfox-logo.d.ts.map +0 -1
  255. package/dist/components/icon/custom/shipfox-logo.js.map +0 -1
  256. package/dist/components/icon/custom/slack-logo.d.ts.map +0 -1
  257. package/dist/components/icon/custom/slack-logo.js.map +0 -1
  258. package/dist/components/icon/custom/spinner.d.ts.map +0 -1
  259. package/dist/components/icon/custom/spinner.js.map +0 -1
  260. package/dist/components/icon/custom/stripe-logo.d.ts.map +0 -1
  261. package/dist/components/icon/custom/stripe-logo.js.map +0 -1
  262. package/dist/components/icon/custom/thunder.d.ts.map +0 -1
  263. package/dist/components/icon/custom/thunder.js.map +0 -1
  264. package/dist/components/icon/custom/x-circle-solid.d.ts.map +0 -1
  265. package/dist/components/icon/custom/x-circle-solid.js.map +0 -1
  266. package/dist/components/icon/icon.d.ts.map +0 -1
  267. package/dist/components/icon/icon.js.map +0 -1
  268. package/dist/components/icon/icon.stories.js.map +0 -1
  269. package/dist/components/icon/index.d.ts.map +0 -1
  270. package/dist/components/icon/index.js.map +0 -1
  271. package/dist/components/icon/remixicon-registry.d.ts.map +0 -1
  272. package/dist/components/icon/remixicon-registry.js.map +0 -1
  273. package/dist/components/index.d.ts.map +0 -1
  274. package/dist/components/index.js.map +0 -1
  275. package/dist/components/inline-tips/index.d.ts.map +0 -1
  276. package/dist/components/inline-tips/index.js.map +0 -1
  277. package/dist/components/inline-tips/inline-tips.d.ts.map +0 -1
  278. package/dist/components/inline-tips/inline-tips.js.map +0 -1
  279. package/dist/components/inline-tips/inline-tips.stories.js.map +0 -1
  280. package/dist/components/input/index.d.ts.map +0 -1
  281. package/dist/components/input/index.js.map +0 -1
  282. package/dist/components/input/input.d.ts.map +0 -1
  283. package/dist/components/input/input.js.map +0 -1
  284. package/dist/components/input/input.stories.js.map +0 -1
  285. package/dist/components/item/index.d.ts.map +0 -1
  286. package/dist/components/item/index.js.map +0 -1
  287. package/dist/components/item/item.d.ts.map +0 -1
  288. package/dist/components/item/item.js.map +0 -1
  289. package/dist/components/item/item.stories.js.map +0 -1
  290. package/dist/components/kbd/index.d.ts.map +0 -1
  291. package/dist/components/kbd/index.js.map +0 -1
  292. package/dist/components/kbd/kbd.d.ts.map +0 -1
  293. package/dist/components/kbd/kbd.js.map +0 -1
  294. package/dist/components/kbd/kbd.stories.js.map +0 -1
  295. package/dist/components/label/index.d.ts.map +0 -1
  296. package/dist/components/label/index.js.map +0 -1
  297. package/dist/components/label/label.d.ts.map +0 -1
  298. package/dist/components/label/label.js.map +0 -1
  299. package/dist/components/label/label.stories.js.map +0 -1
  300. package/dist/components/modal/index.d.ts.map +0 -1
  301. package/dist/components/modal/index.js.map +0 -1
  302. package/dist/components/modal/modal.d.ts.map +0 -1
  303. package/dist/components/modal/modal.js.map +0 -1
  304. package/dist/components/modal/modal.stories.js.map +0 -1
  305. package/dist/components/moving-border/index.d.ts.map +0 -1
  306. package/dist/components/moving-border/index.js.map +0 -1
  307. package/dist/components/moving-border/moving-border.d.ts.map +0 -1
  308. package/dist/components/moving-border/moving-border.js.map +0 -1
  309. package/dist/components/popover/index.d.ts.map +0 -1
  310. package/dist/components/popover/index.js.map +0 -1
  311. package/dist/components/popover/popover.d.ts.map +0 -1
  312. package/dist/components/popover/popover.js.map +0 -1
  313. package/dist/components/search/index.d.ts.map +0 -1
  314. package/dist/components/search/index.js.map +0 -1
  315. package/dist/components/search/search-context.d.ts.map +0 -1
  316. package/dist/components/search/search-context.js.map +0 -1
  317. package/dist/components/search/search-inline.d.ts.map +0 -1
  318. package/dist/components/search/search-inline.js.map +0 -1
  319. package/dist/components/search/search-modal.d.ts.map +0 -1
  320. package/dist/components/search/search-modal.js.map +0 -1
  321. package/dist/components/search/search-trigger.d.ts.map +0 -1
  322. package/dist/components/search/search-trigger.js.map +0 -1
  323. package/dist/components/search/search-variants.d.ts.map +0 -1
  324. package/dist/components/search/search-variants.js.map +0 -1
  325. package/dist/components/search/search.d.ts.map +0 -1
  326. package/dist/components/search/search.js.map +0 -1
  327. package/dist/components/search/search.stories.js.map +0 -1
  328. package/dist/components/select/index.d.ts.map +0 -1
  329. package/dist/components/select/index.js.map +0 -1
  330. package/dist/components/select/select.d.ts.map +0 -1
  331. package/dist/components/select/select.js.map +0 -1
  332. package/dist/components/select/select.stories.js.map +0 -1
  333. package/dist/components/shiny-text/index.d.ts.map +0 -1
  334. package/dist/components/shiny-text/index.js.map +0 -1
  335. package/dist/components/shiny-text/shiny-text.d.ts.map +0 -1
  336. package/dist/components/shiny-text/shiny-text.js.map +0 -1
  337. package/dist/components/skeleton/index.d.ts.map +0 -1
  338. package/dist/components/skeleton/index.js.map +0 -1
  339. package/dist/components/skeleton/skeleton.d.ts.map +0 -1
  340. package/dist/components/skeleton/skeleton.js.map +0 -1
  341. package/dist/components/skeleton/skeleton.stories.js.map +0 -1
  342. package/dist/components/table/data-table.d.ts.map +0 -1
  343. package/dist/components/table/data-table.js.map +0 -1
  344. package/dist/components/table/index.d.ts.map +0 -1
  345. package/dist/components/table/index.js.map +0 -1
  346. package/dist/components/table/table-column-header.d.ts.map +0 -1
  347. package/dist/components/table/table-column-header.js.map +0 -1
  348. package/dist/components/table/table-pagination.d.ts.map +0 -1
  349. package/dist/components/table/table-pagination.js.map +0 -1
  350. package/dist/components/table/table.d.ts.map +0 -1
  351. package/dist/components/table/table.js.map +0 -1
  352. package/dist/components/table/table.stories.columns.d.ts.map +0 -1
  353. package/dist/components/table/table.stories.columns.js.map +0 -1
  354. package/dist/components/table/table.stories.components.d.ts.map +0 -1
  355. package/dist/components/table/table.stories.components.js.map +0 -1
  356. package/dist/components/table/table.stories.data.d.ts.map +0 -1
  357. package/dist/components/table/table.stories.data.js.map +0 -1
  358. package/dist/components/table/table.stories.js.map +0 -1
  359. package/dist/components/tabs/index.d.ts.map +0 -1
  360. package/dist/components/tabs/index.js.map +0 -1
  361. package/dist/components/tabs/tabs.d.ts.map +0 -1
  362. package/dist/components/tabs/tabs.js.map +0 -1
  363. package/dist/components/tabs/tabs.stories.js.map +0 -1
  364. package/dist/components/textarea/index.d.ts.map +0 -1
  365. package/dist/components/textarea/index.js.map +0 -1
  366. package/dist/components/textarea/textarea.d.ts.map +0 -1
  367. package/dist/components/textarea/textarea.js.map +0 -1
  368. package/dist/components/textarea/textarea.stories.js.map +0 -1
  369. package/dist/components/theme/index.d.ts.map +0 -1
  370. package/dist/components/theme/index.js.map +0 -1
  371. package/dist/components/theme/theme-provider.d.ts.map +0 -1
  372. package/dist/components/theme/theme-provider.js.map +0 -1
  373. package/dist/components/toast/index.d.ts.map +0 -1
  374. package/dist/components/toast/index.js.map +0 -1
  375. package/dist/components/toast/toast-custom.d.ts.map +0 -1
  376. package/dist/components/toast/toast-custom.js.map +0 -1
  377. package/dist/components/toast/toast.d.ts.map +0 -1
  378. package/dist/components/toast/toast.js.map +0 -1
  379. package/dist/components/toast/toast.stories.js.map +0 -1
  380. package/dist/components/tooltip/index.d.ts.map +0 -1
  381. package/dist/components/tooltip/index.js.map +0 -1
  382. package/dist/components/tooltip/tooltip.d.ts.map +0 -1
  383. package/dist/components/tooltip/tooltip.js.map +0 -1
  384. package/dist/components/tooltip/tooltip.stories.js.map +0 -1
  385. package/dist/components/typography/code.d.ts.map +0 -1
  386. package/dist/components/typography/code.js.map +0 -1
  387. package/dist/components/typography/code.stories.js.map +0 -1
  388. package/dist/components/typography/header.d.ts.map +0 -1
  389. package/dist/components/typography/header.js.map +0 -1
  390. package/dist/components/typography/header.stories.js.map +0 -1
  391. package/dist/components/typography/index.d.ts.map +0 -1
  392. package/dist/components/typography/index.js.map +0 -1
  393. package/dist/components/typography/text.d.ts.map +0 -1
  394. package/dist/components/typography/text.js.map +0 -1
  395. package/dist/components/typography/text.stories.js.map +0 -1
  396. package/dist/hooks/index.d.ts.map +0 -1
  397. package/dist/hooks/index.js.map +0 -1
  398. package/dist/hooks/useCopy.d.ts.map +0 -1
  399. package/dist/hooks/useCopy.js.map +0 -1
  400. package/dist/hooks/useCopyToClipboard.d.ts.map +0 -1
  401. package/dist/hooks/useCopyToClipboard.js.map +0 -1
  402. package/dist/hooks/useMediaQuery.d.ts.map +0 -1
  403. package/dist/hooks/useMediaQuery.js.map +0 -1
  404. package/dist/hooks/useResolvedTheme.d.ts.map +0 -1
  405. package/dist/hooks/useResolvedTheme.js.map +0 -1
  406. package/dist/hooks/useShikiHighlight.d.ts.map +0 -1
  407. package/dist/hooks/useShikiHighlight.js.map +0 -1
  408. package/dist/hooks/useShikiStyleInjection.d.ts.map +0 -1
  409. package/dist/hooks/useShikiStyleInjection.js.map +0 -1
  410. package/dist/hooks/useTheme.d.ts.map +0 -1
  411. package/dist/hooks/useTheme.js.map +0 -1
  412. package/dist/index.d.ts.map +0 -1
  413. package/dist/index.js.map +0 -1
  414. package/dist/onboarding/sign-in.stories.js.map +0 -1
  415. package/dist/state/theme.d.ts.map +0 -1
  416. package/dist/state/theme.js.map +0 -1
  417. package/dist/utils/avatar.d.ts.map +0 -1
  418. package/dist/utils/avatar.js.map +0 -1
  419. package/dist/utils/clipboard.d.ts.map +0 -1
  420. package/dist/utils/clipboard.js.map +0 -1
  421. package/dist/utils/cn.d.ts.map +0 -1
  422. package/dist/utils/cn.js.map +0 -1
  423. package/dist/utils/date.d.ts.map +0 -1
  424. package/dist/utils/date.js.map +0 -1
  425. package/dist/utils/debounce.d.ts.map +0 -1
  426. package/dist/utils/debounce.js.map +0 -1
  427. package/dist/utils/format/chart.d.ts.map +0 -1
  428. package/dist/utils/format/chart.js.map +0 -1
  429. package/dist/utils/format/date.d.ts.map +0 -1
  430. package/dist/utils/format/date.js.map +0 -1
  431. package/dist/utils/format/duration.d.ts.map +0 -1
  432. package/dist/utils/format/duration.js.map +0 -1
  433. package/dist/utils/format/index.d.ts.map +0 -1
  434. package/dist/utils/format/index.js.map +0 -1
  435. package/dist/utils/format/number.d.ts.map +0 -1
  436. package/dist/utils/format/number.js.map +0 -1
  437. package/dist/utils/index.d.ts.map +0 -1
  438. package/dist/utils/index.js.map +0 -1
  439. package/index.css +0 -1018
  440. package/src/assets/illustration-1.svg +0 -92
  441. package/src/assets/illustration-2.svg +0 -14
  442. package/src/assets/illustration-gradient.svg +0 -7049
  443. package/src/build-css-entry.ts +0 -3
  444. package/src/colors.stories.conts.ts +0 -164
  445. package/src/colors.stories.tsx +0 -66
  446. package/src/components/alert/alert.stories.tsx +0 -178
  447. package/src/components/alert/alert.tsx +0 -291
  448. package/src/components/alert/index.ts +0 -1
  449. package/src/components/avatar/avatar-group.tsx +0 -186
  450. package/src/components/avatar/avatar.stories.tsx +0 -179
  451. package/src/components/avatar/avatar.tsx +0 -219
  452. package/src/components/avatar/index.ts +0 -2
  453. package/src/components/badge/badge.stories.tsx +0 -468
  454. package/src/components/badge/badge.tsx +0 -147
  455. package/src/components/badge/icon-badge.tsx +0 -43
  456. package/src/components/badge/index.ts +0 -4
  457. package/src/components/badge/status-badge.tsx +0 -43
  458. package/src/components/badge/user-badge.tsx +0 -34
  459. package/src/components/button/button-link.stories.tsx +0 -86
  460. package/src/components/button/button-link.tsx +0 -76
  461. package/src/components/button/button.stories.tsx +0 -138
  462. package/src/components/button/button.tsx +0 -91
  463. package/src/components/button/icon-button.stories.tsx +0 -228
  464. package/src/components/button/icon-button.tsx +0 -95
  465. package/src/components/button/index.ts +0 -3
  466. package/src/components/button-group/button-group.stories.tsx +0 -361
  467. package/src/components/button-group/button-group.tsx +0 -111
  468. package/src/components/button-group/index.ts +0 -1
  469. package/src/components/calendar/calendar.tsx +0 -90
  470. package/src/components/calendar/index.ts +0 -1
  471. package/src/components/checkbox/checkbox-label.tsx +0 -125
  472. package/src/components/checkbox/checkbox-links.tsx +0 -92
  473. package/src/components/checkbox/checkbox.stories.tsx +0 -391
  474. package/src/components/checkbox/checkbox.tsx +0 -71
  475. package/src/components/checkbox/index.ts +0 -3
  476. package/src/components/code-block/code-block-footer.tsx +0 -197
  477. package/src/components/code-block/code-block.stories.tsx +0 -323
  478. package/src/components/code-block/code-block.tsx +0 -283
  479. package/src/components/code-block/code-content.tsx +0 -63
  480. package/src/components/code-block/code-copy-button.tsx +0 -73
  481. package/src/components/code-block/code-tabs.tsx +0 -170
  482. package/src/components/code-block/index.ts +0 -3
  483. package/src/components/command/command.stories.tsx +0 -133
  484. package/src/components/command/command.tsx +0 -265
  485. package/src/components/command/index.ts +0 -1
  486. package/src/components/confetti/confetti.stories.tsx +0 -38
  487. package/src/components/confetti/confetti.tsx +0 -140
  488. package/src/components/confetti/index.ts +0 -1
  489. package/src/components/dashboard/components/analytics-content.tsx +0 -102
  490. package/src/components/dashboard/components/animated-logo.tsx +0 -25
  491. package/src/components/dashboard/components/complete-setup-button.tsx +0 -30
  492. package/src/components/dashboard/components/jobs-content.tsx +0 -51
  493. package/src/components/dashboard/components/mobile-menu.tsx +0 -50
  494. package/src/components/dashboard/components/organization-selector.tsx +0 -51
  495. package/src/components/dashboard/components/top-menu.tsx +0 -26
  496. package/src/components/dashboard/components/topbar-button.tsx +0 -27
  497. package/src/components/dashboard/components/topbar.tsx +0 -40
  498. package/src/components/dashboard/components/user-profile.tsx +0 -90
  499. package/src/components/dashboard/dashboard.stories.tsx +0 -25
  500. package/src/components/dashboard/dashboard.tsx +0 -61
  501. package/src/components/dashboard/index.ts +0 -1
  502. package/src/components/date-picker/date-picker.stories.tsx +0 -230
  503. package/src/components/date-picker/date-picker.tsx +0 -179
  504. package/src/components/date-picker/index.ts +0 -1
  505. package/src/components/date-time-range-picker/date-time-range-picker.tsx +0 -211
  506. package/src/components/date-time-range-picker/index.ts +0 -1
  507. package/src/components/dot-grid/dot-grid.tsx +0 -325
  508. package/src/components/dot-grid/index.ts +0 -1
  509. package/src/components/dropdown-menu/dropdown-menu.stories.tsx +0 -384
  510. package/src/components/dropdown-menu/dropdown-menu.tsx +0 -416
  511. package/src/components/dropdown-menu/index.ts +0 -1
  512. package/src/components/dynamic-item/dynamic-item.stories.tsx +0 -266
  513. package/src/components/dynamic-item/dynamic-item.tsx +0 -74
  514. package/src/components/dynamic-item/index.ts +0 -1
  515. package/src/components/form/form.stories.tsx +0 -505
  516. package/src/components/form/form.tsx +0 -154
  517. package/src/components/form/index.ts +0 -1
  518. package/src/components/icon/custom/badge.tsx +0 -17
  519. package/src/components/icon/custom/check-circle-solid.tsx +0 -24
  520. package/src/components/icon/custom/circle-dotted-line.tsx +0 -17
  521. package/src/components/icon/custom/component-fill.tsx +0 -17
  522. package/src/components/icon/custom/component-line.tsx +0 -17
  523. package/src/components/icon/custom/ellipse-mini-solid.tsx +0 -17
  524. package/src/components/icon/custom/index.ts +0 -14
  525. package/src/components/icon/custom/info-tooltip-fill.tsx +0 -21
  526. package/src/components/icon/custom/resize.tsx +0 -17
  527. package/src/components/icon/custom/shipfox-logo.tsx +0 -20
  528. package/src/components/icon/custom/slack-logo.tsx +0 -35
  529. package/src/components/icon/custom/spinner.tsx +0 -144
  530. package/src/components/icon/custom/stripe-logo.tsx +0 -27
  531. package/src/components/icon/custom/thunder.tsx +0 -17
  532. package/src/components/icon/custom/x-circle-solid.tsx +0 -24
  533. package/src/components/icon/icon.stories.tsx +0 -31
  534. package/src/components/icon/icon.tsx +0 -90
  535. package/src/components/icon/index.ts +0 -1
  536. package/src/components/icon/remixicon-registry.ts +0 -24
  537. package/src/components/index.ts +0 -36
  538. package/src/components/inline-tips/index.ts +0 -1
  539. package/src/components/inline-tips/inline-tips.stories.tsx +0 -131
  540. package/src/components/inline-tips/inline-tips.tsx +0 -132
  541. package/src/components/input/index.ts +0 -1
  542. package/src/components/input/input.stories.tsx +0 -138
  543. package/src/components/input/input.tsx +0 -43
  544. package/src/components/item/index.ts +0 -1
  545. package/src/components/item/item.stories.tsx +0 -159
  546. package/src/components/item/item.tsx +0 -182
  547. package/src/components/kbd/index.ts +0 -1
  548. package/src/components/kbd/kbd.stories.tsx +0 -64
  549. package/src/components/kbd/kbd.tsx +0 -32
  550. package/src/components/label/index.ts +0 -1
  551. package/src/components/label/label.stories.tsx +0 -67
  552. package/src/components/label/label.tsx +0 -15
  553. package/src/components/modal/index.ts +0 -1
  554. package/src/components/modal/modal.stories.tsx +0 -448
  555. package/src/components/modal/modal.tsx +0 -311
  556. package/src/components/moving-border/index.ts +0 -1
  557. package/src/components/moving-border/moving-border.tsx +0 -67
  558. package/src/components/popover/index.ts +0 -1
  559. package/src/components/popover/popover.tsx +0 -60
  560. package/src/components/renovate.json +0 -23
  561. package/src/components/search/index.ts +0 -28
  562. package/src/components/search/search-context.tsx +0 -78
  563. package/src/components/search/search-inline.tsx +0 -107
  564. package/src/components/search/search-modal.tsx +0 -198
  565. package/src/components/search/search-trigger.tsx +0 -47
  566. package/src/components/search/search-variants.ts +0 -88
  567. package/src/components/search/search.stories.tsx +0 -392
  568. package/src/components/search/search.tsx +0 -47
  569. package/src/components/select/index.ts +0 -1
  570. package/src/components/select/select.stories.tsx +0 -207
  571. package/src/components/select/select.tsx +0 -220
  572. package/src/components/shiny-text/index.ts +0 -1
  573. package/src/components/shiny-text/shiny-text.tsx +0 -21
  574. package/src/components/skeleton/index.ts +0 -1
  575. package/src/components/skeleton/skeleton.stories.tsx +0 -178
  576. package/src/components/skeleton/skeleton.tsx +0 -14
  577. package/src/components/table/data-table.tsx +0 -254
  578. package/src/components/table/index.ts +0 -5
  579. package/src/components/table/table-column-header.tsx +0 -141
  580. package/src/components/table/table-pagination.tsx +0 -161
  581. package/src/components/table/table.stories.columns.tsx +0 -198
  582. package/src/components/table/table.stories.components.tsx +0 -104
  583. package/src/components/table/table.stories.data.ts +0 -117
  584. package/src/components/table/table.stories.tsx +0 -256
  585. package/src/components/table/table.tsx +0 -95
  586. package/src/components/tabs/index.ts +0 -1
  587. package/src/components/tabs/tabs.stories.tsx +0 -100
  588. package/src/components/tabs/tabs.tsx +0 -380
  589. package/src/components/textarea/index.ts +0 -1
  590. package/src/components/textarea/textarea.stories.tsx +0 -196
  591. package/src/components/textarea/textarea.tsx +0 -42
  592. package/src/components/theme/index.ts +0 -1
  593. package/src/components/theme/theme-provider.tsx +0 -50
  594. package/src/components/toast/index.ts +0 -2
  595. package/src/components/toast/toast-custom.tsx +0 -154
  596. package/src/components/toast/toast.stories.tsx +0 -369
  597. package/src/components/toast/toast.tsx +0 -41
  598. package/src/components/tooltip/index.ts +0 -1
  599. package/src/components/tooltip/tooltip.stories.tsx +0 -284
  600. package/src/components/tooltip/tooltip.tsx +0 -121
  601. package/src/components/typography/code.stories.tsx +0 -36
  602. package/src/components/typography/code.tsx +0 -38
  603. package/src/components/typography/header.stories.tsx +0 -27
  604. package/src/components/typography/header.tsx +0 -41
  605. package/src/components/typography/index.ts +0 -3
  606. package/src/components/typography/text.stories.tsx +0 -67
  607. package/src/components/typography/text.tsx +0 -50
  608. package/src/hooks/index.ts +0 -6
  609. package/src/hooks/useCopy.ts +0 -0
  610. package/src/hooks/useCopyToClipboard.ts +0 -20
  611. package/src/hooks/useMediaQuery.ts +0 -87
  612. package/src/hooks/useResolvedTheme.ts +0 -34
  613. package/src/hooks/useShikiHighlight.ts +0 -140
  614. package/src/hooks/useShikiStyleInjection.ts +0 -34
  615. package/src/hooks/useTheme.ts +0 -10
  616. package/src/index.ts +0 -4
  617. package/src/onboarding/sign-in.stories.tsx +0 -85
  618. package/src/state/theme.ts +0 -15
  619. package/src/utils/avatar.ts +0 -27
  620. package/src/utils/clipboard.ts +0 -4
  621. package/src/utils/cn.ts +0 -6
  622. package/src/utils/date.test.ts +0 -119
  623. package/src/utils/date.ts +0 -99
  624. package/src/utils/debounce.ts +0 -15
  625. package/src/utils/format/chart.ts +0 -16
  626. package/src/utils/format/date.test.ts +0 -65
  627. package/src/utils/format/date.ts +0 -75
  628. package/src/utils/format/duration.test.ts +0 -58
  629. package/src/utils/format/duration.ts +0 -82
  630. package/src/utils/format/index.ts +0 -4
  631. package/src/utils/format/number.test.ts +0 -38
  632. package/src/utils/format/number.ts +0 -33
  633. package/src/utils/index.ts +0 -6
  634. package/test/global.ts +0 -3
  635. package/test/setup.ts +0 -9
  636. package/tsconfig.build.json +0 -19
  637. package/tsconfig.json +0 -11
  638. package/tsconfig.test.json +0 -12
  639. package/vercel.json +0 -8
  640. package/vite.css.config.ts +0 -30
  641. package/vitest.config.ts +0 -44
@@ -1,95 +0,0 @@
1
- import {Slot} from '@radix-ui/react-slot';
2
- import {cva, type VariantProps} from 'class-variance-authority';
3
- import {Icon, type IconName} from 'components/icon';
4
- import type {ComponentProps} from 'react';
5
- import {cn} from 'utils/cn';
6
-
7
- export const iconButtonVariants = cva(
8
- 'inline-flex items-center justify-center whitespace-nowrap transition-colors cursor-pointer disabled:pointer-events-none shrink-0 outline-none',
9
- {
10
- variants: {
11
- variant: {
12
- primary:
13
- 'bg-background-button-inverted-default text-tag-neutral-icon shadow-button-inverted hover:bg-background-button-inverted-hover active:bg-background-button-inverted-pressed focus-visible:shadow-button-inverted-focus disabled:bg-background-neutral-disabled disabled:text-foreground-neutral-disabled disabled:shadow-none',
14
- transparent:
15
- 'bg-background-button-transparent-default text-tag-neutral-icon hover:bg-background-button-transparent-hover active:bg-background-button-transparent-pressed focus-visible:shadow-button-neutral-focus disabled:text-foreground-neutral-disabled',
16
- },
17
- size: {
18
- '2xs': 'w-20 h-20 text-xs',
19
- xs: 'w-24 h-24 text-xs',
20
- sm: 'w-28 h-28 text-sm',
21
- md: 'w-32 h-32 text-md',
22
- lg: 'w-36 h-36 text-lg',
23
- xl: 'w-40 h-40 text-xl',
24
- },
25
- radius: {
26
- rounded: 'rounded-6',
27
- full: 'rounded-full',
28
- },
29
- muted: {
30
- true: 'opacity-60',
31
- false: '',
32
- },
33
- },
34
- defaultVariants: {
35
- variant: 'primary',
36
- size: 'md',
37
- radius: 'rounded',
38
- muted: false,
39
- },
40
- },
41
- );
42
-
43
- const spinnerSizeMap: Record<
44
- NonNullable<VariantProps<typeof iconButtonVariants>['size']>,
45
- string
46
- > = {
47
- '2xs': 'size-8',
48
- xs: 'size-10',
49
- sm: 'size-12',
50
- md: 'size-14',
51
- lg: 'size-16',
52
- xl: 'size-18',
53
- };
54
-
55
- export function IconButton({
56
- className,
57
- variant,
58
- size,
59
- radius,
60
- muted,
61
- asChild = false,
62
- children,
63
- icon,
64
- isLoading = false,
65
- disabled,
66
- ...props
67
- }: ComponentProps<'button'> &
68
- VariantProps<typeof iconButtonVariants> & {
69
- asChild?: boolean;
70
- icon?: IconName;
71
- isLoading?: boolean;
72
- }) {
73
- const Comp = asChild ? Slot : 'button';
74
- const spinnerSize = spinnerSizeMap[size ?? 'md'];
75
-
76
- return (
77
- <Comp
78
- data-slot="icon-button"
79
- className={cn(iconButtonVariants({variant, size, radius, muted}), className)}
80
- disabled={disabled || isLoading}
81
- aria-busy={isLoading}
82
- aria-live={isLoading ? 'polite' : undefined}
83
- {...(asChild ? {'aria-disabled': disabled || isLoading} : {})}
84
- {...props}
85
- >
86
- {isLoading ? (
87
- <Icon name="spinner" className={spinnerSize} />
88
- ) : icon ? (
89
- <Icon name={icon} />
90
- ) : (
91
- children
92
- )}
93
- </Comp>
94
- );
95
- }
@@ -1,3 +0,0 @@
1
- export * from './button';
2
- export * from './button-link';
3
- export * from './icon-button';
@@ -1,361 +0,0 @@
1
- import type {Meta, StoryObj} from '@storybook/react';
2
- import {useState} from 'react';
3
- import {Button} from '../button';
4
- import {Icon} from '../icon';
5
- import {Input} from '../input';
6
- import {Popover, PopoverContent, PopoverTrigger} from '../popover';
7
- import {Select, SelectContent, SelectItem, SelectTrigger, SelectValue} from '../select';
8
- import {Textarea} from '../textarea';
9
- import {Code, Header} from '../typography';
10
- import {ButtonGroup, ButtonGroupSeparator, ButtonGroupText} from './button-group';
11
-
12
- const meta = {
13
- title: 'Components/ButtonGroup',
14
- component: ButtonGroup,
15
- tags: ['autodocs'],
16
- parameters: {
17
- docs: {
18
- description: {
19
- component:
20
- 'A container that groups related buttons together with consistent styling. Automatically styles Button, Input, Select, and Textarea children without requiring manual className overrides. Separators are recommended for visual hierarchy.',
21
- },
22
- },
23
- },
24
- argTypes: {
25
- orientation: {
26
- control: 'select',
27
- options: ['horizontal', 'vertical'],
28
- description: 'The orientation of the button group',
29
- defaultValue: 'horizontal',
30
- },
31
- },
32
- } satisfies Meta<typeof ButtonGroup>;
33
-
34
- export default meta;
35
-
36
- type Story = StoryObj<typeof meta>;
37
-
38
- function SelectExample() {
39
- const [currency, setCurrency] = useState('$');
40
-
41
- return (
42
- <div className="inline-flex gap-8">
43
- <ButtonGroup className="w-280" aria-label="Currency converter">
44
- <Select value={currency} onValueChange={setCurrency}>
45
- <SelectTrigger
46
- className="w-80 font-mono text-foreground-neutral-subtle"
47
- aria-label="Select currency"
48
- >
49
- <SelectValue />
50
- </SelectTrigger>
51
- <SelectContent align="start">
52
- <SelectItem value="$">$ USD</SelectItem>
53
- <SelectItem value="€">€ EUR</SelectItem>
54
- <SelectItem value="£">£ GBP</SelectItem>
55
- <SelectItem value="¥">¥ JPY</SelectItem>
56
- </SelectContent>
57
- </Select>
58
- <ButtonGroupSeparator />
59
- <Input placeholder="10.00" pattern="[0-9]*" aria-label="Amount" />
60
- </ButtonGroup>
61
- <ButtonGroup aria-label="Send action">
62
- <Button variant="secondary" aria-label="Send">
63
- <Icon name="arrowRightLine" className="size-16 text-foreground-neutral-subtle" />
64
- </Button>
65
- </ButtonGroup>
66
- </div>
67
- );
68
- }
69
-
70
- function PopoverExample() {
71
- const [open, setOpen] = useState(false);
72
-
73
- return (
74
- <ButtonGroup aria-label="Copilot actions">
75
- <ButtonGroupText>
76
- <Icon name="sparklingLine" className="size-16" />
77
- Copilot
78
- </ButtonGroupText>
79
- <ButtonGroupSeparator />
80
- <Popover open={open} onOpenChange={setOpen}>
81
- <PopoverTrigger asChild>
82
- <Button
83
- variant="secondary"
84
- size="sm"
85
- className="!text-foreground-neutral-subtle"
86
- aria-label="Open Copilot options"
87
- >
88
- <Icon name="arrowDownSLine" className="size-16" />
89
- </Button>
90
- </PopoverTrigger>
91
- <PopoverContent align="end" className="w-320 p-0 rounded-12">
92
- <div className="px-16 py-12 border-b border-border-neutral-strong">
93
- <Header variant="h4" className="text-sm font-medium">
94
- Agent Tasks
95
- </Header>
96
- </div>
97
- <div className="p-16 flex flex-col gap-12">
98
- <Textarea
99
- placeholder="Describe your task in natural language."
100
- className="min-h-80 resize-none"
101
- aria-label="Task description"
102
- />
103
- <div className="flex flex-col gap-8">
104
- <Code variant="label" className="font-medium text-foreground-neutral-base">
105
- Start a new task with Copilot
106
- </Code>
107
- <Code variant="paragraph" className="text-foreground-neutral-subtle text-xs">
108
- Describe your task in natural language. Copilot will work in the background and open
109
- a pull request for your review.
110
- </Code>
111
- </div>
112
- </div>
113
- </PopoverContent>
114
- </Popover>
115
- </ButtonGroup>
116
- );
117
- }
118
-
119
- export const Default: Story = {
120
- render: () => (
121
- <div className="flex flex-col gap-24">
122
- {/* Basic Button Group */}
123
- <div className="flex flex-col gap-8">
124
- <Code variant="label" className="text-foreground-neutral-subtle">
125
- Basic Button Group
126
- </Code>
127
- <ButtonGroup aria-label="Text alignment">
128
- <Button variant="secondary" size="sm" aria-label="Align left">
129
- <Icon name="rewindFill" className="size-14 text-foreground-neutral-subtle" />
130
- </Button>
131
- <ButtonGroupSeparator />
132
- <Button variant="secondary" size="sm" aria-label="Align center">
133
- <Icon name="playFill" className="size-14 text-foreground-neutral-subtle" />
134
- </Button>
135
- <ButtonGroupSeparator />
136
- <Button variant="secondary" size="sm" aria-label="Align right">
137
- <Icon name="speedFill" className="size-14 text-foreground-neutral-subtle" />
138
- </Button>
139
- </ButtonGroup>
140
- </div>
141
-
142
- {/* Sizes */}
143
- <div className="flex flex-col gap-12">
144
- <Code variant="label" className="text-foreground-neutral-subtle">
145
- Sizes
146
- </Code>
147
- <div className="flex flex-col gap-8">
148
- <ButtonGroup aria-label="Small buttons">
149
- <Button variant="secondary" size="sm" aria-label="Cut">
150
- <Icon name="rewindFill" className="size-14 text-foreground-neutral-subtle" />
151
- </Button>
152
- <ButtonGroupSeparator />
153
- <Button variant="secondary" size="sm" aria-label="Copy">
154
- <Icon name="playFill" className="size-14 text-foreground-neutral-subtle" />
155
- </Button>
156
- <ButtonGroupSeparator />
157
- <Button variant="secondary" size="sm" aria-label="Paste">
158
- <Icon name="speedFill" className="size-14 text-foreground-neutral-subtle" />
159
- </Button>
160
- </ButtonGroup>
161
- <ButtonGroup aria-label="Medium buttons">
162
- <Button variant="secondary" size="md" aria-label="Cut">
163
- <Icon name="rewindFill" className="size-16 text-foreground-neutral-subtle" />
164
- </Button>
165
- <ButtonGroupSeparator />
166
- <Button variant="secondary" size="md" aria-label="Copy">
167
- <Icon name="playFill" className="size-16 text-foreground-neutral-subtle" />
168
- </Button>
169
- <ButtonGroupSeparator />
170
- <Button variant="secondary" size="md" aria-label="Paste">
171
- <Icon name="speedFill" className="size-16 text-foreground-neutral-subtle" />
172
- </Button>
173
- </ButtonGroup>
174
- <ButtonGroup aria-label="Large buttons">
175
- <Button variant="secondary" size="lg" aria-label="Cut">
176
- <Icon name="rewindFill" className="size-16 text-foreground-neutral-subtle" />
177
- </Button>
178
- <ButtonGroupSeparator />
179
- <Button variant="secondary" size="lg" aria-label="Copy">
180
- <Icon name="playFill" className="size-16 text-foreground-neutral-subtle" />
181
- </Button>
182
- <ButtonGroupSeparator />
183
- <Button variant="secondary" size="lg" aria-label="Paste">
184
- <Icon name="speedFill" className="size-16 text-foreground-neutral-subtle" />
185
- </Button>
186
- </ButtonGroup>
187
- </div>
188
- </div>
189
-
190
- {/* Orientation */}
191
- <div className="flex flex-col gap-8">
192
- <Code variant="label" className="text-foreground-neutral-subtle">
193
- Orientation
194
- </Code>
195
- <div className="flex gap-24 items-start">
196
- <ButtonGroup aria-label="Horizontal">
197
- <Button variant="secondary" size="sm" aria-label="Zoom in">
198
- <Icon name="addLine" className="size-16 text-foreground-neutral-subtle" />
199
- </Button>
200
- <ButtonGroupSeparator />
201
- <Button variant="secondary" size="sm" aria-label="Zoom out">
202
- <Icon name="subtractLine" className="size-16 text-foreground-neutral-subtle" />
203
- </Button>
204
- </ButtonGroup>
205
- <ButtonGroup orientation="vertical" className="h-fit w-fit" aria-label="Vertical">
206
- <Button variant="secondary" size="sm" aria-label="Increase">
207
- <Icon name="addLine" className="size-16 text-foreground-neutral-subtle" />
208
- </Button>
209
- <ButtonGroupSeparator orientation="horizontal" />
210
- <Button variant="secondary" size="sm" aria-label="Decrease">
211
- <Icon name="subtractLine" className="size-16 text-foreground-neutral-subtle" />
212
- </Button>
213
- </ButtonGroup>
214
- </div>
215
- </div>
216
-
217
- {/* Split Button */}
218
- <div className="flex flex-col gap-8">
219
- <Code variant="label" className="text-foreground-neutral-subtle">
220
- Split Button
221
- </Code>
222
- <ButtonGroup aria-label="Save actions">
223
- <Button variant="secondary" size="sm" className=" !text-foreground-neutral-subtle">
224
- Save
225
- </Button>
226
- <ButtonGroupSeparator />
227
- <Button variant="secondary" size="sm" aria-label="More options">
228
- <Icon name="arrowDownSLine" className="size-16 text-foreground-neutral-subtle" />
229
- </Button>
230
- </ButtonGroup>
231
- </div>
232
-
233
- {/* With Input */}
234
- <div className="flex flex-col gap-8">
235
- <Code variant="label" className="text-foreground-neutral-subtle">
236
- With Input
237
- </Code>
238
- <ButtonGroup className="w-320" aria-label="Search">
239
- <Input placeholder="Search..." aria-label="Search input" />
240
- <ButtonGroupSeparator />
241
- <Button variant="secondary" aria-label="Submit search">
242
- <Icon name="searchLine" className="size-16 text-foreground-neutral-subtle" />
243
- </Button>
244
- </ButtonGroup>
245
- </div>
246
-
247
- {/* Quantity Input */}
248
- <div className="flex flex-col gap-8">
249
- <Code variant="label" className="text-foreground-neutral-subtle">
250
- Quantity Selector
251
- </Code>
252
- <ButtonGroup className="w-280" aria-label="Quantity selector">
253
- <Button variant="secondary" aria-label="Decrease">
254
- <Icon name="subtractLine" className="size-16 text-foreground-neutral-subtle" />
255
- </Button>
256
- <ButtonGroupSeparator />
257
- <Input placeholder="1" className="text-center" aria-label="Quantity" />
258
- <ButtonGroupSeparator />
259
- <Button variant="secondary" aria-label="Increase">
260
- <Icon name="addLine" className="size-16 text-foreground-neutral-subtle" />
261
- </Button>
262
- </ButtonGroup>
263
- </div>
264
-
265
- {/* With Select */}
266
- <div className="flex flex-col gap-8">
267
- <Code variant="label" className="text-foreground-neutral-subtle">
268
- With Select
269
- </Code>
270
- <SelectExample />
271
- </div>
272
-
273
- {/* With Popover */}
274
- <div className="flex flex-col gap-8">
275
- <Code variant="label" className="text-foreground-neutral-subtle">
276
- With Popover
277
- </Code>
278
- <PopoverExample />
279
- </div>
280
-
281
- {/* Nested Groups */}
282
- <div className="flex flex-col gap-8">
283
- <Code variant="label" className="text-foreground-neutral-subtle">
284
- Nested Groups
285
- </Code>
286
- <div className="inline-flex gap-8">
287
- <ButtonGroup aria-label="Page selection">
288
- <Button
289
- variant="transparent"
290
- className="w-42 !text-foreground-neutral-subtle"
291
- aria-label="Page 1"
292
- >
293
- 1
294
- </Button>
295
- <ButtonGroupSeparator />
296
- <Button
297
- variant="transparent"
298
- className="w-42 !text-foreground-neutral-subtle"
299
- aria-label="Page 2"
300
- >
301
- 2
302
- </Button>
303
- <ButtonGroupSeparator />
304
- <Button
305
- variant="transparent"
306
- className="w-42 !text-foreground-neutral-subtle"
307
- aria-label="Page 3"
308
- >
309
- 3
310
- </Button>
311
- <ButtonGroupSeparator />
312
- <Button
313
- variant="transparent"
314
- className="w-42 !text-foreground-neutral-subtle"
315
- aria-label="Page 4"
316
- >
317
- 4
318
- </Button>
319
- <ButtonGroupSeparator />
320
- <Button
321
- variant="transparent"
322
- className="w-42 !text-foreground-neutral-subtle"
323
- aria-label="Page 5"
324
- >
325
- 5
326
- </Button>
327
- </ButtonGroup>
328
- <ButtonGroup aria-label="Pagination controls">
329
- <Button variant="transparent" aria-label="Previous page">
330
- <Icon name="arrowLeftSLine" className="size-16 text-foreground-neutral-subtle" />
331
- </Button>
332
- <ButtonGroupSeparator />
333
- <Button variant="transparent" aria-label="Next page">
334
- <Icon name="arrowRightSLine" className="size-16 text-foreground-neutral-subtle" />
335
- </Button>
336
- </ButtonGroup>
337
- </div>
338
- </div>
339
-
340
- {/* Disabled State */}
341
- <div className="flex flex-col gap-8">
342
- <Code variant="label" className="text-foreground-neutral-subtle">
343
- Disabled State
344
- </Code>
345
- <ButtonGroup aria-label="Button group with disabled state">
346
- <Button variant="secondary" size="sm" className=" !text-foreground-neutral-subtle">
347
- Enabled
348
- </Button>
349
- <ButtonGroupSeparator />
350
- <Button variant="secondary" size="sm" disabled>
351
- Disabled
352
- </Button>
353
- <ButtonGroupSeparator />
354
- <Button variant="secondary" size="sm" className=" !text-foreground-neutral-subtle">
355
- Enabled
356
- </Button>
357
- </ButtonGroup>
358
- </div>
359
- </div>
360
- ),
361
- };
@@ -1,111 +0,0 @@
1
- import {Slot} from '@radix-ui/react-slot';
2
- import {cva, type VariantProps} from 'class-variance-authority';
3
- import type {ComponentProps} from 'react';
4
- import {cn} from 'utils/cn';
5
-
6
- const buttonGroupVariants = cva(
7
- [
8
- 'flex w-fit items-stretch',
9
- // Apply shadow to the group container instead of individual children
10
- 'rounded-6 shadow-button-neutral',
11
- // Focus management
12
- '[&>*]:focus-visible:z-10 [&>*]:focus-visible:relative',
13
- // Select trigger sizing
14
- "[&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit",
15
- // Input flex
16
- '[&>input]:flex-1',
17
- // Nested button groups
18
- 'has-[>[data-slot=button-group]]:gap-8',
19
- // Remove shadows from all children to prevent inner shadow artifacts
20
- '[&>*]:shadow-none',
21
- ],
22
- {
23
- variants: {
24
- orientation: {
25
- horizontal: [
26
- // Remove left border-radius and left border from all but first child
27
- '[&>*:not(:first-child)]:rounded-l-none',
28
- '[&>*:not(:first-child)]:border-l-0',
29
- // Remove right border-radius from all but last child
30
- '[&>*:not(:last-child)]:rounded-r-none',
31
- ],
32
- vertical: [
33
- 'flex-col',
34
- // Remove top border-radius and top border from all but first child
35
- '[&>*:not(:first-child)]:rounded-t-none',
36
- '[&>*:not(:first-child)]:border-t-0',
37
- // Remove bottom border-radius from all but last child
38
- '[&>*:not(:last-child)]:rounded-b-none',
39
- ],
40
- },
41
- },
42
- defaultVariants: {
43
- orientation: 'horizontal',
44
- },
45
- },
46
- );
47
-
48
- type ButtonGroupProps = ComponentProps<'div'> & VariantProps<typeof buttonGroupVariants>;
49
-
50
- function ButtonGroup({className, orientation, ...props}: ButtonGroupProps) {
51
- return (
52
- // biome-ignore lint/a11y/useSemanticElements: role="group" is semantically correct for button groups
53
- <div
54
- role="group"
55
- data-slot="button-group"
56
- data-orientation={orientation}
57
- className={cn(buttonGroupVariants({orientation}), className)}
58
- {...props}
59
- />
60
- );
61
- }
62
-
63
- type ButtonGroupTextProps = ComponentProps<'div'> & {
64
- asChild?: boolean;
65
- };
66
-
67
- function ButtonGroupText({className, asChild = false, ...props}: ButtonGroupTextProps) {
68
- const Comp = asChild ? Slot : 'div';
69
-
70
- return (
71
- <Comp
72
- data-slot="button-group-text"
73
- className={cn(
74
- 'flex items-center gap-8 rounded-6 px-12',
75
- 'bg-background-field-base text-foreground-neutral-subtle',
76
- 'text-sm leading-20 font-medium',
77
- 'shadow-button-neutral',
78
- "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-16",
79
- className,
80
- )}
81
- {...props}
82
- />
83
- );
84
- }
85
-
86
- type ButtonGroupSeparatorProps = ComponentProps<'div'> & {
87
- orientation?: 'horizontal' | 'vertical';
88
- };
89
-
90
- function ButtonGroupSeparator({
91
- className,
92
- orientation = 'vertical',
93
- ...props
94
- }: ButtonGroupSeparatorProps) {
95
- return (
96
- <div
97
- aria-hidden="true"
98
- data-slot="button-group-separator"
99
- data-orientation={orientation}
100
- className={cn(
101
- 'shrink-0 self-stretch',
102
- 'bg-border-neutral-strong',
103
- orientation === 'vertical' ? 'h-auto w-px' : 'h-px w-auto',
104
- className,
105
- )}
106
- {...props}
107
- />
108
- );
109
- }
110
-
111
- export {ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants};
@@ -1 +0,0 @@
1
- export * from './button-group';
@@ -1,90 +0,0 @@
1
- import {Icon} from 'components/icon';
2
- import type {ComponentProps} from 'react';
3
- import {DayPicker} from 'react-day-picker';
4
- import {cn} from 'utils/cn';
5
-
6
- export type CalendarProps = ComponentProps<typeof DayPicker>;
7
-
8
- export function Calendar({className, classNames, showOutsideDays = true, ...props}: CalendarProps) {
9
- return (
10
- <DayPicker
11
- showOutsideDays={showOutsideDays}
12
- className={cn('p-16 transition-colors', className)}
13
- classNames={{
14
- months: 'flex flex-col sm:flex-row gap-24',
15
- month: 'space-y-16 relative',
16
- month_caption: 'flex items-center justify-center mb-8 px-4 relative h-32',
17
- caption_label: 'text-sm font-medium text-foreground-neutral-base',
18
- nav: 'flex items-center gap-4 fixed left-0 top-16 w-full z-10',
19
- button_previous: cn(
20
- 'size-32 bg-transparent p-0 absolute left-16 top-0',
21
- 'inline-flex items-center justify-center rounded-6',
22
- 'text-foreground-neutral-base',
23
- 'hover:bg-background-button-transparent-hover',
24
- 'active:bg-background-button-transparent-pressed',
25
- 'transition-colors outline-none',
26
- 'focus-visible:shadow-border-interactive-with-active',
27
- 'disabled:pointer-events-none disabled:opacity-50',
28
- ),
29
- button_next: cn(
30
- 'size-32 bg-transparent p-0 absolute right-16 top-0',
31
- 'inline-flex items-center justify-center rounded-6',
32
- 'text-foreground-neutral-base',
33
- 'hover:bg-background-button-transparent-hover',
34
- 'active:bg-background-button-transparent-pressed',
35
- 'transition-colors outline-none',
36
- 'focus-visible:shadow-border-interactive-with-active',
37
- 'disabled:pointer-events-none disabled:opacity-50',
38
- ),
39
- month_grid: 'w-full border-collapse mt-8',
40
- weekdays: 'flex mb-8',
41
- weekday:
42
- 'text-foreground-neutral-subtle text-xs font-medium w-36 h-32 flex items-center justify-center',
43
- week: 'flex mt-4',
44
- day: cn(
45
- 'relative text-center size-36 p-0 text-sm font-normal [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none',
46
- '[&:last-child[data-selected=true]_button]:rounded-r-6',
47
- props.showWeekNumber
48
- ? '[&:nth-child(2)[data-selected=true]_button]:rounded-l-6'
49
- : '[&:first-child[data-selected=true]_button]:rounded-l-6',
50
- ),
51
- day_button: cn(
52
- 'size-36 p-0 text-sm font-normal rounded-6',
53
- 'inline-flex items-center justify-center',
54
- 'hover:bg-background-button-transparent-hover',
55
- 'focus-visible:shadow-border-interactive-with-active',
56
- 'transition-colors outline-none',
57
- 'aria-selected:opacity-100',
58
- ),
59
- range_start: 'day-range-start rounded-6',
60
- range_end: 'day-range-end rounded-6',
61
- selected: cn(
62
- 'bg-foreground-highlight-interactive/80 !text-foreground-neutral-base font-medium rounded-6',
63
- 'hover:bg-foreground-highlight-interactive-hover/80',
64
- 'focus:bg-foreground-highlight-interactive/80',
65
- ),
66
- today: cn(
67
- 'bg-background-field-base text-foreground-neutral-base font-medium rounded-6',
68
- 'border border-border-neutral-base',
69
- ),
70
- outside: 'day-outside text-foreground-neutral-muted',
71
- disabled: 'text-foreground-neutral-disabled opacity-30 cursor-not-allowed',
72
- range_middle: cn(
73
- 'aria-selected:bg-foreground-highlight-interactive/10 aria-selected:text-foreground-neutral-base',
74
- 'rounded-none',
75
- 'first:rounded-l-6 first:rounded-r-none',
76
- 'last:rounded-r-6 last:rounded-l-none',
77
- ),
78
- hidden: 'invisible',
79
- ...classNames,
80
- }}
81
- components={{
82
- Chevron: ({orientation}) => {
83
- const iconName = orientation === 'left' ? 'arrowLeftSLine' : 'arrowRightSLine';
84
- return <Icon name={iconName} className="size-20" />;
85
- },
86
- }}
87
- {...props}
88
- />
89
- );
90
- }
@@ -1 +0,0 @@
1
- export * from './calendar';