@cloudflare/kumo 2.2.2 → 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 (252) hide show
  1. package/CHANGELOG.md +95 -0
  2. package/ai/component-registry.json +194 -128
  3. package/ai/component-registry.md +412 -221
  4. package/ai/schemas.ts +8 -2
  5. package/dist/.build-complete +1 -1
  6. package/dist/ai/schemas.d.ts +58 -38
  7. package/dist/ai/schemas.d.ts.map +1 -1
  8. package/dist/ai/schemas.js +14 -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-mhrvtq4y5n21vr0t.js → autocomplete-cvp5fsdt6gh0p3vu.js} +86 -68
  13. package/dist/chunks/autocomplete-cvp5fsdt6gh0p3vu.js.map +1 -0
  14. package/dist/chunks/{badge-kqox9toi0sygfbno.js → badge-c1th6h6ahz7eu49q.js} +80 -19
  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-ohstavaqvycoremm.js → breadcrumbs-j214mimk5zj4ffp4.js} +8 -6
  19. package/dist/chunks/breadcrumbs-j214mimk5zj4ffp4.js.map +1 -0
  20. package/dist/chunks/{button-oevxukl0zmwoq4tb.js → button-mnrxu6dud2x5js5b.js} +19 -17
  21. package/dist/chunks/{button-oevxukl0zmwoq4tb.js.map → button-mnrxu6dud2x5js5b.js.map} +1 -1
  22. package/dist/chunks/{checkbox-h6vkv17lnq854z2c.js → checkbox-dqih8tzzt3vhp870.js} +25 -19
  23. package/dist/chunks/checkbox-dqih8tzzt3vhp870.js.map +1 -0
  24. package/dist/chunks/{clipboard-text-kyy71jmx7umdh8k8.js → clipboard-text-mrut8z3dt1w0efxz.js} +4 -4
  25. package/dist/chunks/{clipboard-text-kyy71jmx7umdh8k8.js.map → clipboard-text-mrut8z3dt1w0efxz.js.map} +1 -1
  26. package/dist/chunks/{collapsible-ej6p2bq758sw30nk.js → collapsible-nzqcf9zwnjkxqzr6.js} +21 -17
  27. package/dist/chunks/collapsible-nzqcf9zwnjkxqzr6.js.map +1 -0
  28. package/dist/chunks/{combobox-g3cudlfajecou4va.js → combobox-dpptfpcmqfrso1xa.js} +123 -111
  29. package/dist/chunks/combobox-dpptfpcmqfrso1xa.js.map +1 -0
  30. package/dist/chunks/{command-palette-eep807rf6iapoz8r.js → command-palette-fqhyacp33fhyf696.js} +12 -12
  31. package/dist/chunks/{command-palette-eep807rf6iapoz8r.js.map → command-palette-fqhyacp33fhyf696.js.map} +1 -1
  32. package/dist/chunks/dialog-my9fioafdstq50mi.js +134 -0
  33. package/dist/chunks/dialog-my9fioafdstq50mi.js.map +1 -0
  34. package/dist/chunks/{dropdown-cobpydatw4vlb3ov.js → dropdown-g4sb4cw9ffqaw5gx.js} +54 -44
  35. package/dist/chunks/dropdown-g4sb4cw9ffqaw5gx.js.map +1 -0
  36. package/dist/chunks/{empty-n3r7xutkb9sxjaso.js → empty-n17inn1z67bpohkw.js} +2 -2
  37. package/dist/chunks/{empty-n3r7xutkb9sxjaso.js.map → empty-n17inn1z67bpohkw.js.map} +1 -1
  38. package/dist/chunks/{field-l1oapopp6kjnephi.js → field-c8o7h3rlam4c9pcx.js} +3 -3
  39. package/dist/chunks/{field-l1oapopp6kjnephi.js.map → field-c8o7h3rlam4c9pcx.js.map} +1 -1
  40. package/dist/chunks/{input-area-gudamx1ruz8rxiw2.js → input-area-eurk3seud30ricwn.js} +4 -4
  41. package/dist/chunks/{input-area-gudamx1ruz8rxiw2.js.map → input-area-eurk3seud30ricwn.js.map} +1 -1
  42. package/dist/chunks/{input-i3os21puacqw4r75.js → input-en8hhb14mmt3tfwn.js} +3 -3
  43. package/dist/chunks/{input-i3os21puacqw4r75.js.map → input-en8hhb14mmt3tfwn.js.map} +1 -1
  44. package/dist/chunks/{input-group-gy08vju7eoogil8k.js → input-group-d09ocmjcbdai0gze.js} +70 -70
  45. package/dist/chunks/input-group-d09ocmjcbdai0gze.js.map +1 -0
  46. package/dist/chunks/{label-i0bj94d43irz0k1x.js → label-c8rz453pti66slki.js} +3 -3
  47. package/dist/chunks/{label-i0bj94d43irz0k1x.js.map → label-c8rz453pti66slki.js.map} +1 -1
  48. package/dist/chunks/{layer-card-hyz8lfxceudt05pv.js → layer-card-er4flkcxmzfug8jw.js} +2 -2
  49. package/dist/chunks/{layer-card-hyz8lfxceudt05pv.js.map → layer-card-er4flkcxmzfug8jw.js.map} +1 -1
  50. package/dist/chunks/{link-lkzjiitte3l29q87.js → link-i6vnwyjcwvjz5btm.js} +20 -19
  51. package/dist/chunks/{link-lkzjiitte3l29q87.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-jbxkh6gfggx1kjna.js → meter-d5igshkjqttl1fdj.js} +2 -2
  55. package/dist/chunks/{meter-jbxkh6gfggx1kjna.js.map → meter-d5igshkjqttl1fdj.js.map} +1 -1
  56. package/dist/chunks/{pagination-ceetno8sc1rd0wr2.js → pagination-bw7vwca4wrfjm8vb.js} +3 -3
  57. package/dist/chunks/{pagination-ceetno8sc1rd0wr2.js.map → pagination-bw7vwca4wrfjm8vb.js.map} +1 -1
  58. package/dist/chunks/{popover-i4opvl9g0as52fyx.js → popover-ozf1j7oi7pxiudyz.js} +4 -2
  59. package/dist/chunks/popover-ozf1j7oi7pxiudyz.js.map +1 -0
  60. package/dist/chunks/{radio-g56o5rftpu1qpxuv.js → radio-gpg6kmzonr2cayq1.js} +54 -46
  61. package/dist/chunks/radio-gpg6kmzonr2cayq1.js.map +1 -0
  62. package/dist/chunks/select-dw9iw35ug7yer3o3.js +237 -0
  63. package/dist/chunks/select-dw9iw35ug7yer3o3.js.map +1 -0
  64. package/dist/chunks/{sensitive-input-hokm527ollnz9dqc.js → sensitive-input-dgoxjtoxl4zqa51v.js} +101 -92
  65. package/dist/chunks/sensitive-input-dgoxjtoxl4zqa51v.js.map +1 -0
  66. package/dist/chunks/sidebar-hzio700cg85f7f31.js +1014 -0
  67. package/dist/chunks/sidebar-hzio700cg85f7f31.js.map +1 -0
  68. package/dist/chunks/{surface-ck1nt2uqfzmod4sz.js → surface-iyejjbqogjbo7ise.js} +2 -2
  69. package/dist/chunks/{surface-ck1nt2uqfzmod4sz.js.map → surface-iyejjbqogjbo7ise.js.map} +1 -1
  70. package/dist/chunks/{switch-fv0ttj24uhocvuh8.js → switch-g8f77h69h34xld06.js} +50 -45
  71. package/dist/chunks/switch-g8f77h69h34xld06.js.map +1 -0
  72. package/dist/chunks/{table-nsfcgpo93gfetrhh.js → table-e1te1im2tt2ez05y.js} +2 -2
  73. package/dist/chunks/{table-nsfcgpo93gfetrhh.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-g8ier5pehjpfxauf.js → tabs-hice1yy5q2t889z8.js} +6 -4
  77. package/dist/chunks/tabs-hice1yy5q2t889z8.js.map +1 -0
  78. package/dist/chunks/{toast-ofqlfmddcyka091n.js → toast-kvbgct0jvfmn4mas.js} +29 -27
  79. package/dist/chunks/{toast-ofqlfmddcyka091n.js.map → toast-kvbgct0jvfmn4mas.js.map} +1 -1
  80. package/dist/chunks/{tooltip-icvb67awe1zolz61.js → tooltip-ken77ixya0qpidie.js} +13 -13
  81. package/dist/chunks/{tooltip-icvb67awe1zolz61.js.map → tooltip-ken77ixya0qpidie.js.map} +1 -1
  82. package/dist/chunks/vendor-base-ui-knphx7dts1vm1x37.js +24710 -0
  83. package/dist/chunks/vendor-base-ui-knphx7dts1vm1x37.js.map +1 -0
  84. package/dist/chunks/{vendor-floating-ui-dwag5e88viikh2zs.js → vendor-floating-ui-c4mwmh0xmfzevy9l.js} +5 -5
  85. package/dist/chunks/{vendor-floating-ui-dwag5e88viikh2zs.js.map → vendor-floating-ui-c4mwmh0xmfzevy9l.js.map} +1 -1
  86. package/dist/chunks/vendor-utils-m5h2xu7s2rs3pgk5.js +217 -0
  87. package/dist/chunks/vendor-utils-m5h2xu7s2rs3pgk5.js.map +1 -0
  88. package/dist/code.js +1 -1
  89. package/dist/components/autocomplete.js +1 -1
  90. package/dist/components/badge.js +1 -1
  91. package/dist/components/banner.js +1 -1
  92. package/dist/components/breadcrumbs.js +1 -1
  93. package/dist/components/button.js +1 -1
  94. package/dist/components/chart.js +1 -1
  95. package/dist/components/checkbox.js +1 -1
  96. package/dist/components/clipboard-text.js +1 -1
  97. package/dist/components/collapsible.js +1 -1
  98. package/dist/components/combobox.js +1 -1
  99. package/dist/components/command-palette.js +1 -1
  100. package/dist/components/dialog.js +1 -1
  101. package/dist/components/dropdown.js +1 -1
  102. package/dist/components/empty.js +1 -1
  103. package/dist/components/field.js +1 -1
  104. package/dist/components/input-group.js +1 -1
  105. package/dist/components/input.js +3 -3
  106. package/dist/components/label.js +1 -1
  107. package/dist/components/layer-card.js +1 -1
  108. package/dist/components/link.js +1 -1
  109. package/dist/components/menubar.js +1 -1
  110. package/dist/components/meter.js +1 -1
  111. package/dist/components/pagination.js +1 -1
  112. package/dist/components/popover.js +1 -1
  113. package/dist/components/radio.js +1 -1
  114. package/dist/components/select.js +1 -1
  115. package/dist/components/sensitive-input.js +1 -1
  116. package/dist/components/sidebar.js +22 -23
  117. package/dist/components/surface.js +1 -1
  118. package/dist/components/switch.js +1 -1
  119. package/dist/components/table-of-contents.js +1 -1
  120. package/dist/components/table.js +1 -1
  121. package/dist/components/tabs.js +1 -1
  122. package/dist/components/toast.js +2 -2
  123. package/dist/components/tooltip.js +1 -1
  124. package/dist/index.js +122 -123
  125. package/dist/primitives/accordion.js +1 -1
  126. package/dist/primitives/alert-dialog.js +1 -1
  127. package/dist/primitives/autocomplete.js +1 -1
  128. package/dist/primitives/avatar.js +1 -1
  129. package/dist/primitives/button.js +1 -1
  130. package/dist/primitives/checkbox-group.js +1 -1
  131. package/dist/primitives/checkbox.js +1 -1
  132. package/dist/primitives/collapsible.js +1 -1
  133. package/dist/primitives/combobox.js +1 -1
  134. package/dist/primitives/context-menu.js +1 -1
  135. package/dist/primitives/csp-provider.js +1 -1
  136. package/dist/primitives/dialog.js +1 -1
  137. package/dist/primitives/direction-provider.js +1 -1
  138. package/dist/primitives/drawer.js +1 -1
  139. package/dist/primitives/field.js +1 -1
  140. package/dist/primitives/fieldset.js +1 -1
  141. package/dist/primitives/form.js +1 -1
  142. package/dist/primitives/input.js +1 -1
  143. package/dist/primitives/menu.js +1 -1
  144. package/dist/primitives/menubar.js +1 -1
  145. package/dist/primitives/meter.js +1 -1
  146. package/dist/primitives/navigation-menu.js +1 -1
  147. package/dist/primitives/number-field.js +1 -1
  148. package/dist/primitives/otp-field.js +1 -1
  149. package/dist/primitives/popover.js +1 -1
  150. package/dist/primitives/preview-card.js +1 -1
  151. package/dist/primitives/progress.js +1 -1
  152. package/dist/primitives/radio-group.js +1 -1
  153. package/dist/primitives/radio.js +1 -1
  154. package/dist/primitives/scroll-area.js +1 -1
  155. package/dist/primitives/select.js +1 -1
  156. package/dist/primitives/separator.js +1 -1
  157. package/dist/primitives/slider.js +1 -1
  158. package/dist/primitives/switch.js +1 -1
  159. package/dist/primitives/tabs.js +1 -1
  160. package/dist/primitives/toast.js +1 -1
  161. package/dist/primitives/toggle-group.js +1 -1
  162. package/dist/primitives/toggle.js +1 -1
  163. package/dist/primitives/toolbar.js +1 -1
  164. package/dist/primitives/tooltip.js +1 -1
  165. package/dist/primitives.js +1 -1
  166. package/dist/scripts/theme-generator/config.d.ts.map +1 -1
  167. package/dist/scripts/theme-generator/config.js +37 -39
  168. package/dist/scripts/theme-generator/config.js.map +1 -1
  169. package/dist/scripts/theme-generator/generate-css.d.ts.map +1 -1
  170. package/dist/scripts/theme-generator/types.d.ts +8 -2
  171. package/dist/scripts/theme-generator/types.d.ts.map +1 -1
  172. package/dist/src/components/autocomplete/autocomplete.d.ts +1 -0
  173. package/dist/src/components/autocomplete/autocomplete.d.ts.map +1 -1
  174. package/dist/src/components/autocomplete/index.d.ts +1 -0
  175. package/dist/src/components/autocomplete/index.d.ts.map +1 -1
  176. package/dist/src/components/badge/badge.d.ts +51 -3
  177. package/dist/src/components/badge/badge.d.ts.map +1 -1
  178. package/dist/src/components/banner/banner.d.ts +14 -7
  179. package/dist/src/components/banner/banner.d.ts.map +1 -1
  180. package/dist/src/components/breadcrumbs/breadcrumbs.d.ts.map +1 -1
  181. package/dist/src/components/button/button.d.ts.map +1 -1
  182. package/dist/src/components/chart/SankeyChart.d.ts +6 -1
  183. package/dist/src/components/chart/SankeyChart.d.ts.map +1 -1
  184. package/dist/src/components/chart/TimeseriesChart.d.ts +43 -1
  185. package/dist/src/components/chart/TimeseriesChart.d.ts.map +1 -1
  186. package/dist/src/components/checkbox/checkbox.d.ts.map +1 -1
  187. package/dist/src/components/collapsible/collapsible.d.ts.map +1 -1
  188. package/dist/src/components/combobox/combobox.d.ts +1 -0
  189. package/dist/src/components/combobox/combobox.d.ts.map +1 -1
  190. package/dist/src/components/combobox/index.d.ts +1 -0
  191. package/dist/src/components/combobox/index.d.ts.map +1 -1
  192. package/dist/src/components/dialog/dialog.d.ts +11 -4
  193. package/dist/src/components/dialog/dialog.d.ts.map +1 -1
  194. package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
  195. package/dist/src/components/input-group/input-group-button.d.ts.map +1 -1
  196. package/dist/src/components/input-group/input-group-input.d.ts.map +1 -1
  197. package/dist/src/components/input-group/input-group.d.ts.map +1 -1
  198. package/dist/src/components/link/link.d.ts.map +1 -1
  199. package/dist/src/components/menubar/menubar.d.ts.map +1 -1
  200. package/dist/src/components/popover/popover.d.ts.map +1 -1
  201. package/dist/src/components/radio/radio.d.ts.map +1 -1
  202. package/dist/src/components/select/select.d.ts.map +1 -1
  203. package/dist/src/components/sensitive-input/sensitive-input.d.ts.map +1 -1
  204. package/dist/src/components/sidebar/index.d.ts +1 -1
  205. package/dist/src/components/sidebar/index.d.ts.map +1 -1
  206. package/dist/src/components/sidebar/sidebar.d.ts +159 -146
  207. package/dist/src/components/sidebar/sidebar.d.ts.map +1 -1
  208. package/dist/src/components/switch/switch.d.ts.map +1 -1
  209. package/dist/src/components/table-of-contents/table-of-contents.d.ts.map +1 -1
  210. package/dist/src/components/tabs/tabs.d.ts.map +1 -1
  211. package/dist/src/components/toast/toast.d.ts.map +1 -1
  212. package/dist/src/index.d.ts +1 -1
  213. package/dist/src/index.d.ts.map +1 -1
  214. package/dist/styles/kumo-binding.css +0 -18
  215. package/dist/styles/kumo-standalone.css +1 -1
  216. package/dist/styles/kumo.css +37 -0
  217. package/dist/styles/theme-kumo.css +30 -37
  218. package/package.json +5 -2
  219. package/scripts/generate-primitives.ts +6 -1
  220. package/scripts/theme-generator/config.ts +38 -40
  221. package/scripts/theme-generator/generate-css.ts +4 -1
  222. package/scripts/theme-generator/types.ts +8 -2
  223. package/dist/chunks/SankeyChart-dkq90770ad7hgzx3.js +0 -635
  224. package/dist/chunks/SankeyChart-dkq90770ad7hgzx3.js.map +0 -1
  225. package/dist/chunks/autocomplete-mhrvtq4y5n21vr0t.js.map +0 -1
  226. package/dist/chunks/badge-kqox9toi0sygfbno.js.map +0 -1
  227. package/dist/chunks/banner-ip2lm8r87hich557.js +0 -88
  228. package/dist/chunks/banner-ip2lm8r87hich557.js.map +0 -1
  229. package/dist/chunks/breadcrumbs-ohstavaqvycoremm.js.map +0 -1
  230. package/dist/chunks/checkbox-h6vkv17lnq854z2c.js.map +0 -1
  231. package/dist/chunks/collapsible-ej6p2bq758sw30nk.js.map +0 -1
  232. package/dist/chunks/combobox-g3cudlfajecou4va.js.map +0 -1
  233. package/dist/chunks/dialog-fo3qhv9fgiadq5gp.js +0 -115
  234. package/dist/chunks/dialog-fo3qhv9fgiadq5gp.js.map +0 -1
  235. package/dist/chunks/dropdown-cobpydatw4vlb3ov.js.map +0 -1
  236. package/dist/chunks/input-group-gy08vju7eoogil8k.js.map +0 -1
  237. package/dist/chunks/menubar-jalggrag4utvdpey.js +0 -96
  238. package/dist/chunks/menubar-jalggrag4utvdpey.js.map +0 -1
  239. package/dist/chunks/popover-i4opvl9g0as52fyx.js.map +0 -1
  240. package/dist/chunks/radio-g56o5rftpu1qpxuv.js.map +0 -1
  241. package/dist/chunks/select-g1xvti1k1hj7xe5t.js +0 -226
  242. package/dist/chunks/select-g1xvti1k1hj7xe5t.js.map +0 -1
  243. package/dist/chunks/sensitive-input-hokm527ollnz9dqc.js.map +0 -1
  244. package/dist/chunks/sidebar-oan40ylmqkyui21w.js +0 -875
  245. package/dist/chunks/sidebar-oan40ylmqkyui21w.js.map +0 -1
  246. package/dist/chunks/switch-fv0ttj24uhocvuh8.js.map +0 -1
  247. package/dist/chunks/table-of-contents-fzyv7uhnnyr13dqu.js.map +0 -1
  248. package/dist/chunks/tabs-g8ier5pehjpfxauf.js.map +0 -1
  249. package/dist/chunks/vendor-base-ui-nbyiqqi138hcoz52.js +0 -24639
  250. package/dist/chunks/vendor-base-ui-nbyiqqi138hcoz52.js.map +0 -1
  251. package/dist/chunks/vendor-utils-ixnhxmehwihk5tr7.js +0 -534
  252. package/dist/chunks/vendor-utils-ixnhxmehwihk5tr7.js.map +0 -1
@@ -1,115 +0,0 @@
1
- "use client";
2
- import { jsx as t, jsxs as R } from "react/jsx-runtime";
3
- import { createContext as b, useContext as N } from "react";
4
- import { L as P } from "./layer-card-hyz8lfxceudt05pv.js";
5
- import { c as D } from "./cn-ct4n7r74mh8y0f48.js";
6
- import { r as A } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
7
- import { u as k } from "./portal-provider-hwmkdmkpvct0cb76.js";
8
- import { ap as h, aq as z, ar as n, as as c, at as g, au as d, av as p, aw as m, ax as u } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
9
- const L = {
10
- size: {
11
- base: {
12
- classes: "sm:min-w-96",
13
- description: "Default dialog width"
14
- },
15
- sm: {
16
- classes: "min-w-72",
17
- description: "Small dialog for simple confirmations"
18
- },
19
- lg: {
20
- classes: "min-w-[32rem]",
21
- description: "Large dialog for complex content"
22
- },
23
- xl: {
24
- classes: "min-w-[48rem]",
25
- description: "Extra large dialog for detailed views"
26
- }
27
- }
28
- }, r = {
29
- size: "base",
30
- role: "dialog"
31
- }, f = b("dialog");
32
- function s() {
33
- return N(f);
34
- }
35
- function O({
36
- size: a = r.size
37
- } = {}) {
38
- return D(
39
- // Base styles
40
- "shadow-m ring ring-kumo-line fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0",
41
- // Apply size from KUMO_DIALOG_VARIANTS
42
- A(L.size, a, r.size).classes
43
- );
44
- }
45
- function _({
46
- className: a,
47
- children: o,
48
- style: i,
49
- size: e = r.size,
50
- container: C
51
- }) {
52
- const l = s(), v = k();
53
- return /* @__PURE__ */ R(l === "alertdialog" ? p : p, { container: C ?? v ?? void 0, children: [
54
- /* @__PURE__ */ t(l === "alertdialog" ? m : m, { className: "fixed inset-0 bg-kumo-recessed opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0" }),
55
- /* @__PURE__ */ t(
56
- P,
57
- {
58
- render: /* @__PURE__ */ t(l === "alertdialog" ? u : u, {}),
59
- className: D(O({ size: e }), a),
60
- style: {
61
- transitionProperty: "scale, opacity",
62
- transitionTimingFunction: "var(--default-transition-timing-function)",
63
- "--tw-shadow": "0 20px 25px -5px rgb(0 0 0 / 0.03), 0 8px 10px -6px rgb(0 0 0 / 0.03)",
64
- ...i
65
- },
66
- children: o
67
- }
68
- )
69
- ] });
70
- }
71
- function x({
72
- children: a,
73
- role: o = r.role,
74
- ...i
75
- }) {
76
- const e = o === "alertdialog" ? h : z;
77
- return /* @__PURE__ */ t(f.Provider, { value: o, children: /* @__PURE__ */ t(e, { ...i, children: a }) });
78
- }
79
- x.displayName = "Dialog.Root";
80
- function y({ children: a, ...o }) {
81
- const e = s() === "alertdialog" ? n : n;
82
- return /* @__PURE__ */ t(e, { ...o, children: a });
83
- }
84
- y.displayName = "Dialog.Trigger";
85
- function w({ className: a, ...o }) {
86
- const e = s() === "alertdialog" ? c : c;
87
- return /* @__PURE__ */ t(e, { className: a, ...o });
88
- }
89
- w.displayName = "Dialog.Title";
90
- function B({ className: a, ...o }) {
91
- const e = s() === "alertdialog" ? g : g;
92
- return /* @__PURE__ */ t(e, { className: a, ...o });
93
- }
94
- B.displayName = "Dialog.Description";
95
- function T({ children: a, ...o }) {
96
- const e = s() === "alertdialog" ? d : d;
97
- return /* @__PURE__ */ t(e, { ...o, children: a });
98
- }
99
- T.displayName = "Dialog.Close";
100
- const q = Object.assign(_, {
101
- Root: x,
102
- Trigger: y,
103
- Title: w,
104
- Description: B,
105
- Close: T
106
- });
107
- export {
108
- q as D,
109
- x as a,
110
- y as b,
111
- w as c,
112
- B as d,
113
- T as e
114
- };
115
- //# sourceMappingURL=dialog-fo3qhv9fgiadq5gp.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-fo3qhv9fgiadq5gp.js","sources":["../../src/components/dialog/dialog.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type ReactNode,\n} from \"react\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\nimport { AlertDialog as AlertDialogBase } from \"@base-ui/react/alert-dialog\";\nimport { LayerCard } from \"../layer-card\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Dialog size variant definitions mapping sizes to their minimum widths. */\nexport const KUMO_DIALOG_VARIANTS = {\n size: {\n base: {\n classes: \"sm:min-w-96\",\n description: \"Default dialog width\",\n },\n sm: {\n classes: \"min-w-72\",\n description: \"Small dialog for simple confirmations\",\n },\n lg: {\n classes: \"min-w-[32rem]\",\n description: \"Large dialog for complex content\",\n },\n xl: {\n classes: \"min-w-[48rem]\",\n description: \"Extra large dialog for detailed views\",\n },\n },\n role: {\n dialog: {\n classes: \"\",\n description: \"Standard dialog for general-purpose modals\",\n },\n alertdialog: {\n classes: \"\",\n description:\n \"Alert dialog for confirmation flows requiring explicit user acknowledgment\",\n },\n },\n} as const;\n\nexport const KUMO_DIALOG_DEFAULT_VARIANTS = {\n size: \"base\",\n role: \"dialog\",\n} as const;\n\nexport const KUMO_DIALOG_STYLING = {\n dimensions: {\n sm: {\n width: 350,\n titleSize: 20,\n descSize: 16,\n padding: 16,\n gap: 8,\n buttonSize: \"sm\",\n },\n base: {\n width: 384,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n lg: {\n width: 512,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n xl: {\n width: 768,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n },\n baseTokens: {\n background: \"color-surface\",\n text: \"text-color-surface\",\n borderRadius: 12,\n shadow: \"shadow-m\",\n },\n backdrop: {\n background: \"color-surface-secondary\",\n opacity: 0.8,\n },\n header: {\n title: { fontWeight: 600, color: \"text-color-surface\" },\n closeIcon: { name: \"ph-x\", size: 20, color: \"text-color-muted\" },\n },\n description: {\n fontWeight: 400,\n color: \"text-color-muted\",\n },\n buttons: {\n primary: { background: \"color-primary\", text: \"white\" },\n secondary: { ring: \"color-border\", text: \"text-color-surface\" },\n },\n} as const;\n\n// Derived types from KUMO_DIALOG_VARIANTS\nexport type KumoDialogSize = keyof typeof KUMO_DIALOG_VARIANTS.size;\nexport type KumoDialogRole = keyof typeof KUMO_DIALOG_VARIANTS.role;\n\nexport interface KumoDialogVariantsProps {\n /**\n * Dialog width.\n * - `\"sm\"` — Small (min 288px) for simple confirmations\n * - `\"base\"` — Default (min 384px)\n * - `\"lg\"` — Large (min 512px) for complex content\n * - `\"xl\"` — Extra large (min 768px) for detailed views\n * @default \"base\"\n */\n size?: KumoDialogSize;\n}\n\n// ============================================================================\n// Dialog Role Context\n// ============================================================================\n\nconst DialogRoleContext = createContext<KumoDialogRole>(\"dialog\");\n\nfunction useDialogRole() {\n return useContext(DialogRoleContext);\n}\n\nexport function dialogVariants({\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: KumoDialogVariantsProps = {}) {\n return cn(\n // Base styles\n \"shadow-m ring ring-kumo-line fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0\",\n // Apply size from KUMO_DIALOG_VARIANTS\n resolveVariant(KUMO_DIALOG_VARIANTS.size, size, KUMO_DIALOG_DEFAULT_VARIANTS.size).classes,\n );\n}\n\n/**\n * Dialog component props — the modal content panel.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Open</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Confirm Action</Dialog.Title>\n * <Dialog.Description>Are you sure?</Dialog.Description>\n * <Dialog.Close render={(p) => <Button {...p}>Cancel</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nexport type DialogProps = KumoDialogVariantsProps & {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Dialog content (typically Title, Description, Close, and action buttons). */\n children: ReactNode;\n /** Inline styles. */\n style?: CSSProperties;\n /**\n * Container element for the portal. Use this to render the dialog 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\n/**\n * Modal dialog overlay with backdrop. Compound component with `Dialog.Root`,\n * `Dialog.Trigger`, `Dialog.Title`, `Dialog.Description`, and `Dialog.Close`.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Delete</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Item</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n *\n * @example Alert Dialog for destructive actions\n * ```tsx\n * <Dialog.Root role=\"alertdialog\">\n * <Dialog.Trigger render={(p) => <Button variant=\"destructive\" {...p}>Delete Project</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Project?</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"secondary\" {...p}>Cancel</Button>} />\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nfunction DialogContent({\n className,\n children,\n style,\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n container: containerProp,\n}: DialogProps) {\n const role = useDialogRole();\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n const BasePortal =\n role === \"alertdialog\" ? AlertDialogBase.Portal : DialogBase.Portal;\n const BaseBackdrop =\n role === \"alertdialog\" ? AlertDialogBase.Backdrop : DialogBase.Backdrop;\n const BasePopup =\n role === \"alertdialog\" ? AlertDialogBase.Popup : DialogBase.Popup;\n\n return (\n <BasePortal container={container}>\n <BaseBackdrop className=\"fixed inset-0 bg-kumo-recessed opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0\" />\n <LayerCard\n render={<BasePopup />}\n className={cn(dialogVariants({ size }), className)}\n style={\n {\n transitionProperty: \"scale, opacity\",\n transitionTimingFunction:\n \"var(--default-transition-timing-function)\",\n \"--tw-shadow\":\n \"0 20px 25px -5px rgb(0 0 0 / 0.03), 0 8px 10px -6px rgb(0 0 0 / 0.03)\",\n ...style,\n } as CSSProperties\n }\n >\n {children}\n </LayerCard>\n </BasePortal>\n );\n}\n\n// ============================================================================\n// Dialog Root\n// ============================================================================\n\ntype BaseDialogRootProps = ComponentPropsWithoutRef<typeof DialogBase.Root>;\n\nexport type DialogRootProps = BaseDialogRootProps & {\n /**\n * The ARIA role for the dialog.\n * - `\"dialog\"` — Standard dialog for general-purpose modals. Dismissible via outside click by default.\n * - `\"alertdialog\"` — Alert dialog for destructive or confirmation flows. Not dismissible via outside click.\n *\n * Use `role=\"alertdialog\"` for:\n * - Destructive actions (delete, discard, remove)\n * - Confirmation dialogs requiring explicit user acknowledgment\n * - Actions that cannot be undone\n *\n * @default \"dialog\"\n */\n role?: KumoDialogRole;\n};\n\nfunction DialogRoot({\n children,\n role = KUMO_DIALOG_DEFAULT_VARIANTS.role,\n ...props\n}: DialogRootProps) {\n const BaseRoot =\n role === \"alertdialog\" ? AlertDialogBase.Root : DialogBase.Root;\n return (\n <DialogRoleContext.Provider value={role}>\n <BaseRoot {...props}>{children}</BaseRoot>\n </DialogRoleContext.Provider>\n );\n}\n\nDialogRoot.displayName = \"Dialog.Root\";\n\n// ============================================================================\n// Dialog Trigger\n// ============================================================================\n\ntype BaseDialogTriggerProps = ComponentPropsWithoutRef<\n typeof DialogBase.Trigger\n>;\n\nexport type DialogTriggerProps = BaseDialogTriggerProps;\n\nfunction DialogTrigger({ children, ...props }: DialogTriggerProps) {\n const role = useDialogRole();\n const BaseTrigger =\n role === \"alertdialog\" ? AlertDialogBase.Trigger : DialogBase.Trigger;\n return <BaseTrigger {...props}>{children}</BaseTrigger>;\n}\n\nDialogTrigger.displayName = \"Dialog.Trigger\";\n\n// ============================================================================\n// Dialog Title\n// ============================================================================\n\ntype BaseDialogTitleProps = ComponentPropsWithoutRef<typeof DialogBase.Title>;\n\nexport type DialogTitleProps = BaseDialogTitleProps;\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n const role = useDialogRole();\n const BaseTitle =\n role === \"alertdialog\" ? AlertDialogBase.Title : DialogBase.Title;\n return <BaseTitle className={className} {...props} />;\n}\n\nDialogTitle.displayName = \"Dialog.Title\";\n\n// ============================================================================\n// Dialog Description\n// ============================================================================\n\ntype BaseDialogDescriptionProps = ComponentPropsWithoutRef<\n typeof DialogBase.Description\n>;\n\nexport type DialogDescriptionProps = BaseDialogDescriptionProps;\n\nfunction DialogDescription({ className, ...props }: DialogDescriptionProps) {\n const role = useDialogRole();\n const BaseDescription =\n role === \"alertdialog\"\n ? AlertDialogBase.Description\n : DialogBase.Description;\n return <BaseDescription className={className} {...props} />;\n}\n\nDialogDescription.displayName = \"Dialog.Description\";\n\n// ============================================================================\n// Dialog Close\n// ============================================================================\n\ntype BaseDialogCloseProps = ComponentPropsWithoutRef<typeof DialogBase.Close>;\n\nexport type DialogCloseProps = BaseDialogCloseProps;\n\nfunction DialogClose({ children, ...props }: DialogCloseProps) {\n const role = useDialogRole();\n const BaseClose =\n role === \"alertdialog\" ? AlertDialogBase.Close : DialogBase.Close;\n return <BaseClose {...props}>{children}</BaseClose>;\n}\n\nDialogClose.displayName = \"Dialog.Close\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nconst Dialog = Object.assign(DialogContent, {\n Root: DialogRoot,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n});\n\nexport {\n Dialog,\n DialogRoot,\n DialogTrigger,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"names":["KUMO_DIALOG_VARIANTS","KUMO_DIALOG_DEFAULT_VARIANTS","DialogRoleContext","createContext","useDialogRole","useContext","dialogVariants","size","cn","resolveVariant","DialogContent","className","children","style","containerProp","role","contextContainer","usePortalContainer","jsxs","AlertDialogBase.Portal","DialogBase.Portal","jsx","AlertDialogBase.Backdrop","DialogBase.Backdrop","LayerCard","AlertDialogBase.Popup","DialogBase.Popup","DialogRoot","props","BaseRoot","AlertDialogBase.Root","DialogBase.Root","DialogTrigger","BaseTrigger","AlertDialogBase.Trigger","DialogBase.Trigger","DialogTitle","BaseTitle","AlertDialogBase.Title","DialogBase.Title","DialogDescription","BaseDescription","AlertDialogBase.Description","DialogBase.Description","DialogClose","BaseClose","AlertDialogBase.Close","DialogBase.Close","Dialog"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-cobpydatw4vlb3ov.js","sources":["../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import { Menu as DropdownMenuPrimitive } from \"@base-ui/react/menu\";\nimport * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\nimport {\n CaretRightIcon as CaretRight,\n CheckIcon,\n CheckIcon as Check,\n type Icon,\n} from \"@phosphor-icons/react\";\n\n/** Dropdown item variant definitions (default and danger styles). */\nexport const KUMO_DROPDOWN_VARIANTS = {\n variant: {\n default: {\n classes: \"\",\n description: \"Default dropdown item appearance\",\n },\n danger: {\n classes:\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n description: \"Destructive action item\",\n },\n },\n} as const;\n\nexport const KUMO_DROPDOWN_DEFAULT_VARIANTS = {\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_DROPDOWN_VARIANTS\nexport type KumoDropdownVariant = keyof typeof KUMO_DROPDOWN_VARIANTS.variant;\n\nexport interface KumoDropdownVariantsProps {\n /**\n * Visual style of the dropdown item.\n * - `\"default\"` — Standard item appearance\n * - `\"danger\"` — Destructive action with red text\n * @default \"default\"\n */\n variant?: KumoDropdownVariant;\n}\n\nexport function dropdownVariants({\n variant = KUMO_DROPDOWN_DEFAULT_VARIANTS.variant,\n}: KumoDropdownVariantsProps = {}) {\n return cn(resolveVariant(KUMO_DROPDOWN_VARIANTS.variant, variant, KUMO_DROPDOWN_DEFAULT_VARIANTS.variant).classes);\n}\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubmenuTrigger\n > & {\n inset?: boolean;\n icon?: Icon;\n }\n>(({ className, inset, children, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.SubmenuTrigger\n ref={ref}\n className={cn(\n \"flex cursor-default items-center rounded-sm text-base outline-hidden select-none\", // base styles\n \"px-2 py-1.5\", // spacing\n \"focus:bg-kumo-tint focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand\", // focus state\n \"data-[state=open]:bg-kumo-tint\", // open state\n inset && \"pl-8\", // conditional inset\n className,\n )}\n {...props}\n >\n {IconComponent && <IconComponent className=\"mr-2 h-4 w-4\" />}\n {children}\n <CaretRight className=\"ml-auto h-4 w-4\" />\n </DropdownMenuPrimitive.SubmenuTrigger>\n));\n\nDropdownMenuSubTrigger.displayName =\n DropdownMenuPrimitive.SubmenuTrigger.displayName;\n\nconst DropdownMenuContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Positioner>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Positioner> & {\n /**\n * Container element for the portal. Use this to render the dropdown 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>(\n (\n { className, sideOffset = 8, children, container: containerProp, ...props },\n ref,\n ) => {\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n return (\n <DropdownMenuPrimitive.Portal container={container}>\n <DropdownMenuPrimitive.Positioner\n ref={ref}\n sideOffset={sideOffset}\n {...props}\n >\n <DropdownMenuPrimitive.Popup\n className={cn(\n \"overflow-hidden bg-kumo-control text-kumo-default\", // background\n \"rounded-lg shadow-lg ring ring-kumo-line\", // border part\n \"min-w-36 p-1.5\", // spacing\n \"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\", // open animation\n \"data-[side=bottom]:slide-in-from-top-2\", // bottom side animation\n \"data-[side=left]:slide-in-from-right-2\", // left side animation\n \"data-[side=right]:slide-in-from-left-2\", // right side animation\n \"data-[side=top]:slide-in-from-bottom-2\", // top side animation\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\", // close animation\n className,\n )}\n >\n {children}\n </DropdownMenuPrimitive.Popup>\n </DropdownMenuPrimitive.Positioner>\n </DropdownMenuPrimitive.Portal>\n );\n },\n);\n\nconst renderIconNode = (IconComponent?: Icon | React.ReactNode) => {\n if (!IconComponent) return null;\n if (React.isValidElement(IconComponent)) return IconComponent;\n const Comp = IconComponent as React.ComponentType<Record<string, unknown>>;\n return <Comp className=\"mr-2 h-4 w-4\" />;\n};\n\n/**\n * DropdownMenuItem — a single actionable item within a dropdown menu.\n *\n * For navigation links, use `DropdownMenu.LinkItem` instead.\n *\n * @example\n * ```tsx\n * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n * <DropdownMenu.Item icon={CopyIcon}>Duplicate</DropdownMenu.Item>\n * <DropdownMenu.Item variant=\"danger\">Delete</DropdownMenu.Item>\n * ```\n */\nconst DropdownMenuItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n selected?: boolean;\n /**\n * @deprecated Use `DropdownMenu.LinkItem` instead for navigation links.\n * This prop will be removed in a future major version.\n */\n href?: string;\n variant?: \"default\" | \"danger\";\n }\n>(\n (\n {\n className,\n inset,\n icon: IconComponent,\n children,\n selected,\n render,\n href,\n variant = \"default\",\n ...props\n },\n ref,\n ) => {\n const LinkComponent = useLinkComponent();\n\n // Build the inner content with icon, children, and selected indicator\n const innerContent = React.useMemo(\n () => (\n <>\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n {selected && (\n <span className=\"inline-flex\">\n <Check />\n </span>\n )}\n </>\n ),\n [IconComponent, children, selected],\n );\n\n // Legacy href support (deprecated)\n const linkContent = React.useMemo(() => {\n if (!href) return undefined;\n\n // Matches http://, https://, or protocol-relative //\n const isExternal = /^(https?:)?\\/\\//.test(href);\n const styles = cn(\n \"flex items-center\",\n variant === \"danger\" &&\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n );\n if (isExternal) {\n return (\n <a\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n target=\"_blank\"\n rel=\"noreferrer\"\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </a>\n );\n }\n return (\n <LinkComponent\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n to={href}\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </LinkComponent>\n );\n }, [href, innerContent, variant, LinkComponent]);\n\n // When href is provided, use linkContent as render prop\n // When render prop is provided, caller controls children rendering\n const useRenderProp = href || render;\n\n return (\n <DropdownMenuPrimitive.Item\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay\",\n inset && \"pl-8\",\n dropdownVariants({ variant }),\n className,\n )}\n render={href ? linkContent : render}\n {...props}\n >\n {useRenderProp ? undefined : innerContent}\n </DropdownMenuPrimitive.Item>\n );\n },\n);\n\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\n/**\n * DropdownMenuLinkItem — a menu item that navigates to a URL.\n *\n * Use this instead of `DropdownMenu.Item` with `href` for navigation links.\n * Provides full control over link attributes like `target` and `rel`.\n *\n * @example\n * ```tsx\n * // External link\n * <DropdownMenu.LinkItem href=\"https://example.com\" target=\"_blank\">\n * Documentation\n * </DropdownMenu.LinkItem>\n *\n * // Internal link\n * <DropdownMenu.LinkItem href=\"/settings\">\n * Settings\n * </DropdownMenu.LinkItem>\n *\n * // With icon\n * <DropdownMenu.LinkItem href=\"/profile\" icon={UserIcon}>\n * Profile\n * </DropdownMenu.LinkItem>\n * ```\n */\nconst DropdownMenuLinkItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.LinkItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.LinkItem> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n variant?: \"default\" | \"danger\";\n }\n>(\n (\n {\n className,\n inset,\n icon: IconComponent,\n children,\n variant = \"default\",\n ...props\n },\n ref,\n ) => {\n return (\n <DropdownMenuPrimitive.LinkItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none\",\n \"focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay\",\n \"text-inherit no-underline\",\n inset && \"pl-8\",\n dropdownVariants({ variant }),\n className,\n )}\n {...props}\n >\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n </DropdownMenuPrimitive.LinkItem>\n );\n },\n);\n\nDropdownMenuLinkItem.displayName = \"DropdownMenuLinkItem\";\n\nconst DropdownMenuCheckboxItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n <DropdownMenuPrimitive.CheckboxItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-base outline-hidden transition-colors select-none focus:bg-kumo-tint focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand data-disabled:pointer-events-none data-disabled:opacity-50\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <DropdownMenuPrimitive.CheckboxItemIndicator className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit\">\n <CheckIcon weight=\"bold\" size={12} />\n </DropdownMenuPrimitive.CheckboxItemIndicator>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName =\n DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuLabel = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.GroupLabel>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.GroupLabel> & {\n inset?: boolean;\n }\n>(({ className, inset, ...props }, ref) => (\n <DropdownMenuPrimitive.GroupLabel\n ref={ref}\n className={cn(\n \"px-2 py-1.5 text-base font-semibold\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n />\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.GroupLabel.displayName;\n\nconst DropdownMenuSeparator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.Separator\n ref={ref}\n className={cn(\"-mx-1 my-1 h-px bg-kumo-hairline\", className)}\n {...props}\n />\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={cn(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n {...props}\n />\n );\n};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nconst DropdownMenuRadioItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n }\n>(({ className, children, inset, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none\",\n \"data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-tint\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n >\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n </DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = \"DropdownMenuRadioItem\";\n\nconst DropdownMenuRadioItemIndicator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItemIndicator>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.RadioItemIndicator\n >\n>(({ className, children, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItemIndicator\n ref={ref}\n className={cn(\"ml-auto\", className)}\n {...props}\n >\n {children ?? <Check className=\"h-4 w-4\" />}\n </DropdownMenuPrimitive.RadioItemIndicator>\n));\nDropdownMenuRadioItemIndicator.displayName = \"DropdownMenuRadioItemIndicator\";\n\n/**\n * Custom Trigger that converts a single child element to the `render` prop\n * to avoid nested button issues with base-ui's Menu.Trigger.\n *\n * When an explicit `render` prop is provided, children are passed through\n * to the rendered element.\n */\nconst DropdownMenuTrigger = React.forwardRef<\n HTMLButtonElement,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger>\n>(({ children, render, ...props }, ref) => {\n // If render prop is explicitly provided, use it and pass children through\n if (render) {\n return (\n <DropdownMenuPrimitive.Trigger ref={ref} {...props} render={render}>\n {children}\n </DropdownMenuPrimitive.Trigger>\n );\n }\n\n // Otherwise, auto-promote single child element to render prop\n const childElement = React.isValidElement(children) ? children : null;\n\n return (\n <DropdownMenuPrimitive.Trigger\n ref={ref}\n {...props}\n {...(childElement && {\n render: childElement as React.ReactElement<Record<string, unknown>>,\n })}\n >\n {childElement ? undefined : children}\n </DropdownMenuPrimitive.Trigger>\n );\n});\nDropdownMenuTrigger.displayName = \"DropdownMenuTrigger\";\n\n/**\n * DropdownMenu — accessible dropdown menu anchored to a trigger.\n *\n * Compound component: `DropdownMenu` (Root), `.Trigger`, `.Content`, `.Item`,\n * `.LinkItem`, `.CheckboxItem`, `.RadioGroup`, `.RadioItem`, `.RadioItemIndicator`,\n * `.Sub`, `.SubTrigger`, `.SubContent`, `.Label`, `.Separator`, `.Shortcut`, `.Group`.\n *\n * Built on `@base-ui/react/menu`.\n *\n * @example\n * ```tsx\n * <DropdownMenu>\n * <DropdownMenu.Trigger>\n * <Button>Actions</Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n * <DropdownMenu.Item icon={CopyIcon}>Duplicate</DropdownMenu.Item>\n * <DropdownMenu.LinkItem href=\"/settings\" icon={GearIcon}>Settings</DropdownMenu.LinkItem>\n * <DropdownMenu.Separator />\n * <DropdownMenu.Item variant=\"danger\">Delete</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu>\n * ```\n *\n * @see https://base-ui.com/react/components/menu\n */\nexport const DropdownMenu = Object.assign(DropdownMenuPrimitive.Root, {\n Trigger: DropdownMenuTrigger,\n Portal: DropdownMenuPrimitive.Portal,\n Sub: DropdownMenuPrimitive.SubmenuRoot,\n SubTrigger: DropdownMenuSubTrigger,\n SubContent: DropdownMenuContent,\n Content: DropdownMenuContent,\n Item: DropdownMenuItem,\n LinkItem: DropdownMenuLinkItem,\n CheckboxItem: DropdownMenuCheckboxItem,\n RadioGroup: DropdownMenuPrimitive.RadioGroup,\n RadioItem: DropdownMenuRadioItem,\n RadioItemIndicator: DropdownMenuRadioItemIndicator,\n Label: DropdownMenuLabel,\n Separator: DropdownMenuSeparator,\n Shortcut: DropdownMenuShortcut,\n Group: DropdownMenuPrimitive.Group,\n});\n"],"names":["KUMO_DROPDOWN_VARIANTS","KUMO_DROPDOWN_DEFAULT_VARIANTS","dropdownVariants","variant","cn","resolveVariant","DropdownMenuSubTrigger","React","className","inset","children","IconComponent","props","ref","jsxs","DropdownMenuPrimitive.SubmenuTrigger","jsx","CaretRight","DropdownMenuContent","sideOffset","containerProp","contextContainer","usePortalContainer","DropdownMenuPrimitive.Portal","DropdownMenuPrimitive.Positioner","DropdownMenuPrimitive.Popup","renderIconNode","DropdownMenuItem","selected","render","href","LinkComponent","useLinkComponent","innerContent","Fragment","Check","linkContent","isExternal","styles","e","useRenderProp","DropdownMenuPrimitive.Item","DropdownMenuLinkItem","DropdownMenuPrimitive.LinkItem","DropdownMenuCheckboxItem","checked","DropdownMenuPrimitive.CheckboxItem","DropdownMenuPrimitive.CheckboxItemIndicator","CheckIcon","DropdownMenuLabel","DropdownMenuPrimitive.GroupLabel","DropdownMenuSeparator","DropdownMenuPrimitive.Separator","DropdownMenuShortcut","DropdownMenuRadioItem","DropdownMenuPrimitive.RadioItem","DropdownMenuRadioItemIndicator","DropdownMenuPrimitive.RadioItemIndicator","DropdownMenuTrigger","DropdownMenuPrimitive.Trigger","childElement","DropdownMenu","DropdownMenuPrimitive.Root","DropdownMenuPrimitive.SubmenuRoot","DropdownMenuPrimitive.RadioGroup","DropdownMenuPrimitive.Group"],"mappings":";;;;;;;;;AAiBO,MAAMA,KAAyB;AAAA,EACpC,SAAS;AAAA,IACP,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,QAAQ;AAAA,MACN,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAAiC;AAAA,EAC5C,SAAS;AACX;AAeO,SAASC,EAAiB;AAAA,EAC/B,SAAAC,IAAUF,EAA+B;AAC3C,IAA+B,IAAI;AACjC,SAAOG,EAAGC,EAAeL,GAAuB,SAASG,GAASF,EAA+B,OAAO,EAAE,OAAO;AACnH;AAEA,MAAMK,IAAyBC,EAAM,WAQnC,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,UAAAC,GAAU,MAAMC,GAAe,GAAGC,EAAA,GAASC,MAChE,gBAAAC;AAAA,EAACC;AAAAA,EAAA;AAAA,IACC,KAAAF;AAAA,IACA,WAAWT;AAAA,MACT;AAAA;AAAA,MACA;AAAA;AAAA,MACA;AAAA;AAAA,MACA;AAAA;AAAA,MACAK,KAAS;AAAA;AAAA,MACTD;AAAA,IAAA;AAAA,IAED,GAAGI;AAAA,IAEH,UAAA;AAAA,MAAAD,KAAiB,gBAAAK,EAACL,GAAA,EAAc,WAAU,eAAA,CAAe;AAAA,MACzDD;AAAA,MACD,gBAAAM,EAACC,GAAA,EAAW,WAAU,kBAAA,CAAkB;AAAA,IAAA;AAAA,EAAA;AAC1C,CACD;AAEDX,EAAuB,cACrBS,EAAqC;AAEvC,MAAMG,IAAsBX,EAAM;AAAA,EAWhC,CACE,EAAE,WAAAC,GAAW,YAAAW,IAAa,GAAG,UAAAT,GAAU,WAAWU,GAAe,GAAGR,EAAA,GACpEC,MACG;AACH,UAAMQ,IAAmBC,EAAA;AAGzB,WACE,gBAAAN,EAACO,GAAA,EAA6B,WAHdH,KAAiBC,KAAoB,QAInD,UAAA,gBAAAL;AAAA,MAACQ;AAAAA,MAAA;AAAA,QACC,KAAAX;AAAA,QACA,YAAAM;AAAA,QACC,GAAGP;AAAA,QAEJ,UAAA,gBAAAI;AAAA,UAACS;AAAAA,UAAA;AAAA,YACC,WAAWrB;AAAA,cACT;AAAA;AAAA,cACA;AAAA;AAAA,cACA;AAAA;AAAA,cACA;AAAA;AAAA,cACA;AAAA;AAAA,cACA;AAAA;AAAA,cACA;AAAA;AAAA,cACA;AAAA;AAAA,cACA;AAAA;AAAA,cACAI;AAAA,YAAA;AAAA,YAGD,UAAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA,GAEJ;AAAA,EAEJ;AACF,GAEMgB,IAAiB,CAACf,MACjBA,IACDJ,EAAM,eAAeI,CAAa,IAAUA,IAEzC,gBAAAK,EADML,GACL,EAAK,WAAU,eAAA,CAAe,IAHX,MAkBvBgB,IAAmBpB,EAAM;AAAA,EAc7B,CACE;AAAA,IACE,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAME;AAAA,IACN,UAAAD;AAAA,IACA,UAAAkB;AAAA,IACA,QAAAC;AAAA,IACA,MAAAC;AAAA,IACA,SAAA3B,IAAU;AAAA,IACV,GAAGS;AAAA,EAAA,GAELC,MACG;AACH,UAAMkB,IAAgBC,EAAA,GAGhBC,IAAe1B,EAAM;AAAA,MACzB,MACE,gBAAAO,EAAAoB,GAAA,EACG,UAAA;AAAA,QAAAvB,KAAiBe,EAAef,CAAa;AAAA,QAC7CD;AAAA,QACAkB,KACC,gBAAAZ,EAAC,QAAA,EAAK,WAAU,eACd,UAAA,gBAAAA,EAACmB,KAAM,EAAA,CACT;AAAA,MAAA,GAEJ;AAAA,MAEF,CAACxB,GAAeD,GAAUkB,CAAQ;AAAA,IAAA,GAI9BQ,IAAc7B,EAAM,QAAQ,MAAM;AACtC,UAAI,CAACuB,EAAM;AAGX,YAAMO,IAAa,kBAAkB,KAAKP,CAAI,GACxCQ,IAASlC;AAAA,QACb;AAAA,QACAD,MAAY,YACV;AAAA,MAAA;AAEJ,aAAIkC,IAEA,gBAAArB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWZ,EAAGkC,GAAQ,oCAAoC;AAAA,UAC1D,MAAAR;AAAA,UACA,QAAO;AAAA,UACP,KAAI;AAAA,UACJ,SAAS,CAACS,MAAMA,EAAE,gBAAA;AAAA,UAEjB,UAAAN;AAAA,QAAA;AAAA,MAAA,IAKL,gBAAAjB;AAAA,QAACe;AAAA,QAAA;AAAA,UACC,WAAW3B,EAAGkC,GAAQ,oCAAoC;AAAA,UAC1D,MAAAR;AAAA,UACA,IAAIA;AAAA,UACJ,SAAS,CAACS,MAAMA,EAAE,gBAAA;AAAA,UAEjB,UAAAN;AAAA,QAAA;AAAA,MAAA;AAAA,IAGP,GAAG,CAACH,GAAMG,GAAc9B,GAAS4B,CAAa,CAAC,GAIzCS,IAAgBV,KAAQD;AAE9B,WACE,gBAAAb;AAAA,MAACyB;AAAAA,MAAA;AAAA,QACC,KAAA5B;AAAA,QACA,WAAWT;AAAA,UACT;AAAA,UACAK,KAAS;AAAA,UACTP,EAAiB,EAAE,SAAAC,GAAS;AAAA,UAC5BK;AAAA,QAAA;AAAA,QAEF,QAAQsB,IAAOM,IAAcP;AAAA,QAC5B,GAAGjB;AAAA,QAEH,cAAgB,SAAYqB;AAAA,MAAA;AAAA,IAAA;AAAA,EAGnC;AACF;AAEAN,EAAiB,cAAcc,EAA2B;AA0B1D,MAAMC,IAAuBnC,EAAM;AAAA,EAQjC,CACE;AAAA,IACE,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAME;AAAA,IACN,UAAAD;AAAA,IACA,SAAAP,IAAU;AAAA,IACV,GAAGS;AAAA,EAAA,GAELC,MAGE,gBAAAC;AAAA,IAAC6B;AAAAA,IAAA;AAAA,MACC,KAAA9B;AAAA,MACA,WAAWT;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACAK,KAAS;AAAA,QACTP,EAAiB,EAAE,SAAAC,GAAS;AAAA,QAC5BK;AAAA,MAAA;AAAA,MAED,GAAGI;AAAA,MAEH,UAAA;AAAA,QAAAD,KAAiBe,EAAef,CAAa;AAAA,QAC7CD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIT;AAEAgC,EAAqB,cAAc;AAEnC,MAAME,IAA2BrC,EAAM,WAGrC,CAAC,EAAE,WAAAC,GAAW,UAAAE,GAAU,SAAAmC,GAAS,GAAGjC,KAASC,MAC7C,gBAAAC;AAAA,EAACgC;AAAAA,EAAA;AAAA,IACC,KAAAjC;AAAA,IACA,WAAWT;AAAA,MACT;AAAA,MACAI;AAAA,IAAA;AAAA,IAEF,SAAAqC;AAAA,IACC,GAAGjC;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAI,EAAC+B,IAAA,EAA4C,WAAU,6EACrD,UAAA,gBAAA/B,EAACgC,GAAA,EAAU,QAAO,QAAO,MAAM,GAAA,CAAI,EAAA,CACrC;AAAA,MACCtC;AAAA,IAAA;AAAA,EAAA;AACH,CACD;AACDkC,EAAyB,cACvBE,EAAmC;AAErC,MAAMG,IAAoB1C,EAAM,WAK9B,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,GAAGG,KAASC,MACjC,gBAAAG;AAAA,EAACkC;AAAAA,EAAA;AAAA,IACC,KAAArC;AAAA,IACA,WAAWT;AAAA,MACT;AAAA,MACAK,KAAS;AAAA,MACTD;AAAA,IAAA;AAAA,IAED,GAAGI;AAAA,EAAA;AACN,CACD;AACDqC,EAAkB,cAAcC,EAAiC;AAEjE,MAAMC,IAAwB5C,EAAM,WAGlC,CAAC,EAAE,WAAAC,GAAW,GAAGI,EAAA,GAASC,MAC1B,gBAAAG;AAAA,EAACoC;AAAAA,EAAA;AAAA,IACC,KAAAvC;AAAA,IACA,WAAWT,EAAG,oCAAoCI,CAAS;AAAA,IAC1D,GAAGI;AAAA,EAAA;AACN,CACD;AACDuC,EAAsB,cAAcC,EAAgC;AAEpE,MAAMC,IAAuB,CAAC;AAAA,EAC5B,WAAA7C;AAAA,EACA,GAAGI;AACL,MAEI,gBAAAI;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWZ,EAAG,8CAA8CI,CAAS;AAAA,IACpE,GAAGI;AAAA,EAAA;AAAA;AAIVyC,EAAqB,cAAc;AAEnC,MAAMC,IAAwB/C,EAAM,WAMlC,CAAC,EAAE,WAAAC,GAAW,UAAAE,GAAU,OAAAD,GAAO,MAAME,GAAe,GAAGC,EAAA,GAASC,MAChE,gBAAAC;AAAA,EAACyC;AAAAA,EAAA;AAAA,IACC,KAAA1C;AAAA,IACA,WAAWT;AAAA,MACT;AAAA,MACA;AAAA,MACAK,KAAS;AAAA,MACTD;AAAA,IAAA;AAAA,IAED,GAAGI;AAAA,IAEH,UAAA;AAAA,MAAAD,KAAiBe,EAAef,CAAa;AAAA,MAC7CD;AAAA,IAAA;AAAA,EAAA;AACH,CACD;AACD4C,EAAsB,cAAc;AAEpC,MAAME,IAAiCjD,EAAM,WAK3C,CAAC,EAAE,WAAAC,GAAW,UAAAE,GAAU,GAAGE,KAASC,MACpC,gBAAAG;AAAA,EAACyC;AAAAA,EAAA;AAAA,IACC,KAAA5C;AAAA,IACA,WAAWT,EAAG,WAAWI,CAAS;AAAA,IACjC,GAAGI;AAAA,IAEH,UAAAF,KAAY,gBAAAM,EAACmB,GAAA,EAAM,WAAU,UAAA,CAAU;AAAA,EAAA;AAC1C,CACD;AACDqB,EAA+B,cAAc;AAS7C,MAAME,IAAsBnD,EAAM,WAGhC,CAAC,EAAE,UAAAG,GAAU,QAAAmB,GAAQ,GAAGjB,EAAA,GAASC,MAAQ;AAEzC,MAAIgB;AACF,WACE,gBAAAb,EAAC2C,GAAA,EAA8B,KAAA9C,GAAW,GAAGD,GAAO,QAAAiB,GACjD,UAAAnB,GACH;AAKJ,QAAMkD,IAAerD,EAAM,eAAeG,CAAQ,IAAIA,IAAW;AAEjE,SACE,gBAAAM;AAAA,IAAC2C;AAAAA,IAAA;AAAA,MACC,KAAA9C;AAAA,MACC,GAAGD;AAAA,MACH,GAAIgD,KAAgB;AAAA,QACnB,QAAQA;AAAA,MAAA;AAAA,MAGT,cAAe,SAAYlD;AAAA,IAAA;AAAA,EAAA;AAGlC,CAAC;AACDgD,EAAoB,cAAc;AA6B3B,MAAMG,KAAe,OAAO,OAAOC,GAA4B;AAAA,EACpE,SAASJ;AAAA,EACT,QAAQnC;AAAAA,EACR,KAAKwC;AAAAA,EACL,YAAYzD;AAAA,EACZ,YAAYY;AAAA,EACZ,SAASA;AAAA,EACT,MAAMS;AAAA,EACN,UAAUe;AAAA,EACV,cAAcE;AAAA,EACd,YAAYoB;AAAAA,EACZ,WAAWV;AAAA,EACX,oBAAoBE;AAAA,EACpB,OAAOP;AAAA,EACP,WAAWE;AAAA,EACX,UAAUE;AAAA,EACV,OAAOY;AACT,CAAC;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"input-group-gy08vju7eoogil8k.js","sources":["../../src/components/input-group/context.ts","../../src/components/input-group/input-group-input.tsx","../../src/components/input-group/input-group-button.tsx","../../src/components/input-group/input-group-addon.tsx","../../src/components/input-group/input-group-suffix.tsx","../../src/components/input-group/input-group.tsx"],"sourcesContent":["import {\n Children,\n createContext,\n isValidElement,\n useContext,\n type HTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport type { KumoInputSize } from \"../input/input\";\nimport type { FieldProps } from \"../field/field\";\n\n// Spacing model\n//\n// Each element type has a fixed outer padding. The container uses has-[] CSS\n// to reduce the input's padding on sides that touch an addon.\n//\n// Input outer: px-3 (12px base) — full padding when at the edge\n// Input seam: pl-2 / pr-2 (8px base) — applied by container has-[]\n// Addon outer: pl-2 / pr-2 (8px base) — on the container-edge side\n// Addon seam: nothing — input owns the gap entirely\n//\n// has-[] rules on the container override [&_input]:pl-{seam} when a start\n// addon is present, and [&_input]:pr-{seam} when an end addon is present.\n\nexport interface InputGroupSizeTokens {\n /** Full outer padding — matches standalone Input (e.g. px-3). */\n inputOuter: string;\n /**\n * Directional outer padding for Addon at the container edge.\n *\n * These MUST be static pl-/pr- strings (not derived at runtime via\n * `\"px-N\".replace(…)`) so Tailwind JIT can detect them during its\n * source-file scan. Dynamic string construction produces class names\n * that never appear as literals, so Tailwind never generates the CSS.\n */\n addonOuterStart: string;\n addonOuterEnd: string;\n /**\n * Reduced outer padding when the Addon contains a Button.\n * Buttons have their own internal padding, so the Addon can use\n * less outer padding to keep the visual gap balanced.\n */\n addonButtonOuterStart: string;\n addonButtonOuterEnd: string;\n /** pr- for suffix when no end addon. */\n suffixPad: string;\n fontSize: string;\n /** Icon size in px. */\n iconSize: number;\n}\n\nexport const INPUT_GROUP_SIZE: Record<KumoInputSize, InputGroupSizeTokens> = {\n xs: {\n inputOuter: \"px-1.5\",\n addonOuterStart: \"pl-1.5\",\n addonOuterEnd: \"pr-1.5\",\n addonButtonOuterStart: \"pl-1\",\n addonButtonOuterEnd: \"pr-1\",\n suffixPad: \"pr-1.5\",\n fontSize: \"text-xs\",\n iconSize: 10,\n },\n sm: {\n inputOuter: \"px-2\",\n addonOuterStart: \"pl-1.5\",\n addonOuterEnd: \"pr-1.5\",\n addonButtonOuterStart: \"pl-1\",\n addonButtonOuterEnd: \"pr-1\",\n suffixPad: \"pr-2\",\n fontSize: \"text-xs\",\n iconSize: 13,\n },\n base: {\n inputOuter: \"px-3\",\n addonOuterStart: \"pl-2\",\n addonOuterEnd: \"pr-2\",\n addonButtonOuterStart: \"pl-1\",\n addonButtonOuterEnd: \"pr-1\",\n suffixPad: \"pr-3\",\n fontSize: \"text-base\",\n iconSize: 18,\n },\n lg: {\n inputOuter: \"px-4\",\n addonOuterStart: \"pl-2.5\",\n addonOuterEnd: \"pr-2.5\",\n addonButtonOuterStart: \"pl-1.5\",\n addonButtonOuterEnd: \"pr-1.5\",\n suffixPad: \"pr-4\",\n fontSize: \"text-base\",\n iconSize: 20,\n },\n};\n\n// Build the has-[] container classes that reduce input padding when addons\n// are present. These are static strings so Tailwind JIT can detect them.\nexport const INPUT_GROUP_HAS_CLASSES: Record<KumoInputSize, string> = {\n xs: [\n \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-1\",\n \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-1\",\n ].join(\" \"),\n sm: [\n \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-1.5\",\n \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-1.5\",\n ].join(\" \"),\n base: [\n \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-2\",\n \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-2\",\n ].join(\" \"),\n lg: [\n \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-2.5\",\n \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-2.5\",\n ].join(\" \"),\n};\n\n// Context\n\n/**\n * Props for `InputGroup.Root`. Focus mode is auto-detected from children\n * (see `detectFocusMode`), so it is not part of the public or internal API.\n */\nexport interface InputGroupRootPropsInternal\n extends HTMLAttributes<HTMLElement>,\n Partial<\n Pick<\n FieldProps,\n \"label\" | \"description\" | \"error\" | \"required\" | \"labelTooltip\"\n >\n > {\n size?: KumoInputSize | undefined;\n disabled?: boolean;\n}\n\n/** Public InputGroup.Root props — identical to the internal type. */\nexport type InputGroupRootProps = InputGroupRootPropsInternal;\n\nexport interface InputGroupContextValue {\n size?: KumoInputSize;\n focusMode: \"container\" | \"individual\" | \"hybrid\";\n disabled: boolean;\n error?: FieldProps[\"error\"];\n /** Auto-generated id for the input element; used by the invisible label overlay. */\n inputId: string;\n}\n\nexport const InputGroupContext = createContext<InputGroupContextValue | null>(\n null,\n);\n\n/**\n * Set to `true` by `InputGroup.Addon` so that `InputGroup.Button` can detect\n * whether it's wrapped in an Addon. Ghost buttons should always live inside\n * an Addon for correct spacing.\n */\nexport const InputGroupAddonContext = createContext(false);\n\n/**\n * Reads InputGroupContext and warns in development when the context is null\n * (i.e. when a sub-component is rendered outside of `<InputGroup>`).\n */\nexport function useInputGroupContext(componentName: string) {\n const context = useContext(InputGroupContext);\n if (process.env.NODE_ENV !== \"production\" && !context) {\n console.warn(\n `<InputGroup.${componentName}> must be used within <InputGroup>. Falling back to default values.`,\n );\n }\n return context;\n}\n\n/**\n * Partitions InputGroup children for hybrid focus mode.\n *\n * Container zone: Addon, Input, Suffix, text nodes — everything that should\n * share a single container-style border.\n *\n * Individual zone: Direct `InputGroup.Button` elements that manage their own\n * border and focus ring.\n *\n * Uses `displayName` comparison to identify elements, avoiding circular\n * imports between `context.ts` and the sub-component files.\n */\nexport function partitionChildren(children: ReactNode): {\n containerZone: ReactNode[];\n individualZone: ReactNode[];\n} {\n const containerZone: ReactNode[] = [];\n const individualZone: ReactNode[] = [];\n\n Children.forEach(children, (child) => {\n if (\n isValidElement(child) &&\n (child.type as { displayName?: string })?.displayName ===\n \"InputGroup.Button\"\n ) {\n individualZone.push(child);\n } else {\n containerZone.push(child);\n }\n });\n\n return { containerZone, individualZone };\n}\n\n/**\n * Analyzes the direct children of `InputGroup` to determine the focus mode.\n *\n * Returns `\"hybrid\"` when BOTH an `InputGroup.Addon` AND a non-ghost direct\n * `InputGroup.Button` are present. In hybrid mode, Addon+Input share a\n * container-style border while Buttons get individual borders.\n *\n * Returns `\"individual\"` when a non-ghost direct `InputGroup.Button` is\n * present WITHOUT any `InputGroup.Addon`. This signals a toolbar/pagination\n * layout where each element manages its own focus ring.\n *\n * Returns `\"container\"` (default) in all other cases — the container owns a\n * single shared focus ring.\n *\n * Uses `displayName` comparison to identify elements, avoiding circular\n * imports between `context.ts` and the sub-component files.\n */\nexport function detectFocusMode(\n children: ReactNode,\n): \"container\" | \"individual\" | \"hybrid\" {\n let hasNonGhostDirectButton = false;\n let hasAddon = false;\n\n Children.forEach(children, (child) => {\n if (!isValidElement(child)) return;\n\n // Identify components by displayName to avoid circular imports.\n const type = child.type;\n const displayName =\n typeof type === \"function\" || typeof type === \"object\"\n ? (type as { displayName?: string }).displayName\n : undefined;\n\n if (displayName === \"InputGroup.Addon\") {\n hasAddon = true;\n return;\n }\n\n if (displayName !== \"InputGroup.Button\") return;\n\n // A direct-child Button is by definition NOT inside an Addon (Addon's\n // children are children of the Addon element, not of InputGroup).\n // Check whether the variant is explicitly non-ghost.\n const variant = (child.props as { variant?: string }).variant;\n if (variant !== undefined && variant !== \"ghost\") {\n hasNonGhostDirectButton = true;\n }\n });\n\n if (hasNonGhostDirectButton && hasAddon) return \"hybrid\";\n if (hasNonGhostDirectButton) return \"individual\";\n return \"container\";\n}\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Input as InputExternal, type InputProps } from \"../input/input\";\nimport { useInputGroupContext, INPUT_GROUP_SIZE } from \"./context\";\n\n/** Props for InputGroup.Input — omits Field props since InputGroup handles them. */\nexport type InputGroupInputProps = Omit<\n InputProps,\n \"label\" | \"labelTooltip\" | \"description\" | \"error\" | \"size\" | \"disabled\"\n>;\n\n/**\n * Text input that inherits size, disabled, and error state from InputGroup context.\n * Automatically sets `aria-invalid` when parent has an error.\n */\nexport const Input = forwardRef<HTMLInputElement, InputGroupInputProps>(\n (props, ref) => {\n const context = useInputGroupContext(\"Input\");\n\n // Warn when props that belong on <InputGroup> are passed directly\n if (process.env.NODE_ENV !== \"production\" && context) {\n if ((props as any).size !== undefined) {\n console.warn(\n \"InputGroup.Input: Set `size` on <InputGroup> instead of <InputGroup.Input>.\",\n );\n }\n if ((props as any).disabled !== undefined) {\n console.warn(\n \"InputGroup.Input: Set `disabled` on <InputGroup> instead of <InputGroup.Input>.\",\n );\n }\n if ((props as any).label !== undefined) {\n console.warn(\n \"InputGroup.Input: Use the `label` prop on <InputGroup> instead of <InputGroup.Input>.\",\n );\n }\n if ((props as any).description !== undefined) {\n console.warn(\n \"InputGroup.Input: Use <InputGroup.Suffix> instead of passing `description` to <InputGroup.Input>.\",\n );\n }\n }\n\n const size = context?.size ?? \"base\";\n const tokens = INPUT_GROUP_SIZE[size];\n const isIndividual = context?.focusMode === \"individual\";\n\n // Auto-set aria-invalid when error is present in context\n const hasError = Boolean(context?.error);\n\n // Use explicit id if provided, otherwise fall back to context id\n // (links the input to the invisible label overlay for click-to-focus).\n const inputId = props.id ?? context?.inputId;\n\n return (\n <InputExternal\n ref={ref}\n size={context?.size}\n disabled={context?.disabled || (props as any).disabled}\n aria-invalid={hasError || props[\"aria-invalid\"]}\n {...props}\n id={inputId}\n className={cn(\n // Base input layout: fill height, allow shrinking, strip native border/radius\n \"flex h-full min-w-0 grow items-center rounded-none border-0 bg-transparent font-sans\",\n // Always use full outer padding — the container's has-[] rules reduce\n // pl/pr to inputSeam on sides that touch an addon.\n tokens.inputOuter,\n // Truncate overflowing text with \"…\" instead of expanding the input\n \"text-ellipsis\",\n // Individual mode: each element owns its own border instead of sharing a container ring\n isIndividual\n ? [\n // Own border replaces the container's shared ring\n \"relative ring-0 border border-kumo-line\",\n // Inherit border-radius only on outer edges; inner edges are flat\n \"first:rounded-l-[inherit] last:rounded-r-[inherit]\",\n // Collapse double borders between adjacent elements\n \"not-first:border-l-0\",\n // Hovered element renders above idle siblings to show full border\n \"hover:z-[1] hover:border-kumo-line\",\n // Focused element renders above hovered siblings for focus indicator\n \"focus:z-[2] focus:border-kumo-line focus:outline focus:-outline-offset-1\",\n ].join(\" \")\n : // Container mode: kill all focus indicators — the container handles them\n // z-[1] lifts the input above the invisible label overlay so cursor/selection work\n \"relative z-[1] ring-0! shadow-none outline-none focus:ring-0! focus:outline-none\",\n props.className,\n )}\n />\n );\n },\n);\nInput.displayName = \"InputGroup.Input\";\n","import React, {\n forwardRef,\n useContext,\n type PropsWithChildren,\n type ReactNode,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { type ButtonProps, Button as ButtonExternal } from \"../button/button\";\nimport { Tooltip, type KumoTooltipSide } from \"../tooltip/tooltip\";\nimport type { KumoInputSize } from \"../input/input\";\nimport {\n INPUT_GROUP_SIZE,\n InputGroupAddonContext,\n useInputGroupContext,\n} from \"./context\";\n\n/**\n * In container mode, buttons render \"one size down\" so they stay visually\n * subordinate to the input. In individual mode the size passes through\n * unchanged (pagination / toolbar buttons should match the input height).\n */\nconst COMPACT_BUTTON_SIZE: Record<KumoInputSize, KumoInputSize> = {\n xs: \"xs\",\n sm: \"xs\",\n base: \"sm\",\n lg: \"base\",\n};\n\nexport type InputGroupButtonProps = ButtonProps & {\n /**\n * When provided, wraps the button in a `Tooltip` showing this content on hover.\n * Automatically sets `aria-label` from a string value when no `aria-label` is set.\n *\n * @example\n * ```tsx\n * <InputGroup.Addon align=\"end\">\n * <InputGroup.Button tooltip=\"Query language help\" aria-label=\"Query language help\">\n * <QuestionIcon size={16} />\n * </InputGroup.Button>\n * </InputGroup.Addon>\n * ```\n */\n tooltip?: ReactNode;\n /**\n * Preferred side for the tooltip popup.\n * @default \"bottom\"\n */\n tooltipSide?: KumoTooltipSide;\n};\n\n/**\n * Button for secondary actions rendered inside `InputGroup.Addon`\n * (toggle, copy, help).\n *\n * In `focusMode=\"container\"` (default), renders as a compact ghost button\n * subordinate to the input. In `focusMode=\"individual\"`, renders as a full\n * standalone button with its own focus ring, matching toolbar/pagination usage.\n *\n * Pass a `tooltip` prop to show a tooltip on hover.\n */\nexport const Button = forwardRef<\n HTMLButtonElement,\n PropsWithChildren<InputGroupButtonProps>\n>(\n (\n {\n children,\n className,\n variant,\n size,\n disabled,\n tooltip,\n tooltipSide = \"bottom\",\n icon,\n ...props\n }: PropsWithChildren<InputGroupButtonProps>,\n ref: React.ForwardedRef<HTMLButtonElement>,\n ) => {\n const context = useInputGroupContext(\"Button\");\n const isInsideAddon = useContext(InputGroupAddonContext);\n const isDisabled = disabled ?? context?.disabled;\n const isIndividual =\n context?.focusMode === \"individual\" || context?.focusMode === \"hybrid\";\n const effectiveVariant = variant ?? \"ghost\";\n\n if (\n process.env.NODE_ENV !== \"production\" &&\n context &&\n effectiveVariant === \"ghost\" &&\n !isInsideAddon\n ) {\n console.warn(\n \"InputGroup.Button: Ghost buttons should be wrapped in <InputGroup.Addon> for correct spacing.\",\n );\n }\n\n if (\n process.env.NODE_ENV !== \"production\" &&\n context &&\n size !== undefined\n ) {\n console.warn(\n \"InputGroup.Button: Set `size` on <InputGroup> instead of <InputGroup.Button>.\",\n );\n }\n\n // Derive aria-label from tooltip string when the button has no explicit label.\n // Icon-only buttons require an aria-label for a11y.\n const tooltipAriaLabel =\n typeof tooltip === \"string\" && !props[\"aria-label\"] ? tooltip : undefined;\n\n // Pre-render the icon with the context-derived size so it matches the\n // Addon icon sizing (e.g. 18px at \"base\"). Without this, Button's\n // internal renderIconNode renders `<Icon />` with no size prop,\n // falling back to CSS font-size (~14px).\n const contextIconSize = context\n ? INPUT_GROUP_SIZE[context.size ?? \"base\"].iconSize\n : undefined;\n\n const sizedIcon =\n icon &&\n contextIconSize &&\n (typeof icon === \"function\" ||\n (typeof icon === \"object\" &&\n icon !== null &&\n !React.isValidElement(icon)))\n ? React.createElement(icon as React.ComponentType<{ size?: number }>, {\n size: contextIconSize,\n })\n : icon;\n\n const btn = (\n <ButtonExternal\n ref={ref}\n type=\"button\"\n disabled={isDisabled}\n aria-label={tooltipAriaLabel}\n {...props}\n icon={sizedIcon}\n variant={variant ?? \"ghost\"}\n // Individual: use the group's size directly so buttons match the input height.\n // Container: render one size down so the button stays subordinate to the input.\n size={\n size ??\n (isIndividual\n ? (context?.size ?? \"sm\")\n : (COMPACT_BUTTON_SIZE[context?.size ?? \"base\"] ?? \"sm\"))\n }\n className={cn(\n // Ensure clicks register even when parent has pointer-events-none (e.g. disabled overlay)\n \"pointer-events-auto\",\n // Individual mode: each button owns its own border and focus indicator\n isIndividual && [\n // Own border replaces the container's shared ring; force full height\n \"relative h-full! rounded-none ring-0 border border-kumo-line\",\n // Inherit border-radius only on outer edges; inner edges are flat\n \"first:rounded-l-[inherit] last:rounded-r-[inherit]\",\n // Collapse double borders between adjacent elements\n \"not-first:border-l-0\",\n // Hovered element renders above idle siblings to show full border\n \"hover:z-[1]\",\n // Focused element renders above hovered siblings for focus indicator\n \"focus:z-[2] focus:border-kumo-line focus:outline focus:-outline-offset-1\",\n // Suppress the base Button's focus ring so only our outline shows\n \"focus-visible:ring-2 focus-visible:ring-kumo-focus\",\n // Match the group's disabled visual treatment\n \"disabled:bg-kumo-overlay disabled:text-kumo-inactive!\",\n ],\n className,\n )}\n >\n {children}\n </ButtonExternal>\n );\n\n if (tooltip) {\n return (\n <Tooltip content={tooltip} side={tooltipSide} asChild>\n {btn}\n </Tooltip>\n );\n }\n\n return btn;\n },\n);\nButton.displayName = \"InputGroup.Button\";\n","import {\n Children,\n cloneElement,\n forwardRef,\n isValidElement,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport {\n useInputGroupContext,\n INPUT_GROUP_SIZE,\n InputGroupAddonContext,\n} from \"./context\";\nimport { Button } from \"./input-group-button\";\n\nexport interface InputGroupAddonProps {\n /** Position relative to the input. @default \"start\" */\n align?: \"start\" | \"end\";\n /** Additional CSS classes. */\n className?: string;\n /** Addon content: icons, buttons, spinners, text. */\n children?: ReactNode;\n}\n\n/**\n * Container for icons, text, or compact buttons positioned at the start or end\n * of the input. Automatically sizes icon children to match the input size.\n */\nexport const Addon = forwardRef<HTMLDivElement, InputGroupAddonProps>(\n ({ align = \"start\", className, children }, ref) => {\n const context = useInputGroupContext(\"Addon\");\n\n const size = context?.size ?? \"base\";\n const tokens = INPUT_GROUP_SIZE[size];\n\n // Inject size into direct icon children that don't already have one set.\n // Skips buttons (which have their own size handling) and non-element nodes.\n // Also tracks whether a Button is present so we can reduce outer padding.\n let containsButton = false;\n const sizedChildren = Children.map(children, (child) => {\n if (!isValidElement(child)) return child;\n if (child.type === Button) {\n containsButton = true;\n return child;\n }\n const props = child.props as { size?: unknown };\n if (props.size !== undefined) return child;\n return cloneElement(child as ReactElement<{ size?: number }>, {\n size: tokens.iconSize,\n });\n });\n\n // Always use flex-based positioning. CSS order controls visual placement.\n return (\n <div\n ref={ref}\n data-slot={\n align === \"start\"\n ? \"input-group-addon-start\"\n : \"input-group-addon-end\"\n }\n className={cn(\n \"relative z-[1] pointer-events-none flex shrink-0 items-center gap-1.5\",\n \"text-kumo-subtle\",\n tokens.fontSize,\n \"*:pointer-events-auto\",\n align === \"start\"\n ? cn(\n \"-order-1\",\n containsButton\n ? tokens.addonButtonOuterStart\n : tokens.addonOuterStart,\n \"pr-0\",\n )\n : cn(\n \"order-1\",\n \"pl-0\",\n containsButton\n ? tokens.addonButtonOuterEnd\n : tokens.addonOuterEnd,\n ),\n className,\n )}\n >\n <InputGroupAddonContext.Provider value={true}>\n {sizedChildren}\n </InputGroupAddonContext.Provider>\n </div>\n );\n },\n);\nAddon.displayName = \"InputGroup.Addon\";\n","import { forwardRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useInputGroupContext, INPUT_GROUP_SIZE } from \"./context\";\n\nexport interface InputGroupSuffixProps {\n /** Additional CSS classes. */\n className?: string;\n /** Suffix content (e.g., \".workers.dev\"). */\n children?: ReactNode;\n}\n\n/**\n * Inline suffix that flows seamlessly next to the typed input value.\n * Input width adjusts automatically via CSS `field-sizing: content`.\n */\nexport const Suffix = forwardRef<HTMLDivElement, InputGroupSuffixProps>(\n ({ className, children }, ref) => {\n const context = useInputGroupContext(\"Suffix\");\n\n const size = context?.size ?? \"base\";\n const tokens = INPUT_GROUP_SIZE[size];\n\n return (\n <div\n ref={ref}\n data-slot=\"input-group-suffix\"\n className={cn(\n \"pointer-events-none flex min-w-0 grow select-none items-center text-kumo-subtle\",\n tokens.fontSize,\n tokens.suffixPad,\n className,\n )}\n >\n <span className=\"truncate\">{children}</span>\n </div>\n );\n },\n);\nSuffix.displayName = \"InputGroup.Suffix\";\n","import {\n forwardRef,\n useId,\n useMemo,\n type ComponentPropsWithoutRef,\n type PropsWithChildren,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { inputVariants } from \"../input/input\";\nimport { Field } from \"../field/field\";\nimport {\n InputGroupContext,\n INPUT_GROUP_HAS_CLASSES,\n detectFocusMode,\n partitionChildren,\n type InputGroupRootPropsInternal,\n} from \"./context\";\nimport { Input } from \"./input-group-input\";\nimport { Button } from \"./input-group-button\";\nimport { Addon } from \"./input-group-addon\";\nimport { Suffix } from \"./input-group-suffix\";\n\nexport { type InputGroupRootProps } from \"./context\";\nexport { type InputGroupInputProps } from \"./input-group-input\";\nexport { type InputGroupButtonProps } from \"./input-group-button\";\nexport { type InputGroupAddonProps } from \"./input-group-addon\";\nexport { type InputGroupSuffixProps } from \"./input-group-suffix\";\n\nexport const KUMO_INPUT_GROUP_VARIANTS = {\n size: {\n xs: {\n classes: \"h-6 text-xs\",\n description: \"Extra small size.\",\n },\n sm: {\n classes: \"h-7 text-xs\",\n description: \"Small size.\",\n },\n base: {\n classes: \"h-9 text-base\",\n description: \"Default size.\",\n },\n lg: {\n classes: \"h-11 text-base\",\n description: \"Large size.\",\n },\n },\n} as const;\n\nexport const KUMO_INPUT_GROUP_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\n/**\n * Compound input component for building inputs with icons, addons, inline\n * suffixes, and action buttons. Accepts Field props and wraps content in\n * Field when label is provided.\n *\n * Renders as `<label>` only in standalone container mode (single input, no\n * sibling buttons) so clicking empty space focuses the input. Otherwise\n * renders as `<div>` to avoid nested `<label>` (when Field provides one) or\n * the browser's `:hover` propagation from `<label>` to its first labelable\n * descendant (when multiple labelable controls are siblings).\n *\n * @note Do not wrap InputGroup inside an external Field without using the `label` prop —\n * this creates invalid nested `<label>` elements. Use InputGroup's own `label` prop instead.\n *\n * @example\n * ```tsx\n * <InputGroup label=\"Email\" error={{ message: \"Invalid\", match: true }}>\n * <InputGroup.Addon><EnvelopeIcon /></InputGroup.Addon>\n * <InputGroup.Input placeholder=\"you@example.com\" />\n * </InputGroup>\n * ```\n *\n * @example\n * ```tsx\n * <InputGroup>\n * <InputGroup.Input placeholder=\"my-worker\" />\n * <InputGroup.Suffix>.workers.dev</InputGroup.Suffix>\n * </InputGroup>\n * ```\n */\nconst Root = forwardRef<\n HTMLElement,\n PropsWithChildren<InputGroupRootPropsInternal>\n>(\n (\n {\n size = \"base\",\n children,\n className,\n disabled = false,\n label,\n description,\n error,\n required,\n labelTooltip,\n ...rest\n },\n forwardedRef,\n ) => {\n const inputId = useId();\n const focusMode = detectFocusMode(children);\n\n const contextValue = useMemo(\n () => ({\n size,\n focusMode,\n disabled,\n error,\n inputId,\n }),\n [size, focusMode, disabled, error, inputId],\n );\n\n // When label is provided, Field already renders a <label> with htmlFor\n // that handles click-to-focus. Using <div> avoids nested <label> elements\n // (invalid HTML with undefined assistive technology behavior).\n // When standalone (no label), a native <label> preserves click-to-focus.\n const containerClassName = cn(\n // Establish positioning context and make the whole area a click target\n \"relative w-full cursor-text\",\n // inputVariants provides base ring-kumo-line; must come before state overrides\n inputVariants({ size }),\n // Subtle drop shadow to separate the group from the page surface\n \"shadow-xs\",\n // Disabled state: prevent interaction and dim the entire group\n \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n // Container mode: clip children to rounded corners and show a shared focus ring\n // Individual mode: disable container ring/shadow so each child owns its own border\n focusMode === \"container\"\n ? [\n \"overflow-hidden\",\n // Focus state must come AFTER inputVariants to override ring-kumo-line\n \"focus-within:ring-kumo-focus\",\n ]\n : // isolate creates a new stacking context so z-index in children doesn't leak out\n \"isolate overflow-visible ring-0 shadow-none\",\n // Error state must also come after inputVariants\n \"has-[input[aria-invalid=true]]:ring-kumo-danger\",\n // Reset horizontal padding — children handle their own spacing\n \"px-0\",\n // Horizontal layout with no gap — children control their own internal spacing\n \"flex items-center gap-0\",\n // When a suffix is present, let the input shrink to its content width\n // so the suffix stays visually adjacent\n \"has-[[data-slot=input-group-suffix]]:[&_input]:[field-sizing:content]\",\n \"has-[[data-slot=input-group-suffix]]:[&_input]:max-w-full\",\n \"has-[[data-slot=input-group-suffix]]:[&_input]:grow-0\",\n \"has-[[data-slot=input-group-suffix]]:[&_input]:pr-0\",\n // Size-specific padding adjustments when addons or suffixes are present\n INPUT_GROUP_HAS_CLASSES[size],\n // Reset bottom margin to avoid inherited spacing from parent <label> styles\n \"!mb-0\",\n className,\n );\n\n // Data attributes drive CSS selectors in kumo-binding.css (focus outline)\n // and enable child components to query their parent's state.\n const dataProps = {\n \"data-slot\": \"input-group\" as const,\n \"data-focus-mode\": focusMode,\n \"data-disabled\": disabled ? (\"\" as const) : undefined,\n };\n\n // Hybrid mode: splits children into two rendering zones:\n // 1. Container zone (Addon + Input + Suffix) — shares a single border/ring\n // 2. Individual zone (standalone Buttons) — each button owns its own border\n // This lets inputs and addons look unified while buttons remain independent.\n if (focusMode === \"hybrid\") {\n // Partition children by type: addons/inputs/suffixes → container, buttons → individual\n const { containerZone, individualZone } = partitionChildren(children);\n\n // Override focusMode to \"container\" for children inside the zone\n // so InputGroup.Input uses container-mode styling (ring-0!, no own border).\n const containerZoneContext = {\n ...contextValue,\n focusMode: \"container\" as const,\n };\n\n const hybridContent = (\n <>\n {/* Container zone wrapper — shares a single border/ring */}\n <InputGroupContext.Provider value={containerZoneContext}>\n <div\n data-slot=\"input-group-container-zone\"\n className={cn(\n // Base input sizing/shape from shared variant function\n inputVariants({ size }),\n // Clip children to rounded corners within the zone\n \"overflow-hidden\",\n // Show red ring on validation error\n \"has-[input[aria-invalid=true]]:ring-kumo-danger\",\n // Reset horizontal padding — children handle their own spacing\n \"px-0\",\n // Fill available width but allow shrinking when sibling buttons are present\n \"flex min-w-0 flex-1 items-center gap-0\",\n // Use a clean 1px CSS border instead of ring+shadow from inputVariants\n // so the zone matches adjacent individual-mode buttons exactly.\n \"ring-0 shadow-none\",\n \"border border-kumo-line\",\n \"focus-within:ring-1 focus-within:ring-kumo-focus\",\n // Collapse double borders between zone and adjacent individual-mode button\n \"not-first:border-l-0\",\n // Inherit border-radius from the outer container on outer edges only;\n // inner edges are flat so they butt cleanly against sibling buttons\n \"first:rounded-l-[inherit] last:rounded-r-[inherit] rounded-none\",\n // Size-specific padding adjustments when addons or suffixes are present\n INPUT_GROUP_HAS_CLASSES[size],\n // When a suffix is present, let the input shrink to its content width\n \"has-[[data-slot=input-group-suffix]]:[&_input]:[field-sizing:content]\",\n \"has-[[data-slot=input-group-suffix]]:[&_input]:max-w-full\",\n \"has-[[data-slot=input-group-suffix]]:[&_input]:grow-0\",\n \"has-[[data-slot=input-group-suffix]]:[&_input]:pr-0\",\n )}\n >\n {/* When label exists, an invisible <label> overlay enables click-to-focus\n inside the container zone without nesting visible <label> elements */}\n {label && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control -- invisible overlay for click-to-focus; the visible Field label handles a11y\n <label\n htmlFor={inputId}\n // Positioned behind children (z-0) so it catches clicks on empty space\n className=\"absolute inset-0 z-0 cursor-text !mb-0\"\n aria-hidden=\"true\"\n />\n )}\n {containerZone}\n </div>\n </InputGroupContext.Provider>\n {/* Individual zone — buttons with their own borders */}\n {individualZone}\n </>\n );\n\n // Hybrid always uses a <div> container (never <label>) because\n // individual-zone buttons are siblings — wrapping them in a <label>\n // would be semantically incorrect.\n const hybridContainer = (\n <InputGroupContext.Provider value={contextValue}>\n <div\n ref={forwardedRef as React.Ref<HTMLDivElement>}\n {...dataProps}\n className={containerClassName}\n {...rest}\n >\n {hybridContent}\n </div>\n </InputGroupContext.Provider>\n );\n\n if (label) {\n return (\n <Field\n label={label}\n description={description}\n error={error}\n required={required}\n labelTooltip={labelTooltip}\n >\n {hybridContainer}\n </Field>\n );\n }\n\n return hybridContainer;\n }\n\n // Container / Individual mode (non-hybrid)\n // Use <label> only when there's exactly one labelable descendant; otherwise <label> would propagate :hover to its first labelable descendant.\n const useLabelContainer = !label && focusMode === \"container\";\n const container = (\n <InputGroupContext.Provider value={contextValue}>\n {/* When label is set, use <div> to avoid nested <label> (Field provides one).\n An invisible <label> overlay handles click-to-focus on empty space. */}\n {label ? (\n <div\n ref={forwardedRef as React.Ref<HTMLDivElement>}\n {...dataProps}\n className={containerClassName}\n {...rest}\n >\n {/* eslint-disable-next-line jsx-a11y/label-has-associated-control -- invisible overlay for click-to-focus; the visible Field label handles a11y */}\n <label\n htmlFor={inputId}\n // Positioned behind children (z-0) so it catches clicks on empty space\n className=\"absolute inset-0 z-0 !mb-0\"\n aria-hidden=\"true\"\n />\n {children}\n </div>\n ) : useLabelContainer ? (\n // Standalone container mode: <label> enables click-to-focus on empty space.\n <label\n ref={forwardedRef as React.Ref<HTMLLabelElement>}\n {...dataProps}\n className={cn(containerClassName, \"!mb-0\")}\n {...rest}\n >\n {children}\n </label>\n ) : (\n // Individual mode: <div> avoids :hover propagating to the first labelable sibling.\n <div\n ref={forwardedRef as React.Ref<HTMLDivElement>}\n {...dataProps}\n className={containerClassName}\n {...rest}\n >\n {children}\n </div>\n )}\n </InputGroupContext.Provider>\n );\n\n if (label) {\n return (\n <Field\n label={label}\n description={description}\n error={error}\n required={required}\n labelTooltip={labelTooltip}\n >\n {container}\n </Field>\n );\n }\n\n return container;\n },\n);\nRoot.displayName = \"InputGroup\";\n\n/** @deprecated Use `InputGroup.Addon` instead. */\nconst Label = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<typeof Addon>\n>((props, ref) => <Addon ref={ref} align=\"start\" {...props} />);\nLabel.displayName = \"InputGroup.Label\";\n\n/** @deprecated Use `InputGroup.Suffix` instead. */\nconst Description = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<typeof Suffix>\n>((props, ref) => <Suffix ref={ref} {...props} />);\nDescription.displayName = \"InputGroup.Description\";\n\nexport const InputGroup = Object.assign(Root, {\n Input,\n Button,\n Addon,\n Suffix,\n /** @deprecated Use `InputGroup.Addon` instead. */\n Label,\n /** @deprecated Use `InputGroup.Suffix` instead. */\n Description,\n});\n"],"names":["INPUT_GROUP_SIZE","INPUT_GROUP_HAS_CLASSES","InputGroupContext","createContext","InputGroupAddonContext","useInputGroupContext","componentName","context","useContext","partitionChildren","children","containerZone","individualZone","Children","child","isValidElement","detectFocusMode","hasNonGhostDirectButton","hasAddon","type","displayName","variant","Input","forwardRef","props","ref","size","tokens","isIndividual","hasError","inputId","jsx","InputExternal","cn","COMPACT_BUTTON_SIZE","Button","className","disabled","tooltip","tooltipSide","icon","isInsideAddon","isDisabled","effectiveVariant","tooltipAriaLabel","contextIconSize","sizedIcon","React","btn","ButtonExternal","Tooltip","Addon","align","containsButton","sizedChildren","cloneElement","Suffix","KUMO_INPUT_GROUP_VARIANTS","KUMO_INPUT_GROUP_DEFAULT_VARIANTS","Root","label","description","error","required","labelTooltip","rest","forwardedRef","useId","focusMode","contextValue","useMemo","containerClassName","inputVariants","dataProps","containerZoneContext","hybridContent","jsxs","Fragment","hybridContainer","Field","useLabelContainer","container","Label","Description","InputGroup"],"mappings":"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"}
@@ -1,96 +0,0 @@
1
- "use client";
2
- import { jsx as i } from "react/jsx-runtime";
3
- import { T as p } from "./tooltip-icvb67awe1zolz61.js";
4
- import { c as b } from "./cn-ct4n7r74mh8y0f48.js";
5
- import { IconContext as w } from "@phosphor-icons/react";
6
- import { useRef as g, useEffect as y } from "react";
7
- const k = ({
8
- menuRef: e,
9
- direction: o = "horizontal"
10
- }) => {
11
- const r = g(null);
12
- y(() => {
13
- if (!e.current) return;
14
- const n = Array.from(
15
- e.current.querySelectorAll(
16
- 'a, button, input, textarea, select, details, [tabindex]:not([tabindex="-1"])'
17
- )
18
- );
19
- if (n.length === 0) return;
20
- const t = (u) => {
21
- if (!r.current) return;
22
- const l = n.indexOf(r.current);
23
- let a = l;
24
- const m = o === "horizontal", h = m ? "ArrowRight" : "ArrowDown", x = m ? "ArrowLeft" : "ArrowUp";
25
- if (u.key === h)
26
- u.preventDefault(), a = (l + 1) % n.length;
27
- else if (u.key === x)
28
- u.preventDefault(), a = (l - 1 + n.length) % n.length;
29
- else
30
- return;
31
- const v = n[a];
32
- r.current = v, v.focus();
33
- }, s = () => document.addEventListener("keydown", t), c = () => document.removeEventListener("keydown", t), d = () => {
34
- r.current = document.activeElement, s();
35
- }, f = () => {
36
- r.current = null, c();
37
- };
38
- return e.current.addEventListener("focusin", d), e.current.addEventListener("focusout", f), () => {
39
- e.current?.removeEventListener("focusin", d), e.current?.removeEventListener("focusout", f), c();
40
- };
41
- }, [e, o]);
42
- }, E = ({
43
- icon: e,
44
- id: o,
45
- isActive: r,
46
- onClick: n,
47
- tooltip: t
48
- }) => {
49
- const s = /* @__PURE__ */ i(
50
- "button",
51
- {
52
- "aria-label": t,
53
- className: b(
54
- "relative -ml-px flex h-full w-11 cursor-pointer items-center justify-center rounded-md border-none bg-kumo-recessed first:rounded-l-lg last:rounded-r-lg transition-colors focus:z-3 focus:outline-none focus:ring-kumo-focus/50 focus-visible:z-3 focus-visible:ring-2 focus-visible:ring-kumo-brand",
55
- {
56
- "z-2 bg-kumo-base shadow-xs transition-colors": r === o
57
- }
58
- ),
59
- onClick: n,
60
- children: /* @__PURE__ */ i(w.Provider, { value: { size: 18 }, children: e })
61
- }
62
- );
63
- return /* @__PURE__ */ i(p, { content: t, render: s });
64
- }, I = ({
65
- className: e,
66
- isActive: o,
67
- options: r,
68
- optionIds: n = !1
69
- // if option needs an extra unique ID
70
- }) => {
71
- const t = g(null);
72
- return k({ menuRef: t, direction: "horizontal" }), /* @__PURE__ */ i(
73
- "nav",
74
- {
75
- className: b(
76
- "isolate flex rounded-lg ring ring-kumo-line bg-kumo-recessed pl-px shadow-xs transition-colors",
77
- e
78
- ),
79
- ref: t,
80
- children: r.map((s, c) => /* @__PURE__ */ i(
81
- E,
82
- {
83
- ...s,
84
- isActive: o,
85
- id: n ? s.id : c
86
- },
87
- c
88
- ))
89
- }
90
- );
91
- };
92
- export {
93
- I as M,
94
- k as u
95
- };
96
- //# sourceMappingURL=menubar-jalggrag4utvdpey.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"menubar-jalggrag4utvdpey.js","sources":["../../src/components/menubar/use-menu-navigation.ts","../../src/components/menubar/menubar.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\n\ntype UseMenuNavigationProps = {\n menuRef: React.RefObject<HTMLElement | null>;\n direction?: \"horizontal\" | \"vertical\"; // Default: horizontal\n};\n\nexport const useMenuNavigation = ({\n menuRef,\n direction = \"horizontal\",\n}: UseMenuNavigationProps) => {\n const activeElementRef = useRef<HTMLElement | null>(null);\n\n useEffect(() => {\n if (!menuRef.current) return;\n\n const focusableElements = Array.from(\n menuRef.current.querySelectorAll(\n 'a, button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])',\n ),\n ) as HTMLElement[];\n\n if (focusableElements.length === 0) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!activeElementRef.current) return;\n\n const currentIndex = focusableElements.indexOf(activeElementRef.current);\n let nextIndex = currentIndex;\n\n const isHorizontal = direction === \"horizontal\";\n const forwardKey = isHorizontal ? \"ArrowRight\" : \"ArrowDown\";\n const backwardKey = isHorizontal ? \"ArrowLeft\" : \"ArrowUp\";\n\n if (e.key === forwardKey) {\n e.preventDefault();\n nextIndex = (currentIndex + 1) % focusableElements.length;\n } else if (e.key === backwardKey) {\n e.preventDefault();\n nextIndex =\n (currentIndex - 1 + focusableElements.length) %\n focusableElements.length;\n } else {\n return;\n }\n\n const nextElement = focusableElements[nextIndex];\n activeElementRef.current = nextElement;\n nextElement.focus();\n };\n\n const addKeyListener = () =>\n document.addEventListener(\"keydown\", handleKeyDown);\n const removeKeyListener = () =>\n document.removeEventListener(\"keydown\", handleKeyDown);\n\n const handleFocusIn = () => {\n activeElementRef.current = document.activeElement as HTMLElement;\n addKeyListener();\n };\n\n const handleFocusOut = () => {\n activeElementRef.current = null;\n removeKeyListener();\n };\n\n menuRef.current.addEventListener(\"focusin\", handleFocusIn);\n menuRef.current.addEventListener(\"focusout\", handleFocusOut);\n\n return () => {\n menuRef.current?.removeEventListener(\"focusin\", handleFocusIn);\n menuRef.current?.removeEventListener(\"focusout\", handleFocusOut);\n removeKeyListener();\n };\n }, [menuRef, direction]);\n};\n","import { Tooltip } from \"../tooltip\";\nimport { cn } from \"../../utils/cn\";\nimport { IconContext } from \"@phosphor-icons/react\";\nimport React, { useRef } from \"react\";\nimport { useMenuNavigation } from \"./use-menu-navigation\";\n\n/** MenuBar variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_MENUBAR_VARIANTS = {\n // MenuBar currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_MENUBAR_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_MENUBAR_VARIANTS\nexport interface KumoMenuBarVariantsProps {}\n\nexport function menuBarVariants(_props: KumoMenuBarVariantsProps = {}) {\n return cn(\n // Base styles\n \"flex rounded-lg border border-kumo-recessed bg-kumo-recessed pl-px shadow-xs transition-colors\",\n );\n}\n\n/** Props for an individual menu option within a MenuBar. */\ntype MenuOptionProps = {\n /** Icon element (typically from `@phosphor-icons/react`) rendered at 18px */\n icon: React.ReactNode;\n /** Unique identifier for the option (used when `optionIds` is true) */\n id?: number | string;\n /** Currently active value from the parent MenuBar */\n isActive?: number | boolean | string | undefined;\n /** Callback when this option is clicked */\n onClick: () => void;\n /** Tooltip text shown on hover */\n tooltip: string;\n};\n\nconst MenuOption = ({\n icon,\n id,\n isActive,\n onClick,\n tooltip,\n}: MenuOptionProps) => {\n const button = (\n <button\n aria-label={tooltip}\n className={cn(\n \"relative -ml-px flex h-full w-11 cursor-pointer items-center justify-center rounded-md border-none bg-kumo-recessed first:rounded-l-lg last:rounded-r-lg transition-colors focus:z-3 focus:outline-none focus:ring-kumo-focus/50 focus-visible:z-3 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n {\n \"z-2 bg-kumo-base shadow-xs transition-colors\": isActive === id,\n },\n )}\n onClick={onClick}\n >\n <IconContext.Provider value={{ size: 18 }} {...({} as any)}>\n {icon}\n </IconContext.Provider>\n </button>\n );\n\n return <Tooltip content={tooltip} render={button} />;\n};\n\n/**\n * MenuBar component props.\n *\n * Horizontal icon-button toolbar with keyboard navigation and tooltip labels.\n *\n * @example\n * ```tsx\n * <MenuBar\n * isActive={activeIndex}\n * options={[\n * { icon: <ListIcon />, tooltip: \"List view\", onClick: () => setView(\"list\") },\n * { icon: <GridFourIcon />, tooltip: \"Grid view\", onClick: () => setView(\"grid\") },\n * ]}\n * />\n * ```\n */\ntype MenuBarProps = {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** The currently active option value — matched against option index or `id`. */\n isActive: number | boolean | string | undefined;\n /** Array of menu option configurations. */\n options: MenuOptionProps[];\n /** When true, each option's `id` field is used for matching instead of its array index. */\n optionIds?: boolean;\n};\n\n/**\n * MenuBar — horizontal icon-button toolbar with keyboard arrow-key navigation.\n *\n * Each option renders as a `<button>` with a Tooltip. The active option is\n * visually highlighted with an elevated background.\n *\n * @example\n * ```tsx\n * <MenuBar\n * isActive={0}\n * options={[\n * { icon: <ListIcon />, tooltip: \"List\", onClick: () => {} },\n * { icon: <GridFourIcon />, tooltip: \"Grid\", onClick: () => {} },\n * ]}\n * />\n * ```\n */\nexport const MenuBar = ({\n className,\n isActive,\n options,\n optionIds = false, // if option needs an extra unique ID\n}: MenuBarProps) => {\n const menuRef = useRef<HTMLElement | null>(null);\n\n useMenuNavigation({ menuRef, direction: \"horizontal\" });\n\n return (\n <nav\n className={cn(\n \"isolate flex rounded-lg ring ring-kumo-line bg-kumo-recessed pl-px shadow-xs transition-colors\",\n className,\n )}\n ref={menuRef}\n >\n {options.map((option, index) => (\n <MenuOption\n key={index}\n {...option}\n isActive={isActive}\n id={optionIds ? option.id : index}\n />\n ))}\n </nav>\n );\n};\n"],"names":["useMenuNavigation","menuRef","direction","activeElementRef","useRef","useEffect","focusableElements","handleKeyDown","e","currentIndex","nextIndex","isHorizontal","forwardKey","backwardKey","nextElement","addKeyListener","removeKeyListener","handleFocusIn","handleFocusOut","MenuOption","icon","id","isActive","onClick","tooltip","button","jsx","cn","IconContext","Tooltip","MenuBar","className","options","optionIds","option","index"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"popover-i4opvl9g0as52fyx.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 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 +0,0 @@
1
- {"version":3,"file":"radio-g56o5rftpu1qpxuv.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 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 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 className={cn(\n \"m-0 group relative inline-flex items-center 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 value={value}\n disabled={disabled}\n className={cn(\n \"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\",\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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"}