@nocoo/basalt 2.0.3 → 2.1.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 (295) hide show
  1. package/README.md +134 -15
  2. package/ai/COMPATIBILITY.md +180 -0
  3. package/ai/INTEGRATION.md +1760 -0
  4. package/ai/RECIPES.md +161 -0
  5. package/ai/USAGE.md +99 -0
  6. package/ai/registry.json +38099 -0
  7. package/ai/sources.json +10 -0
  8. package/dist/assets/brand-mark.d.ts +1 -0
  9. package/dist/assets/brand-mark.js +7 -0
  10. package/dist/assets/brand-mark.js.map +1 -0
  11. package/dist/charts/area.d.ts +58 -5
  12. package/dist/charts/area.js +20 -12
  13. package/dist/charts/area.js.map +1 -1
  14. package/dist/charts/bar.d.ts +54 -5
  15. package/dist/charts/bar.js +16 -10
  16. package/dist/charts/bar.js.map +1 -1
  17. package/dist/charts/bullet.d.ts +18 -1
  18. package/dist/charts/bullet.js +6 -3
  19. package/dist/charts/bullet.js.map +1 -1
  20. package/dist/charts/charts.d.ts +58 -5
  21. package/dist/charts/charts.js +13 -2
  22. package/dist/charts/charts.js.map +1 -1
  23. package/dist/charts/config.d.ts +7 -0
  24. package/dist/charts/config.js +5 -1
  25. package/dist/charts/config.js.map +1 -1
  26. package/dist/charts/custom-chart.d.ts +58 -5
  27. package/dist/charts/custom-chart.js +13 -2
  28. package/dist/charts/custom-chart.js.map +1 -1
  29. package/dist/charts/donut.d.ts +18 -1
  30. package/dist/charts/donut.js +6 -3
  31. package/dist/charts/donut.js.map +1 -1
  32. package/dist/charts/frame.d.ts +40 -3
  33. package/dist/charts/frame.js +55 -28
  34. package/dist/charts/frame.js.map +1 -1
  35. package/dist/charts/funnel.d.ts +18 -1
  36. package/dist/charts/funnel.js +5 -1
  37. package/dist/charts/funnel.js.map +1 -1
  38. package/dist/charts/gauge.d.ts +18 -1
  39. package/dist/charts/gauge.js +38 -20
  40. package/dist/charts/gauge.js.map +1 -1
  41. package/dist/charts/grouped-bar.d.ts +54 -5
  42. package/dist/charts/grouped-bar.js +16 -10
  43. package/dist/charts/grouped-bar.js.map +1 -1
  44. package/dist/charts/heatmap-calendar.d.ts +61 -0
  45. package/dist/charts/heatmap-calendar.js +287 -96
  46. package/dist/charts/heatmap-calendar.js.map +1 -1
  47. package/dist/charts/heatmap-matrix.d.ts +99 -0
  48. package/dist/charts/heatmap-matrix.js +249 -0
  49. package/dist/charts/heatmap-matrix.js.map +1 -0
  50. package/dist/charts/line.d.ts +66 -5
  51. package/dist/charts/line.js +37 -30
  52. package/dist/charts/line.js.map +1 -1
  53. package/dist/charts/palette.d.ts +1 -0
  54. package/dist/charts/palette.js +7 -1
  55. package/dist/charts/palette.js.map +1 -1
  56. package/dist/charts/radar.d.ts +18 -1
  57. package/dist/charts/radar.js +26 -19
  58. package/dist/charts/radar.js.map +1 -1
  59. package/dist/charts/sankey.d.ts +18 -1
  60. package/dist/charts/sankey.js +4 -1
  61. package/dist/charts/sankey.js.map +1 -1
  62. package/dist/charts/series.d.ts +5 -7
  63. package/dist/charts/series.js.map +1 -1
  64. package/dist/charts/slot-bar.d.ts +38 -6
  65. package/dist/charts/slot-bar.js +5 -2
  66. package/dist/charts/slot-bar.js.map +1 -1
  67. package/dist/charts/sparkline.d.ts +35 -5
  68. package/dist/charts/sparkline.js +22 -18
  69. package/dist/charts/sparkline.js.map +1 -1
  70. package/dist/charts/stacked-bar.d.ts +58 -5
  71. package/dist/charts/stacked-bar.js +19 -12
  72. package/dist/charts/stacked-bar.js.map +1 -1
  73. package/dist/charts/stat-card.d.ts +51 -1
  74. package/dist/charts/stat-card.js +66 -39
  75. package/dist/charts/stat-card.js.map +1 -1
  76. package/dist/charts/timeline.d.ts +3 -0
  77. package/dist/charts/timeline.js +4 -3
  78. package/dist/charts/timeline.js.map +1 -1
  79. package/dist/charts/timeseries.d.ts +58 -5
  80. package/dist/charts/timeseries.js +13 -2
  81. package/dist/charts/timeseries.js.map +1 -1
  82. package/dist/charts/tooltip.d.ts +57 -0
  83. package/dist/charts/tooltip.js +119 -2
  84. package/dist/charts/tooltip.js.map +1 -1
  85. package/dist/components/accordion.d.ts +117 -2
  86. package/dist/components/accordion.js +20 -13
  87. package/dist/components/accordion.js.map +1 -1
  88. package/dist/components/alert-dialog.d.ts +131 -13
  89. package/dist/components/alert-dialog.js +12 -9
  90. package/dist/components/alert-dialog.js.map +1 -1
  91. package/dist/components/app-header.js +18 -17
  92. package/dist/components/app-header.js.map +1 -1
  93. package/dist/components/app-shell.js +15 -14
  94. package/dist/components/app-shell.js.map +1 -1
  95. package/dist/components/autocomplete.d.ts +4 -0
  96. package/dist/components/autocomplete.js.map +1 -1
  97. package/dist/components/avatar.d.ts +76 -3
  98. package/dist/components/avatar.js.map +1 -1
  99. package/dist/components/badge.d.ts +15 -1
  100. package/dist/components/badge.js +17 -16
  101. package/dist/components/badge.js.map +1 -1
  102. package/dist/components/banner.d.ts +88 -2
  103. package/dist/components/banner.js +41 -40
  104. package/dist/components/banner.js.map +1 -1
  105. package/dist/components/basalt-mark.js +14 -8
  106. package/dist/components/basalt-mark.js.map +1 -1
  107. package/dist/components/battery-meter.d.ts +10 -0
  108. package/dist/components/battery-meter.js +56 -0
  109. package/dist/components/battery-meter.js.map +1 -0
  110. package/dist/components/breadcrumbs.d.ts +27 -7
  111. package/dist/components/breadcrumbs.js +21 -20
  112. package/dist/components/breadcrumbs.js.map +1 -1
  113. package/dist/components/button.d.ts +48 -2
  114. package/dist/components/button.js +87 -36
  115. package/dist/components/button.js.map +1 -1
  116. package/dist/components/chat-bubble.d.ts +7 -0
  117. package/dist/components/chat-bubble.js +14 -13
  118. package/dist/components/chat-bubble.js.map +1 -1
  119. package/dist/components/chat-composer.d.ts +7 -3
  120. package/dist/components/chat-composer.js.map +1 -1
  121. package/dist/components/chat-header.d.ts +6 -1
  122. package/dist/components/chat-header.js +17 -16
  123. package/dist/components/chat-header.js.map +1 -1
  124. package/dist/components/chat-inbox.d.ts +7 -2
  125. package/dist/components/chat-inbox.js.map +1 -1
  126. package/dist/components/checkbox.js +84 -53
  127. package/dist/components/checkbox.js.map +1 -1
  128. package/dist/components/clipboard-text.d.ts +13 -2
  129. package/dist/components/clipboard-text.js +4 -4
  130. package/dist/components/clipboard-text.js.map +1 -1
  131. package/dist/components/collapsible.d.ts +58 -15
  132. package/dist/components/collapsible.js.map +1 -1
  133. package/dist/components/command-palette.d.ts +151 -61
  134. package/dist/components/command-palette.js.map +1 -1
  135. package/dist/components/confirm-dialog.d.ts +1 -1
  136. package/dist/components/confirm-dialog.js +6 -4
  137. package/dist/components/confirm-dialog.js.map +1 -1
  138. package/dist/components/context-menu.d.ts +210 -2
  139. package/dist/components/context-menu.js +7 -4
  140. package/dist/components/context-menu.js.map +1 -1
  141. package/dist/components/data-table.d.ts +40 -2
  142. package/dist/components/data-table.js +168 -120
  143. package/dist/components/data-table.js.map +1 -1
  144. package/dist/components/date-picker.d.ts +53 -2
  145. package/dist/components/date-picker.js +387 -219
  146. package/dist/components/date-picker.js.map +1 -1
  147. package/dist/components/delete-resource.d.ts +7 -1
  148. package/dist/components/delete-resource.js +22 -18
  149. package/dist/components/delete-resource.js.map +1 -1
  150. package/dist/components/description-list.js +16 -15
  151. package/dist/components/description-list.js.map +1 -1
  152. package/dist/components/dialog.d.ts +141 -12
  153. package/dist/components/dialog.js +42 -38
  154. package/dist/components/dialog.js.map +1 -1
  155. package/dist/components/dock.d.ts +1 -1
  156. package/dist/components/dock.js +39 -58
  157. package/dist/components/dock.js.map +1 -1
  158. package/dist/components/dropdown-menu.d.ts +229 -15
  159. package/dist/components/dropdown-menu.js +9 -6
  160. package/dist/components/dropdown-menu.js.map +1 -1
  161. package/dist/components/editable-nav-item.d.ts +33 -0
  162. package/dist/components/editable-nav-item.js +90 -0
  163. package/dist/components/editable-nav-item.js.map +1 -0
  164. package/dist/components/empty.d.ts +22 -2
  165. package/dist/components/empty.js +22 -13
  166. package/dist/components/empty.js.map +1 -1
  167. package/dist/components/field.js +31 -30
  168. package/dist/components/field.js.map +1 -1
  169. package/dist/components/file-dropzone.d.ts +37 -0
  170. package/dist/components/file-dropzone.js +103 -0
  171. package/dist/components/file-dropzone.js.map +1 -0
  172. package/dist/components/filter-bar.d.ts +34 -0
  173. package/dist/components/filter-bar.js +52 -0
  174. package/dist/components/filter-bar.js.map +1 -0
  175. package/dist/components/flow.js +19 -18
  176. package/dist/components/flow.js.map +1 -1
  177. package/dist/components/grid.d.ts +3 -1
  178. package/dist/components/grid.js.map +1 -1
  179. package/dist/components/hover-card.d.ts +111 -1
  180. package/dist/components/hover-card.js +9 -6
  181. package/dist/components/hover-card.js.map +1 -1
  182. package/dist/components/icon-picker.d.ts +34 -0
  183. package/dist/components/icon-picker.js +77 -0
  184. package/dist/components/icon-picker.js.map +1 -0
  185. package/dist/components/inline-editable.d.ts +46 -0
  186. package/dist/components/inline-editable.js +124 -0
  187. package/dist/components/inline-editable.js.map +1 -0
  188. package/dist/components/input-area.js +3 -3
  189. package/dist/components/input-group.js +7 -7
  190. package/dist/components/input.js +3 -3
  191. package/dist/components/label.js +18 -17
  192. package/dist/components/label.js.map +1 -1
  193. package/dist/components/layer-card.d.ts +10 -2
  194. package/dist/components/layer-card.js +71 -68
  195. package/dist/components/layer-card.js.map +1 -1
  196. package/dist/components/loader.d.ts +10 -2
  197. package/dist/components/loader.js.map +1 -1
  198. package/dist/components/menu-bar.d.ts +174 -6
  199. package/dist/components/menu-bar.js +33 -29
  200. package/dist/components/menu-bar.js.map +1 -1
  201. package/dist/components/meter.d.ts +27 -2
  202. package/dist/components/meter.js.map +1 -1
  203. package/dist/components/multi-select.d.ts +64 -0
  204. package/dist/components/multi-select.js +218 -0
  205. package/dist/components/multi-select.js.map +1 -0
  206. package/dist/components/navigation-menu.d.ts +88 -5
  207. package/dist/components/navigation-menu.js.map +1 -1
  208. package/dist/components/overlay.js +6 -5
  209. package/dist/components/overlay.js.map +1 -1
  210. package/dist/components/page-header.js +23 -21
  211. package/dist/components/page-header.js.map +1 -1
  212. package/dist/components/pagination.js +7 -7
  213. package/dist/components/popover.d.ts +136 -16
  214. package/dist/components/popover.js +32 -28
  215. package/dist/components/popover.js.map +1 -1
  216. package/dist/components/radio.js +38 -37
  217. package/dist/components/radio.js.map +1 -1
  218. package/dist/components/resource-list.d.ts +26 -1
  219. package/dist/components/resource-list.js +28 -15
  220. package/dist/components/resource-list.js.map +1 -1
  221. package/dist/components/responsive-master-detail.d.ts +27 -0
  222. package/dist/components/responsive-master-detail.js +85 -0
  223. package/dist/components/responsive-master-detail.js.map +1 -0
  224. package/dist/components/section-rule.js +23 -22
  225. package/dist/components/section-rule.js.map +1 -1
  226. package/dist/components/select.d.ts +27 -3
  227. package/dist/components/select.js +11 -11
  228. package/dist/components/select.js.map +1 -1
  229. package/dist/components/sheet.d.ts +115 -11
  230. package/dist/components/sheet.js +37 -30
  231. package/dist/components/sheet.js.map +1 -1
  232. package/dist/components/sidebar.d.ts +109 -17
  233. package/dist/components/sidebar.js +109 -108
  234. package/dist/components/sidebar.js.map +1 -1
  235. package/dist/components/skeleton-line.d.ts +22 -2
  236. package/dist/components/skeleton-line.js.map +1 -1
  237. package/dist/components/slider.d.ts +61 -1
  238. package/dist/components/slider.js +31 -15
  239. package/dist/components/slider.js.map +1 -1
  240. package/dist/components/stat-strip.js +16 -15
  241. package/dist/components/stat-strip.js.map +1 -1
  242. package/dist/components/switch.js +78 -47
  243. package/dist/components/switch.js.map +1 -1
  244. package/dist/components/table-of-contents.js +18 -17
  245. package/dist/components/table-of-contents.js.map +1 -1
  246. package/dist/components/table-pager.js +20 -19
  247. package/dist/components/table-pager.js.map +1 -1
  248. package/dist/components/table.d.ts +9 -3
  249. package/dist/components/table.js +19 -18
  250. package/dist/components/table.js.map +1 -1
  251. package/dist/components/tabs.js +29 -22
  252. package/dist/components/tabs.js.map +1 -1
  253. package/dist/components/tag-badge.d.ts +58 -0
  254. package/dist/components/tag-badge.js +72 -0
  255. package/dist/components/tag-badge.js.map +1 -0
  256. package/dist/components/tag-color-picker.d.ts +20 -0
  257. package/dist/components/tag-color-picker.js +42 -0
  258. package/dist/components/tag-color-picker.js.map +1 -0
  259. package/dist/components/text.js +17 -16
  260. package/dist/components/text.js.map +1 -1
  261. package/dist/components/toast.d.ts +173 -3
  262. package/dist/components/toast.js +1 -1
  263. package/dist/components/toast.js.map +1 -1
  264. package/dist/components/toggle-group.d.ts +88 -2
  265. package/dist/components/toggle-group.js +32 -31
  266. package/dist/components/toggle-group.js.map +1 -1
  267. package/dist/components/toggle.d.ts +35 -2
  268. package/dist/components/toggle.js +12 -11
  269. package/dist/components/toggle.js.map +1 -1
  270. package/dist/components/tooltip.d.ts +144 -6
  271. package/dist/components/tooltip.js +9 -6
  272. package/dist/components/tooltip.js.map +1 -1
  273. package/dist/components/typeahead-field.js +193 -132
  274. package/dist/components/typeahead-field.js.map +1 -1
  275. package/dist/components/upload-queue.d.ts +51 -0
  276. package/dist/components/upload-queue.js +116 -0
  277. package/dist/components/upload-queue.js.map +1 -0
  278. package/dist/providers/accent.d.ts +46 -2
  279. package/dist/providers/accent.js +358 -172
  280. package/dist/providers/accent.js.map +1 -1
  281. package/dist/providers/link.d.ts +14 -4
  282. package/dist/providers/link.js.map +1 -1
  283. package/dist/providers/theme.d.ts +38 -2
  284. package/dist/providers/theme.js +160 -27
  285. package/dist/providers/theme.js.map +1 -1
  286. package/dist/styles/base.css +83 -0
  287. package/dist/styles/standalone.css +711 -120
  288. package/dist/styles/tailwind.css +21 -7
  289. package/dist/styles/tokens.css +145 -91
  290. package/dist/utils/control-surface.d.ts +2 -1
  291. package/dist/utils/control-surface.js +4 -4
  292. package/dist/utils/control-surface.js.map +1 -1
  293. package/dist/utils/selection-indicator.js +2 -2
  294. package/dist/utils/selection-indicator.js.map +1 -1
  295. package/package.json +8 -4
@@ -1 +1 @@
1
- {"version":3,"file":"palette.js","names":[],"sources":["../../src/charts/palette.tsx"],"sourcesContent":["const v = (token: string) => `hsl(var(--basalt-${token}))`;\n\nexport const withAlpha = (token: string, alpha: number) => `hsl(var(--basalt-${token}) / ${alpha})`;\n\nexport const chartAxis = v(\"chart-axis\");\nexport const chartMuted = v(\"chart-muted\");\n\nexport const chart = {\n\tprimary: v(\"chart-1\"),\n\tsky: v(\"chart-2\"),\n\tteal: v(\"chart-3\"),\n\tjade: v(\"chart-4\"),\n\tgreen: v(\"chart-5\"),\n\tlime: v(\"chart-6\"),\n\tamber: v(\"chart-7\"),\n\torange: v(\"chart-8\"),\n\tvermilion: v(\"chart-9\"),\n\tred: v(\"chart-10\"),\n\trose: v(\"chart-11\"),\n\tmagenta: v(\"chart-12\"),\n\torchid: v(\"chart-13\"),\n\tpurple: v(\"chart-14\"),\n\tindigo: v(\"chart-15\"),\n\tcobalt: v(\"chart-16\"),\n\tsteel: v(\"chart-17\"),\n\tcadet: v(\"chart-18\"),\n\tseafoam: v(\"chart-19\"),\n\tolive: v(\"chart-20\"),\n\tgold: v(\"chart-21\"),\n\ttangerine: v(\"chart-22\"),\n\tcrimson: v(\"chart-23\"),\n\tgray: v(\"chart-24\"),\n} as const;\n\nexport const CHART_COLORS = Object.values(chart);\n\nexport type ChartPaletteProps = {\n\tariaLabel?: string;\n};\n\nexport function ChartPalette({ ariaLabel = \"Chart colors\" }: ChartPaletteProps) {\n\treturn (\n\t\t<div className=\"flex flex-wrap gap-2\" role=\"img\" aria-label={ariaLabel}>\n\t\t\t{CHART_COLORS.map((color) => (\n\t\t\t\t<span key={color} className=\"h-8 w-8 rounded-basalt-sm\" style={{ background: color }} />\n\t\t\t))}\n\t\t</div>\n\t);\n}\n"],"mappings":";;;AAAA,IAAM,KAAK,MAAkB,oBAAoB,EAAM,KAE1C,KAAa,GAAe,MAAkB,oBAAoB,EAAM,MAAM,EAAM,IAEpF,IAAY,EAAE,YAAY,GAC1B,IAAa,EAAE,aAAa,GAE5B,IAAQ;CACpB,SAAS,EAAE,SAAS;CACpB,KAAK,EAAE,SAAS;CAChB,MAAM,EAAE,SAAS;CACjB,MAAM,EAAE,SAAS;CACjB,OAAO,EAAE,SAAS;CAClB,MAAM,EAAE,SAAS;CACjB,OAAO,EAAE,SAAS;CAClB,QAAQ,EAAE,SAAS;CACnB,WAAW,EAAE,SAAS;CACtB,KAAK,EAAE,UAAU;CACjB,MAAM,EAAE,UAAU;CAClB,SAAS,EAAE,UAAU;CACrB,QAAQ,EAAE,UAAU;CACpB,QAAQ,EAAE,UAAU;CACpB,QAAQ,EAAE,UAAU;CACpB,QAAQ,EAAE,UAAU;CACpB,OAAO,EAAE,UAAU;CACnB,OAAO,EAAE,UAAU;CACnB,SAAS,EAAE,UAAU;CACrB,OAAO,EAAE,UAAU;CACnB,MAAM,EAAE,UAAU;CAClB,WAAW,EAAE,UAAU;CACvB,SAAS,EAAE,UAAU;CACrB,MAAM,EAAE,UAAU;AACnB,GAEa,IAAe,OAAO,OAAO,CAAK;AAM/C,SAAgB,EAAa,EAAE,eAAY,kBAAqC;CAC/E,OACC,kBAAC,OAAD;EAAK,WAAU;EAAuB,MAAK;EAAM,cAAY;EAC3D,UAAA,EAAa,KAAK,MAClB,kBAAC,QAAD;GAAkB,WAAU;GAA4B,OAAO,EAAE,YAAY,EAAM;EAAI,GAA5E,CAA4E,CACvF;CACG,CAAA;AAEP"}
1
+ {"version":3,"file":"palette.js","names":[],"sources":["../../src/charts/palette.tsx"],"sourcesContent":["const v = (token: string) => `hsl(var(--basalt-${token}))`;\n\nexport const withAlpha = (token: string, alpha: number) => `hsl(var(--basalt-${token}) / ${alpha})`;\n\nexport const chartAxis = v(\"chart-axis\");\nexport const chartMuted = v(\"chart-muted\");\n\nexport const chart = {\n\tprimary: v(\"chart-1\"),\n\tsky: v(\"chart-2\"),\n\tteal: v(\"chart-3\"),\n\tjade: v(\"chart-4\"),\n\tgreen: v(\"chart-5\"),\n\tlime: v(\"chart-6\"),\n\tamber: v(\"chart-7\"),\n\torange: v(\"chart-8\"),\n\tvermilion: v(\"chart-9\"),\n\tred: v(\"chart-10\"),\n\trose: v(\"chart-11\"),\n\tmagenta: v(\"chart-12\"),\n\torchid: v(\"chart-13\"),\n\tpurple: v(\"chart-14\"),\n\tindigo: v(\"chart-15\"),\n\tcobalt: v(\"chart-16\"),\n\tsteel: v(\"chart-17\"),\n\tcadet: v(\"chart-18\"),\n\tseafoam: v(\"chart-19\"),\n\tolive: v(\"chart-20\"),\n\tgold: v(\"chart-21\"),\n\ttangerine: v(\"chart-22\"),\n\tcrimson: v(\"chart-23\"),\n\tgray: v(\"chart-24\"),\n} as const;\n\n/** Fixed five-color series cycle; independent of the application accent. */\nexport const CHART_COLORS = [chart.primary, chart.rose, chart.green, chart.amber, chart.gray];\n\nexport type ChartPaletteProps = {\n\tariaLabel?: string;\n};\n\nexport function ChartPalette({ ariaLabel = \"Chart colors\" }: ChartPaletteProps) {\n\treturn (\n\t\t<div className=\"flex flex-wrap gap-2\" role=\"img\" aria-label={ariaLabel}>\n\t\t\t{CHART_COLORS.map((color) => (\n\t\t\t\t<span key={color} className=\"h-8 w-8 rounded-basalt-sm\" style={{ background: color }} />\n\t\t\t))}\n\t\t</div>\n\t);\n}\n"],"mappings":";;;AAAA,IAAM,KAAK,MAAkB,oBAAoB,EAAM,KAE1C,KAAa,GAAe,MAAkB,oBAAoB,EAAM,MAAM,EAAM,IAEpF,IAAY,EAAE,YAAY,GAC1B,IAAa,EAAE,aAAa,GAE5B,IAAQ;CACpB,SAAS,EAAE,SAAS;CACpB,KAAK,EAAE,SAAS;CAChB,MAAM,EAAE,SAAS;CACjB,MAAM,EAAE,SAAS;CACjB,OAAO,EAAE,SAAS;CAClB,MAAM,EAAE,SAAS;CACjB,OAAO,EAAE,SAAS;CAClB,QAAQ,EAAE,SAAS;CACnB,WAAW,EAAE,SAAS;CACtB,KAAK,EAAE,UAAU;CACjB,MAAM,EAAE,UAAU;CAClB,SAAS,EAAE,UAAU;CACrB,QAAQ,EAAE,UAAU;CACpB,QAAQ,EAAE,UAAU;CACpB,QAAQ,EAAE,UAAU;CACpB,QAAQ,EAAE,UAAU;CACpB,OAAO,EAAE,UAAU;CACnB,OAAO,EAAE,UAAU;CACnB,SAAS,EAAE,UAAU;CACrB,OAAO,EAAE,UAAU;CACnB,MAAM,EAAE,UAAU;CAClB,WAAW,EAAE,UAAU;CACvB,SAAS,EAAE,UAAU;CACrB,MAAM,EAAE,UAAU;AACnB,GAGa,IAAe;CAAC,EAAM;CAAS,EAAM;CAAM,EAAM;CAAO,EAAM;CAAO,EAAM;AAAI;AAM5F,SAAgB,EAAa,EAAE,eAAY,kBAAqC;CAC/E,OACC,kBAAC,OAAD;EAAK,WAAU;EAAuB,MAAK;EAAM,cAAY;EAC3D,UAAA,EAAa,KAAK,MAClB,kBAAC,QAAD;GAAkB,WAAU;GAA4B,OAAO,EAAE,YAAY,EAAM;EAAI,GAA5E,CAA4E,CACvF;CACG,CAAA;AAEP"}
@@ -1,8 +1,25 @@
1
+ import type { ReactNode } from "react";
1
2
  import type { ChartSeriesDescriptor, RadarPoint } from "./series.js";
2
3
  export type RadarChartProps = {
3
4
  data: RadarPoint[];
4
5
  series?: ChartSeriesDescriptor[];
5
6
  ariaLabel?: string;
6
7
  className?: string;
8
+ /**
9
+ * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.
10
+ * Associated with the chart via useId and aria-describedby.
11
+ */
12
+ summary?: ReactNode;
13
+ /**
14
+ * Accessible tabular or structured data alternative rendered outside the plot area.
15
+ */
16
+ dataAlternative?: ReactNode;
17
+ /**
18
+ * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.
19
+ * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.
20
+ * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.
21
+ * @default true
22
+ */
23
+ accessibilityLayer?: boolean;
7
24
  };
8
- export declare function RadarChart({ data, series, ariaLabel, className, }: RadarChartProps): import("react").JSX.Element;
25
+ export declare function RadarChart({ data, series, ariaLabel, className, summary, dataAlternative, accessibilityLayer, }: RadarChartProps): import("react").JSX.Element;
@@ -1,30 +1,37 @@
1
1
  "use client";
2
- import { ANIMATION_PROPS as e, chartTickStyle as t, seriesColor as n } from "./config.js";
3
- import { ChartFrame as r } from "./frame.js";
4
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
5
- import { PolarAngleAxis as o, PolarGrid as s, Radar as c, RadarChart as l } from "recharts";
2
+ import { ANIMATION_PROPS as e, CHART_TYPE as t, GRID_PROPS as n, chartTickStyle as r, seriesColor as i } from "./config.js";
3
+ import { ChartFrame as a } from "./frame.js";
4
+ import { jsx as o, jsxs as s } from "react/jsx-runtime";
5
+ import { PolarAngleAxis as c, PolarGrid as l, Radar as u, RadarChart as d } from "recharts";
6
6
  //#region src/charts/radar.tsx
7
- function u({ data: u, series: d, ariaLabel: f = "Radar chart", className: p }) {
8
- let m = n(d?.[0], 3);
9
- return /* @__PURE__ */ i(r, {
10
- ariaLabel: f,
11
- className: p,
12
- children: /* @__PURE__ */ a(l, {
13
- data: u,
7
+ function f({ data: f, series: p, ariaLabel: m = "Radar chart", className: h, summary: g, dataAlternative: _, accessibilityLayer: v }) {
8
+ let y = i(p?.[0], 3);
9
+ return /* @__PURE__ */ o(a, {
10
+ ariaLabel: m,
11
+ className: h,
12
+ summary: g,
13
+ dataAlternative: _,
14
+ accessibilityLayer: v,
15
+ children: /* @__PURE__ */ s(d, {
16
+ data: f,
14
17
  outerRadius: 60,
15
18
  children: [
16
- /* @__PURE__ */ i(s, {}),
17
- /* @__PURE__ */ i(o, {
19
+ /* @__PURE__ */ o(l, {
20
+ stroke: n.stroke,
21
+ strokeOpacity: n.strokeOpacity
22
+ }),
23
+ /* @__PURE__ */ o(c, {
18
24
  dataKey: "subject",
19
- tick: t(),
25
+ tick: r(),
20
26
  tickLine: !1
21
27
  }),
22
- /* @__PURE__ */ i(c, {
28
+ /* @__PURE__ */ o(u, {
23
29
  dataKey: "value",
24
- name: d?.[0]?.label,
25
- fill: m,
30
+ name: p?.[0]?.label,
31
+ fill: y,
26
32
  fillOpacity: .3,
27
- stroke: m,
33
+ stroke: y,
34
+ strokeWidth: t.strokeWidth,
28
35
  ...e
29
36
  })
30
37
  ]
@@ -32,6 +39,6 @@ function u({ data: u, series: d, ariaLabel: f = "Radar chart", className: p }) {
32
39
  });
33
40
  }
34
41
  //#endregion
35
- export { u as RadarChart };
42
+ export { f as RadarChart };
36
43
 
37
44
  //# sourceMappingURL=radar.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"radar.js","names":[],"sources":["../../src/charts/radar.tsx"],"sourcesContent":["import { PolarAngleAxis, PolarGrid, Radar, RadarChart as RechartsRadar } from \"recharts\";\nimport { ANIMATION_PROPS, chartTickStyle, seriesColor } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport type { ChartSeriesDescriptor, RadarPoint } from \"./series\";\n\nexport type RadarChartProps = {\n\tdata: RadarPoint[];\n\tseries?: ChartSeriesDescriptor[];\n\tariaLabel?: string;\n\tclassName?: string;\n};\n\nexport function RadarChart({\n\tdata,\n\tseries,\n\tariaLabel = \"Radar chart\",\n\tclassName,\n}: RadarChartProps) {\n\tconst fill = seriesColor(series?.[0], 3);\n\treturn (\n\t\t<ChartFrame ariaLabel={ariaLabel} className={className}>\n\t\t\t<RechartsRadar data={data} outerRadius={60}>\n\t\t\t\t<PolarGrid />\n\t\t\t\t<PolarAngleAxis dataKey=\"subject\" tick={chartTickStyle()} tickLine={false} />\n\t\t\t\t<Radar\n\t\t\t\t\tdataKey=\"value\"\n\t\t\t\t\tname={series?.[0]?.label}\n\t\t\t\t\tfill={fill}\n\t\t\t\t\tfillOpacity={0.3}\n\t\t\t\t\tstroke={fill}\n\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t/>\n\t\t\t</RechartsRadar>\n\t\t</ChartFrame>\n\t);\n}\n"],"mappings":";;;;;;AAYA,SAAgB,EAAW,EAC1B,SACA,WACA,eAAY,eACZ,gBACmB;CACnB,IAAM,IAAO,EAAY,IAAS,IAAI,CAAC;CACvC,OACC,kBAAC,GAAD;EAAuB;EAAsB;EAC5C,UAAA,kBAAC,GAAD;GAAqB;GAAM,aAAa;GAAxC,UAAA;IACC,kBAAC,GAAD,CAAY,CAAA;IACZ,kBAAC,GAAD;KAAgB,SAAQ;KAAU,MAAM,EAAe;KAAG,UAAU;IAAQ,CAAA;IAC5E,kBAAC,GAAD;KACC,SAAQ;KACR,MAAM,IAAS,EAAE,EAAE;KACb;KACN,aAAa;KACb,QAAQ;KACR,GAAI;IACJ,CAAA;GACa;;CACJ,CAAA;AAEd"}
1
+ {"version":3,"file":"radar.js","names":[],"sources":["../../src/charts/radar.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { PolarAngleAxis, PolarGrid, Radar, RadarChart as RechartsRadar } from \"recharts\";\nimport { ANIMATION_PROPS, CHART_TYPE, chartTickStyle, GRID_PROPS, seriesColor } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport type { ChartSeriesDescriptor, RadarPoint } from \"./series\";\n\nexport type RadarChartProps = {\n\tdata: RadarPoint[];\n\tseries?: ChartSeriesDescriptor[];\n\tariaLabel?: string;\n\tclassName?: string;\n\t/**\n\t * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.\n\t * Associated with the chart via useId and aria-describedby.\n\t */\n\tsummary?: ReactNode;\n\t/**\n\t * Accessible tabular or structured data alternative rendered outside the plot area.\n\t */\n\tdataAlternative?: ReactNode;\n\t/**\n\t * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.\n\t * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.\n\t * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.\n\t * @default true\n\t */\n\taccessibilityLayer?: boolean;\n};\n\nexport function RadarChart({\n\tdata,\n\tseries,\n\tariaLabel = \"Radar chart\",\n\tclassName,\n\tsummary,\n\tdataAlternative,\n\taccessibilityLayer,\n}: RadarChartProps) {\n\tconst fill = seriesColor(series?.[0], 3);\n\treturn (\n\t\t<ChartFrame\n\t\t\tariaLabel={ariaLabel}\n\t\t\tclassName={className}\n\t\t\tsummary={summary}\n\t\t\tdataAlternative={dataAlternative}\n\t\t\taccessibilityLayer={accessibilityLayer}\n\t\t>\n\t\t\t<RechartsRadar data={data} outerRadius={60}>\n\t\t\t\t<PolarGrid stroke={GRID_PROPS.stroke} strokeOpacity={GRID_PROPS.strokeOpacity} />\n\t\t\t\t<PolarAngleAxis dataKey=\"subject\" tick={chartTickStyle()} tickLine={false} />\n\t\t\t\t<Radar\n\t\t\t\t\tdataKey=\"value\"\n\t\t\t\t\tname={series?.[0]?.label}\n\t\t\t\t\tfill={fill}\n\t\t\t\t\tfillOpacity={0.3}\n\t\t\t\t\tstroke={fill}\n\t\t\t\t\tstrokeWidth={CHART_TYPE.strokeWidth}\n\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t/>\n\t\t\t</RechartsRadar>\n\t\t</ChartFrame>\n\t);\n}\n"],"mappings":";;;;;;AA6BA,SAAgB,EAAW,EAC1B,SACA,WACA,eAAY,eACZ,cACA,YACA,oBACA,yBACmB;CACnB,IAAM,IAAO,EAAY,IAAS,IAAI,CAAC;CACvC,OACC,kBAAC,GAAD;EACY;EACA;EACF;EACQ;EACG;EAEpB,UAAA,kBAAC,GAAD;GAAqB;GAAM,aAAa;GAAxC,UAAA;IACC,kBAAC,GAAD;KAAW,QAAQ,EAAW;KAAQ,eAAe,EAAW;IAAgB,CAAA;IAChF,kBAAC,GAAD;KAAgB,SAAQ;KAAU,MAAM,EAAe;KAAG,UAAU;IAAQ,CAAA;IAC5E,kBAAC,GAAD;KACC,SAAQ;KACR,MAAM,IAAS,EAAE,EAAE;KACb;KACN,aAAa;KACb,QAAQ;KACR,aAAa,EAAW;KACxB,GAAI;IACJ,CAAA;GACa;;CACJ,CAAA;AAEd"}
@@ -1,7 +1,24 @@
1
+ import type { ReactNode } from "react";
1
2
  import type { SankeyData } from "./series.js";
2
3
  export type SankeyChartProps = {
3
4
  data: SankeyData;
4
5
  ariaLabel?: string;
5
6
  className?: string;
7
+ /**
8
+ * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.
9
+ * Associated with the chart via useId and aria-describedby.
10
+ */
11
+ summary?: ReactNode;
12
+ /**
13
+ * Accessible tabular or structured data alternative rendered outside the plot area.
14
+ */
15
+ dataAlternative?: ReactNode;
16
+ /**
17
+ * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.
18
+ * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.
19
+ * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.
20
+ * @default true
21
+ */
22
+ accessibilityLayer?: boolean;
6
23
  };
7
- export declare function SankeyChart({ data, ariaLabel, className }: SankeyChartProps): import("react").JSX.Element;
24
+ export declare function SankeyChart({ data, ariaLabel, className, summary, dataAlternative, accessibilityLayer, }: SankeyChartProps): import("react").JSX.Element;
@@ -21,10 +21,13 @@ function l({ x: r, y: i, width: s, height: c, payload: l }) {
21
21
  children: l.name
22
22
  })] });
23
23
  }
24
- function u({ data: t, ariaLabel: n = "Sankey chart", className: o }) {
24
+ function u({ data: t, ariaLabel: n = "Sankey chart", className: o, summary: u, dataAlternative: d, accessibilityLayer: f }) {
25
25
  return /* @__PURE__ */ a(i, {
26
26
  ariaLabel: n,
27
27
  className: o,
28
+ summary: u,
29
+ dataAlternative: d,
30
+ accessibilityLayer: f,
28
31
  children: /* @__PURE__ */ a(s, {
29
32
  data: t,
30
33
  nodePadding: 16,
@@ -1 +1 @@
1
- {"version":3,"file":"sankey.js","names":[],"sources":["../../src/charts/sankey.tsx"],"sourcesContent":["import { Sankey, type SankeyNodeProps, Tooltip } from \"recharts\";\nimport { chartFontSize, chartTooltipProps } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport { CHART_COLORS, chartAxis } from \"./palette\";\nimport type { SankeyData } from \"./series\";\n\nfunction SankeyNode({ x, y, width, height, payload }: SankeyNodeProps) {\n\treturn (\n\t\t<g>\n\t\t\t<rect x={x} y={y} width={width} height={height} fill={CHART_COLORS[2]} />\n\t\t\t<text\n\t\t\t\tx={x + width + 6}\n\t\t\t\ty={y + height / 2}\n\t\t\t\tdominantBaseline=\"middle\"\n\t\t\t\tfontSize={chartFontSize(\"axis\")}\n\t\t\t\tfill={chartAxis}\n\t\t\t>\n\t\t\t\t{payload.name}\n\t\t\t</text>\n\t\t</g>\n\t);\n}\n\nexport type SankeyChartProps = {\n\tdata: SankeyData;\n\tariaLabel?: string;\n\tclassName?: string;\n};\n\nexport function SankeyChart({ data, ariaLabel = \"Sankey chart\", className }: SankeyChartProps) {\n\treturn (\n\t\t<ChartFrame ariaLabel={ariaLabel} className={className}>\n\t\t\t<Sankey\n\t\t\t\tdata={data}\n\t\t\t\tnodePadding={16}\n\t\t\t\tnodeWidth={12}\n\t\t\t\tmargin={{ top: 8, right: 72, bottom: 8, left: 8 }}\n\t\t\t\tnode={SankeyNode}\n\t\t\t\tlink={{ stroke: CHART_COLORS[0], strokeOpacity: 0.3 }}\n\t\t\t>\n\t\t\t\t<Tooltip {...chartTooltipProps({ cursor: false })} />\n\t\t\t</Sankey>\n\t\t</ChartFrame>\n\t);\n}\n"],"mappings":";;;;;;;AAMA,SAAS,EAAW,EAAE,MAAG,MAAG,UAAO,WAAQ,cAA4B;CACtE,OACC,kBAAC,KAAD,EAAA,UAAA,CACC,kBAAC,QAAD;EAAS;EAAM;EAAU;EAAe;EAAQ,MAAM,EAAa;CAAK,CAAA,GACxE,kBAAC,QAAD;EACC,GAAG,IAAI,IAAQ;EACf,GAAG,IAAI,IAAS;EAChB,kBAAiB;EACjB,UAAU,EAAc,MAAM;EAC9B,MAAM;EAEL,UAAA,EAAQ;CACJ,CAAA,CACJ,EAAA,CAAA;AAEL;AAQA,SAAgB,EAAY,EAAE,SAAM,eAAY,gBAAgB,gBAA+B;CAC9F,OACC,kBAAC,GAAD;EAAuB;EAAsB;EAC5C,UAAA,kBAAC,GAAD;GACO;GACN,aAAa;GACb,WAAW;GACX,QAAQ;IAAE,KAAK;IAAG,OAAO;IAAI,QAAQ;IAAG,MAAM;GAAE;GAChD,MAAM;GACN,MAAM;IAAE,QAAQ,EAAa;IAAI,eAAe;GAAI;GAEpD,UAAA,kBAAC,GAAD,EAAS,GAAI,EAAkB,EAAE,QAAQ,GAAM,CAAC,EAAI,CAAA;EAC7C,CAAA;CACG,CAAA;AAEd"}
1
+ {"version":3,"file":"sankey.js","names":[],"sources":["../../src/charts/sankey.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Sankey, type SankeyNodeProps, Tooltip } from \"recharts\";\nimport { chartFontSize, chartTooltipProps } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport { CHART_COLORS, chartAxis } from \"./palette\";\nimport type { SankeyData } from \"./series\";\n\nfunction SankeyNode({ x, y, width, height, payload }: SankeyNodeProps) {\n\treturn (\n\t\t<g>\n\t\t\t<rect x={x} y={y} width={width} height={height} fill={CHART_COLORS[2]} />\n\t\t\t<text\n\t\t\t\tx={x + width + 6}\n\t\t\t\ty={y + height / 2}\n\t\t\t\tdominantBaseline=\"middle\"\n\t\t\t\tfontSize={chartFontSize(\"axis\")}\n\t\t\t\tfill={chartAxis}\n\t\t\t>\n\t\t\t\t{payload.name}\n\t\t\t</text>\n\t\t</g>\n\t);\n}\n\nexport type SankeyChartProps = {\n\tdata: SankeyData;\n\tariaLabel?: string;\n\tclassName?: string;\n\t/**\n\t * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.\n\t * Associated with the chart via useId and aria-describedby.\n\t */\n\tsummary?: ReactNode;\n\t/**\n\t * Accessible tabular or structured data alternative rendered outside the plot area.\n\t */\n\tdataAlternative?: ReactNode;\n\t/**\n\t * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.\n\t * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.\n\t * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.\n\t * @default true\n\t */\n\taccessibilityLayer?: boolean;\n};\n\nexport function SankeyChart({\n\tdata,\n\tariaLabel = \"Sankey chart\",\n\tclassName,\n\tsummary,\n\tdataAlternative,\n\taccessibilityLayer,\n}: SankeyChartProps) {\n\treturn (\n\t\t<ChartFrame\n\t\t\tariaLabel={ariaLabel}\n\t\t\tclassName={className}\n\t\t\tsummary={summary}\n\t\t\tdataAlternative={dataAlternative}\n\t\t\taccessibilityLayer={accessibilityLayer}\n\t\t>\n\t\t\t<Sankey\n\t\t\t\tdata={data}\n\t\t\t\tnodePadding={16}\n\t\t\t\tnodeWidth={12}\n\t\t\t\tmargin={{ top: 8, right: 72, bottom: 8, left: 8 }}\n\t\t\t\tnode={SankeyNode}\n\t\t\t\tlink={{ stroke: CHART_COLORS[0], strokeOpacity: 0.3 }}\n\t\t\t>\n\t\t\t\t<Tooltip {...chartTooltipProps({ cursor: false })} />\n\t\t\t</Sankey>\n\t\t</ChartFrame>\n\t);\n}\n"],"mappings":";;;;;;;AAOA,SAAS,EAAW,EAAE,MAAG,MAAG,UAAO,WAAQ,cAA4B;CACtE,OACC,kBAAC,KAAD,EAAA,UAAA,CACC,kBAAC,QAAD;EAAS;EAAM;EAAU;EAAe;EAAQ,MAAM,EAAa;CAAK,CAAA,GACxE,kBAAC,QAAD;EACC,GAAG,IAAI,IAAQ;EACf,GAAG,IAAI,IAAS;EAChB,kBAAiB;EACjB,UAAU,EAAc,MAAM;EAC9B,MAAM;EAEL,UAAA,EAAQ;CACJ,CAAA,CACJ,EAAA,CAAA;AAEL;AAwBA,SAAgB,EAAY,EAC3B,SACA,eAAY,gBACZ,cACA,YACA,oBACA,yBACoB;CACpB,OACC,kBAAC,GAAD;EACY;EACA;EACF;EACQ;EACG;EAEpB,UAAA,kBAAC,GAAD;GACO;GACN,aAAa;GACb,WAAW;GACX,QAAQ;IAAE,KAAK;IAAG,OAAO;IAAI,QAAQ;IAAG,MAAM;GAAE;GAChD,MAAM;GACN,MAAM;IAAE,QAAQ,EAAa;IAAI,eAAe;GAAI;GAEpD,UAAA,kBAAC,GAAD,EAAS,GAAI,EAAkB,EAAE,QAAQ,GAAM,CAAC,EAAI,CAAA;EAC7C,CAAA;CACG,CAAA;AAEd"}
@@ -1,12 +1,10 @@
1
- export type ChartSeriesDescriptor = {
2
- key: string;
1
+ export type ChartSeriesDescriptor<K extends string = string> = {
2
+ key: K;
3
3
  label?: string;
4
4
  color?: string;
5
5
  };
6
6
  export type XYSeriesKey = "y" | "y2" | "y3";
7
- export type XYSeriesDescriptor = ChartSeriesDescriptor & {
8
- key: XYSeriesKey;
9
- };
7
+ export type XYSeriesDescriptor<K extends string = XYSeriesKey> = ChartSeriesDescriptor<K>;
10
8
  export type BulletSeriesKey = "value" | "target";
11
9
  export type BulletSeriesDescriptor = ChartSeriesDescriptor & {
12
10
  key: BulletSeriesKey;
@@ -40,8 +38,8 @@ export type SankeyData = {
40
38
  value: number;
41
39
  }[];
42
40
  };
43
- export declare function resolveChartSeries(series: ChartSeriesDescriptor[] | undefined, fallbackKeys: string[]): ChartSeriesDescriptor[];
44
- export declare function applyLeadColor(items: ChartSeriesDescriptor[], color?: string): ChartSeriesDescriptor[];
41
+ export declare function resolveChartSeries<K extends string = string>(series: Array<ChartSeriesDescriptor<K>> | undefined, fallbackKeys: K[]): Array<ChartSeriesDescriptor<K>>;
42
+ export declare function applyLeadColor<K extends string = string>(items: Array<ChartSeriesDescriptor<K>>, color?: string): Array<ChartSeriesDescriptor<K>>;
45
43
  export declare function xyFallbackKeys(data: Array<{
46
44
  y2?: number;
47
45
  y3?: number;
@@ -1 +1 @@
1
- {"version":3,"file":"series.js","names":[],"sources":["../../src/charts/series.ts"],"sourcesContent":["export type ChartSeriesDescriptor = {\n\tkey: string;\n\tlabel?: string;\n\tcolor?: string;\n};\n\nexport type XYSeriesKey = \"y\" | \"y2\" | \"y3\";\nexport type XYSeriesDescriptor = ChartSeriesDescriptor & { key: XYSeriesKey };\nexport type BulletSeriesKey = \"value\" | \"target\";\nexport type BulletSeriesDescriptor = ChartSeriesDescriptor & { key: BulletSeriesKey };\n\nexport type XYPoint = { x: string | number; y: number; y2?: number; y3?: number };\nexport type NamedValue = { name: string; value: number };\nexport type RadarPoint = { subject: string; value: number };\nexport type BulletPoint = { name: string; value: number; target: number };\nexport type SankeyData = {\n\tnodes: { name: string }[];\n\tlinks: { source: number; target: number; value: number }[];\n};\n\nexport function resolveChartSeries(\n\tseries: ChartSeriesDescriptor[] | undefined,\n\tfallbackKeys: string[],\n): ChartSeriesDescriptor[] {\n\tif (series && series.length > 0) {\n\t\treturn series;\n\t}\n\treturn fallbackKeys.map((key) => ({ key }));\n}\n\nexport function applyLeadColor(\n\titems: ChartSeriesDescriptor[],\n\tcolor?: string,\n): ChartSeriesDescriptor[] {\n\tif (!color) {\n\t\treturn items;\n\t}\n\treturn items.map((item, index) => (index === 0 ? { ...item, color: item.color ?? color } : item));\n}\n\nexport function xyFallbackKeys(data: Array<{ y2?: number; y3?: number }>): string[] {\n\tconst keys = [\"y\"];\n\tif (data.some((point) => point.y2 != null)) {\n\t\tkeys.push(\"y2\");\n\t}\n\tif (data.some((point) => point.y3 != null)) {\n\t\tkeys.push(\"y3\");\n\t}\n\treturn keys;\n}\n"],"mappings":";;AAoBA,SAAgB,EACf,GACA,GAC0B;CAI1B,OAHI,KAAU,EAAO,SAAS,IACtB,IAED,EAAa,KAAK,OAAS,EAAE,OAAI,EAAE;AAC3C;AAEA,SAAgB,EACf,GACA,GAC0B;CAI1B,OAHK,IAGE,EAAM,KAAK,GAAM,MAAW,MAAU,IAAI;EAAE,GAAG;EAAM,OAAO,EAAK,SAAS;CAAM,IAAI,CAAK,IAFxF;AAGT;AAEA,SAAgB,EAAe,GAAqD;CACnF,IAAM,IAAO,CAAC,GAAG;CAOjB,OANI,EAAK,MAAM,MAAU,EAAM,MAAM,IAAI,KACxC,EAAK,KAAK,IAAI,GAEX,EAAK,MAAM,MAAU,EAAM,MAAM,IAAI,KACxC,EAAK,KAAK,IAAI,GAER;AACR"}
1
+ {"version":3,"file":"series.js","names":[],"sources":["../../src/charts/series.ts"],"sourcesContent":["export type ChartSeriesDescriptor<K extends string = string> = {\n\tkey: K;\n\tlabel?: string;\n\tcolor?: string;\n};\n\nexport type XYSeriesKey = \"y\" | \"y2\" | \"y3\";\nexport type XYSeriesDescriptor<K extends string = XYSeriesKey> = ChartSeriesDescriptor<K>;\nexport type BulletSeriesKey = \"value\" | \"target\";\nexport type BulletSeriesDescriptor = ChartSeriesDescriptor & { key: BulletSeriesKey };\n\nexport type XYPoint = { x: string | number; y: number; y2?: number; y3?: number };\nexport type NamedValue = { name: string; value: number };\nexport type RadarPoint = { subject: string; value: number };\nexport type BulletPoint = { name: string; value: number; target: number };\nexport type SankeyData = {\n\tnodes: { name: string }[];\n\tlinks: { source: number; target: number; value: number }[];\n};\n\nexport function resolveChartSeries<K extends string = string>(\n\tseries: Array<ChartSeriesDescriptor<K>> | undefined,\n\tfallbackKeys: K[],\n): Array<ChartSeriesDescriptor<K>> {\n\tif (series && series.length > 0) {\n\t\treturn series;\n\t}\n\treturn fallbackKeys.map((key) => ({ key }));\n}\n\nexport function applyLeadColor<K extends string = string>(\n\titems: Array<ChartSeriesDescriptor<K>>,\n\tcolor?: string,\n): Array<ChartSeriesDescriptor<K>> {\n\tif (!color) {\n\t\treturn items;\n\t}\n\treturn items.map((item, index) => (index === 0 ? { ...item, color: item.color ?? color } : item));\n}\n\nexport function xyFallbackKeys(data: Array<{ y2?: number; y3?: number }>): string[] {\n\tconst keys = [\"y\"];\n\tif (data.some((point) => point.y2 != null)) {\n\t\tkeys.push(\"y2\");\n\t}\n\tif (data.some((point) => point.y3 != null)) {\n\t\tkeys.push(\"y3\");\n\t}\n\treturn keys;\n}\n"],"mappings":";;AAoBA,SAAgB,EACf,GACA,GACkC;CAIlC,OAHI,KAAU,EAAO,SAAS,IACtB,IAED,EAAa,KAAK,OAAS,EAAE,OAAI,EAAE;AAC3C;AAEA,SAAgB,EACf,GACA,GACkC;CAIlC,OAHK,IAGE,EAAM,KAAK,GAAM,MAAW,MAAU,IAAI;EAAE,GAAG;EAAM,OAAO,EAAK,SAAS;CAAM,IAAI,CAAK,IAFxF;AAGT;AAEA,SAAgB,EAAe,GAAqD;CACnF,IAAM,IAAO,CAAC,GAAG;CAOjB,OANI,EAAK,MAAM,MAAU,EAAM,MAAM,IAAI,KACxC,EAAK,KAAK,IAAI,GAEX,EAAK,MAAM,MAAU,EAAM,MAAM,IAAI,KACxC,EAAK,KAAK,IAAI,GAER;AACR"}
@@ -1,4 +1,6 @@
1
- import { type XYPoint, type XYSeriesDescriptor } from "./series.js";
1
+ import type { ReactNode } from "react";
2
+ import type { LineChartNumericKeys } from "./line.js";
3
+ import { type ChartSeriesDescriptor, type XYPoint } from "./series.js";
2
4
  export type SlotBarItem = {
3
5
  color: string;
4
6
  height?: number;
@@ -12,11 +14,41 @@ export type SlotBarItemsProps = {
12
14
  emptyClass?: string;
13
15
  className?: string;
14
16
  };
15
- export type SlotBarDataProps = {
16
- data: XYPoint[];
17
- series?: XYSeriesDescriptor[];
17
+ export type SlotBarDataProps<TData extends {
18
+ x: string | number;
19
+ } = XYPoint, K extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string> = {
20
+ /**
21
+ * Dataset array where each record requires an `x` category or time coordinate.
22
+ * Any remaining fields with numeric, nullable, or optional number values are inferred as valid series keys.
23
+ */
24
+ data: TData[];
25
+ /**
26
+ * Series descriptors identifying which numeric keys to plot.
27
+ * Inferred strictly from numeric keys of `TData` (rejects non-numeric fields, `x`, and typos).
28
+ */
29
+ series?: Array<ChartSeriesDescriptor<NoInfer<K>>>;
18
30
  ariaLabel?: string;
19
31
  className?: string;
32
+ /**
33
+ * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.
34
+ * Associated with the chart via useId and aria-describedby.
35
+ */
36
+ summary?: ReactNode;
37
+ /**
38
+ * Accessible tabular or structured data alternative rendered outside the plot area.
39
+ */
40
+ dataAlternative?: ReactNode;
41
+ /**
42
+ * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.
43
+ * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.
44
+ * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.
45
+ * @default true
46
+ */
47
+ accessibilityLayer?: boolean;
20
48
  };
21
- export type SlotBarChartProps = SlotBarItemsProps | SlotBarDataProps;
22
- export declare function SlotBarChart(props: SlotBarChartProps): import("react").JSX.Element;
49
+ export type SlotBarChartProps<TData extends {
50
+ x: string | number;
51
+ } = XYPoint, K extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string> = SlotBarItemsProps | SlotBarDataProps<TData, K>;
52
+ export declare function SlotBarChart<TData extends {
53
+ x: string | number;
54
+ } = XYPoint, K extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string>(props: SlotBarChartProps<TData, K>): import("react").JSX.Element;
@@ -19,10 +19,13 @@ function _(e) {
19
19
  className: a
20
20
  });
21
21
  }
22
- let { series: t, ariaLabel: n = "Slot bar chart", className: r } = e, i = l(t, ["y"]);
22
+ let { series: t, ariaLabel: n = "Slot bar chart", className: r, summary: i, dataAlternative: _, accessibilityLayer: y } = e, b = l(t, ["y"]);
23
23
  return /* @__PURE__ */ d(u, {
24
24
  ariaLabel: n,
25
25
  className: r,
26
+ summary: i,
27
+ dataAlternative: _,
28
+ accessibilityLayer: y,
26
29
  children: /* @__PURE__ */ f(m, {
27
30
  data: e.data,
28
31
  children: [
@@ -31,7 +34,7 @@ function _(e) {
31
34
  ...s(!0)
32
35
  }),
33
36
  /* @__PURE__ */ d(g, { ...s(!0) }),
34
- i.map((e, t) => /* @__PURE__ */ d(p, {
37
+ b.map((e, t) => /* @__PURE__ */ d(p, {
35
38
  dataKey: e.key,
36
39
  name: e.label ?? e.key,
37
40
  fill: c(e, t),
@@ -1 +1 @@
1
- {"version":3,"file":"slot-bar.js","names":[],"sources":["../../src/charts/slot-bar.tsx"],"sourcesContent":["import { Bar, BarChart as RechartsBar, XAxis, YAxis } from \"recharts\";\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from \"../components/tooltip\";\nimport { cn } from \"../utils/cn\";\nimport { ANIMATION_PROPS, BAR_RADIUS, cartesianAxisProps, seriesColor } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport { resolveChartSeries, type XYPoint, type XYSeriesDescriptor } from \"./series\";\n\nexport type SlotBarItem = {\n\tcolor: string;\n\theight?: number;\n\tlabel?: string;\n};\n\nexport type SlotBarItemsProps = {\n\titems: SlotBarItem[];\n\tariaLabel?: string;\n\theightClass?: string;\n\tgapClass?: string;\n\temptyClass?: string;\n\tclassName?: string;\n};\n\nexport type SlotBarDataProps = {\n\tdata: XYPoint[];\n\tseries?: XYSeriesDescriptor[];\n\tariaLabel?: string;\n\tclassName?: string;\n};\n\nexport type SlotBarChartProps = SlotBarItemsProps | SlotBarDataProps;\n\nexport function SlotBarChart(props: SlotBarChartProps) {\n\tif (\"items\" in props) {\n\t\tconst {\n\t\t\tariaLabel = \"Slot bar chart\",\n\t\t\theightClass = \"h-6\",\n\t\t\tgapClass = \"gap-px\",\n\t\t\temptyClass = \"bg-basalt-muted\",\n\t\t\tclassName,\n\t\t} = props;\n\t\treturn (\n\t\t\t<SlotItemBars\n\t\t\t\titems={props.items}\n\t\t\t\tariaLabel={ariaLabel}\n\t\t\t\theightClass={heightClass}\n\t\t\t\tgapClass={gapClass}\n\t\t\t\temptyClass={emptyClass}\n\t\t\t\tclassName={className}\n\t\t\t/>\n\t\t);\n\t}\n\tconst { series, ariaLabel = \"Slot bar chart\", className } = props;\n\tconst bars = resolveChartSeries(series, [\"y\"]);\n\treturn (\n\t\t<ChartFrame ariaLabel={ariaLabel} className={className}>\n\t\t\t<RechartsBar data={props.data}>\n\t\t\t\t<XAxis dataKey=\"x\" {...cartesianAxisProps(true)} />\n\t\t\t\t<YAxis {...cartesianAxisProps(true)} />\n\t\t\t\t{bars.map((item, index) => (\n\t\t\t\t\t<Bar\n\t\t\t\t\t\tkey={item.key}\n\t\t\t\t\t\tdataKey={item.key}\n\t\t\t\t\t\tname={item.label ?? item.key}\n\t\t\t\t\t\tfill={seriesColor(item, index)}\n\t\t\t\t\t\tradius={BAR_RADIUS.vertical}\n\t\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</RechartsBar>\n\t\t</ChartFrame>\n\t);\n}\n\nfunction SlotItemBars({\n\titems,\n\tariaLabel,\n\theightClass,\n\tgapClass,\n\temptyClass,\n\tclassName,\n}: {\n\titems: SlotBarItem[];\n\tariaLabel: string;\n\theightClass: string;\n\tgapClass: string;\n\temptyClass: string;\n\tclassName?: string;\n}) {\n\tif (items.length === 0) {\n\t\treturn null;\n\t}\n\tconst hasTooltips = items.some((item) => item.label);\n\tfunction renderBar(item: SlotBarItem) {\n\t\tconst heightRatio = item.height ?? 1;\n\t\tconst isEmpty = heightRatio <= 0;\n\t\tconst isTailwindColor = item.color.startsWith(\"bg-\");\n\t\tconst heightPercent = isEmpty ? 100 : Math.max(heightRatio * 100, 10);\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"w-full rounded-sm\",\n\t\t\t\t\tisEmpty ? emptyClass : isTailwindColor ? item.color : undefined,\n\t\t\t\t)}\n\t\t\t\tstyle={{\n\t\t\t\t\theight: `${heightPercent}%`,\n\t\t\t\t\t...(isEmpty || isTailwindColor ? {} : { backgroundColor: item.color }),\n\t\t\t\t}}\n\t\t\t\tdata-testid=\"slot-bar\"\n\t\t\t/>\n\t\t);\n\t}\n\tconst content = items.map((item, index) => {\n\t\tconst bar =\n\t\t\thasTooltips && item.label ? (\n\t\t\t\t<Tooltip>\n\t\t\t\t\t<TooltipTrigger asChild>{renderBar(item)}</TooltipTrigger>\n\t\t\t\t\t<TooltipContent side=\"top\">\n\t\t\t\t\t\t<p>{item.label}</p>\n\t\t\t\t\t</TooltipContent>\n\t\t\t\t</Tooltip>\n\t\t\t) : (\n\t\t\t\trenderBar(item)\n\t\t\t);\n\t\treturn (\n\t\t\t<div\n\t\t\t\tkey={`${item.label ?? item.color}-${index}`}\n\t\t\t\tclassName=\"flex min-h-0 min-w-0 flex-1 items-end self-stretch\"\n\t\t\t>\n\t\t\t\t{bar}\n\t\t\t</div>\n\t\t);\n\t});\n\tconst container = (\n\t\t<div\n\t\t\tclassName={cn(\"flex w-full items-end\", heightClass, gapClass, className)}\n\t\t\trole=\"img\"\n\t\t\taria-label={ariaLabel}\n\t\t>\n\t\t\t{content}\n\t\t</div>\n\t);\n\tif (hasTooltips) {\n\t\treturn <TooltipProvider delayDuration={0}>{container}</TooltipProvider>;\n\t}\n\treturn container;\n}\n"],"mappings":";;;;;;;;;AA+BA,SAAgB,EAAa,GAA0B;CACtD,IAAI,WAAW,GAAO;EACrB,IAAM,EACL,eAAY,kBACZ,iBAAc,OACd,cAAW,UACX,gBAAa,mBACb,iBACG;EACJ,OACC,kBAAC,GAAD;GACC,OAAO,EAAM;GACF;GACE;GACH;GACE;GACD;EACX,CAAA;CAEH;CACA,IAAM,EAAE,WAAQ,eAAY,kBAAkB,iBAAc,GACtD,IAAO,EAAmB,GAAQ,CAAC,GAAG,CAAC;CAC7C,OACC,kBAAC,GAAD;EAAuB;EAAsB;EAC5C,UAAA,kBAAC,GAAD;GAAa,MAAM,EAAM;GAAzB,UAAA;IACC,kBAAC,GAAD;KAAO,SAAQ;KAAI,GAAI,EAAmB,EAAI;IAAI,CAAA;IAClD,kBAAC,GAAD,EAAO,GAAI,EAAmB,EAAI,EAAI,CAAA;IACrC,EAAK,KAAK,GAAM,MAChB,kBAAC,GAAD;KAEC,SAAS,EAAK;KACd,MAAM,EAAK,SAAS,EAAK;KACzB,MAAM,EAAY,GAAM,CAAK;KAC7B,QAAQ,EAAW;KACnB,GAAI;IACJ,GANK,EAAK,GAMV,CACD;GACW;;CACF,CAAA;AAEd;AAEA,SAAS,EAAa,EACrB,UACA,cACA,gBACA,aACA,eACA,gBAQE;CACF,IAAI,EAAM,WAAW,GACpB,OAAO;CAER,IAAM,IAAc,EAAM,MAAM,MAAS,EAAK,KAAK;CACnD,SAAS,EAAU,GAAmB;EACrC,IAAM,IAAc,EAAK,UAAU,GAC7B,IAAU,KAAe,GACzB,IAAkB,EAAK,MAAM,WAAW,KAAK,GAC7C,IAAgB,IAAU,MAAM,KAAK,IAAI,IAAc,KAAK,EAAE;EACpE,OACC,kBAAC,OAAD;GACC,WAAW,EACV,qBACA,IAAU,IAAa,IAAkB,EAAK,QAAQ,KAAA,CACvD;GACA,OAAO;IACN,QAAQ,GAAG,EAAc;IACzB,GAAI,KAAW,IAAkB,CAAC,IAAI,EAAE,iBAAiB,EAAK,MAAM;GACrE;GACA,eAAY;EACZ,CAAA;CAEH;CACA,IAAM,IAAU,EAAM,KAAK,GAAM,MAAU;EAC1C,IAAM,IACL,KAAe,EAAK,QACnB,kBAAC,GAAD,EAAA,UAAA,CACC,kBAAC,GAAD;GAAgB,SAAA;GAAS,UAAA,EAAU,CAAI;EAAkB,CAAA,GACzD,kBAAC,GAAD;GAAgB,MAAK;GACpB,UAAA,kBAAC,KAAD,EAAA,UAAI,EAAK,MAAS,CAAA;EACH,CAAA,CACR,EAAA,CAAA,IAET,EAAU,CAAI;EAEhB,OACC,kBAAC,OAAD;GAEC,WAAU;GAET,UAAA;EACG,GAJC,GAAG,EAAK,SAAS,EAAK,MAAM,GAAG,GAIhC;CAEP,CAAC,GACK,IACL,kBAAC,OAAD;EACC,WAAW,EAAG,yBAAyB,GAAa,GAAU,CAAS;EACvE,MAAK;EACL,cAAY;EAEX,UAAA;CACG,CAAA;CAKN,OAHI,IACI,kBAAC,GAAD;EAAiB,eAAe;EAAI,UAAA;CAA2B,CAAA,IAEhE;AACR"}
1
+ {"version":3,"file":"slot-bar.js","names":[],"sources":["../../src/charts/slot-bar.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Bar, BarChart as RechartsBar, XAxis, YAxis } from \"recharts\";\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from \"../components/tooltip\";\nimport { cn } from \"../utils/cn\";\nimport { ANIMATION_PROPS, BAR_RADIUS, cartesianAxisProps, seriesColor } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport type { LineChartNumericKeys } from \"./line\";\nimport { type ChartSeriesDescriptor, resolveChartSeries, type XYPoint } from \"./series\";\n\nexport type SlotBarItem = {\n\tcolor: string;\n\theight?: number;\n\tlabel?: string;\n};\n\nexport type SlotBarItemsProps = {\n\titems: SlotBarItem[];\n\tariaLabel?: string;\n\theightClass?: string;\n\tgapClass?: string;\n\temptyClass?: string;\n\tclassName?: string;\n};\n\nexport type SlotBarDataProps<\n\tTData extends { x: string | number } = XYPoint,\n\tK extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string,\n> = {\n\t/**\n\t * Dataset array where each record requires an `x` category or time coordinate.\n\t * Any remaining fields with numeric, nullable, or optional number values are inferred as valid series keys.\n\t */\n\tdata: TData[];\n\t/**\n\t * Series descriptors identifying which numeric keys to plot.\n\t * Inferred strictly from numeric keys of `TData` (rejects non-numeric fields, `x`, and typos).\n\t */\n\tseries?: Array<ChartSeriesDescriptor<NoInfer<K>>>;\n\tariaLabel?: string;\n\tclassName?: string;\n\t/**\n\t * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.\n\t * Associated with the chart via useId and aria-describedby.\n\t */\n\tsummary?: ReactNode;\n\t/**\n\t * Accessible tabular or structured data alternative rendered outside the plot area.\n\t */\n\tdataAlternative?: ReactNode;\n\t/**\n\t * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.\n\t * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.\n\t * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.\n\t * @default true\n\t */\n\taccessibilityLayer?: boolean;\n};\n\nexport type SlotBarChartProps<\n\tTData extends { x: string | number } = XYPoint,\n\tK extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string,\n> = SlotBarItemsProps | SlotBarDataProps<TData, K>;\n\nexport function SlotBarChart<\n\tTData extends { x: string | number } = XYPoint,\n\tK extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string,\n>(props: SlotBarChartProps<TData, K>) {\n\tif (\"items\" in props) {\n\t\tconst {\n\t\t\tariaLabel = \"Slot bar chart\",\n\t\t\theightClass = \"h-6\",\n\t\t\tgapClass = \"gap-px\",\n\t\t\temptyClass = \"bg-basalt-muted\",\n\t\t\tclassName,\n\t\t} = props;\n\t\treturn (\n\t\t\t<SlotItemBars\n\t\t\t\titems={props.items}\n\t\t\t\tariaLabel={ariaLabel}\n\t\t\t\theightClass={heightClass}\n\t\t\t\tgapClass={gapClass}\n\t\t\t\temptyClass={emptyClass}\n\t\t\t\tclassName={className}\n\t\t\t/>\n\t\t);\n\t}\n\tconst {\n\t\tseries,\n\t\tariaLabel = \"Slot bar chart\",\n\t\tclassName,\n\t\tsummary,\n\t\tdataAlternative,\n\t\taccessibilityLayer,\n\t} = props;\n\tconst bars = resolveChartSeries(series, [\"y\" as K]);\n\treturn (\n\t\t<ChartFrame\n\t\t\tariaLabel={ariaLabel}\n\t\t\tclassName={className}\n\t\t\tsummary={summary}\n\t\t\tdataAlternative={dataAlternative}\n\t\t\taccessibilityLayer={accessibilityLayer}\n\t\t>\n\t\t\t<RechartsBar data={props.data}>\n\t\t\t\t<XAxis dataKey=\"x\" {...cartesianAxisProps(true)} />\n\t\t\t\t<YAxis {...cartesianAxisProps(true)} />\n\t\t\t\t{bars.map((item, index) => (\n\t\t\t\t\t<Bar\n\t\t\t\t\t\tkey={item.key}\n\t\t\t\t\t\tdataKey={item.key}\n\t\t\t\t\t\tname={item.label ?? item.key}\n\t\t\t\t\t\tfill={seriesColor(item, index)}\n\t\t\t\t\t\tradius={BAR_RADIUS.vertical}\n\t\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</RechartsBar>\n\t\t</ChartFrame>\n\t);\n}\n\nfunction SlotItemBars({\n\titems,\n\tariaLabel,\n\theightClass,\n\tgapClass,\n\temptyClass,\n\tclassName,\n}: {\n\titems: SlotBarItem[];\n\tariaLabel: string;\n\theightClass: string;\n\tgapClass: string;\n\temptyClass: string;\n\tclassName?: string;\n}) {\n\tif (items.length === 0) {\n\t\treturn null;\n\t}\n\tconst hasTooltips = items.some((item) => item.label);\n\tfunction renderBar(item: SlotBarItem) {\n\t\tconst heightRatio = item.height ?? 1;\n\t\tconst isEmpty = heightRatio <= 0;\n\t\tconst isTailwindColor = item.color.startsWith(\"bg-\");\n\t\tconst heightPercent = isEmpty ? 100 : Math.max(heightRatio * 100, 10);\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"w-full rounded-sm\",\n\t\t\t\t\tisEmpty ? emptyClass : isTailwindColor ? item.color : undefined,\n\t\t\t\t)}\n\t\t\t\tstyle={{\n\t\t\t\t\theight: `${heightPercent}%`,\n\t\t\t\t\t...(isEmpty || isTailwindColor ? {} : { backgroundColor: item.color }),\n\t\t\t\t}}\n\t\t\t\tdata-testid=\"slot-bar\"\n\t\t\t/>\n\t\t);\n\t}\n\tconst content = items.map((item, index) => {\n\t\tconst bar =\n\t\t\thasTooltips && item.label ? (\n\t\t\t\t<Tooltip>\n\t\t\t\t\t<TooltipTrigger asChild>{renderBar(item)}</TooltipTrigger>\n\t\t\t\t\t<TooltipContent side=\"top\">\n\t\t\t\t\t\t<p>{item.label}</p>\n\t\t\t\t\t</TooltipContent>\n\t\t\t\t</Tooltip>\n\t\t\t) : (\n\t\t\t\trenderBar(item)\n\t\t\t);\n\t\treturn (\n\t\t\t<div\n\t\t\t\tkey={`${item.label ?? item.color}-${index}`}\n\t\t\t\tclassName=\"flex min-h-0 min-w-0 flex-1 items-end self-stretch\"\n\t\t\t>\n\t\t\t\t{bar}\n\t\t\t</div>\n\t\t);\n\t});\n\tconst container = (\n\t\t<div\n\t\t\tclassName={cn(\"flex w-full items-end\", heightClass, gapClass, className)}\n\t\t\trole=\"img\"\n\t\t\taria-label={ariaLabel}\n\t\t>\n\t\t\t{content}\n\t\t</div>\n\t);\n\tif (hasTooltips) {\n\t\treturn <TooltipProvider delayDuration={0}>{container}</TooltipProvider>;\n\t}\n\treturn container;\n}\n"],"mappings":";;;;;;;;;AA+DA,SAAgB,EAGd,GAAoC;CACrC,IAAI,WAAW,GAAO;EACrB,IAAM,EACL,eAAY,kBACZ,iBAAc,OACd,cAAW,UACX,gBAAa,mBACb,iBACG;EACJ,OACC,kBAAC,GAAD;GACC,OAAO,EAAM;GACF;GACE;GACH;GACE;GACD;EACX,CAAA;CAEH;CACA,IAAM,EACL,WACA,eAAY,kBACZ,cACA,YACA,oBACA,0BACG,GACE,IAAO,EAAmB,GAAQ,CAAC,GAAQ,CAAC;CAClD,OACC,kBAAC,GAAD;EACY;EACA;EACF;EACQ;EACG;EAEpB,UAAA,kBAAC,GAAD;GAAa,MAAM,EAAM;GAAzB,UAAA;IACC,kBAAC,GAAD;KAAO,SAAQ;KAAI,GAAI,EAAmB,EAAI;IAAI,CAAA;IAClD,kBAAC,GAAD,EAAO,GAAI,EAAmB,EAAI,EAAI,CAAA;IACrC,EAAK,KAAK,GAAM,MAChB,kBAAC,GAAD;KAEC,SAAS,EAAK;KACd,MAAM,EAAK,SAAS,EAAK;KACzB,MAAM,EAAY,GAAM,CAAK;KAC7B,QAAQ,EAAW;KACnB,GAAI;IACJ,GANK,EAAK,GAMV,CACD;GACW;;CACF,CAAA;AAEd;AAEA,SAAS,EAAa,EACrB,UACA,cACA,gBACA,aACA,eACA,gBAQE;CACF,IAAI,EAAM,WAAW,GACpB,OAAO;CAER,IAAM,IAAc,EAAM,MAAM,MAAS,EAAK,KAAK;CACnD,SAAS,EAAU,GAAmB;EACrC,IAAM,IAAc,EAAK,UAAU,GAC7B,IAAU,KAAe,GACzB,IAAkB,EAAK,MAAM,WAAW,KAAK,GAC7C,IAAgB,IAAU,MAAM,KAAK,IAAI,IAAc,KAAK,EAAE;EACpE,OACC,kBAAC,OAAD;GACC,WAAW,EACV,qBACA,IAAU,IAAa,IAAkB,EAAK,QAAQ,KAAA,CACvD;GACA,OAAO;IACN,QAAQ,GAAG,EAAc;IACzB,GAAI,KAAW,IAAkB,CAAC,IAAI,EAAE,iBAAiB,EAAK,MAAM;GACrE;GACA,eAAY;EACZ,CAAA;CAEH;CACA,IAAM,IAAU,EAAM,KAAK,GAAM,MAAU;EAC1C,IAAM,IACL,KAAe,EAAK,QACnB,kBAAC,GAAD,EAAA,UAAA,CACC,kBAAC,GAAD;GAAgB,SAAA;GAAS,UAAA,EAAU,CAAI;EAAkB,CAAA,GACzD,kBAAC,GAAD;GAAgB,MAAK;GACpB,UAAA,kBAAC,KAAD,EAAA,UAAI,EAAK,MAAS,CAAA;EACH,CAAA,CACR,EAAA,CAAA,IAET,EAAU,CAAI;EAEhB,OACC,kBAAC,OAAD;GAEC,WAAU;GAET,UAAA;EACG,GAJC,GAAG,EAAK,SAAS,EAAK,MAAM,GAAG,GAIhC;CAEP,CAAC,GACK,IACL,kBAAC,OAAD;EACC,WAAW,EAAG,yBAAyB,GAAa,GAAU,CAAS;EACvE,MAAK;EACL,cAAY;EAEX,UAAA;CACG,CAAA;CAKN,OAHI,IACI,kBAAC,GAAD;EAAiB,eAAe;EAAI,UAAA;CAA2B,CAAA,IAEhE;AACR"}
@@ -1,8 +1,38 @@
1
- import { type XYPoint, type XYSeriesDescriptor } from "./series.js";
2
- export type SparklineProps = {
3
- data: XYPoint[];
4
- series?: XYSeriesDescriptor[];
1
+ import type { ReactNode } from "react";
2
+ import type { LineChartNumericKeys } from "./line.js";
3
+ import { type ChartSeriesDescriptor, type XYPoint } from "./series.js";
4
+ export type SparklineProps<TData extends {
5
+ x: string | number;
6
+ } = XYPoint, K extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string> = {
7
+ /**
8
+ * Dataset array where each record requires an `x` category or time coordinate.
9
+ * Any remaining fields with numeric, nullable, or optional number values are inferred as valid series keys.
10
+ */
11
+ data: TData[];
12
+ /**
13
+ * Series descriptors identifying which numeric keys to plot.
14
+ * Inferred strictly from numeric keys of `TData` (rejects non-numeric fields, `x`, and typos).
15
+ */
16
+ series?: Array<ChartSeriesDescriptor<NoInfer<K>>>;
5
17
  ariaLabel?: string;
6
18
  className?: string;
19
+ /**
20
+ * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.
21
+ * Associated with the chart via useId and aria-describedby.
22
+ */
23
+ summary?: ReactNode;
24
+ /**
25
+ * Accessible tabular or structured data alternative rendered outside the plot area.
26
+ */
27
+ dataAlternative?: ReactNode;
28
+ /**
29
+ * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.
30
+ * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.
31
+ * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.
32
+ * @default true
33
+ */
34
+ accessibilityLayer?: boolean;
7
35
  };
8
- export declare function Sparkline({ data, series, ariaLabel, className }: SparklineProps): import("react").JSX.Element;
36
+ export declare function Sparkline<TData extends {
37
+ x: string | number;
38
+ } = XYPoint, K extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string>({ data, series, ariaLabel, className, summary, dataAlternative, accessibilityLayer, }: SparklineProps<TData, K>): import("react").JSX.Element;
@@ -1,30 +1,34 @@
1
1
  "use client";
2
- import { ANIMATION_PROPS as e, seriesColor as t } from "./config.js";
3
- import { resolveChartSeries as n } from "./series.js";
4
- import { ChartFrame as r } from "./frame.js";
5
- import { jsx as i } from "react/jsx-runtime";
6
- import { Line as a, LineChart as o } from "recharts";
2
+ import { ANIMATION_PROPS as e, CHART_TYPE as t, seriesColor as n } from "./config.js";
3
+ import { resolveChartSeries as r } from "./series.js";
4
+ import { ChartFrame as i } from "./frame.js";
5
+ import { jsx as a } from "react/jsx-runtime";
6
+ import { Line as o, LineChart as s } from "recharts";
7
7
  //#region src/charts/sparkline.tsx
8
- function s({ data: s, series: c, ariaLabel: l = "Sparkline", className: u }) {
9
- let d = n(c, ["y"]);
10
- return /* @__PURE__ */ i(r, {
11
- ariaLabel: l,
12
- className: u,
8
+ function c({ data: c, series: l, ariaLabel: u = "Sparkline", className: d, summary: f, dataAlternative: p, accessibilityLayer: m }) {
9
+ let h = r(l, ["y"]);
10
+ return /* @__PURE__ */ a(i, {
11
+ ariaLabel: u,
12
+ className: d,
13
13
  size: "h-10 w-28",
14
- children: /* @__PURE__ */ i(o, {
15
- data: s,
16
- children: d.map((n, r) => /* @__PURE__ */ i(a, {
14
+ summary: f,
15
+ dataAlternative: p,
16
+ accessibilityLayer: m,
17
+ children: /* @__PURE__ */ a(s, {
18
+ data: c,
19
+ children: h.map((r, i) => /* @__PURE__ */ a(o, {
17
20
  type: "monotone",
18
- dataKey: n.key,
19
- name: n.label ?? n.key,
20
- stroke: t(n, r),
21
+ dataKey: r.key,
22
+ name: r.label ?? r.key,
23
+ stroke: n(r, i),
24
+ strokeWidth: t.strokeWidth,
21
25
  dot: !1,
22
26
  ...e
23
- }, n.key))
27
+ }, r.key))
24
28
  })
25
29
  });
26
30
  }
27
31
  //#endregion
28
- export { s as Sparkline };
32
+ export { c as Sparkline };
29
33
 
30
34
  //# sourceMappingURL=sparkline.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"sparkline.js","names":[],"sources":["../../src/charts/sparkline.tsx"],"sourcesContent":["import { Line, LineChart as RechartsLine } from \"recharts\";\nimport { ANIMATION_PROPS, seriesColor } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport { resolveChartSeries, type XYPoint, type XYSeriesDescriptor } from \"./series\";\n\nexport type SparklineProps = {\n\tdata: XYPoint[];\n\tseries?: XYSeriesDescriptor[];\n\tariaLabel?: string;\n\tclassName?: string;\n};\n\nexport function Sparkline({ data, series, ariaLabel = \"Sparkline\", className }: SparklineProps) {\n\tconst lines = resolveChartSeries(series, [\"y\"]);\n\treturn (\n\t\t<ChartFrame ariaLabel={ariaLabel} className={className} size=\"h-10 w-28\">\n\t\t\t<RechartsLine data={data}>\n\t\t\t\t{lines.map((item, index) => (\n\t\t\t\t\t<Line\n\t\t\t\t\t\tkey={item.key}\n\t\t\t\t\t\ttype=\"monotone\"\n\t\t\t\t\t\tdataKey={item.key}\n\t\t\t\t\t\tname={item.label ?? item.key}\n\t\t\t\t\t\tstroke={seriesColor(item, index)}\n\t\t\t\t\t\tdot={false}\n\t\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</RechartsLine>\n\t\t</ChartFrame>\n\t);\n}\n"],"mappings":";;;;;;;AAYA,SAAgB,EAAU,EAAE,SAAM,WAAQ,eAAY,aAAa,gBAA6B;CAC/F,IAAM,IAAQ,EAAmB,GAAQ,CAAC,GAAG,CAAC;CAC9C,OACC,kBAAC,GAAD;EAAuB;EAAsB;EAAW,MAAK;EAC5D,UAAA,kBAAC,GAAD;GAAoB;GAClB,UAAA,EAAM,KAAK,GAAM,MACjB,kBAAC,GAAD;IAEC,MAAK;IACL,SAAS,EAAK;IACd,MAAM,EAAK,SAAS,EAAK;IACzB,QAAQ,EAAY,GAAM,CAAK;IAC/B,KAAK;IACL,GAAI;GACJ,GAPK,EAAK,GAOV,CACD;EACY,CAAA;CACH,CAAA;AAEd"}
1
+ {"version":3,"file":"sparkline.js","names":[],"sources":["../../src/charts/sparkline.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Line, LineChart as RechartsLine } from \"recharts\";\nimport { ANIMATION_PROPS, CHART_TYPE, seriesColor } from \"./config\";\nimport { ChartFrame } from \"./frame\";\nimport type { LineChartNumericKeys } from \"./line\";\nimport { type ChartSeriesDescriptor, resolveChartSeries, type XYPoint } from \"./series\";\n\nexport type SparklineProps<\n\tTData extends { x: string | number } = XYPoint,\n\tK extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string,\n> = {\n\t/**\n\t * Dataset array where each record requires an `x` category or time coordinate.\n\t * Any remaining fields with numeric, nullable, or optional number values are inferred as valid series keys.\n\t */\n\tdata: TData[];\n\t/**\n\t * Series descriptors identifying which numeric keys to plot.\n\t * Inferred strictly from numeric keys of `TData` (rejects non-numeric fields, `x`, and typos).\n\t */\n\tseries?: Array<ChartSeriesDescriptor<NoInfer<K>>>;\n\tariaLabel?: string;\n\tclassName?: string;\n\t/**\n\t * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.\n\t * Associated with the chart via useId and aria-describedby.\n\t */\n\tsummary?: ReactNode;\n\t/**\n\t * Accessible tabular or structured data alternative rendered outside the plot area.\n\t */\n\tdataAlternative?: ReactNode;\n\t/**\n\t * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.\n\t * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.\n\t * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.\n\t * @default true\n\t */\n\taccessibilityLayer?: boolean;\n};\n\nexport function Sparkline<\n\tTData extends { x: string | number } = XYPoint,\n\tK extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string,\n>({\n\tdata,\n\tseries,\n\tariaLabel = \"Sparkline\",\n\tclassName,\n\tsummary,\n\tdataAlternative,\n\taccessibilityLayer,\n}: SparklineProps<TData, K>) {\n\tconst lines = resolveChartSeries(series, [\"y\" as K]);\n\treturn (\n\t\t<ChartFrame\n\t\t\tariaLabel={ariaLabel}\n\t\t\tclassName={className}\n\t\t\tsize=\"h-10 w-28\"\n\t\t\tsummary={summary}\n\t\t\tdataAlternative={dataAlternative}\n\t\t\taccessibilityLayer={accessibilityLayer}\n\t\t>\n\t\t\t<RechartsLine data={data}>\n\t\t\t\t{lines.map((item, index) => (\n\t\t\t\t\t<Line\n\t\t\t\t\t\tkey={item.key}\n\t\t\t\t\t\ttype=\"monotone\"\n\t\t\t\t\t\tdataKey={item.key}\n\t\t\t\t\t\tname={item.label ?? item.key}\n\t\t\t\t\t\tstroke={seriesColor(item, index)}\n\t\t\t\t\t\tstrokeWidth={CHART_TYPE.strokeWidth}\n\t\t\t\t\t\tdot={false}\n\t\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</RechartsLine>\n\t\t</ChartFrame>\n\t);\n}\n"],"mappings":";;;;;;;AAyCA,SAAgB,EAGd,EACD,SACA,WACA,eAAY,aACZ,cACA,YACA,oBACA,yBAC4B;CAC5B,IAAM,IAAQ,EAAmB,GAAQ,CAAC,GAAQ,CAAC;CACnD,OACC,kBAAC,GAAD;EACY;EACA;EACX,MAAK;EACI;EACQ;EACG;EAEpB,UAAA,kBAAC,GAAD;GAAoB;GAClB,UAAA,EAAM,KAAK,GAAM,MACjB,kBAAC,GAAD;IAEC,MAAK;IACL,SAAS,EAAK;IACd,MAAM,EAAK,SAAS,EAAK;IACzB,QAAQ,EAAY,GAAM,CAAK;IAC/B,aAAa,EAAW;IACxB,KAAK;IACL,GAAI;GACJ,GARK,EAAK,GAQV,CACD;EACY,CAAA;CACH,CAAA;AAEd"}
@@ -1,11 +1,64 @@
1
- import { type XYPoint, type XYSeriesDescriptor } from "./series.js";
2
- export type StackedBarChartProps = {
3
- data: XYPoint[];
4
- series?: XYSeriesDescriptor[];
1
+ import type { ReactNode } from "react";
2
+ import type { LineChartAxisDomain, LineChartLegendRenderer, LineChartNumericKeys, LineChartTooltipRenderer } from "./line.js";
3
+ import { type ChartSeriesDescriptor, type XYPoint } from "./series.js";
4
+ export type StackedBarChartProps<TData extends {
5
+ x: string | number;
6
+ } = XYPoint, K extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string> = {
7
+ /**
8
+ * Dataset array where each record requires an `x` category or time coordinate.
9
+ * Any remaining fields with numeric, nullable, or optional number values are inferred as valid series keys.
10
+ */
11
+ data: TData[];
12
+ /**
13
+ * Series descriptors identifying which numeric keys to plot.
14
+ * Inferred strictly from numeric keys of `TData` (rejects non-numeric fields, `x`, and typos).
15
+ */
16
+ series?: Array<ChartSeriesDescriptor<NoInfer<K>>>;
5
17
  ariaLabel?: string;
6
18
  className?: string;
7
19
  showAxes?: boolean;
8
20
  showLegend?: boolean;
21
+ /**
22
+ * Stacking offset algorithm (e.g. "expand" for 100% normalized percentage bar stacks).
23
+ */
24
+ stackOffset?: "none" | "expand" | "wiggle" | "silhouette";
25
+ /**
26
+ * Value formatter for Y-axis tick values and fallback tooltip values.
27
+ */
9
28
  valueFormatter?: (value: number) => string;
29
+ /**
30
+ * Formatter for X-axis category or time tick labels.
31
+ */
32
+ xValueFormatter?: (value: string | number) => string;
33
+ /**
34
+ * Custom numerical or keyword bounds for the Y-axis.
35
+ */
36
+ yDomain?: LineChartAxisDomain;
37
+ /**
38
+ * Custom legend slot or render function receiving resolved series descriptors.
39
+ */
40
+ legend?: ReactNode | LineChartLegendRenderer<K>;
41
+ /**
42
+ * Custom tooltip content renderer receiving Recharts payload, active status, and coordinate label.
43
+ */
44
+ customTooltip?: LineChartTooltipRenderer;
45
+ /**
46
+ * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.
47
+ * Associated with the chart via useId and aria-describedby.
48
+ */
49
+ summary?: ReactNode;
50
+ /**
51
+ * Accessible tabular or structured data alternative rendered outside the plot area.
52
+ */
53
+ dataAlternative?: ReactNode;
54
+ /**
55
+ * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.
56
+ * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.
57
+ * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.
58
+ * @default true
59
+ */
60
+ accessibilityLayer?: boolean;
10
61
  };
11
- export declare function StackedBarChart({ data, series, ariaLabel, className, showAxes, showLegend, valueFormatter, }: StackedBarChartProps): import("react").JSX.Element;
62
+ export declare function StackedBarChart<TData extends {
63
+ x: string | number;
64
+ } = XYPoint, K extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string>({ data, series, ariaLabel, className, showAxes, showLegend, stackOffset, valueFormatter, xValueFormatter, yDomain, legend, customTooltip, summary, dataAlternative, accessibilityLayer, }: StackedBarChartProps<TData, K>): import("react").JSX.Element;
@@ -6,37 +6,44 @@ import { ChartLegend as u } from "./legend.js";
6
6
  import { jsx as d, jsxs as f } from "react/jsx-runtime";
7
7
  import { Bar as p, BarChart as m, CartesianGrid as h, Tooltip as g, XAxis as _, YAxis as v } from "recharts";
8
8
  //#region src/charts/stacked-bar.tsx
9
- function y({ data: y, series: b, ariaLabel: x = "Stacked bar chart", className: S, showAxes: C = !1, showLegend: w = !1, valueFormatter: T }) {
10
- let E = c(b, [
9
+ function y({ data: y, series: b, ariaLabel: x = "Stacked bar chart", className: S, showAxes: C = !1, showLegend: w = !1, stackOffset: T, valueFormatter: E, xValueFormatter: D, yDomain: O, legend: k, customTooltip: A, summary: j, dataAlternative: M, accessibilityLayer: N }) {
10
+ let P = c(b, [
11
11
  "y",
12
12
  "y2",
13
13
  "y3"
14
- ]);
14
+ ]), F = k === void 0 ? w ? /* @__PURE__ */ d(u, {
15
+ items: P,
16
+ shape: "bar"
17
+ }) : void 0 : typeof k == "function" ? k({ items: P }) : k;
15
18
  return /* @__PURE__ */ d(l, {
16
19
  ariaLabel: x,
17
20
  className: S,
18
- legend: w ? /* @__PURE__ */ d(u, {
19
- items: E,
20
- shape: "bar"
21
- }) : void 0,
21
+ legend: F,
22
+ summary: j,
23
+ dataAlternative: M,
24
+ accessibilityLayer: N,
22
25
  children: /* @__PURE__ */ f(m, {
23
26
  data: y,
24
27
  margin: C ? n : r,
28
+ stackOffset: T,
25
29
  children: [
26
30
  C ? /* @__PURE__ */ d(h, { ...i }) : null,
27
31
  /* @__PURE__ */ d(_, {
28
32
  dataKey: "x",
29
- ...a(!C)
33
+ ...a(!C),
34
+ tickFormatter: D
30
35
  }),
31
36
  /* @__PURE__ */ d(v, {
32
37
  ...a(!C),
33
- tickFormatter: T
38
+ tickFormatter: E,
39
+ ...O ? { domain: O } : {}
34
40
  }),
35
41
  /* @__PURE__ */ d(g, { ...o({
36
- formatter: T,
37
- cursor: "bar"
42
+ formatter: E,
43
+ cursor: "bar",
44
+ customTooltip: A
38
45
  }) }),
39
- E.map((n, r) => /* @__PURE__ */ d(p, {
46
+ P.map((n, r) => /* @__PURE__ */ d(p, {
40
47
  dataKey: n.key,
41
48
  name: n.label ?? n.key,
42
49
  stackId: "stack",
@@ -1 +1 @@
1
- {"version":3,"file":"stacked-bar.js","names":[],"sources":["../../src/charts/stacked-bar.tsx"],"sourcesContent":["import { Bar, CartesianGrid, BarChart as RechartsBar, Tooltip, XAxis, YAxis } from \"recharts\";\nimport {\n\tANIMATION_PROPS,\n\tBAR_RADIUS,\n\tCHART_PLOT_MARGIN,\n\tCHART_PLOT_MARGIN_BARE,\n\tcartesianAxisProps,\n\tchartTooltipProps,\n\tGRID_PROPS,\n\tseriesColor,\n} from \"./config\";\nimport { ChartShell } from \"./frame\";\nimport { ChartLegend } from \"./legend\";\nimport { resolveChartSeries, type XYPoint, type XYSeriesDescriptor } from \"./series\";\n\nexport type StackedBarChartProps = {\n\tdata: XYPoint[];\n\tseries?: XYSeriesDescriptor[];\n\tariaLabel?: string;\n\tclassName?: string;\n\tshowAxes?: boolean;\n\tshowLegend?: boolean;\n\tvalueFormatter?: (value: number) => string;\n};\n\nexport function StackedBarChart({\n\tdata,\n\tseries,\n\tariaLabel = \"Stacked bar chart\",\n\tclassName,\n\tshowAxes = false,\n\tshowLegend = false,\n\tvalueFormatter,\n}: StackedBarChartProps) {\n\tconst bars = resolveChartSeries(series, [\"y\", \"y2\", \"y3\"]);\n\treturn (\n\t\t<ChartShell\n\t\t\tariaLabel={ariaLabel}\n\t\t\tclassName={className}\n\t\t\tlegend={showLegend ? <ChartLegend items={bars} shape=\"bar\" /> : undefined}\n\t\t>\n\t\t\t<RechartsBar data={data} margin={showAxes ? CHART_PLOT_MARGIN : CHART_PLOT_MARGIN_BARE}>\n\t\t\t\t{showAxes ? <CartesianGrid {...GRID_PROPS} /> : null}\n\t\t\t\t<XAxis dataKey=\"x\" {...cartesianAxisProps(!showAxes)} />\n\t\t\t\t<YAxis {...cartesianAxisProps(!showAxes)} tickFormatter={valueFormatter} />\n\t\t\t\t<Tooltip {...chartTooltipProps({ formatter: valueFormatter, cursor: \"bar\" })} />\n\t\t\t\t{bars.map((item, index) => (\n\t\t\t\t\t<Bar\n\t\t\t\t\t\tkey={item.key}\n\t\t\t\t\t\tdataKey={item.key}\n\t\t\t\t\t\tname={item.label ?? item.key}\n\t\t\t\t\t\tstackId=\"stack\"\n\t\t\t\t\t\tfill={seriesColor(item, index)}\n\t\t\t\t\t\tradius={BAR_RADIUS.vertical}\n\t\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</RechartsBar>\n\t\t</ChartShell>\n\t);\n}\n"],"mappings":";;;;;;;;AAyBA,SAAgB,EAAgB,EAC/B,SACA,WACA,eAAY,qBACZ,cACA,cAAW,IACX,gBAAa,IACb,qBACwB;CACxB,IAAM,IAAO,EAAmB,GAAQ;EAAC;EAAK;EAAM;CAAI,CAAC;CACzD,OACC,kBAAC,GAAD;EACY;EACA;EACX,QAAQ,IAAa,kBAAC,GAAD;GAAa,OAAO;GAAM,OAAM;EAAO,CAAA,IAAI,KAAA;EAEhE,UAAA,kBAAC,GAAD;GAAmB;GAAM,QAAQ,IAAW,IAAoB;GAAhE,UAAA;IACE,IAAW,kBAAC,GAAD,EAAe,GAAI,EAAa,CAAA,IAAI;IAChD,kBAAC,GAAD;KAAO,SAAQ;KAAI,GAAI,EAAmB,CAAC,CAAQ;IAAI,CAAA;IACvD,kBAAC,GAAD;KAAO,GAAI,EAAmB,CAAC,CAAQ;KAAG,eAAe;IAAiB,CAAA;IAC1E,kBAAC,GAAD,EAAS,GAAI,EAAkB;KAAE,WAAW;KAAgB,QAAQ;IAAM,CAAC,EAAI,CAAA;IAC9E,EAAK,KAAK,GAAM,MAChB,kBAAC,GAAD;KAEC,SAAS,EAAK;KACd,MAAM,EAAK,SAAS,EAAK;KACzB,SAAQ;KACR,MAAM,EAAY,GAAM,CAAK;KAC7B,QAAQ,EAAW;KACnB,GAAI;IACJ,GAPK,EAAK,GAOV,CACD;GACW;;CACF,CAAA;AAEd"}
1
+ {"version":3,"file":"stacked-bar.js","names":[],"sources":["../../src/charts/stacked-bar.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Bar, CartesianGrid, BarChart as RechartsBar, Tooltip, XAxis, YAxis } from \"recharts\";\nimport {\n\tANIMATION_PROPS,\n\tBAR_RADIUS,\n\tCHART_PLOT_MARGIN,\n\tCHART_PLOT_MARGIN_BARE,\n\tcartesianAxisProps,\n\tchartTooltipProps,\n\tGRID_PROPS,\n\tseriesColor,\n} from \"./config\";\nimport { ChartShell } from \"./frame\";\nimport { ChartLegend } from \"./legend\";\nimport type {\n\tLineChartAxisDomain,\n\tLineChartLegendRenderer,\n\tLineChartNumericKeys,\n\tLineChartTooltipRenderer,\n} from \"./line\";\nimport { type ChartSeriesDescriptor, resolveChartSeries, type XYPoint } from \"./series\";\n\nexport type StackedBarChartProps<\n\tTData extends { x: string | number } = XYPoint,\n\tK extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string,\n> = {\n\t/**\n\t * Dataset array where each record requires an `x` category or time coordinate.\n\t * Any remaining fields with numeric, nullable, or optional number values are inferred as valid series keys.\n\t */\n\tdata: TData[];\n\t/**\n\t * Series descriptors identifying which numeric keys to plot.\n\t * Inferred strictly from numeric keys of `TData` (rejects non-numeric fields, `x`, and typos).\n\t */\n\tseries?: Array<ChartSeriesDescriptor<NoInfer<K>>>;\n\tariaLabel?: string;\n\tclassName?: string;\n\tshowAxes?: boolean;\n\tshowLegend?: boolean;\n\t/**\n\t * Stacking offset algorithm (e.g. \"expand\" for 100% normalized percentage bar stacks).\n\t */\n\tstackOffset?: \"none\" | \"expand\" | \"wiggle\" | \"silhouette\";\n\t/**\n\t * Value formatter for Y-axis tick values and fallback tooltip values.\n\t */\n\tvalueFormatter?: (value: number) => string;\n\t/**\n\t * Formatter for X-axis category or time tick labels.\n\t */\n\txValueFormatter?: (value: string | number) => string;\n\t/**\n\t * Custom numerical or keyword bounds for the Y-axis.\n\t */\n\tyDomain?: LineChartAxisDomain;\n\t/**\n\t * Custom legend slot or render function receiving resolved series descriptors.\n\t */\n\tlegend?: ReactNode | LineChartLegendRenderer<K>;\n\t/**\n\t * Custom tooltip content renderer receiving Recharts payload, active status, and coordinate label.\n\t */\n\tcustomTooltip?: LineChartTooltipRenderer;\n\t/**\n\t * Textual summary describing key insights, highs, lows, and keyboard exploration instructions.\n\t * Associated with the chart via useId and aria-describedby.\n\t */\n\tsummary?: ReactNode;\n\t/**\n\t * Accessible tabular or structured data alternative rendered outside the plot area.\n\t */\n\tdataAlternative?: ReactNode;\n\t/**\n\t * Whether the interactive accessibility layer is enabled on the underlying Recharts graphic.\n\t * Enables keyboard exploration with Tab and arrow keys where supported by the underlying chart type.\n\t * Non-interactive compact or decorative charts without tooltip navigation should provide summary or dataAlternative.\n\t * @default true\n\t */\n\taccessibilityLayer?: boolean;\n};\n\nexport function StackedBarChart<\n\tTData extends { x: string | number } = XYPoint,\n\tK extends LineChartNumericKeys<TData> & string = LineChartNumericKeys<TData> & string,\n>({\n\tdata,\n\tseries,\n\tariaLabel = \"Stacked bar chart\",\n\tclassName,\n\tshowAxes = false,\n\tshowLegend = false,\n\tstackOffset,\n\tvalueFormatter,\n\txValueFormatter,\n\tyDomain,\n\tlegend,\n\tcustomTooltip,\n\tsummary,\n\tdataAlternative,\n\taccessibilityLayer,\n}: StackedBarChartProps<TData, K>) {\n\tconst defaultKeys = [\"y\", \"y2\", \"y3\"] as K[];\n\tconst bars = resolveChartSeries(series, defaultKeys);\n\tconst resolvedLegend =\n\t\tlegend !== undefined ? (\n\t\t\ttypeof legend === \"function\" ? (\n\t\t\t\tlegend({ items: bars })\n\t\t\t) : (\n\t\t\t\tlegend\n\t\t\t)\n\t\t) : showLegend ? (\n\t\t\t<ChartLegend items={bars} shape=\"bar\" />\n\t\t) : undefined;\n\n\treturn (\n\t\t<ChartShell\n\t\t\tariaLabel={ariaLabel}\n\t\t\tclassName={className}\n\t\t\tlegend={resolvedLegend}\n\t\t\tsummary={summary}\n\t\t\tdataAlternative={dataAlternative}\n\t\t\taccessibilityLayer={accessibilityLayer}\n\t\t>\n\t\t\t<RechartsBar\n\t\t\t\tdata={data}\n\t\t\t\tmargin={showAxes ? CHART_PLOT_MARGIN : CHART_PLOT_MARGIN_BARE}\n\t\t\t\tstackOffset={stackOffset}\n\t\t\t>\n\t\t\t\t{showAxes ? <CartesianGrid {...GRID_PROPS} /> : null}\n\t\t\t\t<XAxis dataKey=\"x\" {...cartesianAxisProps(!showAxes)} tickFormatter={xValueFormatter} />\n\t\t\t\t<YAxis\n\t\t\t\t\t{...cartesianAxisProps(!showAxes)}\n\t\t\t\t\ttickFormatter={valueFormatter}\n\t\t\t\t\t{...(yDomain ? { domain: yDomain as [number, number] } : {})}\n\t\t\t\t/>\n\t\t\t\t<Tooltip\n\t\t\t\t\t{...chartTooltipProps({\n\t\t\t\t\t\tformatter: valueFormatter,\n\t\t\t\t\t\tcursor: \"bar\",\n\t\t\t\t\t\tcustomTooltip,\n\t\t\t\t\t})}\n\t\t\t\t/>\n\t\t\t\t{bars.map((item, index) => (\n\t\t\t\t\t<Bar\n\t\t\t\t\t\tkey={item.key}\n\t\t\t\t\t\tdataKey={item.key}\n\t\t\t\t\t\tname={item.label ?? item.key}\n\t\t\t\t\t\tstackId=\"stack\"\n\t\t\t\t\t\tfill={seriesColor(item, index)}\n\t\t\t\t\t\tradius={BAR_RADIUS.vertical}\n\t\t\t\t\t\t{...ANIMATION_PROPS}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</RechartsBar>\n\t\t</ChartShell>\n\t);\n}\n"],"mappings":";;;;;;;;AAkFA,SAAgB,EAGd,EACD,SACA,WACA,eAAY,qBACZ,cACA,cAAW,IACX,gBAAa,IACb,gBACA,mBACA,oBACA,YACA,WACA,kBACA,YACA,oBACA,yBACkC;CAElC,IAAM,IAAO,EAAmB,GAAQ;EADnB;EAAK;EAAM;CACQ,CAAW,GAC7C,IACL,MAAW,KAAA,IAMP,IACH,kBAAC,GAAD;EAAa,OAAO;EAAM,OAAM;CAAO,CAAA,IACpC,KAAA,IAPH,OAAO,KAAW,aACjB,EAAO,EAAE,OAAO,EAAK,CAAC,IAEtB;CAMH,OACC,kBAAC,GAAD;EACY;EACA;EACX,QAAQ;EACC;EACQ;EACG;EAEpB,UAAA,kBAAC,GAAD;GACO;GACN,QAAQ,IAAW,IAAoB;GAC1B;GAHd,UAAA;IAKE,IAAW,kBAAC,GAAD,EAAe,GAAI,EAAa,CAAA,IAAI;IAChD,kBAAC,GAAD;KAAO,SAAQ;KAAI,GAAI,EAAmB,CAAC,CAAQ;KAAG,eAAe;IAAkB,CAAA;IACvF,kBAAC,GAAD;KACC,GAAI,EAAmB,CAAC,CAAQ;KAChC,eAAe;KACf,GAAK,IAAU,EAAE,QAAQ,EAA4B,IAAI,CAAC;IAC1D,CAAA;IACD,kBAAC,GAAD,EACC,GAAI,EAAkB;KACrB,WAAW;KACX,QAAQ;KACR;IACD,CAAC,EACD,CAAA;IACA,EAAK,KAAK,GAAM,MAChB,kBAAC,GAAD;KAEC,SAAS,EAAK;KACd,MAAM,EAAK,SAAS,EAAK;KACzB,SAAQ;KACR,MAAM,EAAY,GAAM,CAAK;KAC7B,QAAQ,EAAW;KACnB,GAAI;IACJ,GAPK,EAAK,GAOV,CACD;GACW;;CACF,CAAA;AAEd"}