@cloudflare/kumo 2.3.0 → 2.4.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 (229) hide show
  1. package/CHANGELOG.md +80 -0
  2. package/ai/component-registry.json +166 -123
  3. package/ai/component-registry.md +349 -215
  4. package/ai/schemas.ts +7 -2
  5. package/dist/.build-complete +1 -1
  6. package/dist/ai/schemas.d.ts +46 -34
  7. package/dist/ai/schemas.d.ts.map +1 -1
  8. package/dist/ai/schemas.js +12 -4
  9. package/dist/ai/schemas.js.map +1 -1
  10. package/dist/chunks/SankeyChart-npoyr1j06svoxsfe.js +770 -0
  11. package/dist/chunks/SankeyChart-npoyr1j06svoxsfe.js.map +1 -0
  12. package/dist/chunks/{autocomplete-h39m8kzoq0csjh9l.js → autocomplete-cvp5fsdt6gh0p3vu.js} +32 -28
  13. package/dist/chunks/autocomplete-cvp5fsdt6gh0p3vu.js.map +1 -0
  14. package/dist/chunks/{badge-e9w8qrjmeu9nocf6.js → badge-c1th6h6ahz7eu49q.js} +2 -2
  15. package/dist/chunks/badge-c1th6h6ahz7eu49q.js.map +1 -0
  16. package/dist/chunks/banner-es5iwuk4pf25e29e.js +120 -0
  17. package/dist/chunks/banner-es5iwuk4pf25e29e.js.map +1 -0
  18. package/dist/chunks/{breadcrumbs-g4pyoikibpoxsgw4.js → breadcrumbs-j214mimk5zj4ffp4.js} +8 -6
  19. package/dist/chunks/breadcrumbs-j214mimk5zj4ffp4.js.map +1 -0
  20. package/dist/chunks/{button-fxdpoacmq5rv1adk.js → button-mnrxu6dud2x5js5b.js} +19 -17
  21. package/dist/chunks/{button-fxdpoacmq5rv1adk.js.map → button-mnrxu6dud2x5js5b.js.map} +1 -1
  22. package/dist/chunks/{checkbox-dtoq56ieijj9m6vr.js → checkbox-dqih8tzzt3vhp870.js} +25 -19
  23. package/dist/chunks/checkbox-dqih8tzzt3vhp870.js.map +1 -0
  24. package/dist/chunks/{clipboard-text-nvdsloomefwgcxat.js → clipboard-text-mrut8z3dt1w0efxz.js} +4 -4
  25. package/dist/chunks/{clipboard-text-nvdsloomefwgcxat.js.map → clipboard-text-mrut8z3dt1w0efxz.js.map} +1 -1
  26. package/dist/chunks/{collapsible-cnsxmp7dko87pgx0.js → collapsible-nzqcf9zwnjkxqzr6.js} +21 -17
  27. package/dist/chunks/collapsible-nzqcf9zwnjkxqzr6.js.map +1 -0
  28. package/dist/chunks/{combobox-jcqn64ixr4557a0s.js → combobox-dpptfpcmqfrso1xa.js} +115 -103
  29. package/dist/chunks/combobox-dpptfpcmqfrso1xa.js.map +1 -0
  30. package/dist/chunks/{command-palette-jrq7p16tff6n46nj.js → command-palette-fqhyacp33fhyf696.js} +5 -5
  31. package/dist/chunks/{command-palette-jrq7p16tff6n46nj.js.map → command-palette-fqhyacp33fhyf696.js.map} +1 -1
  32. package/dist/chunks/{dialog-gndju3sqg1lmpb3f.js → dialog-my9fioafdstq50mi.js} +49 -33
  33. package/dist/chunks/{dialog-gndju3sqg1lmpb3f.js.map → dialog-my9fioafdstq50mi.js.map} +1 -1
  34. package/dist/chunks/{dropdown-k6orz4j043xybf54.js → dropdown-g4sb4cw9ffqaw5gx.js} +54 -44
  35. package/dist/chunks/dropdown-g4sb4cw9ffqaw5gx.js.map +1 -0
  36. package/dist/chunks/{empty-ni12ufom1kkakbuc.js → empty-n17inn1z67bpohkw.js} +2 -2
  37. package/dist/chunks/{empty-ni12ufom1kkakbuc.js.map → empty-n17inn1z67bpohkw.js.map} +1 -1
  38. package/dist/chunks/{field-n16udu32tpyq5udz.js → field-c8o7h3rlam4c9pcx.js} +3 -3
  39. package/dist/chunks/{field-n16udu32tpyq5udz.js.map → field-c8o7h3rlam4c9pcx.js.map} +1 -1
  40. package/dist/chunks/{input-area-hhhpgg0ev8bowtrk.js → input-area-eurk3seud30ricwn.js} +4 -4
  41. package/dist/chunks/{input-area-hhhpgg0ev8bowtrk.js.map → input-area-eurk3seud30ricwn.js.map} +1 -1
  42. package/dist/chunks/{input-mv7giprcc6hfkpq3.js → input-en8hhb14mmt3tfwn.js} +3 -3
  43. package/dist/chunks/{input-mv7giprcc6hfkpq3.js.map → input-en8hhb14mmt3tfwn.js.map} +1 -1
  44. package/dist/chunks/{input-group-kkw5j7rwzhj66h10.js → input-group-d09ocmjcbdai0gze.js} +5 -5
  45. package/dist/chunks/{input-group-kkw5j7rwzhj66h10.js.map → input-group-d09ocmjcbdai0gze.js.map} +1 -1
  46. package/dist/chunks/{label-f6yvqca8qhbpvkq8.js → label-c8rz453pti66slki.js} +3 -3
  47. package/dist/chunks/{label-f6yvqca8qhbpvkq8.js.map → label-c8rz453pti66slki.js.map} +1 -1
  48. package/dist/chunks/{layer-card-gegkqhkjy65l1ueo.js → layer-card-er4flkcxmzfug8jw.js} +2 -2
  49. package/dist/chunks/{layer-card-gegkqhkjy65l1ueo.js.map → layer-card-er4flkcxmzfug8jw.js.map} +1 -1
  50. package/dist/chunks/{link-jjk7qolyol7s1jkk.js → link-i6vnwyjcwvjz5btm.js} +20 -19
  51. package/dist/chunks/{link-jjk7qolyol7s1jkk.js.map → link-i6vnwyjcwvjz5btm.js.map} +1 -1
  52. package/dist/chunks/menubar-ng5if56amh1tto4j.js +98 -0
  53. package/dist/chunks/menubar-ng5if56amh1tto4j.js.map +1 -0
  54. package/dist/chunks/{meter-kxn34sy6l2mz5dwq.js → meter-d5igshkjqttl1fdj.js} +2 -2
  55. package/dist/chunks/{meter-kxn34sy6l2mz5dwq.js.map → meter-d5igshkjqttl1fdj.js.map} +1 -1
  56. package/dist/chunks/{pagination-ixbq8ssuuo0jxaa4.js → pagination-bw7vwca4wrfjm8vb.js} +3 -3
  57. package/dist/chunks/{pagination-ixbq8ssuuo0jxaa4.js.map → pagination-bw7vwca4wrfjm8vb.js.map} +1 -1
  58. package/dist/chunks/{popover-js5ds3szd43kspja.js → popover-ozf1j7oi7pxiudyz.js} +4 -2
  59. package/dist/chunks/popover-ozf1j7oi7pxiudyz.js.map +1 -0
  60. package/dist/chunks/{radio-nyw89v4eafptepmz.js → radio-gpg6kmzonr2cayq1.js} +54 -46
  61. package/dist/chunks/radio-gpg6kmzonr2cayq1.js.map +1 -0
  62. package/dist/chunks/{select-o2i7aovnu8v1zv8t.js → select-dw9iw35ug7yer3o3.js} +101 -91
  63. package/dist/chunks/select-dw9iw35ug7yer3o3.js.map +1 -0
  64. package/dist/chunks/{sensitive-input-bjg6m791yz7g6bn3.js → sensitive-input-dgoxjtoxl4zqa51v.js} +50 -44
  65. package/dist/chunks/{sensitive-input-bjg6m791yz7g6bn3.js.map → sensitive-input-dgoxjtoxl4zqa51v.js.map} +1 -1
  66. package/dist/chunks/sidebar-hzio700cg85f7f31.js +1014 -0
  67. package/dist/chunks/sidebar-hzio700cg85f7f31.js.map +1 -0
  68. package/dist/chunks/{surface-lzwbh3f5t0gxc83t.js → surface-iyejjbqogjbo7ise.js} +2 -2
  69. package/dist/chunks/{surface-lzwbh3f5t0gxc83t.js.map → surface-iyejjbqogjbo7ise.js.map} +1 -1
  70. package/dist/chunks/{switch-d9cs31oj4rjtg717.js → switch-g8f77h69h34xld06.js} +50 -45
  71. package/dist/chunks/switch-g8f77h69h34xld06.js.map +1 -0
  72. package/dist/chunks/{table-c6qemc2jmv22cv3p.js → table-e1te1im2tt2ez05y.js} +2 -2
  73. package/dist/chunks/{table-c6qemc2jmv22cv3p.js.map → table-e1te1im2tt2ez05y.js.map} +1 -1
  74. package/dist/chunks/{table-of-contents-fzyv7uhnnyr13dqu.js → table-of-contents-jco9kvt48d34dwsw.js} +34 -30
  75. package/dist/chunks/table-of-contents-jco9kvt48d34dwsw.js.map +1 -0
  76. package/dist/chunks/{tabs-f0ztlooi91ko9g04.js → tabs-hice1yy5q2t889z8.js} +6 -4
  77. package/dist/chunks/tabs-hice1yy5q2t889z8.js.map +1 -0
  78. package/dist/chunks/{toast-ejfm5cbt9yulqhol.js → toast-kvbgct0jvfmn4mas.js} +29 -27
  79. package/dist/chunks/{toast-ejfm5cbt9yulqhol.js.map → toast-kvbgct0jvfmn4mas.js.map} +1 -1
  80. package/dist/chunks/{tooltip-o6xfw9jjclv9pxaj.js → tooltip-ken77ixya0qpidie.js} +6 -6
  81. package/dist/chunks/{tooltip-o6xfw9jjclv9pxaj.js.map → tooltip-ken77ixya0qpidie.js.map} +1 -1
  82. package/dist/chunks/{vendor-base-ui-mzjqwv5teijixz8h.js → vendor-base-ui-knphx7dts1vm1x37.js} +1726 -1719
  83. package/dist/chunks/{vendor-base-ui-mzjqwv5teijixz8h.js.map → vendor-base-ui-knphx7dts1vm1x37.js.map} +1 -1
  84. package/dist/code.js +1 -1
  85. package/dist/components/autocomplete.js +1 -1
  86. package/dist/components/badge.js +1 -1
  87. package/dist/components/banner.js +1 -1
  88. package/dist/components/breadcrumbs.js +1 -1
  89. package/dist/components/button.js +1 -1
  90. package/dist/components/chart.js +1 -1
  91. package/dist/components/checkbox.js +1 -1
  92. package/dist/components/clipboard-text.js +1 -1
  93. package/dist/components/collapsible.js +1 -1
  94. package/dist/components/combobox.js +1 -1
  95. package/dist/components/command-palette.js +1 -1
  96. package/dist/components/dialog.js +1 -1
  97. package/dist/components/dropdown.js +1 -1
  98. package/dist/components/empty.js +1 -1
  99. package/dist/components/field.js +1 -1
  100. package/dist/components/input-group.js +1 -1
  101. package/dist/components/input.js +3 -3
  102. package/dist/components/label.js +1 -1
  103. package/dist/components/layer-card.js +1 -1
  104. package/dist/components/link.js +1 -1
  105. package/dist/components/menubar.js +1 -1
  106. package/dist/components/meter.js +1 -1
  107. package/dist/components/pagination.js +1 -1
  108. package/dist/components/popover.js +1 -1
  109. package/dist/components/radio.js +1 -1
  110. package/dist/components/select.js +1 -1
  111. package/dist/components/sensitive-input.js +1 -1
  112. package/dist/components/sidebar.js +22 -23
  113. package/dist/components/surface.js +1 -1
  114. package/dist/components/switch.js +1 -1
  115. package/dist/components/table-of-contents.js +1 -1
  116. package/dist/components/table.js +1 -1
  117. package/dist/components/tabs.js +1 -1
  118. package/dist/components/toast.js +2 -2
  119. package/dist/components/tooltip.js +1 -1
  120. package/dist/index.js +122 -123
  121. package/dist/primitives/accordion.js +1 -1
  122. package/dist/primitives/alert-dialog.js +1 -1
  123. package/dist/primitives/autocomplete.js +1 -1
  124. package/dist/primitives/avatar.js +1 -1
  125. package/dist/primitives/button.js +1 -1
  126. package/dist/primitives/checkbox-group.js +1 -1
  127. package/dist/primitives/checkbox.js +1 -1
  128. package/dist/primitives/collapsible.js +1 -1
  129. package/dist/primitives/combobox.js +1 -1
  130. package/dist/primitives/context-menu.js +1 -1
  131. package/dist/primitives/csp-provider.js +1 -1
  132. package/dist/primitives/dialog.js +1 -1
  133. package/dist/primitives/direction-provider.js +1 -1
  134. package/dist/primitives/drawer.js +1 -1
  135. package/dist/primitives/field.js +1 -1
  136. package/dist/primitives/fieldset.js +1 -1
  137. package/dist/primitives/form.js +1 -1
  138. package/dist/primitives/input.js +1 -1
  139. package/dist/primitives/menu.js +1 -1
  140. package/dist/primitives/menubar.js +1 -1
  141. package/dist/primitives/meter.js +1 -1
  142. package/dist/primitives/navigation-menu.js +1 -1
  143. package/dist/primitives/number-field.js +1 -1
  144. package/dist/primitives/otp-field.js +1 -1
  145. package/dist/primitives/popover.js +1 -1
  146. package/dist/primitives/preview-card.js +1 -1
  147. package/dist/primitives/progress.js +1 -1
  148. package/dist/primitives/radio-group.js +1 -1
  149. package/dist/primitives/radio.js +1 -1
  150. package/dist/primitives/scroll-area.js +1 -1
  151. package/dist/primitives/select.js +1 -1
  152. package/dist/primitives/separator.js +1 -1
  153. package/dist/primitives/slider.js +1 -1
  154. package/dist/primitives/switch.js +1 -1
  155. package/dist/primitives/tabs.js +1 -1
  156. package/dist/primitives/toast.js +1 -1
  157. package/dist/primitives/toggle-group.js +1 -1
  158. package/dist/primitives/toggle.js +1 -1
  159. package/dist/primitives/toolbar.js +1 -1
  160. package/dist/primitives/tooltip.js +1 -1
  161. package/dist/primitives.js +1 -1
  162. package/dist/scripts/theme-generator/config.d.ts.map +1 -1
  163. package/dist/scripts/theme-generator/config.js +36 -38
  164. package/dist/scripts/theme-generator/config.js.map +1 -1
  165. package/dist/scripts/theme-generator/generate-css.d.ts.map +1 -1
  166. package/dist/scripts/theme-generator/types.d.ts +8 -2
  167. package/dist/scripts/theme-generator/types.d.ts.map +1 -1
  168. package/dist/src/components/autocomplete/autocomplete.d.ts +1 -0
  169. package/dist/src/components/autocomplete/autocomplete.d.ts.map +1 -1
  170. package/dist/src/components/autocomplete/index.d.ts +1 -0
  171. package/dist/src/components/autocomplete/index.d.ts.map +1 -1
  172. package/dist/src/components/badge/badge.d.ts +1 -1
  173. package/dist/src/components/banner/banner.d.ts +14 -7
  174. package/dist/src/components/banner/banner.d.ts.map +1 -1
  175. package/dist/src/components/breadcrumbs/breadcrumbs.d.ts.map +1 -1
  176. package/dist/src/components/button/button.d.ts.map +1 -1
  177. package/dist/src/components/chart/TimeseriesChart.d.ts +43 -1
  178. package/dist/src/components/chart/TimeseriesChart.d.ts.map +1 -1
  179. package/dist/src/components/checkbox/checkbox.d.ts.map +1 -1
  180. package/dist/src/components/collapsible/collapsible.d.ts.map +1 -1
  181. package/dist/src/components/combobox/combobox.d.ts +1 -0
  182. package/dist/src/components/combobox/combobox.d.ts.map +1 -1
  183. package/dist/src/components/combobox/index.d.ts +1 -0
  184. package/dist/src/components/combobox/index.d.ts.map +1 -1
  185. package/dist/src/components/dialog/dialog.d.ts.map +1 -1
  186. package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
  187. package/dist/src/components/link/link.d.ts.map +1 -1
  188. package/dist/src/components/menubar/menubar.d.ts.map +1 -1
  189. package/dist/src/components/popover/popover.d.ts.map +1 -1
  190. package/dist/src/components/radio/radio.d.ts.map +1 -1
  191. package/dist/src/components/select/select.d.ts.map +1 -1
  192. package/dist/src/components/sensitive-input/sensitive-input.d.ts.map +1 -1
  193. package/dist/src/components/sidebar/index.d.ts +1 -1
  194. package/dist/src/components/sidebar/index.d.ts.map +1 -1
  195. package/dist/src/components/sidebar/sidebar.d.ts +159 -146
  196. package/dist/src/components/sidebar/sidebar.d.ts.map +1 -1
  197. package/dist/src/components/switch/switch.d.ts.map +1 -1
  198. package/dist/src/components/table-of-contents/table-of-contents.d.ts.map +1 -1
  199. package/dist/src/components/tabs/tabs.d.ts.map +1 -1
  200. package/dist/src/index.d.ts +1 -1
  201. package/dist/src/index.d.ts.map +1 -1
  202. package/dist/styles/kumo-standalone.css +1 -1
  203. package/dist/styles/kumo.css +37 -0
  204. package/dist/styles/theme-kumo.css +28 -35
  205. package/package.json +4 -1
  206. package/scripts/theme-generator/config.ts +37 -39
  207. package/scripts/theme-generator/generate-css.ts +4 -1
  208. package/scripts/theme-generator/types.ts +8 -2
  209. package/dist/chunks/SankeyChart-krkvltewpn3bbupw.js +0 -651
  210. package/dist/chunks/SankeyChart-krkvltewpn3bbupw.js.map +0 -1
  211. package/dist/chunks/autocomplete-h39m8kzoq0csjh9l.js.map +0 -1
  212. package/dist/chunks/badge-e9w8qrjmeu9nocf6.js.map +0 -1
  213. package/dist/chunks/banner-ip2lm8r87hich557.js +0 -88
  214. package/dist/chunks/banner-ip2lm8r87hich557.js.map +0 -1
  215. package/dist/chunks/breadcrumbs-g4pyoikibpoxsgw4.js.map +0 -1
  216. package/dist/chunks/checkbox-dtoq56ieijj9m6vr.js.map +0 -1
  217. package/dist/chunks/collapsible-cnsxmp7dko87pgx0.js.map +0 -1
  218. package/dist/chunks/combobox-jcqn64ixr4557a0s.js.map +0 -1
  219. package/dist/chunks/dropdown-k6orz4j043xybf54.js.map +0 -1
  220. package/dist/chunks/menubar-d5s6h96nw8ggy04a.js +0 -96
  221. package/dist/chunks/menubar-d5s6h96nw8ggy04a.js.map +0 -1
  222. package/dist/chunks/popover-js5ds3szd43kspja.js.map +0 -1
  223. package/dist/chunks/radio-nyw89v4eafptepmz.js.map +0 -1
  224. package/dist/chunks/select-o2i7aovnu8v1zv8t.js.map +0 -1
  225. package/dist/chunks/sidebar-izcfqkrzt4vqn8ez.js +0 -875
  226. package/dist/chunks/sidebar-izcfqkrzt4vqn8ez.js.map +0 -1
  227. package/dist/chunks/switch-d9cs31oj4rjtg717.js.map +0 -1
  228. package/dist/chunks/table-of-contents-fzyv7uhnnyr13dqu.js.map +0 -1
  229. package/dist/chunks/tabs-f0ztlooi91ko9g04.js.map +0 -1
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { jsxs as r, jsx as e, Fragment as d } from "react/jsx-runtime";
3
3
  import { c as t } from "./cn-ct4n7r74mh8y0f48.js";
4
- import { aX as c, aY as f, aZ as x, a_ as b, a$ as h } from "./vendor-base-ui-mzjqwv5teijixz8h.js";
4
+ import { aY as c, aZ as f, a_ as x, a$ as b, b0 as h } from "./vendor-base-ui-knphx7dts1vm1x37.js";
5
5
  function N({
6
6
  value: l,
7
7
  customValue: a,
@@ -48,4 +48,4 @@ function N({
48
48
  export {
49
49
  N as M
50
50
  };
51
- //# sourceMappingURL=meter-kxn34sy6l2mz5dwq.js.map
51
+ //# sourceMappingURL=meter-d5igshkjqttl1fdj.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"meter-kxn34sy6l2mz5dwq.js","sources":["../../src/components/meter/meter.tsx"],"sourcesContent":["import { Meter as BaseMeter } from \"@base-ui/react/meter\";\nimport { type ComponentPropsWithoutRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Meter variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_METER_VARIANTS = {\n // Meter currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_METER_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_METER_VARIANTS\nexport interface KumoMeterVariantsProps {}\n\nexport function meterVariants(_props: KumoMeterVariantsProps = {}) {\n return cn(\n // Base styles\n \"flex w-full flex-col gap-2\",\n );\n}\n\ntype RootProps = ComponentPropsWithoutRef<typeof BaseMeter.Root>;\n\n/**\n * Meter component props.\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage used\" value={65} />\n * <Meter label=\"API requests\" value={75} customValue=\"750 / 1,000\" />\n * ```\n */\nexport interface MeterProps extends RootProps, KumoMeterVariantsProps {\n /** Custom formatted value text (e.g. \"750 / 1,000\") displayed instead of percentage. */\n customValue?: string;\n /** Label text displayed above the meter track. */\n label: string;\n /**\n * Whether to display the percentage value next to the label.\n * @default true\n */\n showValue?: boolean;\n /** Additional CSS classes for the track (background bar). */\n trackClassName?: string;\n /** Additional CSS classes for the indicator (filled bar). */\n indicatorClassName?: string;\n}\n\n/**\n * Progress bar showing a measured value within a known range (e.g. quota usage).\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage\" value={65} />\n * ```\n */\nexport function Meter({\n value,\n customValue,\n label,\n showValue = true,\n className,\n trackClassName,\n indicatorClassName,\n ...props\n}: MeterProps) {\n return (\n <BaseMeter.Root\n value={value}\n {...props}\n className={cn(\"flex w-full flex-col gap-2\", className)}\n >\n <div className=\"flex items-center justify-between gap-4\">\n <BaseMeter.Label className=\"text-xs text-kumo-subtle\">\n {label}\n </BaseMeter.Label>\n {customValue ? (\n <span className=\"text-sm font-medium text-kumo-default tabular-nums\">\n {customValue}\n </span>\n ) : (\n <>\n {showValue && (\n <BaseMeter.Value className=\"text-sm font-medium text-kumo-default tabular-nums\" />\n )}\n </>\n )}\n </div>\n <BaseMeter.Track\n className={cn(\n \"relative h-2 w-full overflow-hidden rounded-full bg-kumo-fill\",\n trackClassName,\n )}\n >\n <BaseMeter.Indicator\n className={cn(\n \"absolute inset-y-0 left-0 rounded-full bg-linear-to-r from-kumo-brand via-kumo-brand to-kumo-brand transition-[width] duration-300 ease-out\",\n indicatorClassName,\n )}\n />\n </BaseMeter.Track>\n </BaseMeter.Root>\n );\n}\n"],"names":["Meter","value","customValue","label","showValue","className","trackClassName","indicatorClassName","props","jsxs","BaseMeter.Root","cn","jsx","BaseMeter.Label","Fragment","BaseMeter.Value","BaseMeter.Track","BaseMeter.Indicator"],"mappings":";;;;AAwDO,SAASA,EAAM;AAAA,EACpB,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,GAAGC;AACL,GAAe;AACb,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,OAAAT;AAAA,MACC,GAAGO;AAAA,MACJ,WAAWG,EAAG,8BAA8BN,CAAS;AAAA,MAErD,UAAA;AAAA,QAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,2CACb,UAAA;AAAA,UAAA,gBAAAG,EAACC,GAAA,EAAgB,WAAU,4BACxB,UAAAV,GACH;AAAA,UACCD,IACC,gBAAAU,EAAC,QAAA,EAAK,WAAU,sDACb,UAAAV,EAAA,CACH,IAEA,gBAAAU,EAAAE,GAAA,EACG,UAAAV,uBACEW,GAAA,EAAgB,WAAU,sDAAqD,EAAA,CAEpF;AAAA,QAAA,GAEJ;AAAA,QACA,gBAAAH;AAAA,UAACI;AAAAA,UAAA;AAAA,YACC,WAAWL;AAAA,cACT;AAAA,cACAL;AAAA,YAAA;AAAA,YAGF,UAAA,gBAAAM;AAAA,cAACK;AAAAA,cAAA;AAAA,gBACC,WAAWN;AAAA,kBACT;AAAA,kBACAJ;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
1
+ {"version":3,"file":"meter-d5igshkjqttl1fdj.js","sources":["../../src/components/meter/meter.tsx"],"sourcesContent":["import { Meter as BaseMeter } from \"@base-ui/react/meter\";\nimport { type ComponentPropsWithoutRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Meter variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_METER_VARIANTS = {\n // Meter currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_METER_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_METER_VARIANTS\nexport interface KumoMeterVariantsProps {}\n\nexport function meterVariants(_props: KumoMeterVariantsProps = {}) {\n return cn(\n // Base styles\n \"flex w-full flex-col gap-2\",\n );\n}\n\ntype RootProps = ComponentPropsWithoutRef<typeof BaseMeter.Root>;\n\n/**\n * Meter component props.\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage used\" value={65} />\n * <Meter label=\"API requests\" value={75} customValue=\"750 / 1,000\" />\n * ```\n */\nexport interface MeterProps extends RootProps, KumoMeterVariantsProps {\n /** Custom formatted value text (e.g. \"750 / 1,000\") displayed instead of percentage. */\n customValue?: string;\n /** Label text displayed above the meter track. */\n label: string;\n /**\n * Whether to display the percentage value next to the label.\n * @default true\n */\n showValue?: boolean;\n /** Additional CSS classes for the track (background bar). */\n trackClassName?: string;\n /** Additional CSS classes for the indicator (filled bar). */\n indicatorClassName?: string;\n}\n\n/**\n * Progress bar showing a measured value within a known range (e.g. quota usage).\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage\" value={65} />\n * ```\n */\nexport function Meter({\n value,\n customValue,\n label,\n showValue = true,\n className,\n trackClassName,\n indicatorClassName,\n ...props\n}: MeterProps) {\n return (\n <BaseMeter.Root\n value={value}\n {...props}\n className={cn(\"flex w-full flex-col gap-2\", className)}\n >\n <div className=\"flex items-center justify-between gap-4\">\n <BaseMeter.Label className=\"text-xs text-kumo-subtle\">\n {label}\n </BaseMeter.Label>\n {customValue ? (\n <span className=\"text-sm font-medium text-kumo-default tabular-nums\">\n {customValue}\n </span>\n ) : (\n <>\n {showValue && (\n <BaseMeter.Value className=\"text-sm font-medium text-kumo-default tabular-nums\" />\n )}\n </>\n )}\n </div>\n <BaseMeter.Track\n className={cn(\n \"relative h-2 w-full overflow-hidden rounded-full bg-kumo-fill\",\n trackClassName,\n )}\n >\n <BaseMeter.Indicator\n className={cn(\n \"absolute inset-y-0 left-0 rounded-full bg-linear-to-r from-kumo-brand via-kumo-brand to-kumo-brand transition-[width] duration-300 ease-out\",\n indicatorClassName,\n )}\n />\n </BaseMeter.Track>\n </BaseMeter.Root>\n );\n}\n"],"names":["Meter","value","customValue","label","showValue","className","trackClassName","indicatorClassName","props","jsxs","BaseMeter.Root","cn","jsx","BaseMeter.Label","Fragment","BaseMeter.Value","BaseMeter.Track","BaseMeter.Indicator"],"mappings":";;;;AAwDO,SAASA,EAAM;AAAA,EACpB,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,GAAGC;AACL,GAAe;AACb,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,OAAAT;AAAA,MACC,GAAGO;AAAA,MACJ,WAAWG,EAAG,8BAA8BN,CAAS;AAAA,MAErD,UAAA;AAAA,QAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,2CACb,UAAA;AAAA,UAAA,gBAAAG,EAACC,GAAA,EAAgB,WAAU,4BACxB,UAAAV,GACH;AAAA,UACCD,IACC,gBAAAU,EAAC,QAAA,EAAK,WAAU,sDACb,UAAAV,EAAA,CACH,IAEA,gBAAAU,EAAAE,GAAA,EACG,UAAAV,uBACEW,GAAA,EAAgB,WAAU,sDAAqD,EAAA,CAEpF;AAAA,QAAA,GAEJ;AAAA,QACA,gBAAAH;AAAA,UAACI;AAAAA,UAAA;AAAA,YACC,WAAWL;AAAA,cACT;AAAA,cACAL;AAAA,YAAA;AAAA,YAGF,UAAA,gBAAAM;AAAA,cAACK;AAAAA,cAAA;AAAA,gBACC,WAAWN;AAAA,kBACT;AAAA,kBACAJ;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import { jsx as a, jsxs as p, Fragment as E } from "react/jsx-runtime";
3
3
  import { useState as T, useMemo as N, useEffect as B, createContext as D, useContext as R } from "react";
4
- import { I as m } from "./input-group-kkw5j7rwzhj66h10.js";
4
+ import { I as m } from "./input-group-d09ocmjcbdai0gze.js";
5
5
  import { CaretDoubleLeftIcon as F, CaretLeftIcon as V, CaretRightIcon as U, CaretDoubleRightIcon as j } from "@phosphor-icons/react";
6
6
  import { c as d } from "./cn-ct4n7r74mh8y0f48.js";
7
- import { S as P } from "./select-o2i7aovnu8v1zv8t.js";
7
+ import { S as P } from "./select-dw9iw35ug7yer3o3.js";
8
8
  const G = [25, 50, 100, 250], y = (n, l, o) => Math.min(Math.max(n, l), o), K = {
9
9
  navigation: "Pagination",
10
10
  firstPage: "First page",
@@ -263,4 +263,4 @@ const W = Object.assign(L, {
263
263
  export {
264
264
  W as P
265
265
  };
266
- //# sourceMappingURL=pagination-ixbq8ssuuo0jxaa4.js.map
266
+ //# sourceMappingURL=pagination-bw7vwca4wrfjm8vb.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"pagination-ixbq8ssuuo0jxaa4.js","sources":["../../src/components/pagination/pagination.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n useEffect,\n useMemo,\n useState,\n type KeyboardEvent,\n type ReactNode,\n} from \"react\";\nimport { InputGroup } from \"../input-group\";\nimport {\n CaretDoubleLeftIcon,\n CaretDoubleRightIcon,\n CaretLeftIcon,\n CaretRightIcon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { Select } from \"../select\";\n\nconst DEFAULT_PAGE_SIZE_OPTIONS = [25, 50, 100, 250] as const;\n\nconst clamp = (value: number, min: number, max: number) =>\n Math.min(Math.max(value, min), max);\n\n// ============================================================================\n// i18n Labels\n// ============================================================================\n\n/**\n * Labels for internationalization of Pagination component.\n * All labels have English defaults and can be overridden for other locales.\n *\n * Note: To customize the \"Showing X-Y of Z\" text, use the `children` render prop\n * on `Pagination.Info` instead. To customize the \"Per page:\" label, use the\n * `label` prop on `Pagination.PageSize`.\n */\nexport interface PaginationLabels {\n /** Aria label for the navigation landmark. @default \"Pagination\" */\n navigation?: string;\n /** Aria label for the first page button. @default \"First page\" */\n firstPage?: string;\n /** Aria label for the previous page button. @default \"Previous page\" */\n previousPage?: string;\n /** Aria label for the next page button. @default \"Next page\" */\n nextPage?: string;\n /** Aria label for the last page button. @default \"Last page\" */\n lastPage?: string;\n /** Aria label for the page number input/select. @default \"Page number\" */\n pageNumber?: string;\n /** Aria label for the page size select. @default \"Page size\" */\n pageSize?: string;\n}\n\nconst DEFAULT_LABELS: Required<PaginationLabels> = {\n navigation: \"Pagination\",\n firstPage: \"First page\",\n previousPage: \"Previous page\",\n nextPage: \"Next page\",\n lastPage: \"Last page\",\n pageNumber: \"Page number\",\n pageSize: \"Page size\",\n};\n\n/** Pagination controls variant definitions. */\nexport const KUMO_PAGINATION_VARIANTS = {\n controls: {\n full: {\n classes: \"\",\n description:\n \"Full pagination controls with first, previous, page input, next, and last buttons\",\n },\n simple: {\n classes: \"\",\n description:\n \"Simple pagination controls with only previous and next buttons\",\n },\n },\n} as const;\n\nexport type KumoPaginationControls =\n keyof typeof KUMO_PAGINATION_VARIANTS.controls;\n\nexport const KUMO_PAGINATION_DEFAULT_VARIANTS = {\n controls: \"full\",\n} as const;\n\nexport interface KumoPaginationVariantsProps {\n controls?: KumoPaginationControls;\n}\n\nexport function paginationVariants({\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n}: KumoPaginationVariantsProps = {}) {\n return cn(\n \"flex items-center justify-between gap-2\",\n resolveVariant(KUMO_PAGINATION_VARIANTS.controls, controls, KUMO_PAGINATION_DEFAULT_VARIANTS.controls).classes,\n );\n}\n\n// ============================================================================\n// Pagination Context\n// ============================================================================\n\ninterface PaginationContextValue {\n page: number;\n perPage?: number;\n totalCount?: number;\n maxPage: number;\n pageShowingRange: string;\n setPage: (page: number) => void;\n editingPage: number;\n setEditingPage: (page: number) => void;\n labels: Required<PaginationLabels>;\n}\n\nconst PaginationContext = createContext<PaginationContextValue | null>(null);\n\nfunction usePaginationContext() {\n const context = useContext(PaginationContext);\n if (!context) {\n throw new Error(\n \"Pagination compound components must be used within a Pagination component\",\n );\n }\n return context;\n}\n\n// ============================================================================\n// Pagination.Info\n// ============================================================================\n\nexport interface PaginationInfoProps {\n /** Custom render function for the info text */\n children?: (props: {\n page: number;\n perPage?: number;\n totalCount?: number;\n pageShowingRange: string;\n }) => ReactNode;\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationInfo({ children, className }: PaginationInfoProps) {\n const { page, perPage, totalCount, pageShowingRange } =\n usePaginationContext();\n\n const content = children ? (\n children({ page, perPage, totalCount, pageShowingRange })\n ) : totalCount && totalCount > 0 ? (\n <>\n Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n <span className=\"tabular-nums\">{totalCount}</span>\n </>\n ) : null;\n\n return (\n <div\n data-slot=\"pagination-info\"\n className={cn(\"text-sm text-kumo-subtle\", className)}\n >\n {content}\n </div>\n );\n}\n\nPaginationInfo.displayName = \"Pagination.Info\";\n\n// ============================================================================\n// Pagination.PageSize\n// ============================================================================\n\nexport interface PaginationPageSizeProps {\n /** Current page size value */\n value: number;\n /** Callback when page size changes */\n onChange: (size: number) => void;\n /** Available page size options */\n options?: number[];\n /**\n * Label text shown before the selector.\n * @default \"Per page:\"\n */\n label?: ReactNode;\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationPageSize({\n value,\n onChange,\n options = DEFAULT_PAGE_SIZE_OPTIONS as unknown as number[],\n label = \"Per page:\",\n className,\n}: PaginationPageSizeProps) {\n const { labels } = usePaginationContext();\n\n return (\n <div\n data-slot=\"pagination-page-size\"\n className={cn(\"flex items-center gap-2\", className)}\n >\n {label && <span className=\"text-sm text-kumo-subtle\">{label}</span>}\n <Select\n aria-label={labels.pageSize}\n value={value}\n onValueChange={(v) => onChange(v as number)}\n >\n {options.map((size) => (\n <Select.Option key={size} value={size}>\n {size}\n </Select.Option>\n ))}\n </Select>\n </div>\n );\n}\n\nPaginationPageSize.displayName = \"Pagination.PageSize\";\n\n// ============================================================================\n// Pagination.Controls\n// ============================================================================\n\nexport interface PaginationControlsProps extends KumoPaginationVariantsProps {\n /**\n * How the page number selector is rendered in \"full\" controls mode.\n * - `\"input\"` (default): A text input where users type a page number.\n * - `\"dropdown\"`: A dropdown select with all page numbers as options.\n *\n * **Note:** `\"dropdown\"` renders an option for every page, so it is best\n * suited for small page counts. For large datasets (hundreds of pages or\n * more) prefer `\"input\"` to avoid rendering performance overhead.\n */\n pageSelector?: \"input\" | \"dropdown\";\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationControls({\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n pageSelector = \"input\",\n className,\n}: PaginationControlsProps) {\n const { page, maxPage, setPage, editingPage, setEditingPage, labels } =\n usePaginationContext();\n\n return (\n <div\n data-slot=\"pagination-controls\"\n className={cn(\"grow flex flex-col items-end\", className)}\n >\n <nav aria-label={labels.navigation}>\n <InputGroup>\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.firstPage}\n disabled={page <= 1}\n onClick={() => {\n setPage(1);\n setEditingPage(1);\n }}\n >\n <CaretDoubleLeftIcon size={16} />\n </InputGroup.Button>\n )}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.previousPage}\n disabled={page <= 1}\n onClick={() => {\n const previousPage = Math.max(page - 1, 1);\n setPage(previousPage);\n setEditingPage(previousPage);\n }}\n >\n <CaretLeftIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" &&\n (pageSelector === \"dropdown\" ? (\n <Select\n aria-label={labels.pageNumber}\n className=\"rounded-none ring-kumo-hairline\"\n value={page}\n onValueChange={(value) => {\n const num = value as number;\n setPage(num);\n setEditingPage(num);\n }}\n >\n {Array.from({ length: maxPage }, (_, i) => i + 1).map((p) => (\n <Select.Option key={p} value={p}>\n {p}\n </Select.Option>\n ))}\n </Select>\n ) : (\n <InputGroup.Input\n style={{ width: 50 }}\n className=\"text-center\"\n aria-label={labels.pageNumber}\n value={editingPage}\n onValueChange={(value: string) => {\n setEditingPage(Number(value));\n }}\n onBlur={() => {\n const clamped = clamp(editingPage, 1, maxPage);\n setPage(clamped);\n setEditingPage(clamped);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === \"Enter\") {\n const clamped = clamp(editingPage, 1, maxPage);\n setPage(clamped);\n setEditingPage(clamped);\n }\n }}\n // Prevent password managers from auto-filling\n autoComplete=\"off\"\n data-1p-ignore\n data-lpignore=\"true\"\n data-form-type=\"other\"\n />\n ))}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.nextPage}\n disabled={page === maxPage}\n onClick={() => {\n const nextPage = Math.min(page + 1, maxPage);\n setPage(nextPage);\n setEditingPage(nextPage);\n }}\n >\n <CaretRightIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.lastPage}\n disabled={page === maxPage}\n onClick={() => {\n setPage(maxPage);\n setEditingPage(maxPage);\n }}\n >\n <CaretDoubleRightIcon size={16} />\n </InputGroup.Button>\n )}\n </InputGroup>\n </nav>\n </div>\n );\n}\n\nPaginationControls.displayName = \"Pagination.Controls\";\n\n// ============================================================================\n// Pagination.Separator\n// ============================================================================\n\nexport interface PaginationSeparatorProps {\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationSeparator({ className }: PaginationSeparatorProps) {\n return (\n <div\n data-slot=\"pagination-separator\"\n className={cn(\"mx-2 h-6 border-l border-kumo-hairline\", className)}\n />\n );\n}\n\nPaginationSeparator.displayName = \"Pagination.Separator\";\n\n// ============================================================================\n// Pagination Root\n// ============================================================================\n\n/** Base props shared by both compound and legacy Pagination APIs */\ninterface PaginationBaseProps {\n /** Callback fired when the current page changes. */\n setPage: (page: number) => void;\n /**\n * Current page number (1-indexed).\n * @default 1\n */\n page?: number;\n /** Number of items displayed per page. */\n perPage?: number;\n /** Total number of items across all pages. */\n totalCount?: number;\n /** Additional CSS classes for the container */\n className?: string;\n /**\n * Labels for internationalization of aria-labels. All labels have English defaults.\n *\n * For visible text like \"Showing X of Y\", use render props on sub-components:\n * - `Pagination.Info` children for the info text\n * - `Pagination.PageSize` label prop for the \"Per page:\" text\n *\n * @example\n * ```tsx\n * <Pagination\n * labels={{\n * firstPage: \"Première page\",\n * previousPage: \"Page précédente\",\n * nextPage: \"Page suivante\",\n * lastPage: \"Dernière page\",\n * pageNumber: \"Numéro de page\",\n * pageSize: \"Taille de page\",\n * }}\n * // ...\n * />\n * ```\n */\n labels?: PaginationLabels;\n}\n\n/**\n * Props for the compound component API (recommended).\n *\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport interface PaginationCompoundProps extends PaginationBaseProps {\n /**\n * Compound component children for custom layouts.\n * Use Pagination.Info, Pagination.PageSize, Pagination.Controls, and Pagination.Separator.\n */\n children: ReactNode;\n controls?: never;\n text?: never;\n}\n\n/**\n * Props for the legacy API (deprecated, use compound components instead).\n *\n * @deprecated Use the compound component API with children instead:\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * ```tsx\n * // Legacy usage (deprecated)\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nexport interface PaginationLegacyProps\n extends PaginationBaseProps, KumoPaginationVariantsProps {\n children?: never;\n /** @deprecated Use Pagination.Info with children prop instead */\n text?: (props: {\n page?: number;\n perPage?: number;\n totalCount?: number;\n pageShowingRange: string;\n }) => ReactNode;\n}\n\n/**\n * Pagination component props.\n *\n * Prefer the compound component API for new code:\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport type PaginationProps = PaginationCompoundProps | PaginationLegacyProps;\n\n/**\n * Page navigation controls with page count display.\n *\n * Supports both compound component and legacy patterns. Prefer compound components for new code:\n *\n * @example\n * // Compound component (recommended)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.Separator />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * // Legacy (deprecated)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nfunction PaginationRoot(props: PaginationProps) {\n const {\n page = 1,\n perPage,\n totalCount,\n setPage,\n children,\n className,\n labels: labelsProp,\n } = props;\n\n // Extract legacy props (only present when children is not provided)\n const text = \"text\" in props ? props.text : undefined;\n const controls =\n \"controls\" in props\n ? (props.controls ?? KUMO_PAGINATION_DEFAULT_VARIANTS.controls)\n : KUMO_PAGINATION_DEFAULT_VARIANTS.controls;\n const [editingPage, setEditingPage] = useState<number>(1);\n\n // Merge provided labels with defaults\n const labels = useMemo<Required<PaginationLabels>>(\n () => ({ ...DEFAULT_LABELS, ...labelsProp }),\n [labelsProp],\n );\n\n useEffect(() => {\n setEditingPage(page);\n }, [page]);\n\n const pageShowingRange = useMemo(() => {\n let lower = page * (perPage ?? 1) - (perPage ?? 0) + 1;\n let upper = Math.min(page * (perPage ?? 0), totalCount ?? 0);\n\n if (Number.isNaN(lower)) lower = 0;\n if (Number.isNaN(upper)) upper = 0;\n\n return `${lower}-${upper}`;\n }, [page, perPage, totalCount]);\n\n const maxPage = useMemo(() => {\n return Math.ceil((totalCount ?? 1) / (perPage ?? 1));\n }, [totalCount, perPage]);\n\n const contextValue: PaginationContextValue = {\n page,\n perPage,\n totalCount,\n maxPage,\n pageShowingRange,\n setPage,\n editingPage,\n setEditingPage,\n labels,\n };\n\n // Compound component mode: render children within context\n if (children) {\n return (\n <PaginationContext.Provider value={contextValue}>\n <div\n data-slot=\"pagination\"\n className={cn(\"flex items-center gap-2 w-full\", className)}\n >\n {children}\n </div>\n </PaginationContext.Provider>\n );\n }\n\n // Legacy mode: render default layout for backwards compatibility\n const getPaginationText = () => {\n if (text) {\n return text({ page, perPage, totalCount, pageShowingRange });\n } else if (totalCount && totalCount > 0) {\n return (\n <>\n Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n <span className=\"tabular-nums\">{totalCount}</span>\n </>\n );\n }\n return null;\n };\n\n return (\n <PaginationContext.Provider value={contextValue}>\n <div\n data-slot=\"pagination\"\n className={cn(\"flex items-center gap-2 w-full\", className)}\n >\n <div\n aria-live=\"polite\"\n aria-atomic=\"true\"\n data-slot=\"pagination-info\"\n className=\"grow text-sm text-kumo-subtle\"\n >\n {getPaginationText()}\n </div>\n <PaginationControls controls={controls} />\n </div>\n </PaginationContext.Provider>\n );\n}\n\nPaginationRoot.displayName = \"Pagination\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nexport const Pagination = Object.assign(PaginationRoot, {\n Info: PaginationInfo,\n PageSize: PaginationPageSize,\n Controls: PaginationControls,\n Separator: PaginationSeparator,\n});\n\nexport {\n PaginationInfo,\n PaginationPageSize,\n PaginationControls,\n PaginationSeparator,\n};\n"],"names":["DEFAULT_PAGE_SIZE_OPTIONS","clamp","value","min","max","DEFAULT_LABELS","KUMO_PAGINATION_DEFAULT_VARIANTS","PaginationContext","createContext","usePaginationContext","context","useContext","PaginationInfo","children","className","page","perPage","totalCount","pageShowingRange","content","jsxs","Fragment","jsx","cn","PaginationPageSize","onChange","options","label","labels","Select","v","size","PaginationControls","controls","pageSelector","maxPage","setPage","editingPage","setEditingPage","InputGroup","CaretDoubleLeftIcon","previousPage","CaretLeftIcon","num","_","i","p","clamped","e","nextPage","CaretRightIcon","CaretDoubleRightIcon","PaginationSeparator","PaginationRoot","props","labelsProp","text","useState","useMemo","useEffect","lower","upper","contextValue","getPaginationText","Pagination"],"mappings":"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"}
1
+ {"version":3,"file":"pagination-bw7vwca4wrfjm8vb.js","sources":["../../src/components/pagination/pagination.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n useEffect,\n useMemo,\n useState,\n type KeyboardEvent,\n type ReactNode,\n} from \"react\";\nimport { InputGroup } from \"../input-group\";\nimport {\n CaretDoubleLeftIcon,\n CaretDoubleRightIcon,\n CaretLeftIcon,\n CaretRightIcon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { Select } from \"../select\";\n\nconst DEFAULT_PAGE_SIZE_OPTIONS = [25, 50, 100, 250] as const;\n\nconst clamp = (value: number, min: number, max: number) =>\n Math.min(Math.max(value, min), max);\n\n// ============================================================================\n// i18n Labels\n// ============================================================================\n\n/**\n * Labels for internationalization of Pagination component.\n * All labels have English defaults and can be overridden for other locales.\n *\n * Note: To customize the \"Showing X-Y of Z\" text, use the `children` render prop\n * on `Pagination.Info` instead. To customize the \"Per page:\" label, use the\n * `label` prop on `Pagination.PageSize`.\n */\nexport interface PaginationLabels {\n /** Aria label for the navigation landmark. @default \"Pagination\" */\n navigation?: string;\n /** Aria label for the first page button. @default \"First page\" */\n firstPage?: string;\n /** Aria label for the previous page button. @default \"Previous page\" */\n previousPage?: string;\n /** Aria label for the next page button. @default \"Next page\" */\n nextPage?: string;\n /** Aria label for the last page button. @default \"Last page\" */\n lastPage?: string;\n /** Aria label for the page number input/select. @default \"Page number\" */\n pageNumber?: string;\n /** Aria label for the page size select. @default \"Page size\" */\n pageSize?: string;\n}\n\nconst DEFAULT_LABELS: Required<PaginationLabels> = {\n navigation: \"Pagination\",\n firstPage: \"First page\",\n previousPage: \"Previous page\",\n nextPage: \"Next page\",\n lastPage: \"Last page\",\n pageNumber: \"Page number\",\n pageSize: \"Page size\",\n};\n\n/** Pagination controls variant definitions. */\nexport const KUMO_PAGINATION_VARIANTS = {\n controls: {\n full: {\n classes: \"\",\n description:\n \"Full pagination controls with first, previous, page input, next, and last buttons\",\n },\n simple: {\n classes: \"\",\n description:\n \"Simple pagination controls with only previous and next buttons\",\n },\n },\n} as const;\n\nexport type KumoPaginationControls =\n keyof typeof KUMO_PAGINATION_VARIANTS.controls;\n\nexport const KUMO_PAGINATION_DEFAULT_VARIANTS = {\n controls: \"full\",\n} as const;\n\nexport interface KumoPaginationVariantsProps {\n controls?: KumoPaginationControls;\n}\n\nexport function paginationVariants({\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n}: KumoPaginationVariantsProps = {}) {\n return cn(\n \"flex items-center justify-between gap-2\",\n resolveVariant(KUMO_PAGINATION_VARIANTS.controls, controls, KUMO_PAGINATION_DEFAULT_VARIANTS.controls).classes,\n );\n}\n\n// ============================================================================\n// Pagination Context\n// ============================================================================\n\ninterface PaginationContextValue {\n page: number;\n perPage?: number;\n totalCount?: number;\n maxPage: number;\n pageShowingRange: string;\n setPage: (page: number) => void;\n editingPage: number;\n setEditingPage: (page: number) => void;\n labels: Required<PaginationLabels>;\n}\n\nconst PaginationContext = createContext<PaginationContextValue | null>(null);\n\nfunction usePaginationContext() {\n const context = useContext(PaginationContext);\n if (!context) {\n throw new Error(\n \"Pagination compound components must be used within a Pagination component\",\n );\n }\n return context;\n}\n\n// ============================================================================\n// Pagination.Info\n// ============================================================================\n\nexport interface PaginationInfoProps {\n /** Custom render function for the info text */\n children?: (props: {\n page: number;\n perPage?: number;\n totalCount?: number;\n pageShowingRange: string;\n }) => ReactNode;\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationInfo({ children, className }: PaginationInfoProps) {\n const { page, perPage, totalCount, pageShowingRange } =\n usePaginationContext();\n\n const content = children ? (\n children({ page, perPage, totalCount, pageShowingRange })\n ) : totalCount && totalCount > 0 ? (\n <>\n Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n <span className=\"tabular-nums\">{totalCount}</span>\n </>\n ) : null;\n\n return (\n <div\n data-slot=\"pagination-info\"\n className={cn(\"text-sm text-kumo-subtle\", className)}\n >\n {content}\n </div>\n );\n}\n\nPaginationInfo.displayName = \"Pagination.Info\";\n\n// ============================================================================\n// Pagination.PageSize\n// ============================================================================\n\nexport interface PaginationPageSizeProps {\n /** Current page size value */\n value: number;\n /** Callback when page size changes */\n onChange: (size: number) => void;\n /** Available page size options */\n options?: number[];\n /**\n * Label text shown before the selector.\n * @default \"Per page:\"\n */\n label?: ReactNode;\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationPageSize({\n value,\n onChange,\n options = DEFAULT_PAGE_SIZE_OPTIONS as unknown as number[],\n label = \"Per page:\",\n className,\n}: PaginationPageSizeProps) {\n const { labels } = usePaginationContext();\n\n return (\n <div\n data-slot=\"pagination-page-size\"\n className={cn(\"flex items-center gap-2\", className)}\n >\n {label && <span className=\"text-sm text-kumo-subtle\">{label}</span>}\n <Select\n aria-label={labels.pageSize}\n value={value}\n onValueChange={(v) => onChange(v as number)}\n >\n {options.map((size) => (\n <Select.Option key={size} value={size}>\n {size}\n </Select.Option>\n ))}\n </Select>\n </div>\n );\n}\n\nPaginationPageSize.displayName = \"Pagination.PageSize\";\n\n// ============================================================================\n// Pagination.Controls\n// ============================================================================\n\nexport interface PaginationControlsProps extends KumoPaginationVariantsProps {\n /**\n * How the page number selector is rendered in \"full\" controls mode.\n * - `\"input\"` (default): A text input where users type a page number.\n * - `\"dropdown\"`: A dropdown select with all page numbers as options.\n *\n * **Note:** `\"dropdown\"` renders an option for every page, so it is best\n * suited for small page counts. For large datasets (hundreds of pages or\n * more) prefer `\"input\"` to avoid rendering performance overhead.\n */\n pageSelector?: \"input\" | \"dropdown\";\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationControls({\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n pageSelector = \"input\",\n className,\n}: PaginationControlsProps) {\n const { page, maxPage, setPage, editingPage, setEditingPage, labels } =\n usePaginationContext();\n\n return (\n <div\n data-slot=\"pagination-controls\"\n className={cn(\"grow flex flex-col items-end\", className)}\n >\n <nav aria-label={labels.navigation}>\n <InputGroup>\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.firstPage}\n disabled={page <= 1}\n onClick={() => {\n setPage(1);\n setEditingPage(1);\n }}\n >\n <CaretDoubleLeftIcon size={16} />\n </InputGroup.Button>\n )}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.previousPage}\n disabled={page <= 1}\n onClick={() => {\n const previousPage = Math.max(page - 1, 1);\n setPage(previousPage);\n setEditingPage(previousPage);\n }}\n >\n <CaretLeftIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" &&\n (pageSelector === \"dropdown\" ? (\n <Select\n aria-label={labels.pageNumber}\n className=\"rounded-none ring-kumo-hairline\"\n value={page}\n onValueChange={(value) => {\n const num = value as number;\n setPage(num);\n setEditingPage(num);\n }}\n >\n {Array.from({ length: maxPage }, (_, i) => i + 1).map((p) => (\n <Select.Option key={p} value={p}>\n {p}\n </Select.Option>\n ))}\n </Select>\n ) : (\n <InputGroup.Input\n style={{ width: 50 }}\n className=\"text-center\"\n aria-label={labels.pageNumber}\n value={editingPage}\n onValueChange={(value: string) => {\n setEditingPage(Number(value));\n }}\n onBlur={() => {\n const clamped = clamp(editingPage, 1, maxPage);\n setPage(clamped);\n setEditingPage(clamped);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === \"Enter\") {\n const clamped = clamp(editingPage, 1, maxPage);\n setPage(clamped);\n setEditingPage(clamped);\n }\n }}\n // Prevent password managers from auto-filling\n autoComplete=\"off\"\n data-1p-ignore\n data-lpignore=\"true\"\n data-form-type=\"other\"\n />\n ))}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.nextPage}\n disabled={page === maxPage}\n onClick={() => {\n const nextPage = Math.min(page + 1, maxPage);\n setPage(nextPage);\n setEditingPage(nextPage);\n }}\n >\n <CaretRightIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.lastPage}\n disabled={page === maxPage}\n onClick={() => {\n setPage(maxPage);\n setEditingPage(maxPage);\n }}\n >\n <CaretDoubleRightIcon size={16} />\n </InputGroup.Button>\n )}\n </InputGroup>\n </nav>\n </div>\n );\n}\n\nPaginationControls.displayName = \"Pagination.Controls\";\n\n// ============================================================================\n// Pagination.Separator\n// ============================================================================\n\nexport interface PaginationSeparatorProps {\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationSeparator({ className }: PaginationSeparatorProps) {\n return (\n <div\n data-slot=\"pagination-separator\"\n className={cn(\"mx-2 h-6 border-l border-kumo-hairline\", className)}\n />\n );\n}\n\nPaginationSeparator.displayName = \"Pagination.Separator\";\n\n// ============================================================================\n// Pagination Root\n// ============================================================================\n\n/** Base props shared by both compound and legacy Pagination APIs */\ninterface PaginationBaseProps {\n /** Callback fired when the current page changes. */\n setPage: (page: number) => void;\n /**\n * Current page number (1-indexed).\n * @default 1\n */\n page?: number;\n /** Number of items displayed per page. */\n perPage?: number;\n /** Total number of items across all pages. */\n totalCount?: number;\n /** Additional CSS classes for the container */\n className?: string;\n /**\n * Labels for internationalization of aria-labels. All labels have English defaults.\n *\n * For visible text like \"Showing X of Y\", use render props on sub-components:\n * - `Pagination.Info` children for the info text\n * - `Pagination.PageSize` label prop for the \"Per page:\" text\n *\n * @example\n * ```tsx\n * <Pagination\n * labels={{\n * firstPage: \"Première page\",\n * previousPage: \"Page précédente\",\n * nextPage: \"Page suivante\",\n * lastPage: \"Dernière page\",\n * pageNumber: \"Numéro de page\",\n * pageSize: \"Taille de page\",\n * }}\n * // ...\n * />\n * ```\n */\n labels?: PaginationLabels;\n}\n\n/**\n * Props for the compound component API (recommended).\n *\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport interface PaginationCompoundProps extends PaginationBaseProps {\n /**\n * Compound component children for custom layouts.\n * Use Pagination.Info, Pagination.PageSize, Pagination.Controls, and Pagination.Separator.\n */\n children: ReactNode;\n controls?: never;\n text?: never;\n}\n\n/**\n * Props for the legacy API (deprecated, use compound components instead).\n *\n * @deprecated Use the compound component API with children instead:\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * ```tsx\n * // Legacy usage (deprecated)\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nexport interface PaginationLegacyProps\n extends PaginationBaseProps, KumoPaginationVariantsProps {\n children?: never;\n /** @deprecated Use Pagination.Info with children prop instead */\n text?: (props: {\n page?: number;\n perPage?: number;\n totalCount?: number;\n pageShowingRange: string;\n }) => ReactNode;\n}\n\n/**\n * Pagination component props.\n *\n * Prefer the compound component API for new code:\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport type PaginationProps = PaginationCompoundProps | PaginationLegacyProps;\n\n/**\n * Page navigation controls with page count display.\n *\n * Supports both compound component and legacy patterns. Prefer compound components for new code:\n *\n * @example\n * // Compound component (recommended)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.Separator />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * // Legacy (deprecated)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nfunction PaginationRoot(props: PaginationProps) {\n const {\n page = 1,\n perPage,\n totalCount,\n setPage,\n children,\n className,\n labels: labelsProp,\n } = props;\n\n // Extract legacy props (only present when children is not provided)\n const text = \"text\" in props ? props.text : undefined;\n const controls =\n \"controls\" in props\n ? (props.controls ?? KUMO_PAGINATION_DEFAULT_VARIANTS.controls)\n : KUMO_PAGINATION_DEFAULT_VARIANTS.controls;\n const [editingPage, setEditingPage] = useState<number>(1);\n\n // Merge provided labels with defaults\n const labels = useMemo<Required<PaginationLabels>>(\n () => ({ ...DEFAULT_LABELS, ...labelsProp }),\n [labelsProp],\n );\n\n useEffect(() => {\n setEditingPage(page);\n }, [page]);\n\n const pageShowingRange = useMemo(() => {\n let lower = page * (perPage ?? 1) - (perPage ?? 0) + 1;\n let upper = Math.min(page * (perPage ?? 0), totalCount ?? 0);\n\n if (Number.isNaN(lower)) lower = 0;\n if (Number.isNaN(upper)) upper = 0;\n\n return `${lower}-${upper}`;\n }, [page, perPage, totalCount]);\n\n const maxPage = useMemo(() => {\n return Math.ceil((totalCount ?? 1) / (perPage ?? 1));\n }, [totalCount, perPage]);\n\n const contextValue: PaginationContextValue = {\n page,\n perPage,\n totalCount,\n maxPage,\n pageShowingRange,\n setPage,\n editingPage,\n setEditingPage,\n labels,\n };\n\n // Compound component mode: render children within context\n if (children) {\n return (\n <PaginationContext.Provider value={contextValue}>\n <div\n data-slot=\"pagination\"\n className={cn(\"flex items-center gap-2 w-full\", className)}\n >\n {children}\n </div>\n </PaginationContext.Provider>\n );\n }\n\n // Legacy mode: render default layout for backwards compatibility\n const getPaginationText = () => {\n if (text) {\n return text({ page, perPage, totalCount, pageShowingRange });\n } else if (totalCount && totalCount > 0) {\n return (\n <>\n Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n <span className=\"tabular-nums\">{totalCount}</span>\n </>\n );\n }\n return null;\n };\n\n return (\n <PaginationContext.Provider value={contextValue}>\n <div\n data-slot=\"pagination\"\n className={cn(\"flex items-center gap-2 w-full\", className)}\n >\n <div\n aria-live=\"polite\"\n aria-atomic=\"true\"\n data-slot=\"pagination-info\"\n className=\"grow text-sm text-kumo-subtle\"\n >\n {getPaginationText()}\n </div>\n <PaginationControls controls={controls} />\n </div>\n </PaginationContext.Provider>\n );\n}\n\nPaginationRoot.displayName = \"Pagination\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nexport const Pagination = Object.assign(PaginationRoot, {\n Info: PaginationInfo,\n PageSize: PaginationPageSize,\n Controls: PaginationControls,\n Separator: PaginationSeparator,\n});\n\nexport {\n PaginationInfo,\n PaginationPageSize,\n PaginationControls,\n PaginationSeparator,\n};\n"],"names":["DEFAULT_PAGE_SIZE_OPTIONS","clamp","value","min","max","DEFAULT_LABELS","KUMO_PAGINATION_DEFAULT_VARIANTS","PaginationContext","createContext","usePaginationContext","context","useContext","PaginationInfo","children","className","page","perPage","totalCount","pageShowingRange","content","jsxs","Fragment","jsx","cn","PaginationPageSize","onChange","options","label","labels","Select","v","size","PaginationControls","controls","pageSelector","maxPage","setPage","editingPage","setEditingPage","InputGroup","CaretDoubleLeftIcon","previousPage","CaretLeftIcon","num","_","i","p","clamped","e","nextPage","CaretRightIcon","CaretDoubleRightIcon","PaginationSeparator","PaginationRoot","props","labelsProp","text","useState","useMemo","useEffect","lower","upper","contextValue","getPaginationText","Pagination"],"mappings":"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"}
@@ -2,7 +2,7 @@
2
2
  import { jsx as o, jsxs as p } from "react/jsx-runtime";
3
3
  import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
4
4
  import { u as h } from "./portal-provider-hwmkdmkpvct0cb76.js";
5
- import { bk as C, bl as x, bm as N, bn as y, bo as L, bp as k, bq as T, br as R, bs as w } from "./vendor-base-ui-mzjqwv5teijixz8h.js";
5
+ import { bl as C, bm as x, bn as N, bo as y, bp as L, bq as k, br as T, bs as R, bt as w } from "./vendor-base-ui-knphx7dts1vm1x37.js";
6
6
  const $ = {
7
7
  side: {
8
8
  top: {
@@ -39,6 +39,8 @@ function d({
39
39
  return /* @__PURE__ */ o(
40
40
  x,
41
41
  {
42
+ "data-kumo-component": "Popover",
43
+ "data-kumo-part": "trigger",
42
44
  className: t,
43
45
  render: a ?? (r ? e : void 0),
44
46
  ...s,
@@ -176,4 +178,4 @@ export {
176
178
  g as f,
177
179
  V as g
178
180
  };
179
- //# sourceMappingURL=popover-js5ds3szd43kspja.js.map
181
+ //# sourceMappingURL=popover-ozf1j7oi7pxiudyz.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"popover-ozf1j7oi7pxiudyz.js","sources":["../../src/components/popover/popover.tsx"],"sourcesContent":["import { Popover as PopoverBase } from \"@base-ui/react/popover\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Popover side variant definitions mapping positions to their Tailwind classes. */\nexport const KUMO_POPOVER_VARIANTS = {\n side: {\n top: {\n classes: \"\",\n description: \"Popover appears above the trigger\",\n },\n bottom: {\n classes: \"\",\n description: \"Popover appears below the trigger\",\n },\n left: {\n classes: \"\",\n description: \"Popover appears to the left of the trigger\",\n },\n right: {\n classes: \"\",\n description: \"Popover appears to the right of the trigger\",\n },\n },\n} as const;\n\nexport const KUMO_POPOVER_DEFAULT_VARIANTS = {\n side: \"bottom\",\n} as const;\n\n// Derived types from KUMO_POPOVER_VARIANTS\nexport type KumoPopoverSide = keyof typeof KUMO_POPOVER_VARIANTS.side;\n\nexport interface KumoPopoverVariantsProps {\n /**\n * Which side of the trigger the popover appears on.\n * - `\"top\"` — Above the trigger\n * - `\"bottom\"` — Below the trigger\n * - `\"left\"` — Left of the trigger\n * - `\"right\"` — Right of the trigger\n * @default \"bottom\"\n */\n side?: KumoPopoverSide;\n}\n\n// ============================================================================\n// Popover Root\n// ============================================================================\n\ntype BasePopoverRootProps = ComponentPropsWithoutRef<typeof PopoverBase.Root>;\n\nexport type PopoverRootProps = BasePopoverRootProps;\n\nfunction PopoverRoot({ children, ...props }: PopoverRootProps) {\n return <PopoverBase.Root {...props}>{children}</PopoverBase.Root>;\n}\n\nPopoverRoot.displayName = \"Popover\";\n\n// ============================================================================\n// Popover Trigger\n// ============================================================================\n\ntype BasePopoverTriggerProps = ComponentPropsWithoutRef<\n typeof PopoverBase.Trigger\n>;\n\nexport type PopoverTriggerProps = BasePopoverTriggerProps & {\n /**\n * @deprecated Use the `render` prop instead.\n * @example `<Popover.Trigger render={<Button />}>Open</Popover.Trigger>` instead of `<Popover.Trigger asChild><Button>Open</Button></Popover.Trigger>`\n */\n asChild?: boolean;\n};\n\nfunction PopoverTrigger({\n children,\n className,\n asChild,\n render,\n ...props\n}: PopoverTriggerProps) {\n // Support both render prop (preferred) and deprecated asChild pattern\n // When using asChild, children IS the render element, so don't pass it as children\n const resolvedRender =\n render ??\n (asChild ? (children as BasePopoverTriggerProps[\"render\"]) : undefined);\n\n return (\n <PopoverBase.Trigger\n data-kumo-component=\"Popover\"\n data-kumo-part=\"trigger\"\n className={className}\n render={resolvedRender}\n {...props}\n >\n {asChild ? undefined : children}\n </PopoverBase.Trigger>\n );\n}\n\nPopoverTrigger.displayName = \"Popover.Trigger\";\n\n// ============================================================================\n// Popover Content\n// ============================================================================\n\n/** Alignment options for popover positioning */\ntype PopoverAlign = \"start\" | \"center\" | \"end\";\n\ntype BasePopoverPositionerProps = ComponentPropsWithoutRef<\n typeof PopoverBase.Positioner\n>;\n\n/**\n * Popover content panel props.\n *\n * @example\n * ```tsx\n * <Popover.Content side=\"top\" align=\"start\" sideOffset={12}>\n * <p>Popover body</p>\n * </Popover.Content>\n * ```\n */\nexport type PopoverContentProps = KumoPopoverVariantsProps & {\n /**\n * An element to position the popup against.\n * By default, the popup will be positioned against the trigger.\n *\n * Accepts a DOM element, a ref to a DOM element, a virtual element\n * (object with a `getBoundingClientRect` method), or a function\n * returning any of these.\n *\n * This is useful when the popover trigger and the desired anchor point\n * are in different component trees, or when positioning against a\n * coordinate (e.g., a `DOMRect` from `getBoundingClientRect()`).\n *\n * @example Virtual element (e.g., anchoring to a DOMRect)\n * ```tsx\n * <Popover open={open} onOpenChange={setOpen}>\n * <Popover.Content anchor={{ getBoundingClientRect: () => anchorRect }}>\n * <p>Anchored content</p>\n * </Popover.Content>\n * </Popover>\n * ```\n */\n anchor?: BasePopoverPositionerProps[\"anchor\"];\n /**\n * How to align the popover relative to the trigger.\n * @default \"center\"\n */\n align?: PopoverAlign;\n /**\n * Distance between the trigger and the popover in pixels.\n * @default 8\n */\n sideOffset?: number;\n /**\n * Additional offset along the alignment axis in pixels.\n * @default 0\n */\n alignOffset?: number;\n /**\n * Determines which CSS `position` property to use.\n * Use \"fixed\" when the popover needs to escape stacking contexts (e.g., inside sticky headers).\n * @default \"absolute\"\n */\n positionMethod?: \"absolute\" | \"fixed\";\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Content to render inside the popover. */\n children?: ReactNode;\n /**\n * Container element for the portal. Use this to render the popover inside\n * a Shadow DOM or custom container. Overrides `KumoPortalProvider` context.\n * @default document.body (or KumoPortalProvider container if set)\n */\n container?: PortalContainer;\n};\n\nfunction PopoverContent({\n children,\n side = KUMO_POPOVER_DEFAULT_VARIANTS.side,\n align = \"center\",\n sideOffset = 8,\n alignOffset = 0,\n positionMethod = \"absolute\",\n anchor,\n className,\n container: containerProp,\n}: PopoverContentProps) {\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n return (\n <PopoverBase.Portal container={container}>\n <PopoverBase.Positioner\n anchor={anchor}\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n positionMethod={positionMethod}\n >\n <PopoverBase.Popup\n className={cn(\n \"flex origin-(--transform-origin) flex-col rounded-lg bg-kumo-base px-4 py-3 text-sm text-kumo-default\",\n \"shadow-lg shadow-kumo-tip-shadow outline outline-kumo-fill\",\n \"transition-[transform,scale,opacity] duration-150\",\n \"data-starting-style:scale-90 data-starting-style:opacity-0\",\n \"data-ending-style:scale-90 data-ending-style:opacity-0\",\n \"data-instant:duration-0\",\n \"kumo-popover-popup\",\n className,\n )}\n >\n <PopoverBase.Arrow\n className={cn(\n \"flex\",\n \"data-[side=bottom]:-top-2\",\n \"data-[side=left]:right-[-13px] data-[side=left]:rotate-90\",\n \"data-[side=right]:left-[-13px] data-[side=right]:-rotate-90\",\n \"data-[side=top]:-bottom-2 data-[side=top]:rotate-180\",\n )}\n >\n <ArrowSvg />\n </PopoverBase.Arrow>\n {children}\n </PopoverBase.Popup>\n </PopoverBase.Positioner>\n </PopoverBase.Portal>\n );\n}\n\nPopoverContent.displayName = \"Popover.Content\";\n\n// ============================================================================\n// Popover Title\n// ============================================================================\n\ntype BasePopoverTitleProps = ComponentPropsWithoutRef<typeof PopoverBase.Title>;\n\nexport type PopoverTitleProps = BasePopoverTitleProps;\n\nfunction PopoverTitle({ className, ...props }: PopoverTitleProps) {\n return (\n <PopoverBase.Title\n className={cn(\"m-0 text-base leading-6 font-medium\", className)}\n {...props}\n />\n );\n}\n\nPopoverTitle.displayName = \"Popover.Title\";\n\n// ============================================================================\n// Popover Description\n// ============================================================================\n\ntype BasePopoverDescriptionProps = ComponentPropsWithoutRef<\n typeof PopoverBase.Description\n>;\n\nexport type PopoverDescriptionProps = BasePopoverDescriptionProps;\n\nfunction PopoverDescription({ className, ...props }: PopoverDescriptionProps) {\n return (\n <PopoverBase.Description\n className={cn(\"m-0 text-base leading-6 text-kumo-subtle\", className)}\n {...props}\n />\n );\n}\n\nPopoverDescription.displayName = \"Popover.Description\";\n\n// ============================================================================\n// Popover Close\n// ============================================================================\n\ntype BasePopoverCloseProps = ComponentPropsWithoutRef<typeof PopoverBase.Close>;\n\nexport type PopoverCloseProps = BasePopoverCloseProps & {\n /**\n * @deprecated Use the `render` prop instead.\n * @example `<Popover.Close render={<Button />}>Close</Popover.Close>` instead of `<Popover.Close asChild><Button>Close</Button></Popover.Close>`\n */\n asChild?: boolean;\n};\n\nfunction PopoverClose({\n children,\n className,\n asChild,\n render,\n ...props\n}: PopoverCloseProps) {\n // Support both render prop (preferred) and deprecated asChild pattern\n // When using asChild, children IS the render element, so don't pass it as children\n const resolvedRender =\n render ??\n (asChild ? (children as BasePopoverCloseProps[\"render\"]) : undefined);\n\n return (\n <PopoverBase.Close className={className} render={resolvedRender} {...props}>\n {asChild ? undefined : children}\n </PopoverBase.Close>\n );\n}\n\nPopoverClose.displayName = \"Popover.Close\";\n\n// ============================================================================\n// Arrow SVG\n// ============================================================================\n\n/**\n * Arrow SVG with three paths for proper border rendering in both light and dark modes.\n * This approach matches Base UI's popover/tooltip implementation.\n *\n * The three paths are:\n * 1. ArrowFill - The main arrow body, matches popover background\n * 2. ArrowOuterStroke - Border visible in light mode only (transparent in dark)\n * 3. ArrowInnerStroke - Border visible in dark mode only (transparent in light)\n *\n * This is necessary because the outer and inner stroke paths have different geometries,\n * and using both ensures the arrow border aligns perfectly with the popover's outline\n * in both color modes.\n *\n * @see https://base-ui.com/react/components/popover\n */\nfunction ArrowSvg(props: React.ComponentProps<\"svg\">) {\n return (\n <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\" {...props}>\n <path\n d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n className=\"fill-kumo-base\"\n />\n <path\n d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n className=\"fill-kumo-tip-shadow\"\n />\n <path\n d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\"\n className=\"fill-kumo-tip-stroke\"\n />\n </svg>\n );\n}\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\n/**\n * Popover component for displaying accessible popup content anchored to a trigger.\n *\n * @example\n * ```tsx\n * <Popover>\n * <Popover.Trigger render={<Button>Open</Button>} />\n * <Popover.Content>\n * <Popover.Title>Notifications</Popover.Title>\n * <Popover.Description>You are all caught up!</Popover.Description>\n * </Popover.Content>\n * </Popover>\n * ```\n *\n * @see https://base-ui.com/react/components/popover\n */\nexport const Popover = Object.assign(PopoverRoot, {\n Trigger: PopoverTrigger,\n Content: PopoverContent,\n Title: PopoverTitle,\n Description: PopoverDescription,\n Close: PopoverClose,\n});\n\n// Export sub-components for direct access and type inference\nexport {\n PopoverRoot,\n PopoverTrigger,\n PopoverContent,\n PopoverTitle,\n PopoverDescription,\n PopoverClose,\n};\n"],"names":["KUMO_POPOVER_VARIANTS","KUMO_POPOVER_DEFAULT_VARIANTS","PopoverRoot","children","props","PopoverBase.Root","PopoverTrigger","className","asChild","render","jsx","PopoverBase.Trigger","PopoverContent","side","align","sideOffset","alignOffset","positionMethod","anchor","containerProp","contextContainer","usePortalContainer","PopoverBase.Portal","PopoverBase.Positioner","jsxs","PopoverBase.Popup","cn","PopoverBase.Arrow","ArrowSvg","PopoverTitle","PopoverBase.Title","PopoverDescription","PopoverBase.Description","PopoverClose","PopoverBase.Close","Popover"],"mappings":"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"}
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import { jsx as e, jsxs as p } from "react/jsx-runtime";
3
3
  import { forwardRef as I, createContext as C, useContext as G } from "react";
4
- import { c as o } from "./cn-ct4n7r74mh8y0f48.js";
4
+ import { c as r } from "./cn-ct4n7r74mh8y0f48.js";
5
5
  import { r as x } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
6
- import { R as L, U as O, Q as w, bt as v, bu as N } from "./vendor-base-ui-mzjqwv5teijixz8h.js";
7
- const R = {
6
+ import { R as L, U as O, Q as w, bu as v, bv as R } from "./vendor-base-ui-knphx7dts1vm1x37.js";
7
+ const N = {
8
8
  variant: {
9
9
  default: {
10
10
  classes: "ring-kumo-hairline",
@@ -31,11 +31,11 @@ const R = {
31
31
  };
32
32
  function P({
33
33
  variant: t = f.variant,
34
- appearance: r = f.appearance
34
+ appearance: a = f.appearance
35
35
  } = {}) {
36
- return o(
37
- x(R.variant, t, f.variant).classes,
38
- x(R.appearance, r, f.appearance).classes
36
+ return r(
37
+ x(N.variant, t, f.variant).classes,
38
+ x(N.appearance, a, f.appearance).classes
39
39
  );
40
40
  }
41
41
  const y = C({
@@ -44,8 +44,8 @@ const y = C({
44
44
  }), A = I(
45
45
  ({
46
46
  className: t,
47
- disabled: r,
48
- variant: a = "default",
47
+ disabled: a,
48
+ variant: o = "default",
49
49
  appearance: s,
50
50
  label: n,
51
51
  description: i,
@@ -55,13 +55,15 @@ const y = C({
55
55
  return d ? /* @__PURE__ */ p(
56
56
  "label",
57
57
  {
58
- className: o(
58
+ "data-kumo-component": "Radio",
59
+ "data-kumo-part": "item-label",
60
+ className: r(
59
61
  "m-0 group relative flex items-start gap-3 rounded-lg border border-kumo-hairline bg-kumo-base p-3 transition-colors has-[[data-checked]]:border-kumo-interact has-[[data-checked]]:bg-kumo-tint",
60
62
  m === "start" && "flex-row-reverse",
61
- a === "error" && "border-kumo-danger has-[[data-checked]]:border-kumo-danger has-[[data-checked]]:bg-kumo-base",
62
- r ? "cursor-not-allowed opacity-50" : o(
63
+ o === "error" && "border-kumo-danger has-[[data-checked]]:border-kumo-danger has-[[data-checked]]:bg-kumo-base",
64
+ a ? "cursor-not-allowed opacity-50" : r(
63
65
  "has-[[data-disabled]]:cursor-not-allowed has-[[data-disabled]]:opacity-50 cursor-pointer",
64
- a !== "error" && "hover:not-has-[[data-disabled]]:bg-kumo-tint"
66
+ o !== "error" && "hover:not-has-[[data-disabled]]:bg-kumo-tint"
65
67
  ),
66
68
  t
67
69
  ),
@@ -74,17 +76,19 @@ const y = C({
74
76
  v,
75
77
  {
76
78
  ref: l,
79
+ "data-kumo-component": "Radio",
80
+ "data-kumo-part": "item",
77
81
  value: c,
78
- disabled: r,
79
- className: o(
82
+ disabled: a,
83
+ className: r(
80
84
  "relative mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring ring-2 focus:outline-none focus:ring-kumo-focus focus-visible:ring-2 focus-visible:ring-kumo-brand",
81
- a === "error" ? "ring-kumo-danger" : "ring-kumo-line",
82
- !r && a !== "error" && "group-hover:ring-kumo-hairline focus-visible:outline-offset-3",
83
- !r && a === "error" && "focus-visible:outline-offset-3",
85
+ o === "error" ? "ring-kumo-danger" : "ring-kumo-line",
86
+ !a && o !== "error" && "group-hover:ring-kumo-hairline focus-visible:outline-offset-3",
87
+ !a && o === "error" && "focus-visible:outline-offset-3",
84
88
  "data-[checked]:bg-kumo-contrast"
85
89
  ),
86
90
  children: /* @__PURE__ */ e(
87
- N,
91
+ R,
88
92
  {
89
93
  keepMounted: !0,
90
94
  className: "flex items-center justify-center",
@@ -98,12 +102,14 @@ const y = C({
98
102
  ) : /* @__PURE__ */ p(
99
103
  "label",
100
104
  {
101
- className: o(
102
- "m-0 group relative inline-flex items-center gap-2",
105
+ "data-kumo-component": "Radio",
106
+ "data-kumo-part": "item-label",
107
+ className: r(
108
+ "m-0 group relative inline-flex items-start gap-2",
103
109
  // "start" (default): radio before label
104
110
  // "end": label before radio using flex-row-reverse
105
111
  m === "end" && "flex-row-reverse justify-end",
106
- r ? "cursor-not-allowed opacity-50" : "cursor-pointer",
112
+ a ? "cursor-not-allowed opacity-50" : "cursor-pointer",
107
113
  t
108
114
  ),
109
115
  children: [
@@ -111,17 +117,19 @@ const y = C({
111
117
  v,
112
118
  {
113
119
  ref: l,
120
+ "data-kumo-component": "Radio",
121
+ "data-kumo-part": "item",
114
122
  value: c,
115
- disabled: r,
116
- className: o(
117
- "relative flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring focus:outline-none after:absolute after:-inset-x-3 after:-inset-y-2",
118
- a === "error" ? "ring-kumo-danger" : "ring-kumo-line",
119
- !r && a !== "error" && "group-hover:ring-kumo-hairline focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3",
120
- !r && a === "error" && "focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3",
123
+ disabled: a,
124
+ className: r(
125
+ "relative mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring focus:outline-none after:absolute after:-inset-x-3 after:-inset-y-2",
126
+ o === "error" ? "ring-kumo-danger" : "ring-kumo-line",
127
+ !a && o !== "error" && "group-hover:ring-kumo-hairline focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3",
128
+ !a && o === "error" && "focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3",
121
129
  "data-[checked]:bg-kumo-contrast"
122
130
  ),
123
131
  children: /* @__PURE__ */ e(
124
- N,
132
+ R,
125
133
  {
126
134
  keepMounted: !0,
127
135
  className: "flex items-center justify-center",
@@ -137,20 +145,20 @@ const y = C({
137
145
  }
138
146
  );
139
147
  A.displayName = "Radio.Item";
140
- function j({ children: t, className: r }) {
148
+ function j({ children: t, className: a }) {
141
149
  return /* @__PURE__ */ e(
142
150
  w,
143
151
  {
144
- className: o("text-base font-medium text-kumo-default", r),
152
+ className: r("text-base font-medium text-kumo-default", a),
145
153
  children: t
146
154
  }
147
155
  );
148
156
  }
149
157
  j.displayName = "Radio.Legend";
150
- function h({
158
+ function k({
151
159
  legend: t,
152
- children: r,
153
- orientation: a = "vertical",
160
+ children: a,
161
+ orientation: o = "vertical",
154
162
  appearance: s = "default",
155
163
  error: n,
156
164
  description: i,
@@ -158,11 +166,11 @@ function h({
158
166
  value: l,
159
167
  onValueChange: g,
160
168
  disabled: u,
161
- controlPosition: k,
169
+ controlPosition: h,
162
170
  name: d,
163
171
  className: m
164
172
  }) {
165
- return /* @__PURE__ */ e(y.Provider, { value: { controlPosition: k, appearance: s }, children: /* @__PURE__ */ e(
173
+ return /* @__PURE__ */ e(y.Provider, { value: { controlPosition: h, appearance: s }, children: /* @__PURE__ */ e(
166
174
  L,
167
175
  {
168
176
  defaultValue: c,
@@ -174,16 +182,16 @@ function h({
174
182
  O,
175
183
  {
176
184
  disabled: u,
177
- className: o("flex flex-col gap-4", m),
185
+ className: r("flex flex-col gap-4", m),
178
186
  children: [
179
187
  t && /* @__PURE__ */ e(w, { className: "text-base font-medium text-kumo-default", children: t }),
180
188
  /* @__PURE__ */ e(
181
189
  "div",
182
190
  {
183
- className: o(
184
- a === "vertical" ? o("flex flex-col", s === "card" ? "gap-3" : "gap-2") : s === "card" ? "grid grid-cols-2 gap-3" : "flex flex-row flex-wrap gap-2"
191
+ className: r(
192
+ o === "vertical" ? r("flex flex-col", s === "card" ? "gap-3" : "gap-2") : s === "card" ? "grid grid-cols-2 gap-3" : "flex flex-row flex-wrap gap-2"
185
193
  ),
186
- children: r
194
+ children: a
187
195
  }
188
196
  ),
189
197
  n && /* @__PURE__ */ e("p", { className: "text-sm text-kumo-danger", children: n }),
@@ -194,17 +202,17 @@ function h({
194
202
  }
195
203
  ) });
196
204
  }
197
- h.displayName = "Radio.Group";
198
- const U = Object.assign(h, {
205
+ k.displayName = "Radio.Group";
206
+ const U = Object.assign(k, {
199
207
  Item: A,
200
- Group: h,
208
+ Group: k,
201
209
  Legend: j
202
210
  });
203
211
  export {
204
- R as K,
212
+ N as K,
205
213
  U as R,
206
- h as a,
214
+ k as a,
207
215
  f as b,
208
216
  P as r
209
217
  };
210
- //# sourceMappingURL=radio-nyw89v4eafptepmz.js.map
218
+ //# sourceMappingURL=radio-gpg6kmzonr2cayq1.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"radio-gpg6kmzonr2cayq1.js","sources":["../../src/components/radio/radio.tsx"],"sourcesContent":["import { forwardRef, createContext, useContext, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { Fieldset } from \"@base-ui/react/fieldset\";\nimport { RadioGroup as BaseRadioGroup } from \"@base-ui/react/radio-group\";\nimport { Radio as BaseRadio } from \"@base-ui/react/radio\";\n\n/** Radio variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_RADIO_VARIANTS = {\n variant: {\n default: {\n classes: \"ring-kumo-hairline\",\n description: \"Default radio appearance\",\n },\n error: {\n classes: \"ring-kumo-danger\",\n description: \"Error state for validation failures\",\n },\n },\n appearance: {\n default: {\n classes: \"\",\n description: \"Standard inline radio item\",\n },\n card: {\n classes:\n \"rounded-lg border border-kumo-hairline bg-kumo-base p-3 transition-colors hover:bg-kumo-tint has-[[data-checked]]:border-kumo-interact has-[[data-checked]]:bg-kumo-tint\",\n description:\n \"Choice card appearance with border, padding, and highlighted selection state\",\n },\n },\n} as const;\n\nexport const KUMO_RADIO_DEFAULT_VARIANTS = {\n variant: \"default\",\n appearance: \"default\",\n} as const;\n\n// Derived types from KUMO_RADIO_VARIANTS\nexport type KumoRadioVariant = keyof typeof KUMO_RADIO_VARIANTS.variant;\nexport type KumoRadioAppearance = keyof typeof KUMO_RADIO_VARIANTS.appearance;\n\nexport interface KumoRadioVariantsProps {\n /**\n * Visual variant.\n * - `\"default\"` — Standard radio appearance\n * - `\"error\"` — Error state for validation failures\n * @default \"default\"\n */\n variant?: KumoRadioVariant;\n /**\n * Visual appearance.\n * - `\"default\"` — Standard inline radio item\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n}\n\nexport function radioVariants({\n variant = KUMO_RADIO_DEFAULT_VARIANTS.variant,\n appearance = KUMO_RADIO_DEFAULT_VARIANTS.appearance,\n}: KumoRadioVariantsProps = {}) {\n return cn(\n resolveVariant(KUMO_RADIO_VARIANTS.variant, variant, KUMO_RADIO_DEFAULT_VARIANTS.variant).classes,\n resolveVariant(KUMO_RADIO_VARIANTS.appearance, appearance, KUMO_RADIO_DEFAULT_VARIANTS.appearance).classes,\n );\n}\n\n// Legacy type alias for backwards compatibility\nexport type RadioVariant = KumoRadioVariant;\n\n/** Position of the radio control relative to its label */\nexport type RadioControlPosition = \"start\" | \"end\";\n\n// Context for passing controlPosition and appearance from Group to Items.\n// `controlPosition` may be undefined so each item can fall back to an\n// appearance-appropriate default (start for default, end for card).\nconst RadioGroupContext = createContext<{\n controlPosition: RadioControlPosition | undefined;\n appearance: KumoRadioAppearance;\n}>({\n controlPosition: undefined,\n appearance: \"default\",\n});\n\n/**\n * Radio group component props (with built-in Fieldset and RadioGroup)\n *\n * @example\n * // Basic usage\n * ```tsx\n * <Radio.Group legend=\"Notification preference\" defaultValue=\"email\">\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * <Radio.Item label=\"Push\" value=\"push\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Horizontal layout\n * ```tsx\n * <Radio.Group legend=\"Size\" orientation=\"horizontal\" defaultValue=\"md\">\n * <Radio.Item label=\"Small\" value=\"sm\" />\n * <Radio.Item label=\"Medium\" value=\"md\" />\n * <Radio.Item label=\"Large\" value=\"lg\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // With error and description\n * ```tsx\n * <Radio.Group\n * legend=\"Payment method\"\n * error=\"Please select a payment method\"\n * description=\"Choose how you'd like to pay\"\n * >\n * <Radio.Item label=\"Credit Card\" value=\"card\" />\n * <Radio.Item label=\"PayPal\" value=\"paypal\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Controlled\n * ```tsx\n * const [value, setValue] = useState(\"email\");\n * <Radio.Group legend=\"Contact\" value={value} onValueChange={setValue}>\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"Phone\" value=\"phone\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Label before radio (controlPosition=\"end\")\n * ```tsx\n * <Radio.Group legend=\"Options\" controlPosition=\"end\" defaultValue=\"a\">\n * <Radio.Item label=\"Option A\" value=\"a\" />\n * <Radio.Item label=\"Option B\" value=\"b\" />\n * </Radio.Group>\n * ```\n */\n/**\n * Props for Radio.Legend — a composable sub-component for labeling a Radio.Group.\n *\n * Place as a direct child of `<Radio.Group>` to provide a styled, accessible legend.\n * Accepts `className` for full styling control (e.g. `className=\"sr-only\"` to visually hide).\n *\n * @example\n * ```tsx\n * <Radio.Group>\n * <Radio.Legend className=\"sr-only\">Paths</Radio.Legend>\n * <Radio.Item label=\"Allow all paths\" value=\"all\" />\n * </Radio.Group>\n * ```\n */\nexport interface RadioLegendProps {\n /** Legend content */\n children: ReactNode;\n /** Additional CSS classes (e.g. \"sr-only\" to visually hide the legend) */\n className?: string;\n}\n\nexport interface RadioGroupProps {\n /**\n * Legend text for the group (required for accessibility).\n * For more control over legend styling, omit this prop and use `<Radio.Legend>` as a child instead.\n */\n legend?: string;\n /** Child Radio.Item components (and optionally a Radio.Legend) */\n children: ReactNode;\n /** Layout direction of the radio items */\n orientation?: \"vertical\" | \"horizontal\";\n /**\n * Visual appearance applied to all Radio.Item children.\n * - `\"default\"` — Standard inline radio items\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n *\n * Individual items can override this with their own `appearance` prop.\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n /** Error message for the group */\n error?: string;\n /** Helper text for the group */\n description?: ReactNode;\n /** Value of the radio that should be initially selected (uncontrolled) */\n defaultValue?: string;\n /** Value of the radio that should be selected (controlled) */\n value?: string;\n /** Event handler called when radio value changes */\n onValueChange?: (value: string) => void;\n /** Whether all radios in the group are disabled */\n disabled?: boolean;\n /** Position of radio control relative to label: \"start\" puts radio before label, \"end\" puts label before radio. Defaults to \"start\" for default appearance and \"end\" for card appearance. */\n controlPosition?: RadioControlPosition;\n /** Form submission name for the radio group */\n name?: string;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Individual radio item within a group\n *\n * @example\n * ```tsx\n * <Radio.Item label=\"Option A\" value=\"a\" />\n * ```\n *\n * @example\n * // Disabled item\n * ```tsx\n * <Radio.Item label=\"Unavailable\" value=\"unavailable\" disabled />\n * ```\n */\nexport type RadioItemProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures */\n variant?: RadioVariant;\n /**\n * Visual appearance of the radio item.\n * - `\"default\"` — Standard inline radio item\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n *\n * When set on an individual item, overrides the group-level `appearance`.\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n /** Label content displayed next to radio (required). Accepts strings or React nodes for rich content. */\n label: ReactNode;\n /** Description text displayed below the label (only visible in card appearance) */\n description?: ReactNode;\n /** Value of the radio (required) */\n value: string;\n /** Additional CSS classes for the label wrapper */\n className?: string;\n /** Whether the radio is disabled */\n disabled?: boolean;\n};\n\n// Radio.Item for use within Radio.Group\nconst RadioItem = forwardRef<HTMLButtonElement, RadioItemProps>(\n (\n {\n className,\n disabled,\n variant = \"default\",\n appearance: appearanceProp,\n label,\n description,\n value,\n },\n ref,\n ) => {\n const { controlPosition, appearance: groupAppearance } =\n useContext(RadioGroupContext);\n const appearance = appearanceProp ?? groupAppearance;\n const isCard = appearance === \"card\";\n\n // Fall back to an appearance-appropriate default when controlPosition is\n // not provided: card defaults to \"end\" (radio on the right), default\n // appearance defaults to \"start\" (radio on the left).\n const effectiveControlPosition: RadioControlPosition =\n controlPosition ?? (isCard ? \"end\" : \"start\");\n\n if (isCard) {\n const controlAtStart = effectiveControlPosition === \"start\";\n return (\n <label\n data-kumo-component=\"Radio\"\n data-kumo-part=\"item-label\"\n className={cn(\n \"m-0 group relative flex items-start gap-3 rounded-lg border border-kumo-hairline bg-kumo-base p-3 transition-colors has-[[data-checked]]:border-kumo-interact has-[[data-checked]]:bg-kumo-tint\",\n controlAtStart && \"flex-row-reverse\",\n variant === \"error\" &&\n \"border-kumo-danger has-[[data-checked]]:border-kumo-danger has-[[data-checked]]:bg-kumo-base\",\n disabled\n ? \"cursor-not-allowed opacity-50\"\n : cn(\n \"has-[[data-disabled]]:cursor-not-allowed has-[[data-disabled]]:opacity-50 cursor-pointer\",\n variant !== \"error\" &&\n \"hover:not-has-[[data-disabled]]:bg-kumo-tint\",\n ),\n className,\n )}\n >\n <div className=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n <span className=\"text-base font-medium text-kumo-default\">\n {label}\n </span>\n {description && (\n <span className=\"text-sm text-kumo-subtle\">{description}</span>\n )}\n </div>\n <BaseRadio.Root\n ref={ref}\n data-kumo-component=\"Radio\"\n data-kumo-part=\"item\"\n value={value}\n disabled={disabled}\n className={cn(\n \"relative mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring ring-2 focus:outline-none focus:ring-kumo-focus focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled &&\n variant !== \"error\" &&\n \"group-hover:ring-kumo-hairline focus-visible:outline-offset-3\",\n !disabled &&\n variant === \"error\" &&\n \"focus-visible:outline-offset-3\",\n \"data-[checked]:bg-kumo-contrast\",\n )}\n >\n <BaseRadio.Indicator\n keepMounted\n className=\"flex items-center justify-center\"\n >\n <span className=\"h-2 w-2 rounded-full bg-kumo-base\" />\n </BaseRadio.Indicator>\n </BaseRadio.Root>\n </label>\n );\n }\n\n return (\n <label\n data-kumo-component=\"Radio\"\n data-kumo-part=\"item-label\"\n className={cn(\n \"m-0 group relative inline-flex items-start gap-2\",\n // \"start\" (default): radio before label\n // \"end\": label before radio using flex-row-reverse\n effectiveControlPosition === \"end\" && \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\",\n className,\n )}\n >\n <BaseRadio.Root\n ref={ref}\n data-kumo-component=\"Radio\"\n data-kumo-part=\"item\"\n value={value}\n disabled={disabled}\n className={cn(\n \"relative mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring focus:outline-none after:absolute after:-inset-x-3 after:-inset-y-2\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled &&\n variant !== \"error\" &&\n \"group-hover:ring-kumo-hairline focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3\",\n !disabled &&\n variant === \"error\" &&\n \"focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3\",\n \"data-[checked]:bg-kumo-contrast\",\n )}\n >\n <BaseRadio.Indicator\n keepMounted\n className=\"flex items-center justify-center\"\n >\n <span className=\"h-2 w-2 rounded-full bg-kumo-base\" />\n </BaseRadio.Indicator>\n </BaseRadio.Root>\n <span className=\"text-base text-kumo-default\">{label}</span>\n </label>\n );\n },\n);\n\nRadioItem.displayName = \"Radio.Item\";\n\n// Radio.Legend — composable legend sub-component for Radio.Group\nfunction RadioLegend({ children, className }: RadioLegendProps) {\n return (\n <Fieldset.Legend\n className={cn(\"text-base font-medium text-kumo-default\", className)}\n >\n {children}\n </Fieldset.Legend>\n );\n}\n\nRadioLegend.displayName = \"Radio.Legend\";\n\n// Radio.Group with built-in Fieldset and RadioGroup\nfunction RadioGroup({\n legend,\n children,\n orientation = \"vertical\",\n appearance = \"default\",\n error,\n description,\n defaultValue,\n value,\n onValueChange,\n disabled,\n controlPosition,\n name,\n className,\n}: RadioGroupProps) {\n return (\n <RadioGroupContext.Provider value={{ controlPosition, appearance }}>\n <BaseRadioGroup\n defaultValue={defaultValue}\n value={value}\n onValueChange={(newValue) => onValueChange?.(newValue)}\n disabled={disabled}\n name={name}\n >\n <Fieldset.Root\n disabled={disabled}\n className={cn(\"flex flex-col gap-4\", className)}\n >\n {legend && (\n <Fieldset.Legend className=\"text-base font-medium text-kumo-default\">\n {legend}\n </Fieldset.Legend>\n )}\n <div\n className={cn(\n orientation === \"vertical\"\n ? cn(\"flex flex-col\", appearance === \"card\" ? \"gap-3\" : \"gap-2\")\n : appearance === \"card\"\n ? \"grid grid-cols-2 gap-3\"\n : \"flex flex-row flex-wrap gap-2\",\n )}\n >\n {children}\n </div>\n {error && <p className=\"text-sm text-kumo-danger\">{error}</p>}\n {description && (\n <p className=\"text-sm text-kumo-subtle\">{description}</p>\n )}\n </Fieldset.Root>\n </BaseRadioGroup>\n </RadioGroupContext.Provider>\n );\n}\n\nRadioGroup.displayName = \"Radio.Group\";\n\n// Export RadioGroup directly for external usage\nexport { RadioGroup };\n\n/**\n * Radio — radio button group for single-select choices.\n *\n * Compound component: `Radio.Group` (with built-in Fieldset), `Radio.Item`, and `Radio.Legend`.\n * Built on `@base-ui/react/radio-group` + `@base-ui/react/radio`.\n *\n * @example\n * ```tsx\n * // Simple: legend as a string prop\n * <Radio.Group legend=\"Notification preference\" defaultValue=\"email\">\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * <Radio.Item label=\"Push\" value=\"push\" />\n * </Radio.Group>\n *\n * // Composable: Radio.Legend for full styling control (e.g. visually hidden)\n * <Radio.Group defaultValue=\"email\">\n * <Radio.Legend className=\"sr-only\">Notification preference</Radio.Legend>\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * </Radio.Group>\n * ```\n */\nexport const Radio = Object.assign(RadioGroup, {\n Item: RadioItem,\n Group: RadioGroup,\n Legend: RadioLegend,\n});\n"],"names":["KUMO_RADIO_VARIANTS","KUMO_RADIO_DEFAULT_VARIANTS","radioVariants","variant","appearance","cn","resolveVariant","RadioGroupContext","createContext","RadioItem","forwardRef","className","disabled","appearanceProp","label","description","value","ref","controlPosition","groupAppearance","useContext","isCard","effectiveControlPosition","jsxs","jsx","BaseRadio.Root","BaseRadio.Indicator","RadioLegend","children","Fieldset.Legend","RadioGroup","legend","orientation","error","defaultValue","onValueChange","name","BaseRadioGroup","newValue","Fieldset.Root","Radio"],"mappings":"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"}