@nadicodeai/ui 12.1.102 → 12.1.103

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 (562) hide show
  1. package/dist/components/accordion.d.ts +38 -12
  2. package/dist/components/accordion.d.ts.map +1 -1
  3. package/dist/components/accordion.js +36 -15
  4. package/dist/components/account-menu.js +2 -2
  5. package/dist/components/action-menu.d.ts +20 -19
  6. package/dist/components/action-menu.d.ts.map +1 -1
  7. package/dist/components/action-menu.js +22 -15
  8. package/dist/components/action-status.d.ts +14 -10
  9. package/dist/components/action-status.d.ts.map +1 -1
  10. package/dist/components/action-status.js +14 -10
  11. package/dist/components/activity-calendar.d.ts +3 -1
  12. package/dist/components/activity-calendar.d.ts.map +1 -1
  13. package/dist/components/activity-calendar.js +16 -2
  14. package/dist/components/activity-feed.d.ts +2 -2
  15. package/dist/components/activity-feed.d.ts.map +1 -1
  16. package/dist/components/activity-feed.js +14 -5
  17. package/dist/components/agent-card.d.ts +11 -5
  18. package/dist/components/agent-card.d.ts.map +1 -1
  19. package/dist/components/agent-card.js +13 -7
  20. package/dist/components/agent-list-row.js +1 -1
  21. package/dist/components/agent-orb-appearance.d.ts +7 -1
  22. package/dist/components/agent-orb-appearance.d.ts.map +1 -1
  23. package/dist/components/agent-orb-appearance.js +26 -0
  24. package/dist/components/agent-profile.d.ts +8 -7
  25. package/dist/components/agent-profile.d.ts.map +1 -1
  26. package/dist/components/agent-profile.js +6 -6
  27. package/dist/components/alert-dialog.d.ts +25 -16
  28. package/dist/components/alert-dialog.d.ts.map +1 -1
  29. package/dist/components/alert-dialog.js +30 -18
  30. package/dist/components/alert.d.ts +1 -1
  31. package/dist/components/avatar.d.ts +83 -17
  32. package/dist/components/avatar.d.ts.map +1 -1
  33. package/dist/components/avatar.js +89 -23
  34. package/dist/components/badge.d.ts +59 -8
  35. package/dist/components/badge.d.ts.map +1 -1
  36. package/dist/components/badge.js +57 -14
  37. package/dist/components/breadcrumb.d.ts +18 -7
  38. package/dist/components/breadcrumb.d.ts.map +1 -1
  39. package/dist/components/breadcrumb.js +37 -13
  40. package/dist/components/button-group.d.ts +12 -15
  41. package/dist/components/button-group.d.ts.map +1 -1
  42. package/dist/components/button-group.js +13 -17
  43. package/dist/components/button.d.ts +126 -23
  44. package/dist/components/button.d.ts.map +1 -1
  45. package/dist/components/button.js +164 -39
  46. package/dist/components/calendar.d.ts +26 -15
  47. package/dist/components/calendar.d.ts.map +1 -1
  48. package/dist/components/calendar.js +60 -46
  49. package/dist/components/card-row.d.ts +13 -5
  50. package/dist/components/card-row.d.ts.map +1 -1
  51. package/dist/components/card-row.js +24 -10
  52. package/dist/components/card.d.ts +6 -12
  53. package/dist/components/card.d.ts.map +1 -1
  54. package/dist/components/card.js +11 -16
  55. package/dist/components/carousel.d.ts +3 -3
  56. package/dist/components/carousel.d.ts.map +1 -1
  57. package/dist/components/carousel.js +7 -7
  58. package/dist/components/catalog-drawer.d.ts +7 -7
  59. package/dist/components/catalog-drawer.d.ts.map +1 -1
  60. package/dist/components/catalog-drawer.js +6 -6
  61. package/dist/components/chart-area-stacked.d.ts +1 -1
  62. package/dist/components/chart-area-stacked.d.ts.map +1 -1
  63. package/dist/components/chart-area-stacked.js +4 -4
  64. package/dist/components/chart-axis.d.ts +14 -1
  65. package/dist/components/chart-axis.d.ts.map +1 -1
  66. package/dist/components/chart-axis.js +11 -1
  67. package/dist/components/chart-bar-horizontal.d.ts +2 -2
  68. package/dist/components/chart-bar-horizontal.d.ts.map +1 -1
  69. package/dist/components/chart-bar-horizontal.js +14 -5
  70. package/dist/components/chart-bar-multiple.d.ts +1 -1
  71. package/dist/components/chart-bar-multiple.d.ts.map +1 -1
  72. package/dist/components/chart-bar-multiple.js +3 -3
  73. package/dist/components/chart-bar-stacked.d.ts +1 -1
  74. package/dist/components/chart-bar-stacked.d.ts.map +1 -1
  75. package/dist/components/chart-bar-stacked.js +3 -3
  76. package/dist/components/chart-card.d.ts +17 -6
  77. package/dist/components/chart-card.d.ts.map +1 -1
  78. package/dist/components/chart-card.js +11 -4
  79. package/dist/components/chart-date-range-control.d.ts +18 -9
  80. package/dist/components/chart-date-range-control.d.ts.map +1 -1
  81. package/dist/components/chart-date-range-control.js +43 -47
  82. package/dist/components/chart-sparkline.d.ts +4 -3
  83. package/dist/components/chart-sparkline.d.ts.map +1 -1
  84. package/dist/components/chart-sparkline.js +6 -5
  85. package/dist/components/check-counts.d.ts +44 -0
  86. package/dist/components/check-counts.d.ts.map +1 -0
  87. package/dist/components/check-counts.js +51 -0
  88. package/dist/components/checkbox.d.ts +39 -11
  89. package/dist/components/checkbox.d.ts.map +1 -1
  90. package/dist/components/checkbox.js +38 -11
  91. package/dist/components/choicebox.d.ts +96 -0
  92. package/dist/components/choicebox.d.ts.map +1 -0
  93. package/dist/components/choicebox.js +113 -0
  94. package/dist/components/clearable-input.d.ts +57 -0
  95. package/dist/components/clearable-input.d.ts.map +1 -0
  96. package/dist/components/clearable-input.js +58 -0
  97. package/dist/components/code-block.d.ts +77 -17
  98. package/dist/components/code-block.d.ts.map +1 -1
  99. package/dist/components/code-block.js +85 -15
  100. package/dist/components/collapsible.d.ts +27 -10
  101. package/dist/components/collapsible.d.ts.map +1 -1
  102. package/dist/components/collapsible.js +24 -9
  103. package/dist/components/collection-filters.d.ts +3 -1
  104. package/dist/components/collection-filters.d.ts.map +1 -1
  105. package/dist/components/collection-filters.js +7 -9
  106. package/dist/components/collection-page.d.ts +31 -10
  107. package/dist/components/collection-page.d.ts.map +1 -1
  108. package/dist/components/collection-page.js +14 -13
  109. package/dist/components/collection-search.d.ts +32 -10
  110. package/dist/components/collection-search.d.ts.map +1 -1
  111. package/dist/components/collection-search.js +24 -13
  112. package/dist/components/collection-sort.d.ts.map +1 -1
  113. package/dist/components/collection-sort.js +2 -2
  114. package/dist/components/collection-toolbar.d.ts +5 -2
  115. package/dist/components/collection-toolbar.d.ts.map +1 -1
  116. package/dist/components/collection-toolbar.js +7 -4
  117. package/dist/components/combobox.d.ts +97 -22
  118. package/dist/components/combobox.d.ts.map +1 -1
  119. package/dist/components/combobox.js +80 -28
  120. package/dist/components/command.d.ts +34 -21
  121. package/dist/components/command.d.ts.map +1 -1
  122. package/dist/components/command.js +33 -25
  123. package/dist/components/confirm-dialog.d.ts +23 -6
  124. package/dist/components/confirm-dialog.d.ts.map +1 -1
  125. package/dist/components/confirm-dialog.js +32 -13
  126. package/dist/components/context-menu.d.ts +14 -10
  127. package/dist/components/context-menu.d.ts.map +1 -1
  128. package/dist/components/context-menu.js +17 -12
  129. package/dist/components/copy-button.d.ts +5 -2
  130. package/dist/components/copy-button.d.ts.map +1 -1
  131. package/dist/components/copy-button.js +16 -8
  132. package/dist/components/data-table.d.ts +120 -54
  133. package/dist/components/data-table.d.ts.map +1 -1
  134. package/dist/components/data-table.js +163 -92
  135. package/dist/components/desktop-shell.d.ts +4 -2
  136. package/dist/components/desktop-shell.d.ts.map +1 -1
  137. package/dist/components/desktop-shell.js +3 -3
  138. package/dist/components/dialog.d.ts +63 -24
  139. package/dist/components/dialog.d.ts.map +1 -1
  140. package/dist/components/dialog.js +52 -31
  141. package/dist/components/disclosure-row.d.ts +1 -2
  142. package/dist/components/disclosure-row.d.ts.map +1 -1
  143. package/dist/components/disclosure-row.js +1 -2
  144. package/dist/components/disclosure.d.ts +1 -1
  145. package/dist/components/disclosure.js +1 -1
  146. package/dist/components/drawer.d.ts +33 -12
  147. package/dist/components/drawer.d.ts.map +1 -1
  148. package/dist/components/drawer.js +47 -35
  149. package/dist/components/dropdown-menu.d.ts +59 -14
  150. package/dist/components/dropdown-menu.d.ts.map +1 -1
  151. package/dist/components/dropdown-menu.js +58 -26
  152. package/dist/components/empty-state.d.ts +35 -12
  153. package/dist/components/empty-state.d.ts.map +1 -1
  154. package/dist/components/empty-state.js +35 -17
  155. package/dist/components/entry-scene.d.ts +4 -4
  156. package/dist/components/entry-scene.d.ts.map +1 -1
  157. package/dist/components/entry-scene.js +2 -2
  158. package/dist/components/field.d.ts +44 -14
  159. package/dist/components/field.d.ts.map +1 -1
  160. package/dist/components/field.js +49 -20
  161. package/dist/components/file-diff.d.ts.map +1 -1
  162. package/dist/components/file-diff.js +3 -4
  163. package/dist/components/form-dialog.d.ts +7 -7
  164. package/dist/components/form-dialog.d.ts.map +1 -1
  165. package/dist/components/form-dialog.js +13 -11
  166. package/dist/components/form-drawer.d.ts +10 -7
  167. package/dist/components/form-drawer.d.ts.map +1 -1
  168. package/dist/components/form-drawer.js +11 -10
  169. package/dist/components/gauge.d.ts +64 -0
  170. package/dist/components/gauge.d.ts.map +1 -0
  171. package/dist/components/gauge.js +73 -0
  172. package/dist/components/hover-card.d.ts +72 -14
  173. package/dist/components/hover-card.d.ts.map +1 -1
  174. package/dist/components/hover-card.js +51 -17
  175. package/dist/components/identity-mark.d.ts +8 -1
  176. package/dist/components/identity-mark.d.ts.map +1 -1
  177. package/dist/components/identity-mark.js +31 -5
  178. package/dist/components/input-group.d.ts +44 -21
  179. package/dist/components/input-group.d.ts.map +1 -1
  180. package/dist/components/input-group.js +74 -27
  181. package/dist/components/input.d.ts +64 -12
  182. package/dist/components/input.d.ts.map +1 -1
  183. package/dist/components/input.js +51 -15
  184. package/dist/components/item.d.ts +37 -15
  185. package/dist/components/item.d.ts.map +1 -1
  186. package/dist/components/item.js +41 -22
  187. package/dist/components/kbd.d.ts +49 -13
  188. package/dist/components/kbd.d.ts.map +1 -1
  189. package/dist/components/kbd.js +115 -16
  190. package/dist/components/kpi-card.d.ts +12 -4
  191. package/dist/components/kpi-card.d.ts.map +1 -1
  192. package/dist/components/kpi-card.js +13 -4
  193. package/dist/components/label.d.ts +17 -10
  194. package/dist/components/label.d.ts.map +1 -1
  195. package/dist/components/label.js +18 -11
  196. package/dist/components/library-shelf.d.ts +6 -6
  197. package/dist/components/library-shelf.d.ts.map +1 -1
  198. package/dist/components/library-shelf.js +5 -5
  199. package/dist/components/load-more-button.d.ts +35 -0
  200. package/dist/components/load-more-button.d.ts.map +1 -0
  201. package/dist/components/load-more-button.js +26 -0
  202. package/dist/components/message-notice.d.ts +8 -13
  203. package/dist/components/message-notice.d.ts.map +1 -1
  204. package/dist/components/message-notice.js +25 -22
  205. package/dist/components/middle-truncate.d.ts +33 -0
  206. package/dist/components/middle-truncate.d.ts.map +1 -0
  207. package/dist/components/middle-truncate.js +72 -0
  208. package/dist/components/multi-select.d.ts +94 -0
  209. package/dist/components/multi-select.d.ts.map +1 -0
  210. package/dist/components/multi-select.js +132 -0
  211. package/dist/components/native-select.d.ts +37 -13
  212. package/dist/components/native-select.d.ts.map +1 -1
  213. package/dist/components/native-select.js +27 -11
  214. package/dist/components/notice-banner.d.ts +17 -10
  215. package/dist/components/notice-banner.d.ts.map +1 -1
  216. package/dist/components/notice-banner.js +12 -11
  217. package/dist/components/numbered-steps.d.ts +10 -4
  218. package/dist/components/numbered-steps.d.ts.map +1 -1
  219. package/dist/components/numbered-steps.js +9 -7
  220. package/dist/components/object-page.d.ts +40 -14
  221. package/dist/components/object-page.d.ts.map +1 -1
  222. package/dist/components/object-page.js +12 -10
  223. package/dist/components/object-workspace.d.ts +29 -10
  224. package/dist/components/object-workspace.d.ts.map +1 -1
  225. package/dist/components/object-workspace.js +18 -8
  226. package/dist/components/overview-page.d.ts +2 -2
  227. package/dist/components/overview-page.d.ts.map +1 -1
  228. package/dist/components/overview-page.js +8 -7
  229. package/dist/components/page-actions.d.ts +28 -8
  230. package/dist/components/page-actions.d.ts.map +1 -1
  231. package/dist/components/page-actions.js +22 -25
  232. package/dist/components/page-header.d.ts +11 -4
  233. package/dist/components/page-header.d.ts.map +1 -1
  234. package/dist/components/page-header.js +10 -5
  235. package/dist/components/pending-label.d.ts +6 -5
  236. package/dist/components/pending-label.d.ts.map +1 -1
  237. package/dist/components/pending-label.js +14 -6
  238. package/dist/components/picture-label.d.ts +2 -2
  239. package/dist/components/picture-label.d.ts.map +1 -1
  240. package/dist/components/picture-label.js +3 -3
  241. package/dist/components/portal-sidebar-frame.d.ts +9 -21
  242. package/dist/components/portal-sidebar-frame.d.ts.map +1 -1
  243. package/dist/components/portal-sidebar-frame.js +13 -27
  244. package/dist/components/progress-checklist.d.ts +46 -0
  245. package/dist/components/progress-checklist.d.ts.map +1 -0
  246. package/dist/components/progress-checklist.js +46 -0
  247. package/dist/components/progress.d.ts +48 -8
  248. package/dist/components/progress.d.ts.map +1 -1
  249. package/dist/components/progress.js +92 -16
  250. package/dist/components/prose.d.ts +19 -0
  251. package/dist/components/prose.d.ts.map +1 -0
  252. package/dist/components/prose.js +29 -0
  253. package/dist/components/radio-group.d.ts +51 -12
  254. package/dist/components/radio-group.d.ts.map +1 -1
  255. package/dist/components/radio-group.js +42 -12
  256. package/dist/components/reading-column.js +1 -1
  257. package/dist/components/record-identity.d.ts +6 -5
  258. package/dist/components/record-identity.d.ts.map +1 -1
  259. package/dist/components/record-identity.js +12 -3
  260. package/dist/components/record-list.d.ts +117 -27
  261. package/dist/components/record-list.d.ts.map +1 -1
  262. package/dist/components/record-list.js +185 -55
  263. package/dist/components/record-time.d.ts +20 -7
  264. package/dist/components/record-time.d.ts.map +1 -1
  265. package/dist/components/record-time.js +38 -19
  266. package/dist/components/resizable.d.ts +7 -5
  267. package/dist/components/resizable.d.ts.map +1 -1
  268. package/dist/components/resizable.js +6 -6
  269. package/dist/components/scope-switcher.d.ts +2 -0
  270. package/dist/components/scope-switcher.d.ts.map +1 -1
  271. package/dist/components/scope-switcher.js +2 -2
  272. package/dist/components/scroll-area.d.ts +47 -11
  273. package/dist/components/scroll-area.d.ts.map +1 -1
  274. package/dist/components/scroll-area.js +72 -14
  275. package/dist/components/segmented-control.d.ts +82 -0
  276. package/dist/components/segmented-control.d.ts.map +1 -0
  277. package/dist/components/segmented-control.js +90 -0
  278. package/dist/components/select.d.ts +55 -15
  279. package/dist/components/select.d.ts.map +1 -1
  280. package/dist/components/select.js +62 -19
  281. package/dist/components/separator.d.ts +12 -5
  282. package/dist/components/separator.d.ts.map +1 -1
  283. package/dist/components/separator.js +11 -6
  284. package/dist/components/settings-facts.d.ts +34 -14
  285. package/dist/components/settings-facts.d.ts.map +1 -1
  286. package/dist/components/settings-facts.js +21 -12
  287. package/dist/components/settings-page.d.ts +4 -4
  288. package/dist/components/settings-page.js +5 -5
  289. package/dist/components/settings-section.d.ts +160 -34
  290. package/dist/components/settings-section.d.ts.map +1 -1
  291. package/dist/components/settings-section.js +92 -39
  292. package/dist/components/sheet.d.ts +47 -16
  293. package/dist/components/sheet.d.ts.map +1 -1
  294. package/dist/components/sheet.js +40 -19
  295. package/dist/components/sidebar-sections.d.ts +16 -12
  296. package/dist/components/sidebar-sections.d.ts.map +1 -1
  297. package/dist/components/sidebar-sections.js +30 -15
  298. package/dist/components/sidebar.d.ts +117 -21
  299. package/dist/components/sidebar.d.ts.map +1 -1
  300. package/dist/components/sidebar.js +180 -55
  301. package/dist/components/skeleton.d.ts +54 -8
  302. package/dist/components/skeleton.d.ts.map +1 -1
  303. package/dist/components/skeleton.js +44 -9
  304. package/dist/components/slider.d.ts +53 -11
  305. package/dist/components/slider.d.ts.map +1 -1
  306. package/dist/components/slider.js +71 -17
  307. package/dist/components/snippet.d.ts +57 -0
  308. package/dist/components/snippet.d.ts.map +1 -0
  309. package/dist/components/snippet.js +60 -0
  310. package/dist/components/sonner.d.ts +13 -14
  311. package/dist/components/sonner.d.ts.map +1 -1
  312. package/dist/components/sonner.js +25 -22
  313. package/dist/components/status-badge.d.ts +37 -11
  314. package/dist/components/status-badge.d.ts.map +1 -1
  315. package/dist/components/status-badge.js +63 -15
  316. package/dist/components/status-dot.d.ts +42 -11
  317. package/dist/components/status-dot.d.ts.map +1 -1
  318. package/dist/components/status-dot.js +40 -11
  319. package/dist/components/switch.d.ts +43 -12
  320. package/dist/components/switch.d.ts.map +1 -1
  321. package/dist/components/switch.js +42 -12
  322. package/dist/components/table-card.d.ts +21 -12
  323. package/dist/components/table-card.d.ts.map +1 -1
  324. package/dist/components/table-card.js +17 -9
  325. package/dist/components/table-layouts.d.ts +40 -8
  326. package/dist/components/table-layouts.d.ts.map +1 -1
  327. package/dist/components/table-layouts.js +52 -8
  328. package/dist/components/table-value.d.ts +4 -3
  329. package/dist/components/table-value.d.ts.map +1 -1
  330. package/dist/components/table-value.js +6 -5
  331. package/dist/components/table.d.ts +62 -25
  332. package/dist/components/table.d.ts.map +1 -1
  333. package/dist/components/table.js +62 -26
  334. package/dist/components/tabs.d.ts +86 -17
  335. package/dist/components/tabs.d.ts.map +1 -1
  336. package/dist/components/tabs.js +93 -22
  337. package/dist/components/text-link.d.ts +4 -1
  338. package/dist/components/text-link.d.ts.map +1 -1
  339. package/dist/components/text-link.js +4 -1
  340. package/dist/components/text-with-copy-button.d.ts +30 -0
  341. package/dist/components/text-with-copy-button.d.ts.map +1 -0
  342. package/dist/components/text-with-copy-button.js +32 -0
  343. package/dist/components/textarea.d.ts +40 -10
  344. package/dist/components/textarea.d.ts.map +1 -1
  345. package/dist/components/textarea.js +50 -11
  346. package/dist/components/theme-mode-switcher.d.ts +18 -1
  347. package/dist/components/theme-mode-switcher.d.ts.map +1 -1
  348. package/dist/components/theme-mode-switcher.js +20 -2
  349. package/dist/components/toggle-group.d.ts +28 -8
  350. package/dist/components/toggle-group.d.ts.map +1 -1
  351. package/dist/components/toggle-group.js +12 -6
  352. package/dist/components/toggle.d.ts +6 -3
  353. package/dist/components/toggle.d.ts.map +1 -1
  354. package/dist/components/toggle.js +10 -7
  355. package/dist/components/tooltip.d.ts +43 -12
  356. package/dist/components/tooltip.d.ts.map +1 -1
  357. package/dist/components/tooltip.js +45 -16
  358. package/dist/components/trend-badge.js +1 -1
  359. package/dist/components/update-card.js +1 -1
  360. package/dist/eslint/index.js +82 -0
  361. package/dist/eslint/rules/badge-is-static-label.js +93 -0
  362. package/dist/eslint/rules/button-icon-slot.js +102 -0
  363. package/dist/eslint/rules/button-link-for-navigation.js +146 -0
  364. package/dist/eslint/rules/button-no-aria-label-with-text.js +75 -0
  365. package/dist/eslint/rules/button-type-roles-only-in-buttons.js +83 -0
  366. package/dist/eslint/rules/choice-control-has-a-name.js +98 -0
  367. package/dist/eslint/rules/choice-group-in-fieldset.js +86 -0
  368. package/dist/eslint/rules/command-shortcut-single-owner.js +118 -0
  369. package/dist/eslint/rules/confirm-dialog-words.js +63 -0
  370. package/dist/eslint/rules/data-table-one-unsized-column.js +96 -0
  371. package/dist/eslint/rules/destructive-action-placement.js +69 -0
  372. package/dist/eslint/rules/disabled-choice-says-why.js +71 -0
  373. package/dist/eslint/rules/ellipsis-opens-a-dialog.js +110 -0
  374. package/dist/eslint/rules/input-group-owners.js +155 -0
  375. package/dist/eslint/rules/kbd-children-no-modifier-text.js +128 -0
  376. package/dist/eslint/rules/literal-text.js +41 -0
  377. package/dist/eslint/rules/middle-truncate-placement.js +69 -0
  378. package/dist/eslint/rules/no-bare-button-label.js +55 -0
  379. package/dist/eslint/rules/no-control-in-read-only-surface.js +106 -0
  380. package/dist/eslint/rules/no-hand-built-busy.js +104 -0
  381. package/dist/eslint/rules/no-hand-built-theme-picker.js +144 -0
  382. package/dist/eslint/rules/no-hand-built-tile.js +41 -0
  383. package/dist/eslint/rules/no-hand-formatted-date.js +87 -0
  384. package/dist/eslint/rules/no-hand-stacked-avatars.js +67 -0
  385. package/dist/eslint/rules/no-nested-collapse.js +60 -0
  386. package/dist/eslint/rules/no-search-in-form.js +47 -0
  387. package/dist/eslint/rules/no-shadcn-appearance-override.js +2 -16
  388. package/dist/eslint/rules/no-shell-prompt-in-snippet.js +74 -0
  389. package/dist/eslint/rules/no-stock-error-words.js +56 -0
  390. package/dist/eslint/rules/no-tooltip-around-labelled-field.js +72 -0
  391. package/dist/eslint/rules/no-weight-class-on-strong-in-type-role.js +57 -0
  392. package/dist/eslint/rules/one-submenu-level.js +43 -0
  393. package/dist/eslint/rules/one-toast-per-flow.js +91 -0
  394. package/dist/eslint/rules/option-count.js +167 -0
  395. package/dist/eslint/rules/page-command-link-not-render.js +43 -0
  396. package/dist/eslint/rules/progress-needs-name.js +57 -0
  397. package/dist/eslint/rules/settings-limit-in-footer.js +94 -0
  398. package/dist/eslint/rules/skeleton-in-region.js +80 -0
  399. package/dist/eslint/rules/sortable-heading-uses-sort.js +79 -0
  400. package/dist/eslint/rules/table-cell-inset-owner.js +107 -0
  401. package/dist/eslint/rules/tabs-selection-is-controlled.js +47 -0
  402. package/dist/eslint/rules/tooltip-only-arrow.js +38 -0
  403. package/dist/eslint/rules/tooltip-trigger-accessible-name.js +114 -0
  404. package/dist/eslint/strict-design-system.js +21 -7
  405. package/dist/index.d.ts +13 -13
  406. package/dist/index.d.ts.map +1 -1
  407. package/dist/index.js +12 -13
  408. package/dist/internal/assistant-ui/attachment.d.ts.map +1 -1
  409. package/dist/internal/assistant-ui/attachment.js +2 -2
  410. package/dist/internal/assistant-ui/reasoning.d.ts +1 -1
  411. package/dist/internal/assistant-ui/reasoning.d.ts.map +1 -1
  412. package/dist/internal/assistant-ui/tool-fallback.js +1 -1
  413. package/dist/internal/assistant-ui/tool-group.d.ts +1 -1
  414. package/dist/internal/assistant-ui/tool-group.d.ts.map +1 -1
  415. package/dist/internal/assistant-ui/tooltip-icon-button.d.ts +2 -3
  416. package/dist/internal/assistant-ui/tooltip-icon-button.d.ts.map +1 -1
  417. package/dist/internal/assistant-ui/tooltip-icon-button.js +1 -1
  418. package/dist/internal/catalog-list.js +2 -2
  419. package/dist/internal/collection-note.d.ts +23 -0
  420. package/dist/internal/collection-note.d.ts.map +1 -0
  421. package/dist/internal/collection-note.js +17 -0
  422. package/dist/internal/collection-rail.d.ts +57 -0
  423. package/dist/internal/collection-rail.d.ts.map +1 -0
  424. package/dist/internal/collection-rail.js +33 -0
  425. package/dist/internal/company-logo.d.ts +18 -0
  426. package/dist/internal/company-logo.d.ts.map +1 -0
  427. package/dist/internal/company-logo.js +14 -0
  428. package/dist/internal/control-name.d.ts +12 -0
  429. package/dist/internal/control-name.d.ts.map +1 -0
  430. package/dist/internal/control-name.js +1 -0
  431. package/dist/internal/diff-line.d.ts +9 -0
  432. package/dist/internal/diff-line.d.ts.map +1 -0
  433. package/dist/internal/diff-line.js +8 -0
  434. package/dist/internal/empty.d.ts +8 -4
  435. package/dist/internal/empty.d.ts.map +1 -1
  436. package/dist/internal/empty.js +14 -8
  437. package/dist/internal/field-frame.d.ts +33 -0
  438. package/dist/internal/field-frame.d.ts.map +1 -0
  439. package/dist/internal/field-frame.js +20 -0
  440. package/dist/internal/final-focus.d.ts +8 -0
  441. package/dist/internal/final-focus.d.ts.map +1 -0
  442. package/dist/internal/final-focus.js +10 -0
  443. package/dist/internal/footer-strip.d.ts.map +1 -1
  444. package/dist/internal/footer-strip.js +3 -1
  445. package/dist/internal/form-submit.d.ts +9 -5
  446. package/dist/internal/form-submit.d.ts.map +1 -1
  447. package/dist/internal/form-submit.js +31 -2
  448. package/dist/internal/input-box.d.ts +26 -0
  449. package/dist/internal/input-box.d.ts.map +1 -0
  450. package/dist/internal/input-box.js +59 -0
  451. package/dist/internal/menu-surface.d.ts +10 -3
  452. package/dist/internal/menu-surface.d.ts.map +1 -1
  453. package/dist/internal/menu-surface.js +10 -3
  454. package/dist/internal/notice.d.ts +25 -0
  455. package/dist/internal/notice.d.ts.map +1 -0
  456. package/dist/internal/notice.js +33 -0
  457. package/dist/internal/overlay-stem.d.ts +5 -0
  458. package/dist/internal/overlay-stem.d.ts.map +1 -0
  459. package/dist/internal/overlay-stem.js +7 -0
  460. package/dist/internal/phone-sheet.d.ts +4 -0
  461. package/dist/internal/phone-sheet.d.ts.map +1 -0
  462. package/dist/internal/phone-sheet.js +2 -0
  463. package/dist/internal/present-content.d.ts +3 -0
  464. package/dist/internal/present-content.d.ts.map +1 -0
  465. package/dist/internal/present-content.js +1 -0
  466. package/dist/internal/record-menu-items.d.ts +4 -3
  467. package/dist/internal/record-menu-items.d.ts.map +1 -1
  468. package/dist/internal/record-menu-items.js +21 -6
  469. package/dist/internal/settings-save.d.ts +9 -2
  470. package/dist/internal/settings-save.d.ts.map +1 -1
  471. package/dist/internal/settings-save.js +9 -6
  472. package/dist/internal/table-compact-line.d.ts +38 -0
  473. package/dist/internal/table-compact-line.d.ts.map +1 -0
  474. package/dist/internal/table-compact-line.js +35 -0
  475. package/dist/internal/title-when-cut.d.ts +8 -0
  476. package/dist/internal/title-when-cut.d.ts.map +1 -0
  477. package/dist/internal/title-when-cut.js +22 -0
  478. package/dist/internal/unsaved-guard.d.ts +18 -0
  479. package/dist/internal/unsaved-guard.d.ts.map +1 -0
  480. package/dist/internal/unsaved-guard.js +31 -0
  481. package/dist/lib/merge-tokens.generated.js +2 -2
  482. package/dist/showcase/foundations.d.ts.map +1 -1
  483. package/dist/showcase/foundations.js +10 -2
  484. package/dist/showcase/specimens/actions.d.ts +2 -0
  485. package/dist/showcase/specimens/actions.d.ts.map +1 -1
  486. package/dist/showcase/specimens/actions.js +30 -5
  487. package/dist/showcase/specimens/charts.d.ts.map +1 -1
  488. package/dist/showcase/specimens/charts.js +22 -13
  489. package/dist/showcase/specimens/choices.d.ts +14 -3
  490. package/dist/showcase/specimens/choices.d.ts.map +1 -1
  491. package/dist/showcase/specimens/choices.js +93 -13
  492. package/dist/showcase/specimens/compositions.d.ts.map +1 -1
  493. package/dist/showcase/specimens/compositions.js +136 -23
  494. package/dist/showcase/specimens/data.d.ts +12 -7
  495. package/dist/showcase/specimens/data.d.ts.map +1 -1
  496. package/dist/showcase/specimens/data.js +139 -35
  497. package/dist/showcase/specimens/feedback.d.ts +2 -0
  498. package/dist/showcase/specimens/feedback.d.ts.map +1 -1
  499. package/dist/showcase/specimens/feedback.js +39 -15
  500. package/dist/showcase/specimens/index.d.ts +20 -12
  501. package/dist/showcase/specimens/index.d.ts.map +1 -1
  502. package/dist/showcase/specimens/inputs.d.ts +4 -2
  503. package/dist/showcase/specimens/inputs.d.ts.map +1 -1
  504. package/dist/showcase/specimens/inputs.js +62 -19
  505. package/dist/showcase/specimens/menus.d.ts +0 -1
  506. package/dist/showcase/specimens/menus.d.ts.map +1 -1
  507. package/dist/showcase/specimens/menus.js +47 -17
  508. package/dist/showcase/specimens/navigation.d.ts +6 -4
  509. package/dist/showcase/specimens/navigation.d.ts.map +1 -1
  510. package/dist/showcase/specimens/navigation.js +61 -32
  511. package/dist/showcase/specimens/other.d.ts +1 -3
  512. package/dist/showcase/specimens/other.d.ts.map +1 -1
  513. package/dist/showcase/specimens/other.js +17 -13
  514. package/dist/showcase/specimens/status.d.ts +4 -1
  515. package/dist/showcase/specimens/status.d.ts.map +1 -1
  516. package/dist/showcase/specimens/status.js +64 -11
  517. package/dist/showcase/usage.generated.d.ts +1 -1
  518. package/dist/showcase/usage.generated.d.ts.map +1 -1
  519. package/dist/showcase/usage.generated.js +632 -544
  520. package/dist/standalone/index.js +1 -1
  521. package/dist/styles/components.css +13 -13
  522. package/dist/styles/globals.css +25 -0
  523. package/package.json +2 -3
  524. package/dist/components/approval-row.d.ts +0 -34
  525. package/dist/components/approval-row.d.ts.map +0 -1
  526. package/dist/components/approval-row.js +0 -27
  527. package/dist/components/channel-view.d.ts +0 -112
  528. package/dist/components/channel-view.d.ts.map +0 -1
  529. package/dist/components/channel-view.js +0 -84
  530. package/dist/components/dashboard-shell.d.ts +0 -51
  531. package/dist/components/dashboard-shell.d.ts.map +0 -1
  532. package/dist/components/dashboard-shell.js +0 -89
  533. package/dist/components/direction.d.ts +0 -2
  534. package/dist/components/direction.d.ts.map +0 -1
  535. package/dist/components/direction.js +0 -1
  536. package/dist/components/expandable-block.d.ts +0 -20
  537. package/dist/components/expandable-block.d.ts.map +0 -1
  538. package/dist/components/expandable-block.js +0 -32
  539. package/dist/components/form.d.ts +0 -42
  540. package/dist/components/form.d.ts.map +0 -1
  541. package/dist/components/form.js +0 -91
  542. package/dist/components/label-system.d.ts +0 -17
  543. package/dist/components/label-system.d.ts.map +0 -1
  544. package/dist/components/label-system.js +0 -21
  545. package/dist/components/memory-item.d.ts +0 -21
  546. package/dist/components/memory-item.d.ts.map +0 -1
  547. package/dist/components/memory-item.js +0 -18
  548. package/dist/components/menubar.d.ts +0 -43
  549. package/dist/components/menubar.d.ts.map +0 -1
  550. package/dist/components/menubar.js +0 -69
  551. package/dist/components/navigation-menu.d.ts +0 -26
  552. package/dist/components/navigation-menu.d.ts.map +0 -1
  553. package/dist/components/navigation-menu.js +0 -45
  554. package/dist/components/pagination.d.ts +0 -33
  555. package/dist/components/pagination.d.ts.map +0 -1
  556. package/dist/components/pagination.js +0 -41
  557. package/dist/components/plugin-slot-boundary.d.ts +0 -42
  558. package/dist/components/plugin-slot-boundary.d.ts.map +0 -1
  559. package/dist/components/plugin-slot-boundary.js +0 -41
  560. package/dist/components/status-row.d.ts +0 -32
  561. package/dist/components/status-row.d.ts.map +0 -1
  562. package/dist/components/status-row.js +0 -35
@@ -1,19 +1,71 @@
1
1
  import * as React from "react";
2
+ import { type FieldName } from "../internal/field-frame.js";
3
+ import { type FieldSize } from "../internal/input-box.js";
4
+ export type { FieldSize };
5
+ type InputProps = Omit<React.ComponentProps<"input">, "size" | "prefix"> & {
6
+ size?: FieldSize;
7
+ /** Literal text or a mark in a cell before the value: `https://`. */
8
+ prefix?: React.ReactNode;
9
+ /** Literal text or a mark in a cell after the value: `.com`. */
10
+ suffix?: React.ReactNode;
11
+ /** `segment` draws the prefix and suffix as filled cells with a divider; `plain` sets them on the box's own fill. */
12
+ look?: "segment" | "plain";
13
+ /** A pill: the box, its cells and its halo take the full corner. */
14
+ rounded?: boolean;
15
+ /** One muted sentence under the box that says what to enter, read with the box. */
16
+ description?: string;
17
+ /** The message under the box, in the product's words; it also marks the box invalid. */
18
+ error?: string;
19
+ } & FieldName;
2
20
  /**
3
- * One line of free text, edged in the input grey.
21
+ * One line of free text.
4
22
  *
5
23
  * @family Inputs
6
- * @when One free-form value on one line: a name, an address, a number.
7
- * @instead Text with a fixed prefix, an icon or a button inside is `InputGroup`. Several lines are
8
- * `Textarea`. A known set of values is a select, radios or a combobox.
9
- * @behaviour 36 px, edged in the `input` role's grey with no shadow, 6 px corners. Focus is the 2 px outline. Invalid keeps a red edge and a red outline even without
10
- * focus. Disabled is 50% on a half-grey fill. The value survives a failed save.
11
- * @words The label is a noun in sentence case with no colon. The placeholder is an example (*Bizeta
12
- * Arredamenti*), never the label or an instruction. In a configuration section the box stops at 20
13
- * rem under its label.
14
- * @access A visible `label` tied by `id`, the help and the error joined through `aria-describedby`,
15
- * `aria-invalid` when wrong. Use the right `type`, `autocomplete` and `inputMode`.
24
+ * @when "Retrieve text input from a user." (https://vercel.com/geist/input) "Pick `<Input>` for a
25
+ * single line of free-form text such as names, domains, or tokens." (https://vercel.com/geist/input)
26
+ * @instead "Switch to `Textarea` the moment content can wrap to multiple lines."
27
+ * (https://vercel.com/geist/input) "Use `Combobox` when the value comes from a known list the user
28
+ * filters by typing." (https://vercel.com/geist/input) "For an inline search box, set the `search`
29
+ * variant with a scoped placeholder like `Search projects`; don’t embed a `<SearchInput>` inside an
30
+ * unrelated form." (https://vercel.com/geist/input) Ours: there is no `search` variant. A
31
+ * collection's search is `CollectionSearch`, and a value people empty often is `ClearableInput`. A
32
+ * short known set is radios or a select. A button inside the box, or a server-given value with its
33
+ * copy button, is an `InputGroup`.
34
+ * @behaviour Sizes `sm` (32 px), default (36 px) and `lg` (40 px, larger type) are shared by every
35
+ * field, so fields in a row line up. The edge is a 1 px ring outside the box that darkens on hover;
36
+ * focus makes it full strength with a soft 4 px halo around it. Colour sits in one place: an error
37
+ * turns the ring red and fills the halo, always and also while focused, and colours the message;
38
+ * the label, fill, text and placeholder stay neutral. Disabled steps down in fill and text, never
39
+ * in opacity, and ignores hover. `label` and `error` draw the `Field` parts around the box: the
40
+ * label above it, the message under it with an alert mark. `prefix` and `suffix` are filled cells
41
+ * inside the ring, divided from the text, with 14 px marks (8 px of padding at `sm`); the suffix
42
+ * reads in the text colour. `look="plain"` sets both on the box's own fill with no divider, flush
43
+ * against the text. `rounded` makes the box a pill. `className` lands on the box. "Validate on
44
+ * blur, not on every keystroke; surface the message by passing a string to `error`."
45
+ * (https://vercel.com/geist/input) "Trim leading and trailing whitespace before submit so `
46
+ * example.com` and `example.com` resolve to one value." (https://vercel.com/geist/input) "Keep the
47
+ * field focusable while saving; pair `disabled` with a spinner only when input is impossible."
48
+ * (https://vercel.com/geist/input) "Don’t wrap a labelled `<Input>` in a `Tooltip`; put the
49
+ * explainer on a sibling icon button so the label stays announced."
50
+ * (https://vercel.com/geist/input) "Helper text is sentence case, one sentence with a trailing
51
+ * period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input)
52
+ * Ours: help is the one-line description of the card or form around the field, not a line under it.
53
+ * Nothing spins while a field saves. Only the forms `Field` names trim.
54
+ * @words "Labels are short Title Case nouns: `Project Name`, `Domain`, `Environment Variable
55
+ * Name`." (https://vercel.com/geist/input) "Placeholders show an example value
56
+ * (`my-awesome-project`, `example.com`), never instructions like `Enter your project name`."
57
+ * (https://vercel.com/geist/input) "Validation names the field and the constraint, ends in a
58
+ * period, and skips `please` (`Project name is required.`, `Code must be 6 digits.`)."
59
+ * (https://vercel.com/geist/input) Ours: the label is a short noun in sentence case with no colon,
60
+ * not Title Case, and the example comes from our catalogue (*Bizeta Arredamenti*).
61
+ * @access "Passing a string to `label` requires `id`; the `InputPropsWithStringLabelAndId` union
62
+ * won’t compile without it and screen readers lose the association."
63
+ * (https://vercel.com/geist/input) Ours: a field whose name is drawn elsewhere (a toolbar's search,
64
+ * a table cell) takes `aria-label` or `aria-labelledby` instead, and one with no name does not
65
+ * compile. The error is joined through `aria-describedby`. Use the right `type`, `autocomplete` and
66
+ * `inputMode`. "For icon-only affordances inside a row of inputs, use `<Button shape="circle"
67
+ * svgOnly aria-label="…">` rather than an unlabeled icon." (https://vercel.com/geist/input)
16
68
  */
17
- declare function Input({ className, type, ...props }: React.ComponentProps<"input">): React.JSX.Element;
69
+ declare function Input({ label, description, error, prefix, suffix, look, rounded, size, className, ...props }: InputProps): React.JSX.Element;
18
70
  export { Input };
19
71
  //# sourceMappingURL=input.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/components/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;;;;;;;;;;;;GAcG;AACH,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,qBAY1E;AAED,OAAO,EAAE,KAAK,EAAE,CAAC"}
1
+ {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/components/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACpE,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAGhE,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,KAAK,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC,GAAG;IACzE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,qEAAqE;IACrE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,gEAAgE;IAChE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,qHAAqH;IACrH,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC3B,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mFAAmF;IACnF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wFAAwF;IACxF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,SAAS,CAAC;AAEd;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgDG;AACH,iBAAS,KAAK,CAAC,EACb,KAAK,EACL,WAAW,EACX,KAAK,EACL,MAAM,EACN,MAAM,EACN,IAAgB,EAChB,OAAe,EACf,IAAgB,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,UAAU,qBAyBZ;AAED,OAAO,EAAE,KAAK,EAAE,CAAC"}
@@ -1,22 +1,58 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { Input as InputPrimitive } from "@base-ui/react/input";
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
2
  import { cn } from "../lib/utils.js";
3
+ import { FieldFrame } from "../internal/field-frame.js";
4
+ import { InputBox } from "../internal/input-box.js";
5
+ import { InputGroup, InputGroupAddon, InputGroupControl } from "./input-group.js";
4
6
  /**
5
- * One line of free text, edged in the input grey.
7
+ * One line of free text.
6
8
  *
7
9
  * @family Inputs
8
- * @when One free-form value on one line: a name, an address, a number.
9
- * @instead Text with a fixed prefix, an icon or a button inside is `InputGroup`. Several lines are
10
- * `Textarea`. A known set of values is a select, radios or a combobox.
11
- * @behaviour 36 px, edged in the `input` role's grey with no shadow, 6 px corners. Focus is the 2 px outline. Invalid keeps a red edge and a red outline even without
12
- * focus. Disabled is 50% on a half-grey fill. The value survives a failed save.
13
- * @words The label is a noun in sentence case with no colon. The placeholder is an example (*Bizeta
14
- * Arredamenti*), never the label or an instruction. In a configuration section the box stops at 20
15
- * rem under its label.
16
- * @access A visible `label` tied by `id`, the help and the error joined through `aria-describedby`,
17
- * `aria-invalid` when wrong. Use the right `type`, `autocomplete` and `inputMode`.
10
+ * @when "Retrieve text input from a user." (https://vercel.com/geist/input) "Pick `<Input>` for a
11
+ * single line of free-form text such as names, domains, or tokens." (https://vercel.com/geist/input)
12
+ * @instead "Switch to `Textarea` the moment content can wrap to multiple lines."
13
+ * (https://vercel.com/geist/input) "Use `Combobox` when the value comes from a known list the user
14
+ * filters by typing." (https://vercel.com/geist/input) "For an inline search box, set the `search`
15
+ * variant with a scoped placeholder like `Search projects`; don’t embed a `<SearchInput>` inside an
16
+ * unrelated form." (https://vercel.com/geist/input) Ours: there is no `search` variant. A
17
+ * collection's search is `CollectionSearch`, and a value people empty often is `ClearableInput`. A
18
+ * short known set is radios or a select. A button inside the box, or a server-given value with its
19
+ * copy button, is an `InputGroup`.
20
+ * @behaviour Sizes `sm` (32 px), default (36 px) and `lg` (40 px, larger type) are shared by every
21
+ * field, so fields in a row line up. The edge is a 1 px ring outside the box that darkens on hover;
22
+ * focus makes it full strength with a soft 4 px halo around it. Colour sits in one place: an error
23
+ * turns the ring red and fills the halo, always and also while focused, and colours the message;
24
+ * the label, fill, text and placeholder stay neutral. Disabled steps down in fill and text, never
25
+ * in opacity, and ignores hover. `label` and `error` draw the `Field` parts around the box: the
26
+ * label above it, the message under it with an alert mark. `prefix` and `suffix` are filled cells
27
+ * inside the ring, divided from the text, with 14 px marks (8 px of padding at `sm`); the suffix
28
+ * reads in the text colour. `look="plain"` sets both on the box's own fill with no divider, flush
29
+ * against the text. `rounded` makes the box a pill. `className` lands on the box. "Validate on
30
+ * blur, not on every keystroke; surface the message by passing a string to `error`."
31
+ * (https://vercel.com/geist/input) "Trim leading and trailing whitespace before submit so `
32
+ * example.com` and `example.com` resolve to one value." (https://vercel.com/geist/input) "Keep the
33
+ * field focusable while saving; pair `disabled` with a spinner only when input is impossible."
34
+ * (https://vercel.com/geist/input) "Don’t wrap a labelled `<Input>` in a `Tooltip`; put the
35
+ * explainer on a sibling icon button so the label stays announced."
36
+ * (https://vercel.com/geist/input) "Helper text is sentence case, one sentence with a trailing
37
+ * period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input)
38
+ * Ours: help is the one-line description of the card or form around the field, not a line under it.
39
+ * Nothing spins while a field saves. Only the forms `Field` names trim.
40
+ * @words "Labels are short Title Case nouns: `Project Name`, `Domain`, `Environment Variable
41
+ * Name`." (https://vercel.com/geist/input) "Placeholders show an example value
42
+ * (`my-awesome-project`, `example.com`), never instructions like `Enter your project name`."
43
+ * (https://vercel.com/geist/input) "Validation names the field and the constraint, ends in a
44
+ * period, and skips `please` (`Project name is required.`, `Code must be 6 digits.`)."
45
+ * (https://vercel.com/geist/input) Ours: the label is a short noun in sentence case with no colon,
46
+ * not Title Case, and the example comes from our catalogue (*Bizeta Arredamenti*).
47
+ * @access "Passing a string to `label` requires `id`; the `InputPropsWithStringLabelAndId` union
48
+ * won’t compile without it and screen readers lose the association."
49
+ * (https://vercel.com/geist/input) Ours: a field whose name is drawn elsewhere (a toolbar's search,
50
+ * a table cell) takes `aria-label` or `aria-labelledby` instead, and one with no name does not
51
+ * compile. The error is joined through `aria-describedby`. Use the right `type`, `autocomplete` and
52
+ * `inputMode`. "For icon-only affordances inside a row of inputs, use `<Button shape="circle"
53
+ * svgOnly aria-label="…">` rather than an unlabeled icon." (https://vercel.com/geist/input)
18
54
  */
19
- function Input({ className, type, ...props }) {
20
- return (_jsx(InputPrimitive, { type: type, "data-slot": "input", className: cn("h-control-height min-h-touch-target w-full min-w-0 rounded-sm border border-input bg-background px-control-padding-inline py-1 text-base transition-colors file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-placeholder disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive [@media(hover:hover)_and_(pointer:fine)]:min-h-0 md:text-sm", className), ...props }));
55
+ function Input({ label, description, error, prefix, suffix, look = "segment", rounded = false, size = "default", className, ...props }) {
56
+ return (_jsx(FieldFrame, { label: label, description: description, error: error, size: size, control: props, children: (aria) => prefix || suffix ? (_jsxs(InputGroup, { size: size, rounded: rounded, className: className, children: [prefix ? _jsx(InputGroupAddon, { look: look, children: prefix }) : null, _jsx(InputGroupControl, { ...props, ...aria }), suffix ? (_jsx(InputGroupAddon, { align: "inline-end", look: look, children: suffix })) : null] })) : (_jsx(InputBox, { size: size, className: cn(rounded && "rounded-full", className), ...props, ...aria })) }));
21
57
  }
22
58
  export { Input };
@@ -1,4 +1,5 @@
1
1
  import * as React from "react";
2
+ import type { Checkbox as CheckboxPrimitive } from "@base-ui/react/checkbox";
2
3
  import { useRender } from "@base-ui/react/use-render";
3
4
  import { type VariantProps } from "class-variance-authority";
4
5
  import { Separator } from "./separator.js";
@@ -15,23 +16,28 @@ declare function ItemGroup({ className, divided, render, ...props }: useRender.C
15
16
  declare function ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): React.JSX.Element;
16
17
  declare const itemVariants: (props?: ({
17
18
  variant?: "default" | "outline" | "muted" | null | undefined;
18
- size?: "default" | "xs" | "sm" | null | undefined;
19
+ size?: "default" | "xs" | null | undefined;
19
20
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
20
21
  /**
21
22
  * A row said in a sentence: media, a title, one line of description, trailing actions.
22
23
  *
23
24
  * @family Data
24
- * @when Things best said in a sentence: an activity feed, a Library shelf, connected accounts.
25
- * Media, a title, one line of description, trailing actions.
26
- * @instead Facts that compare across records are a `DataTable`. A page whose job is one collection
27
- * is `CollectionPage`. Agents in a gallery are `AgentListRow`; Library entries `CatalogEntry`.
28
- * @behaviour Inside a card the group is `divided`: no gaps, one hairline between items. An item
29
- * that is an `a` or `button` takes the `accent` hover and is one hit target; nested controls stay
30
- * independent. The title holds one line.
31
- * @words Title: the name, or what happened as a short sentence (*Nadia filed 12 invoices*).
32
- * Description: one sentence. One primary action as a button; the rest in the three dots.
33
- * @access The group is a `list` and each item a list item. A linked item's text is its name; image
34
- * media is decorative beside the title.
25
+ * @when “Use `<Entity>` for a row of descriptive content paired with one or two controls (member rows, integration rows, domain rows).” (https://vercel.com/geist/entity)
26
+ * Ours: things best said in a sentence, with one or two controls and no columns: a connected account, a session, a notification preference, a Library shelf row, an activity row. Media, a title over its description, trailing controls.
27
+ * @instead “For tabular data with sortable columns and shared row shape, use `Table` instead.” (https://vercel.com/geist/entity)
28
+ * “For a static key/value metadata block on a detail page, use `Description`.” (https://vercel.com/geist/entity)
29
+ * Ours: Geist's `Table` is a `DataTable` and its `Description` is `ObjectFacts`. An object a person opens, with a mark, facts and a status, is a `RecordList` row; the same row edited in place is a `RecordList` with an `editor`. A page whose job is one collection is `CollectionPage`. Agents in a gallery are `AgentListRow`; Library entries `CatalogEntry`.
30
+ * @behaviour Every row has a title over its one muted description line; only a message row read whole, or a second content beside the first, may be description only. Media, content and actions stand 16 px apart, centred on one another, in a 72 px row of 16 px padding; the title and the description each hold one line and end in an ellipsis (`whole` lets a message wrap). Inside a card the group is `divided`: no gaps, one hairline between items. An item that is an `a`, a `button` or a `label` takes the `accent` hover and is one hit target; a plain item never reacts to hover; nested controls stay independent. A button in the row is `size="sm"`. A row a person picks starts with `ItemSelect` and is drawn `render={<label />}`, so the whole row ticks its box and has no other control. A second content beside the first takes only the room its words need. Colour is neutral: the title in ink, the description and any trailing words muted, no hue.
31
+ * “The right column holds at most one or two controls. If the row needs more, move secondary actions into a `Dots Menu`.” (https://vercel.com/geist/entity)
32
+ * Ours: the third control goes in the row's three dots.
33
+ * “Render the Skeleton variant (`entity-with-skeleton`) during load instead of an empty row, and swap to real content once data resolves.” (https://vercel.com/geist/entity)
34
+ * Ours: `ItemSkeleton` stands in a `SkeletonRegion`, still, with no shimmer.
35
+ * @words “Lead the left column with a scannable identifier: an `Avatar` or icon, a Title Case label, then sentence-case secondary metadata (`Member since Mar 14, 2026`).” (https://vercel.com/geist/entity)
36
+ * “Keep right-column buttons Verb + Noun (`Remove Member`, `Resend Invite`). Bare verbs like `Remove` or `Confirm` lose context once the row scrolls offscreen.” (https://vercel.com/geist/entity)
37
+ * Ours: the title is the name, or what happened as a short sentence (*Nadia filed 12 invoices*), and the description one sentence, in sentence case: *Remove member*, never *Remove*.
38
+ * @access Draw each row of a group `render={<li />}`, so the group is a list of list items. A linked item's text is its name; image media is decorative beside the title.
39
+ * “For multi-select rows, the leading `Checkbox` carries `aria-label="Select {entity name}"` so the row is selectable without relying on the visual label.” (https://vercel.com/geist/entity)
40
+ * Ours: the box of `ItemSelect` is named *Select {name}* in the product's words.
35
41
  */
36
42
  declare function Item({ className, variant, size, render, ...props }: useRender.ComponentProps<"div"> & VariantProps<typeof itemVariants>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
37
43
  declare const itemMediaVariants: (props?: ({
@@ -41,11 +47,27 @@ declare function ItemMedia({ className, variant, ...props }: React.ComponentProp
41
47
  declare function ItemContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
42
48
  declare function ItemTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
43
49
  declare function ItemDescription({ className, whole, ...props }: React.ComponentProps<"p"> & {
44
- /** A message read whole, such as a failure and its next step, is never cut to two lines. */
50
+ /** A message read whole, such as a failure and its next step, wraps instead of ending in an ellipsis. */
45
51
  whole?: boolean;
46
52
  }): React.JSX.Element;
47
- declare function ItemActions({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
53
+ type ItemAction = React.ReactElement | string | number | false | null | undefined;
54
+ declare function ItemActions({ className, ...props }: Omit<React.ComponentProps<"div">, "children"> & {
55
+ /** One or two controls; a third goes in the row's three dots. */
56
+ children?: ItemAction | readonly [ItemAction, ItemAction];
57
+ }): React.JSX.Element;
58
+ declare function ItemSelect({ label, ...props }: Omit<CheckboxPrimitive.Root.Props, "aria-label" | "aria-labelledby"> & {
59
+ /** Names the box for assistive technology: "Select Chrome, Mac". */
60
+ label: string;
61
+ }): React.JSX.Element;
62
+ /**
63
+ * The place of one item while its record loads: a bar for the title line and three for the
64
+ * description line.
65
+ *
66
+ * “Set `width` and `height` to match the final content so the layout doesn’t shift when data resolves.” (https://vercel.com/geist/skeleton)
67
+ * Ours: the bars are sized like the final row.
68
+ */
69
+ declare function ItemSkeleton({ className, ...props }: Omit<React.ComponentProps<"div">, "children">): React.JSX.Element;
48
70
  declare function ItemHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
49
71
  declare function ItemFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
50
- export { Item, ItemMedia, ItemContent, ItemActions, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, };
72
+ export { Item, ItemMedia, ItemContent, ItemActions, ItemSelect, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, ItemSkeleton, };
51
73
  //# sourceMappingURL=item.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../src/components/item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAEnD,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAe,EACf,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IACnC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,0EAmBA;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,qBAWrF;AAED,QAAA,MAAM,YAAY;;;8EAoBjB,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,0EAgBrE;AAED,QAAA,MAAM,iBAAiB;;8EAetB,CAAC;AAEF,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,qBAStE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWxE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWtE;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAa,EACb,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAC7B,4FAA4F;IAC5F,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,qBAYA;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAIxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,OAAO,EACL,IAAI,EACJ,SAAS,EACT,WAAW,EACX,WAAW,EACX,SAAS,EACT,aAAa,EACb,SAAS,EACT,eAAe,EACf,UAAU,EACV,UAAU,GACX,CAAC"}
1
+ {"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../src/components/item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAE7E,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAGnD,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAe,EACf,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IACnC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,0EAmBA;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,qBAWrF;AAED,QAAA,MAAM,YAAY;;;8EAmBjB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,0EAgBrE;AAED,QAAA,MAAM,iBAAiB;;8EAetB,CAAC;AAEF,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,qBAStE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWxE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWtE;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAa,EACb,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAC7B,yGAAyG;IACzG,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,qBAYA;AAED,KAAK,UAAU,GAAG,KAAK,CAAC,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC;AAElF,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IACjD,iEAAiE;IACjE,QAAQ,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;CAC3D,qBAIA;AAED,iBAAS,UAAU,CAAC,EAClB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,EAAE,YAAY,GAAG,iBAAiB,CAAC,GAAG;IACxE,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAC;CACf,qBAMA;AAED;;;;;;GAMG;AACH,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,qBAW3F;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,OAAO,EACL,IAAI,EACJ,SAAS,EACT,WAAW,EACX,WAAW,EACX,UAAU,EACV,SAAS,EACT,aAAa,EACb,SAAS,EACT,eAAe,EACf,UAAU,EACV,UAAU,EACV,YAAY,GACb,CAAC"}
@@ -1,9 +1,11 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { mergeProps } from "@base-ui/react/merge-props";
3
3
  import { useRender } from "@base-ui/react/use-render";
4
4
  import { cva } from "class-variance-authority";
5
5
  import { cn } from "../lib/utils.js";
6
+ import { Checkbox } from "./checkbox.js";
6
7
  import { Separator } from "./separator.js";
8
+ import { Skeleton } from "./skeleton.js";
7
9
  function ItemGroup({ className, divided = false, render, ...props }) {
8
10
  return useRender({
9
11
  defaultTagName: "div",
@@ -11,7 +13,7 @@ function ItemGroup({ className, divided = false, render, ...props }) {
11
13
  role: "list",
12
14
  className: cn("group/item-group flex w-full flex-col", divided
13
15
  ? "[&>*:not(:last-child)]:border-b [&>*:not(:last-child)]:border-b-border"
14
- : "gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", className),
16
+ : "gap-4 has-data-[size=xs]:gap-2", className),
15
17
  }, props),
16
18
  render,
17
19
  state: { slot: "item-group", divided },
@@ -20,7 +22,7 @@ function ItemGroup({ className, divided = false, render, ...props }) {
20
22
  function ItemSeparator({ className, ...props }) {
21
23
  return (_jsx(Separator, { "data-slot": "item-separator", orientation: "horizontal", className: cn("my-2", className), ...props, "aria-hidden": "true", role: "presentation" }));
22
24
  }
23
- const itemVariants = cva("nc-transition-paint group/item flex w-full flex-wrap items-center rounded-sm border text-sm in-data-divided:rounded-none in-data-divided:border-0 [a]:transition-colors [a]:hover:bg-accent [button]:transition-colors [button]:text-left [button]:enabled:hover:bg-accent [button]:disabled:opacity-50", {
25
+ const itemVariants = cva("nc-transition-paint group/item flex w-full flex-wrap items-center rounded-sm border text-sm in-data-divided:rounded-none in-data-divided:border-0 [a]:transition-colors [a]:hover:bg-accent [label]:cursor-pointer [label]:transition-colors [label]:hover:bg-accent [button]:transition-colors [button]:text-left [button]:enabled:hover:bg-accent [button]:disabled:opacity-50", {
24
26
  variants: {
25
27
  variant: {
26
28
  default: "border-transparent",
@@ -28,8 +30,7 @@ const itemVariants = cva("nc-transition-paint group/item flex w-full flex-wrap i
28
30
  muted: "border-transparent bg-muted/50",
29
31
  },
30
32
  size: {
31
- default: "gap-2.5 px-3 py-2.5",
32
- sm: "gap-2.5 px-3 py-2.5",
33
+ default: "gap-4 p-4",
33
34
  xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0",
34
35
  },
35
36
  },
@@ -42,17 +43,22 @@ const itemVariants = cva("nc-transition-paint group/item flex w-full flex-wrap i
42
43
  * A row said in a sentence: media, a title, one line of description, trailing actions.
43
44
  *
44
45
  * @family Data
45
- * @when Things best said in a sentence: an activity feed, a Library shelf, connected accounts.
46
- * Media, a title, one line of description, trailing actions.
47
- * @instead Facts that compare across records are a `DataTable`. A page whose job is one collection
48
- * is `CollectionPage`. Agents in a gallery are `AgentListRow`; Library entries `CatalogEntry`.
49
- * @behaviour Inside a card the group is `divided`: no gaps, one hairline between items. An item
50
- * that is an `a` or `button` takes the `accent` hover and is one hit target; nested controls stay
51
- * independent. The title holds one line.
52
- * @words Title: the name, or what happened as a short sentence (*Nadia filed 12 invoices*).
53
- * Description: one sentence. One primary action as a button; the rest in the three dots.
54
- * @access The group is a `list` and each item a list item. A linked item's text is its name; image
55
- * media is decorative beside the title.
46
+ * @when “Use `<Entity>` for a row of descriptive content paired with one or two controls (member rows, integration rows, domain rows).” (https://vercel.com/geist/entity)
47
+ * Ours: things best said in a sentence, with one or two controls and no columns: a connected account, a session, a notification preference, a Library shelf row, an activity row. Media, a title over its description, trailing controls.
48
+ * @instead “For tabular data with sortable columns and shared row shape, use `Table` instead.” (https://vercel.com/geist/entity)
49
+ * “For a static key/value metadata block on a detail page, use `Description`.” (https://vercel.com/geist/entity)
50
+ * Ours: Geist's `Table` is a `DataTable` and its `Description` is `ObjectFacts`. An object a person opens, with a mark, facts and a status, is a `RecordList` row; the same row edited in place is a `RecordList` with an `editor`. A page whose job is one collection is `CollectionPage`. Agents in a gallery are `AgentListRow`; Library entries `CatalogEntry`.
51
+ * @behaviour Every row has a title over its one muted description line; only a message row read whole, or a second content beside the first, may be description only. Media, content and actions stand 16 px apart, centred on one another, in a 72 px row of 16 px padding; the title and the description each hold one line and end in an ellipsis (`whole` lets a message wrap). Inside a card the group is `divided`: no gaps, one hairline between items. An item that is an `a`, a `button` or a `label` takes the `accent` hover and is one hit target; a plain item never reacts to hover; nested controls stay independent. A button in the row is `size="sm"`. A row a person picks starts with `ItemSelect` and is drawn `render={<label />}`, so the whole row ticks its box and has no other control. A second content beside the first takes only the room its words need. Colour is neutral: the title in ink, the description and any trailing words muted, no hue.
52
+ * “The right column holds at most one or two controls. If the row needs more, move secondary actions into a `Dots Menu`.” (https://vercel.com/geist/entity)
53
+ * Ours: the third control goes in the row's three dots.
54
+ * “Render the Skeleton variant (`entity-with-skeleton`) during load instead of an empty row, and swap to real content once data resolves.” (https://vercel.com/geist/entity)
55
+ * Ours: `ItemSkeleton` stands in a `SkeletonRegion`, still, with no shimmer.
56
+ * @words “Lead the left column with a scannable identifier: an `Avatar` or icon, a Title Case label, then sentence-case secondary metadata (`Member since Mar 14, 2026`).” (https://vercel.com/geist/entity)
57
+ * “Keep right-column buttons Verb + Noun (`Remove Member`, `Resend Invite`). Bare verbs like `Remove` or `Confirm` lose context once the row scrolls offscreen.” (https://vercel.com/geist/entity)
58
+ * Ours: the title is the name, or what happened as a short sentence (*Nadia filed 12 invoices*), and the description one sentence, in sentence case: *Remove member*, never *Remove*.
59
+ * @access Draw each row of a group `render={<li />}`, so the group is a list of list items. A linked item's text is its name; image media is decorative beside the title.
60
+ * “For multi-select rows, the leading `Checkbox` carries `aria-label="Select {entity name}"` so the row is selectable without relying on the visual label.” (https://vercel.com/geist/entity)
61
+ * Ours: the box of `ItemSelect` is named *Select {name}* in the product's words.
56
62
  */
57
63
  function Item({ className, variant = "default", size = "default", render, ...props }) {
58
64
  return useRender({
@@ -68,12 +74,12 @@ function Item({ className, variant = "default", size = "default", render, ...pro
68
74
  },
69
75
  });
70
76
  }
71
- const itemMediaVariants = cva("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
77
+ const itemMediaVariants = cva("flex shrink-0 items-center justify-center gap-2 [&_svg]:pointer-events-none", {
72
78
  variants: {
73
79
  variant: {
74
80
  default: "bg-transparent",
75
81
  icon: "[&_svg:not([class*='size-'])]:size-4",
76
- image: "size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover",
82
+ image: "size-8 overflow-hidden rounded-sm group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover",
77
83
  },
78
84
  },
79
85
  defaultVariants: {
@@ -84,21 +90,34 @@ function ItemMedia({ className, variant = "default", ...props }) {
84
90
  return (_jsx("div", { "data-slot": "item-media", "data-variant": variant, className: cn(itemMediaVariants({ variant, className })), ...props }));
85
91
  }
86
92
  function ItemContent({ className, ...props }) {
87
- return (_jsx("div", { "data-slot": "item-content", className: cn("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className), ...props }));
93
+ return (_jsx("div", { "data-slot": "item-content", className: cn("flex min-w-0 flex-1 flex-col [&+[data-slot=item-content]]:flex-none", className), ...props }));
88
94
  }
89
95
  function ItemTitle({ className, ...props }) {
90
- return (_jsx("div", { "data-slot": "item-title", className: cn("line-clamp-1 flex w-fit items-center gap-2 text-left text-sm font-medium underline-offset-4", className), ...props }));
96
+ return (_jsx("div", { "data-slot": "item-title", className: cn("line-clamp-1 flex w-fit items-center gap-2 text-left text-sm font-semibold underline-offset-4", className), ...props }));
91
97
  }
92
98
  function ItemDescription({ className, whole = false, ...props }) {
93
- return (_jsx("p", { "data-slot": "item-description", className: cn(!whole && "line-clamp-2", "text-left text-sm font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
99
+ return (_jsx("p", { "data-slot": "item-description", className: cn(!whole && "truncate", "text-left text-sm font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
94
100
  }
95
101
  function ItemActions({ className, ...props }) {
96
102
  return (_jsx("div", { "data-slot": "item-actions", className: cn("flex items-center gap-2", className), ...props }));
97
103
  }
104
+ function ItemSelect({ label, ...props }) {
105
+ return (_jsx(ItemMedia, { children: _jsx(Checkbox, { "aria-label": label, ...props }) }));
106
+ }
107
+ /**
108
+ * The place of one item while its record loads: a bar for the title line and three for the
109
+ * description line.
110
+ *
111
+ * “Set `width` and `height` to match the final content so the layout doesn’t shift when data resolves.” (https://vercel.com/geist/skeleton)
112
+ * Ours: the bars are sized like the final row.
113
+ */
114
+ function ItemSkeleton({ className, ...props }) {
115
+ return (_jsxs(Item, { "aria-busy": "true", className: cn("flex-col items-stretch gap-2", className), ...props, children: [_jsx(Skeleton, { height: 20, width: "100%" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Skeleton, { height: 20, width: 70 }), _jsx(Skeleton, { height: 20, width: 60 }), _jsx(Skeleton, { height: 20, width: 68 })] })] }));
116
+ }
98
117
  function ItemHeader({ className, ...props }) {
99
118
  return (_jsx("div", { "data-slot": "item-header", className: cn("flex basis-full items-center justify-between gap-2", className), ...props }));
100
119
  }
101
120
  function ItemFooter({ className, ...props }) {
102
121
  return (_jsx("div", { "data-slot": "item-footer", className: cn("flex basis-full items-center justify-between gap-2", className), ...props }));
103
122
  }
104
- export { Item, ItemMedia, ItemContent, ItemActions, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, };
123
+ export { Item, ItemMedia, ItemContent, ItemActions, ItemSelect, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, ItemSkeleton, };
@@ -1,18 +1,54 @@
1
+ export declare const KBD_KEYS: readonly ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "/", ",", ".", "?", "[", "]", "-", "=", "Enter", "Esc", "Tab", "Space", "Backspace", "Delete", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
2
+ /** One key: a capital letter, a digit, a punctuation mark or a named key. */
3
+ export type KbdKey = (typeof KBD_KEYS)[number];
4
+ type Modifier = "meta" | "shift" | "alt" | "ctrl";
5
+ type Modifiers = {
6
+ [M in Modifier]?: boolean;
7
+ };
8
+ type SomeModifier = {
9
+ [M in Modifier]: Record<M, true> & Modifiers;
10
+ }[Modifier];
11
+ export type KbdProps = Omit<React.ComponentProps<"kbd">, "children"> & {
12
+ /** `sm` is for a menu row, a command item or a table cell. */
13
+ size?: "default" | "sm";
14
+ } & ((Modifiers & {
15
+ /**
16
+ * The key, which a modifier flag may precede. JSX text types as `string`, so the lint rule
17
+ * `kbd-children-no-modifier-text` holds it to `KBD_KEYS`.
18
+ */
19
+ children: string;
20
+ }) | (SomeModifier & {
21
+ children?: undefined;
22
+ }));
1
23
  /**
2
- * One key of a shortcut, beside the command it triggers.
24
+ * One key, or a modifier with its key, of a shortcut beside the command it triggers.
3
25
  *
4
26
  * @family Data
5
- * @when A shortcut hint next to the command it triggers: Find with ⌘K, the sidebar with ⌘B. 20 px,
6
- * 2 px corners, mono 12 on the recessed fill.
7
- * @instead A key a person types into is an `Input`; a code a person types is `InputOTP`. In a
8
- * command list, `CommandShortcut`.
9
- * @behaviour Not interactive. Only shortcuts actually bound are shown. The caller maps the
10
- * platform: ⌘ on macOS, Ctrl on Windows and Linux.
11
- * @words One key per `Kbd`; symbols for macOS modifiers (⌘ ⇧ ⌥), words elsewhere (*Ctrl*).
12
- * Surrounding prose stays outside the key.
13
- * @access A `kbd` element, read in order; the command's own name carries the meaning.
27
+ * @when "Use `<Kbd>` for shortcut hints inside prose, menu items, and button suffixes." "Use `small`
28
+ * inside dense surfaces like menu rows, command-bar items, or table cells where the default size
29
+ * crowds adjacent text." (https://vercel.com/geist/keyboard-input)
30
+ * Ours: `small` is `size="sm"`. Find with ⌘K, the sidebar with ⌘B. Only shortcuts actually bound are
31
+ * shown.
32
+ * @instead "In long-form docs that narrate a shortcut, write `the ⌘ K shortcut` directly so the page
33
+ * renders the same when copied to plain text." (https://vercel.com/geist/keyboard-input)
34
+ * Ours: a key a person types into is an `Input`; a code a person types is `InputOTP`.
35
+ * @behaviour "Pass modifiers via boolean props (`meta`, `shift`, `alt`, `ctrl`)." "The component
36
+ * swaps `⌘` for `Ctrl` on Windows and Linux, so hard-coding `<Kbd>Cmd+K</Kbd>` ships the wrong glyph
37
+ * to half your users." (https://vercel.com/geist/keyboard-input)
38
+ * Ours: not interactive. ⌘ ⇧ ⌥ ⌃ on Apple systems, *Ctrl* *Shift* *Alt* elsewhere, with `meta`
39
+ * becoming *Ctrl*. The server draws the Apple form and the browser corrects it after hydration.
40
+ * Several flags make one key: `meta shift`. It is 24 px high (`size="sm"`: 20 px) in the interface's
41
+ * sans type, 14 px (12 px), with no gap between Apple glyphs. Colour: one neutral key in the primary
42
+ * ink on the page surface with a hairline ring, no hue; inside a tooltip it drops the ring and takes
43
+ * a fill one step off the tooltip's inverted surface, at 20 px.
44
+ * @words "`children` is one key, digit, or named key (`K`, `7`, `Enter`, `Esc`)." "Don’t lowercase
45
+ * it, don’t spell out modifiers inside, and don’t pack a sentence into the element." "Punctuation
46
+ * lives outside the element: `Press <Kbd meta>K</Kbd> to open the command menu.`" "Period, comma,
47
+ * and `or` separators stay in surrounding prose so screen readers don’t announce them as keys."
48
+ * (https://vercel.com/geist/keyboard-input)
49
+ * Ours: children is a capital letter, a digit, a mark or a named key from `KBD_KEYS`.
50
+ * @access Ours: a `kbd` element, read in order; the command's own name carries the meaning.
14
51
  */
15
- declare function Kbd({ className, ...props }: React.ComponentProps<"kbd">): import("react").JSX.Element;
16
- declare function KbdGroup({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
17
- export { Kbd, KbdGroup };
52
+ declare function Kbd({ className, size, meta, shift, alt, ctrl, children, ...props }: KbdProps): import("react").JSX.Element;
53
+ export { Kbd };
18
54
  //# sourceMappingURL=kbd.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"kbd.d.ts","sourceRoot":"","sources":["../../src/components/kbd.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;GAaG;AACH,iBAAS,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAWhE;AAED,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAQrE;AAED,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC"}
1
+ {"version":3,"file":"kbd.d.ts","sourceRoot":"","sources":["../../src/components/kbd.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,QAAQ,iVAuDX,CAAC;AAEX,6EAA6E;AAC7E,MAAM,MAAM,MAAM,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;AAE/C,KAAK,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,MAAM,CAAC;AAClD,KAAK,SAAS,GAAG;KAAG,CAAC,IAAI,QAAQ,CAAC,CAAC,EAAE,OAAO;CAAE,CAAC;AAC/C,KAAK,YAAY,GAAG;KAAG,CAAC,IAAI,QAAQ,GAAG,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,SAAS;CAAE,CAAC,QAAQ,CAAC,CAAC;AAE/E,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IACrE,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;CACzB,GAAG,CACE,CAAC,SAAS,GAAG;IACX;;;OAGG;IACH,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC,GACF,CAAC,YAAY,GAAG;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC,CAC5C,CAAC;AA6BJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,iBAAS,GAAG,CAAC,EACX,SAAS,EACT,IAAgB,EAChB,IAAI,EACJ,KAAK,EACL,GAAG,EACH,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,QAAQ,+BA+BV;AAED,OAAO,EAAE,GAAG,EAAE,CAAC"}