@cloudflare/kumo 1.18.0 → 2.0.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 (330) hide show
  1. package/CHANGELOG.md +329 -0
  2. package/ai/component-registry.json +907 -159
  3. package/ai/component-registry.md +1929 -598
  4. package/ai/schemas.ts +58 -14
  5. package/dist/.build-complete +1 -1
  6. package/dist/ai/schemas.d.ts +206 -27
  7. package/dist/ai/schemas.d.ts.map +1 -1
  8. package/dist/ai/schemas.js +2003 -1948
  9. package/dist/ai/schemas.js.map +1 -1
  10. package/dist/chunks/Legend-ibjxhfm9pn2vrb6f.js +430 -0
  11. package/dist/chunks/Legend-ibjxhfm9pn2vrb6f.js.map +1 -0
  12. package/dist/chunks/autocomplete-cs3fwy6lwzlyirpq.js +174 -0
  13. package/dist/chunks/autocomplete-cs3fwy6lwzlyirpq.js.map +1 -0
  14. package/dist/chunks/{breadcrumbs-k39s28qx05vbxxth.js → breadcrumbs-cxcwf2l1ki3ffg5d.js} +2 -2
  15. package/dist/chunks/{breadcrumbs-k39s28qx05vbxxth.js.map → breadcrumbs-cxcwf2l1ki3ffg5d.js.map} +1 -1
  16. package/dist/chunks/{button-cdxnqcgzwko8ooha.js → button-6by9ntsa3nj553mq.js} +18 -19
  17. package/dist/chunks/button-6by9ntsa3nj553mq.js.map +1 -0
  18. package/dist/chunks/checkbox-eren6w2csum1xghg.js +210 -0
  19. package/dist/chunks/checkbox-eren6w2csum1xghg.js.map +1 -0
  20. package/dist/chunks/{clipboard-text-vcbvmtne4zjk4b18.js → clipboard-text-f9q753udny1uyxr5.js} +47 -43
  21. package/dist/chunks/{clipboard-text-vcbvmtne4zjk4b18.js.map → clipboard-text-f9q753udny1uyxr5.js.map} +1 -1
  22. package/dist/chunks/{cloudflare-logo-bgts2jgsdh7sslw4.js → cloudflare-logo-pbavoe1wu8nr5c4n.js} +9 -9
  23. package/dist/chunks/{cloudflare-logo-bgts2jgsdh7sslw4.js.map → cloudflare-logo-pbavoe1wu8nr5c4n.js.map} +1 -1
  24. package/dist/chunks/collapsible-k8urhi16pg90jvxa.js +71 -0
  25. package/dist/chunks/collapsible-k8urhi16pg90jvxa.js.map +1 -0
  26. package/dist/chunks/{combobox-he2hd9e2ruknq5mp.js → combobox-n9qht9h9ag6kh5sn.js} +142 -118
  27. package/dist/chunks/combobox-n9qht9h9ag6kh5sn.js.map +1 -0
  28. package/dist/chunks/{command-palette-jc1w07jwakxvj23a.js → command-palette-gk9m34ymp2b3hfc5.js} +130 -130
  29. package/dist/chunks/command-palette-gk9m34ymp2b3hfc5.js.map +1 -0
  30. package/dist/chunks/{date-range-picker-j318zxjyqz4o3dak.js → date-range-picker-c9wnx9tbwohai7jy.js} +26 -26
  31. package/dist/chunks/{date-range-picker-j318zxjyqz4o3dak.js.map → date-range-picker-c9wnx9tbwohai7jy.js.map} +1 -1
  32. package/dist/chunks/{dialog-oqh8l3l3zutpibxx.js → dialog-94v7wiz7j3in6528.js} +25 -25
  33. package/dist/chunks/dialog-94v7wiz7j3in6528.js.map +1 -0
  34. package/dist/chunks/dropdown-zbax0zowy6m9zhmt.js +302 -0
  35. package/dist/chunks/dropdown-zbax0zowy6m9zhmt.js.map +1 -0
  36. package/dist/chunks/{empty-cj898km1r8xwuw44.js → empty-kpymw59thjf2ip8g.js} +9 -9
  37. package/dist/chunks/{empty-cj898km1r8xwuw44.js.map → empty-kpymw59thjf2ip8g.js.map} +1 -1
  38. package/dist/chunks/{field-krp6z6vfbkrvufz2.js → field-lnj619xpe8zjd26r.js} +7 -7
  39. package/dist/chunks/{field-krp6z6vfbkrvufz2.js.map → field-lnj619xpe8zjd26r.js.map} +1 -1
  40. package/dist/chunks/{grid-m9r71jxo2b8q1972.js → grid-hj1ylz16p7g5uelh.js} +2 -2
  41. package/dist/chunks/{grid-m9r71jxo2b8q1972.js.map → grid-hj1ylz16p7g5uelh.js.map} +1 -1
  42. package/dist/chunks/{input-area-no30c09udyjxshu5.js → input-area-h8xbqturegdfm1mi.js} +4 -4
  43. package/dist/chunks/{input-area-no30c09udyjxshu5.js.map → input-area-h8xbqturegdfm1mi.js.map} +1 -1
  44. package/dist/chunks/input-group-dh4pg8p20rh4mdi0.js +505 -0
  45. package/dist/chunks/input-group-dh4pg8p20rh4mdi0.js.map +1 -0
  46. package/dist/chunks/{input-h48k3uagzrgb98au.js → input-lpa5fc75tgrraafv.js} +45 -45
  47. package/dist/chunks/input-lpa5fc75tgrraafv.js.map +1 -0
  48. package/dist/chunks/label-be8m7qzlakzig2sl.js +68 -0
  49. package/dist/chunks/{label-latndvb1ngem7we8.js.map → label-be8m7qzlakzig2sl.js.map} +1 -1
  50. package/dist/chunks/layer-card-hvivdirwwnyq88wa.js +46 -0
  51. package/dist/chunks/layer-card-hvivdirwwnyq88wa.js.map +1 -0
  52. package/dist/chunks/{link-hn5ejal7nhh0o0b4.js → link-kt74pxkud4olmcer.js} +4 -4
  53. package/dist/chunks/{link-hn5ejal7nhh0o0b4.js.map → link-kt74pxkud4olmcer.js.map} +1 -1
  54. package/dist/chunks/menubar-hwev159bm4rw9ixk.js +96 -0
  55. package/dist/chunks/menubar-hwev159bm4rw9ixk.js.map +1 -0
  56. package/dist/chunks/{meter-gfa1hz9fhjnvx784.js → meter-bqetlujwg8gm2u7m.js} +2 -2
  57. package/dist/chunks/{meter-gfa1hz9fhjnvx784.js.map → meter-bqetlujwg8gm2u7m.js.map} +1 -1
  58. package/dist/chunks/pagination-ho8zesqfyp6ckmrl.js +266 -0
  59. package/dist/chunks/pagination-ho8zesqfyp6ckmrl.js.map +1 -0
  60. package/dist/chunks/{popover-h300w4vit0s2ayej.js → popover-iayd9ya5yhujz6ve.js} +69 -73
  61. package/dist/chunks/popover-iayd9ya5yhujz6ve.js.map +1 -0
  62. package/dist/chunks/{radio-jouttv89lbvhs55r.js → radio-datzh3pilz8ojak1.js} +87 -75
  63. package/dist/chunks/radio-datzh3pilz8ojak1.js.map +1 -0
  64. package/dist/chunks/select-kpfbib9l8xrrmzpz.js +215 -0
  65. package/dist/chunks/select-kpfbib9l8xrrmzpz.js.map +1 -0
  66. package/dist/chunks/{sensitive-input-hd4tpqkzifad1yca.js → sensitive-input-i1upqytzaw2pus8v.js} +42 -42
  67. package/dist/chunks/sensitive-input-i1upqytzaw2pus8v.js.map +1 -0
  68. package/dist/chunks/{sidebar-hljy3ssm8itc0ucx.js → sidebar-kh37grvfxto14ek6.js} +146 -147
  69. package/dist/chunks/sidebar-kh37grvfxto14ek6.js.map +1 -0
  70. package/dist/chunks/surface-o63tktyrifcjejyb.js +29 -0
  71. package/dist/chunks/surface-o63tktyrifcjejyb.js.map +1 -0
  72. package/dist/chunks/{switch-ihaydbzem62bey4p.js → switch-lclhiplr9zqf73tj.js} +89 -81
  73. package/dist/chunks/switch-lclhiplr9zqf73tj.js.map +1 -0
  74. package/dist/chunks/table-fyy8gl875yyevqs3.js +207 -0
  75. package/dist/chunks/table-fyy8gl875yyevqs3.js.map +1 -0
  76. package/dist/chunks/table-of-contents-fzyv7uhnnyr13dqu.js +102 -0
  77. package/dist/chunks/table-of-contents-fzyv7uhnnyr13dqu.js.map +1 -0
  78. package/dist/chunks/{tabs-e7eh7l3mpk3xgmwq.js → tabs-jywwt8ebjqjkux75.js} +21 -21
  79. package/dist/chunks/{tabs-e7eh7l3mpk3xgmwq.js.map → tabs-jywwt8ebjqjkux75.js.map} +1 -1
  80. package/dist/chunks/{text-nmyi1rkwdj37f30f.js → text-f7t467waymhb30sx.js} +8 -8
  81. package/dist/chunks/text-f7t467waymhb30sx.js.map +1 -0
  82. package/dist/chunks/{toast-bpz6iaq54u9jmuu8.js → toast-h573o0tc7tefivk2.js} +12 -12
  83. package/dist/chunks/{toast-bpz6iaq54u9jmuu8.js.map → toast-h573o0tc7tefivk2.js.map} +1 -1
  84. package/dist/chunks/{tooltip-belkznz8t8333h5f.js → tooltip-odudhkxe282wxinq.js} +38 -37
  85. package/dist/chunks/tooltip-odudhkxe282wxinq.js.map +1 -0
  86. package/dist/chunks/vendor-base-ui-ie71jahf0czyf58j.js +24638 -0
  87. package/dist/chunks/vendor-base-ui-ie71jahf0czyf58j.js.map +1 -0
  88. package/dist/chunks/vendor-floating-ui-dwag5e88viikh2zs.js +1311 -0
  89. package/dist/chunks/vendor-floating-ui-dwag5e88viikh2zs.js.map +1 -0
  90. package/dist/chunks/vendor-utils-ixnhxmehwihk5tr7.js +534 -0
  91. package/dist/chunks/vendor-utils-ixnhxmehwihk5tr7.js.map +1 -0
  92. package/dist/code.js +1 -1
  93. package/dist/components/autocomplete.js +9 -0
  94. package/dist/components/autocomplete.js.map +1 -0
  95. package/dist/components/breadcrumbs.js +1 -1
  96. package/dist/components/button.js +1 -1
  97. package/dist/components/chart.js +1 -1
  98. package/dist/components/checkbox.js +1 -1
  99. package/dist/components/clipboard-text.js +1 -1
  100. package/dist/components/cloudflare-logo.js +1 -1
  101. package/dist/components/collapsible.js +1 -1
  102. package/dist/components/combobox.js +1 -1
  103. package/dist/components/command-palette.js +1 -1
  104. package/dist/components/date-range-picker.js +1 -1
  105. package/dist/components/dialog.js +1 -1
  106. package/dist/components/dropdown.js +1 -1
  107. package/dist/components/empty.js +1 -1
  108. package/dist/components/field.js +1 -1
  109. package/dist/components/flow.js +2 -2
  110. package/dist/components/flow.js.map +1 -1
  111. package/dist/components/grid.js +1 -1
  112. package/dist/components/input-group.js +8 -0
  113. package/dist/components/input-group.js.map +1 -0
  114. package/dist/components/input.js +9 -7
  115. package/dist/components/label.js +1 -1
  116. package/dist/components/layer-card.js +1 -1
  117. package/dist/components/link.js +1 -1
  118. package/dist/components/menubar.js +1 -1
  119. package/dist/components/meter.js +1 -1
  120. package/dist/components/pagination.js +1 -1
  121. package/dist/components/popover.js +1 -1
  122. package/dist/components/radio.js +1 -1
  123. package/dist/components/select.js +1 -1
  124. package/dist/components/sensitive-input.js +1 -1
  125. package/dist/components/sidebar.js +1 -1
  126. package/dist/components/surface.js +1 -1
  127. package/dist/components/switch.js +1 -1
  128. package/dist/components/table-of-contents.js +8 -0
  129. package/dist/components/table-of-contents.js.map +1 -0
  130. package/dist/components/table.js +1 -1
  131. package/dist/components/tabs.js +1 -1
  132. package/dist/components/text.js +1 -1
  133. package/dist/components/toast.js +2 -2
  134. package/dist/components/tooltip.js +1 -1
  135. package/dist/index.js +148 -139
  136. package/dist/index.js.map +1 -1
  137. package/dist/primitives/accordion.js +1 -1
  138. package/dist/primitives/alert-dialog.js +1 -1
  139. package/dist/primitives/autocomplete.js +1 -1
  140. package/dist/primitives/avatar.js +1 -1
  141. package/dist/primitives/button.js +1 -1
  142. package/dist/primitives/checkbox-group.js +1 -1
  143. package/dist/primitives/checkbox.js +1 -1
  144. package/dist/primitives/collapsible.js +1 -1
  145. package/dist/primitives/combobox.js +1 -1
  146. package/dist/primitives/context-menu.js +1 -1
  147. package/dist/primitives/csp-provider.js +1 -1
  148. package/dist/primitives/dialog.js +1 -1
  149. package/dist/primitives/direction-provider.js +1 -1
  150. package/dist/primitives/drawer.js +2 -2
  151. package/dist/primitives/field.js +1 -1
  152. package/dist/primitives/fieldset.js +1 -1
  153. package/dist/primitives/form.js +1 -1
  154. package/dist/primitives/input.js +1 -1
  155. package/dist/primitives/menu.js +1 -1
  156. package/dist/primitives/menubar.js +1 -1
  157. package/dist/primitives/meter.js +1 -1
  158. package/dist/primitives/navigation-menu.js +1 -1
  159. package/dist/primitives/number-field.js +1 -1
  160. package/dist/primitives/otp-field.js +6 -0
  161. package/dist/primitives/otp-field.js.map +1 -0
  162. package/dist/primitives/popover.js +1 -1
  163. package/dist/primitives/preview-card.js +2 -2
  164. package/dist/primitives/progress.js +1 -1
  165. package/dist/primitives/radio-group.js +1 -1
  166. package/dist/primitives/radio.js +1 -1
  167. package/dist/primitives/scroll-area.js +1 -1
  168. package/dist/primitives/select.js +1 -1
  169. package/dist/primitives/separator.js +1 -1
  170. package/dist/primitives/slider.js +1 -1
  171. package/dist/primitives/switch.js +1 -1
  172. package/dist/primitives/tabs.js +1 -1
  173. package/dist/primitives/toast.js +1 -1
  174. package/dist/primitives/toggle-group.js +1 -1
  175. package/dist/primitives/toggle.js +1 -1
  176. package/dist/primitives/toolbar.js +1 -1
  177. package/dist/primitives/tooltip.js +1 -1
  178. package/dist/primitives.js +22 -21
  179. package/dist/scripts/theme-generator/config.d.ts.map +1 -1
  180. package/dist/scripts/theme-generator/config.js +13 -3
  181. package/dist/scripts/theme-generator/config.js.map +1 -1
  182. package/dist/src/components/autocomplete/autocomplete.d.ts +180 -0
  183. package/dist/src/components/autocomplete/autocomplete.d.ts.map +1 -0
  184. package/dist/src/components/autocomplete/index.d.ts +2 -0
  185. package/dist/src/components/autocomplete/index.d.ts.map +1 -0
  186. package/dist/src/components/button/button.d.ts +3 -3
  187. package/dist/src/components/button/button.d.ts.map +1 -1
  188. package/dist/src/components/chart/Color.d.ts +36 -52
  189. package/dist/src/components/chart/Color.d.ts.map +1 -1
  190. package/dist/src/components/chart/EChart.d.ts +18 -2
  191. package/dist/src/components/chart/EChart.d.ts.map +1 -1
  192. package/dist/src/components/chart/TimeseriesChart.d.ts.map +1 -1
  193. package/dist/src/components/chart/index.d.ts +1 -1
  194. package/dist/src/components/chart/index.d.ts.map +1 -1
  195. package/dist/src/components/checkbox/checkbox.d.ts +37 -14
  196. package/dist/src/components/checkbox/checkbox.d.ts.map +1 -1
  197. package/dist/src/components/checkbox/index.d.ts +1 -1
  198. package/dist/src/components/checkbox/index.d.ts.map +1 -1
  199. package/dist/src/components/clipboard-text/clipboard-text.d.ts.map +1 -1
  200. package/dist/src/components/collapsible/collapsible.d.ts +77 -40
  201. package/dist/src/components/collapsible/collapsible.d.ts.map +1 -1
  202. package/dist/src/components/collapsible/index.d.ts +1 -1
  203. package/dist/src/components/collapsible/index.d.ts.map +1 -1
  204. package/dist/src/components/combobox/combobox.d.ts +19 -3
  205. package/dist/src/components/combobox/combobox.d.ts.map +1 -1
  206. package/dist/src/components/command-palette/command-palette.d.ts +2 -11
  207. package/dist/src/components/command-palette/command-palette.d.ts.map +1 -1
  208. package/dist/src/components/command-palette/index.d.ts +1 -1
  209. package/dist/src/components/command-palette/index.d.ts.map +1 -1
  210. package/dist/src/components/command-palette/types.d.ts +13 -1
  211. package/dist/src/components/command-palette/types.d.ts.map +1 -1
  212. package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
  213. package/dist/src/components/input/index.d.ts +16 -1
  214. package/dist/src/components/input/index.d.ts.map +1 -1
  215. package/dist/src/components/input/input.d.ts +2 -2
  216. package/dist/src/components/input/input.d.ts.map +1 -1
  217. package/dist/src/components/input-group/context.d.ts +96 -0
  218. package/dist/src/components/input-group/context.d.ts.map +1 -0
  219. package/dist/src/components/input-group/index.d.ts +2 -0
  220. package/dist/src/components/input-group/index.d.ts.map +1 -0
  221. package/dist/src/components/input-group/input-group-addon.d.ts +15 -0
  222. package/dist/src/components/input-group/input-group-addon.d.ts.map +1 -0
  223. package/dist/src/components/input-group/input-group-button.d.ts +36 -0
  224. package/dist/src/components/input-group/input-group-button.d.ts.map +1 -0
  225. package/dist/src/components/input-group/input-group-input.d.ts +9 -0
  226. package/dist/src/components/input-group/input-group-input.d.ts.map +1 -0
  227. package/dist/src/components/input-group/input-group-suffix.d.ts +13 -0
  228. package/dist/src/components/input-group/input-group-suffix.d.ts.map +1 -0
  229. package/dist/src/components/input-group/input-group.d.ts +43 -0
  230. package/dist/src/components/input-group/input-group.d.ts.map +1 -0
  231. package/dist/src/components/label/label.d.ts.map +1 -1
  232. package/dist/src/components/layer-card/layer-card.d.ts +39 -5
  233. package/dist/src/components/layer-card/layer-card.d.ts.map +1 -1
  234. package/dist/src/components/menubar/menubar.d.ts.map +1 -1
  235. package/dist/src/components/pagination/pagination.d.ts +51 -1
  236. package/dist/src/components/pagination/pagination.d.ts.map +1 -1
  237. package/dist/src/components/popover/popover.d.ts +35 -8
  238. package/dist/src/components/popover/popover.d.ts.map +1 -1
  239. package/dist/src/components/radio/index.d.ts +1 -1
  240. package/dist/src/components/radio/index.d.ts.map +1 -1
  241. package/dist/src/components/radio/radio.d.ts +44 -8
  242. package/dist/src/components/radio/radio.d.ts.map +1 -1
  243. package/dist/src/components/select/select.d.ts +52 -8
  244. package/dist/src/components/select/select.d.ts.map +1 -1
  245. package/dist/src/components/sensitive-input/sensitive-input.d.ts +2 -2
  246. package/dist/src/components/sidebar/sidebar.d.ts +2 -2
  247. package/dist/src/components/sidebar/sidebar.d.ts.map +1 -1
  248. package/dist/src/components/surface/index.d.ts +3 -0
  249. package/dist/src/components/surface/index.d.ts.map +1 -1
  250. package/dist/src/components/surface/surface.d.ts +14 -10
  251. package/dist/src/components/surface/surface.d.ts.map +1 -1
  252. package/dist/src/components/switch/index.d.ts +1 -1
  253. package/dist/src/components/switch/index.d.ts.map +1 -1
  254. package/dist/src/components/switch/switch.d.ts +31 -3
  255. package/dist/src/components/switch/switch.d.ts.map +1 -1
  256. package/dist/src/components/table/table.d.ts +17 -2
  257. package/dist/src/components/table/table.d.ts.map +1 -1
  258. package/dist/src/components/table-of-contents/index.d.ts +2 -0
  259. package/dist/src/components/table-of-contents/index.d.ts.map +1 -0
  260. package/dist/src/components/table-of-contents/table-of-contents.d.ts +72 -0
  261. package/dist/src/components/table-of-contents/table-of-contents.d.ts.map +1 -0
  262. package/dist/src/components/text/text.d.ts +34 -6
  263. package/dist/src/components/text/text.d.ts.map +1 -1
  264. package/dist/src/components/text/text.type-spec.d.ts +44 -0
  265. package/dist/src/components/text/text.type-spec.d.ts.map +1 -0
  266. package/dist/src/components/toast/toast.d.ts +1 -1
  267. package/dist/src/components/toast/toast.d.ts.map +1 -1
  268. package/dist/src/components/tooltip/tooltip.d.ts +15 -6
  269. package/dist/src/components/tooltip/tooltip.d.ts.map +1 -1
  270. package/dist/src/index.d.ts +14 -8
  271. package/dist/src/index.d.ts.map +1 -1
  272. package/dist/src/primitives/index.d.ts +1 -0
  273. package/dist/src/primitives/index.d.ts.map +1 -1
  274. package/dist/src/primitives/otp-field.d.ts +13 -0
  275. package/dist/src/primitives/otp-field.d.ts.map +1 -0
  276. package/dist/styles/kumo-binding.css +19 -0
  277. package/dist/styles/kumo-standalone.css +1 -1
  278. package/dist/styles/kumo.css +2 -2
  279. package/dist/styles/theme-kumo.css +13 -6
  280. package/package.json +18 -2
  281. package/scripts/component-registry/discovery.ts +1 -0
  282. package/scripts/component-registry/index.test.ts +265 -0
  283. package/scripts/component-registry/index.ts +14 -0
  284. package/scripts/component-registry/metadata.ts +55 -7
  285. package/scripts/component-registry/sub-components.ts +81 -50
  286. package/scripts/component-registry/types.ts +2 -0
  287. package/scripts/theme-generator/config.ts +18 -6
  288. package/dist/chunks/Legend-o0ntojbaplmszwk0.js +0 -421
  289. package/dist/chunks/Legend-o0ntojbaplmszwk0.js.map +0 -1
  290. package/dist/chunks/button-cdxnqcgzwko8ooha.js.map +0 -1
  291. package/dist/chunks/checkbox-kt1uojk2f9e0d0h1.js +0 -211
  292. package/dist/chunks/checkbox-kt1uojk2f9e0d0h1.js.map +0 -1
  293. package/dist/chunks/collapsible-jhzee3ks51d3xowb.js +0 -58
  294. package/dist/chunks/collapsible-jhzee3ks51d3xowb.js.map +0 -1
  295. package/dist/chunks/combobox-he2hd9e2ruknq5mp.js.map +0 -1
  296. package/dist/chunks/command-palette-jc1w07jwakxvj23a.js.map +0 -1
  297. package/dist/chunks/dialog-oqh8l3l3zutpibxx.js.map +0 -1
  298. package/dist/chunks/dropdown-ncwhcd912vmone8k.js +0 -300
  299. package/dist/chunks/dropdown-ncwhcd912vmone8k.js.map +0 -1
  300. package/dist/chunks/input-group-lxdd09p60cf27pe1.js +0 -111
  301. package/dist/chunks/input-group-lxdd09p60cf27pe1.js.map +0 -1
  302. package/dist/chunks/input-h48k3uagzrgb98au.js.map +0 -1
  303. package/dist/chunks/label-latndvb1ngem7we8.js +0 -62
  304. package/dist/chunks/layer-card-l5yjvrxry1dhte57.js +0 -44
  305. package/dist/chunks/layer-card-l5yjvrxry1dhte57.js.map +0 -1
  306. package/dist/chunks/menubar-f1pilzooe5mue7c4.js +0 -92
  307. package/dist/chunks/menubar-f1pilzooe5mue7c4.js.map +0 -1
  308. package/dist/chunks/pagination-cu5lm6p5dxuycta4.js +0 -243
  309. package/dist/chunks/pagination-cu5lm6p5dxuycta4.js.map +0 -1
  310. package/dist/chunks/popover-h300w4vit0s2ayej.js.map +0 -1
  311. package/dist/chunks/radio-jouttv89lbvhs55r.js.map +0 -1
  312. package/dist/chunks/select-kva5ru5f673kah1m.js +0 -179
  313. package/dist/chunks/select-kva5ru5f673kah1m.js.map +0 -1
  314. package/dist/chunks/sensitive-input-hd4tpqkzifad1yca.js.map +0 -1
  315. package/dist/chunks/sidebar-hljy3ssm8itc0ucx.js.map +0 -1
  316. package/dist/chunks/surface-cilvbyhmyujz1bee.js +0 -36
  317. package/dist/chunks/surface-cilvbyhmyujz1bee.js.map +0 -1
  318. package/dist/chunks/switch-ihaydbzem62bey4p.js.map +0 -1
  319. package/dist/chunks/table-inweecadl3her7pd.js +0 -183
  320. package/dist/chunks/table-inweecadl3her7pd.js.map +0 -1
  321. package/dist/chunks/text-nmyi1rkwdj37f30f.js.map +0 -1
  322. package/dist/chunks/tooltip-belkznz8t8333h5f.js.map +0 -1
  323. package/dist/chunks/vendor-base-ui-k7bzesq81ie36nya.js +0 -22813
  324. package/dist/chunks/vendor-base-ui-k7bzesq81ie36nya.js.map +0 -1
  325. package/dist/chunks/vendor-floating-ui-gr9m6tsa1cpqwn99.js +0 -1286
  326. package/dist/chunks/vendor-floating-ui-gr9m6tsa1cpqwn99.js.map +0 -1
  327. package/dist/chunks/vendor-utils-fxk97j6xi1g42z2v.js +0 -740
  328. package/dist/chunks/vendor-utils-fxk97j6xi1g42z2v.js.map +0 -1
  329. package/dist/src/components/input/input-group.d.ts +0 -39
  330. package/dist/src/components/input/input-group.d.ts.map +0 -1
@@ -1,211 +0,0 @@
1
- "use client";
2
- import { jsx as e, jsxs as C } from "react/jsx-runtime";
3
- import { forwardRef as N, createContext as B, useContext as F } from "react";
4
- import { MinusIcon as y, CheckIcon as w } from "@phosphor-icons/react";
5
- import { c as b } from "./cn-ct4n7r74mh8y0f48.js";
6
- import { L as K } from "./label-latndvb1ngem7we8.js";
7
- import { K as j, L, N as E, O as R, C as _, P as G, Q as M } from "./vendor-base-ui-k7bzesq81ie36nya.js";
8
- const Q = {
9
- variant: {
10
- default: {
11
- classes: "[&:focus-within>span]:ring-kumo-hairline [&:hover>span]:ring-kumo-hairline",
12
- description: "Default checkbox appearance"
13
- },
14
- error: {
15
- classes: "[&>span]:ring-kumo-danger",
16
- description: "Error state for validation failures"
17
- }
18
- }
19
- }, W = {
20
- variant: "default"
21
- }, O = B({
22
- controlFirst: !0
23
- }), A = N(
24
- ({
25
- className: s,
26
- checked: c,
27
- indeterminate: o,
28
- disabled: t,
29
- variant: l = "default",
30
- label: r,
31
- labelTooltip: m,
32
- controlFirst: u = !0,
33
- onCheckedChange: d,
34
- onValueChange: h,
35
- onChange: i,
36
- required: f,
37
- name: x,
38
- ...a
39
- }, g) => {
40
- if (process.env.NODE_ENV !== "production") {
41
- const n = !!r, k = !!a["aria-label"], p = !!a["aria-labelledby"];
42
- !n && !k && !p && console.warn(
43
- `[Kumo Checkbox]: Checkbox must have an accessible name. Provide either:
44
- - label prop: <Checkbox label='Accept terms' />
45
- - aria-label: <Checkbox aria-label='Select item' />
46
- - aria-labelledby for custom label association
47
- Note: When used inside Checkbox.Group, label is optional`
48
- );
49
- }
50
- const v = /* @__PURE__ */ e(
51
- j,
52
- {
53
- ref: g,
54
- name: x,
55
- checked: c,
56
- indeterminate: o,
57
- disabled: t,
58
- onCheckedChange: (n, k) => {
59
- if (d?.(n), h?.(n), i) {
60
- const p = Object.assign(k.event, {
61
- target: { checked: n }
62
- });
63
- i(p);
64
- }
65
- },
66
- className: b(
67
- "relative flex h-4 w-4 items-center justify-center rounded-sm border-0 bg-kumo-base ring after:absolute after:-inset-x-3 after:-inset-y-2",
68
- l === "error" ? "ring-kumo-danger" : "ring-kumo-line",
69
- !t && "hover:ring-kumo-hairline focus-visible:ring-kumo-hairline",
70
- "data-[checked]:bg-kumo-contrast data-[checked]:ring-kumo-contrast data-[indeterminate]:bg-kumo-contrast data-[indeterminate]:ring-kumo-contrast",
71
- t && "cursor-not-allowed opacity-50",
72
- s
73
- ),
74
- ...a,
75
- children: /* @__PURE__ */ e(
76
- L,
77
- {
78
- keepMounted: !0,
79
- className: "flex items-center justify-center text-kumo-inverse data-[unchecked]:invisible",
80
- render: (n, k) => /* @__PURE__ */ e("span", { ...n, children: k.indeterminate ? /* @__PURE__ */ e(y, { weight: "bold", size: 12 }) : /* @__PURE__ */ e(w, { weight: "bold", size: 12 }) })
81
- }
82
- )
83
- }
84
- );
85
- return r ? /* @__PURE__ */ e(E, { className: "inline-flex", children: /* @__PURE__ */ C(
86
- R,
87
- {
88
- className: b(
89
- "!m-0 !min-h-0 !text-base inline-flex items-center gap-2",
90
- u ? "flex-row" : "flex-row-reverse justify-end",
91
- t ? "cursor-not-allowed" : "cursor-pointer"
92
- ),
93
- children: [
94
- v,
95
- /* @__PURE__ */ e(
96
- K,
97
- {
98
- showOptional: f === !1,
99
- tooltip: m,
100
- asContent: !0,
101
- children: r
102
- }
103
- )
104
- ]
105
- }
106
- ) }) : v;
107
- }
108
- );
109
- A.displayName = "Checkbox";
110
- const I = N(
111
- ({
112
- className: s,
113
- checked: c,
114
- indeterminate: o,
115
- disabled: t,
116
- variant: l = "default",
117
- label: r,
118
- value: m,
119
- onCheckedChange: u,
120
- onValueChange: d,
121
- name: h
122
- }, i) => {
123
- const { controlFirst: f } = F(O), x = (a) => {
124
- u?.(a), d?.(a);
125
- };
126
- return /* @__PURE__ */ C(
127
- "label",
128
- {
129
- className: b(
130
- "m-0 relative inline-flex items-center gap-2",
131
- // Control first (default): checkbox before label
132
- // Label first: label before checkbox using flex-row-reverse
133
- !f && "flex-row-reverse justify-end",
134
- t ? "cursor-not-allowed opacity-50" : "cursor-pointer",
135
- s
136
- ),
137
- children: [
138
- /* @__PURE__ */ e(
139
- j,
140
- {
141
- ref: i,
142
- value: m,
143
- name: h,
144
- checked: c,
145
- indeterminate: o,
146
- disabled: t,
147
- onCheckedChange: x,
148
- className: b(
149
- "peer relative flex h-4 w-4 items-center justify-center rounded-sm border-0 bg-kumo-base ring after:absolute after:-inset-x-3 after:-inset-y-2",
150
- l === "error" ? "ring-kumo-danger" : "ring-kumo-line",
151
- !t && "group-hover:ring-kumo-hairline hover:ring-kumo-hairline focus-visible:ring-kumo-hairline",
152
- "data-[checked]:bg-kumo-contrast data-[checked]:ring-kumo-contrast data-[indeterminate]:bg-kumo-contrast data-[indeterminate]:ring-kumo-contrast"
153
- ),
154
- children: /* @__PURE__ */ e(
155
- L,
156
- {
157
- keepMounted: !0,
158
- className: "flex items-center justify-center text-kumo-inverse data-[unchecked]:invisible",
159
- render: (a, g) => /* @__PURE__ */ e("span", { ...a, children: g.indeterminate ? /* @__PURE__ */ e(y, { weight: "bold", size: 12 }) : /* @__PURE__ */ e(w, { weight: "bold", size: 12 }) })
160
- }
161
- )
162
- }
163
- ),
164
- /* @__PURE__ */ e("span", { className: "text-base text-kumo-default", children: r })
165
- ]
166
- }
167
- );
168
- }
169
- );
170
- I.displayName = "Checkbox.Item";
171
- function z({
172
- legend: s,
173
- children: c,
174
- error: o,
175
- description: t,
176
- defaultValue: l,
177
- value: r,
178
- onValueChange: m,
179
- allValues: u,
180
- disabled: d,
181
- controlFirst: h = !0,
182
- className: i
183
- }) {
184
- return /* @__PURE__ */ e(O.Provider, { value: { controlFirst: h }, children: /* @__PURE__ */ e(
185
- _,
186
- {
187
- defaultValue: l,
188
- value: r,
189
- onValueChange: m,
190
- allValues: u,
191
- disabled: d,
192
- children: /* @__PURE__ */ C(G, { className: b("flex flex-col gap-4", i), children: [
193
- /* @__PURE__ */ e(M, { className: "text-base font-medium text-kumo-default", children: s }),
194
- /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: c }),
195
- o && /* @__PURE__ */ e("p", { className: "text-sm text-kumo-danger", children: o }),
196
- t && /* @__PURE__ */ e("p", { className: "text-sm text-kumo-subtle", children: t })
197
- ] })
198
- }
199
- ) });
200
- }
201
- const D = Object.assign(A, {
202
- Item: I,
203
- Group: z
204
- });
205
- D.displayName = "Checkbox";
206
- export {
207
- D as C,
208
- Q as K,
209
- W as a
210
- };
211
- //# sourceMappingURL=checkbox-kt1uojk2f9e0d0h1.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"checkbox-kt1uojk2f9e0d0h1.js","sources":["../../src/components/checkbox/checkbox.tsx"],"sourcesContent":["import { forwardRef, createContext, useContext, type ReactNode } from \"react\";\nimport { CheckIcon, MinusIcon } from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\nimport { Fieldset } from \"@base-ui/react/fieldset\";\nimport { Field as FieldBase } from \"@base-ui/react/field\";\nimport { CheckboxGroup as BaseCheckboxGroup } from \"@base-ui/react/checkbox-group\";\nimport {\n Checkbox as BaseCheckbox,\n type CheckboxRootChangeEventDetails,\n} from \"@base-ui/react/checkbox\";\n\n/** Checkbox variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_CHECKBOX_VARIANTS = {\n variant: {\n default: {\n classes:\n \"[&:focus-within>span]:ring-kumo-hairline [&:hover>span]:ring-kumo-hairline\",\n description: \"Default checkbox appearance\",\n },\n error: {\n classes: \"[&>span]:ring-kumo-danger\",\n description: \"Error state for validation failures\",\n },\n },\n} as const;\n\nexport const KUMO_CHECKBOX_DEFAULT_VARIANTS = {\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_CHECKBOX_VARIANTS\nexport type KumoCheckboxVariant = keyof typeof KUMO_CHECKBOX_VARIANTS.variant;\n\nexport interface KumoCheckboxVariantsProps {\n /**\n * Visual variant.\n * - `\"default\"` — Standard checkbox appearance\n * - `\"error\"` — Error state for validation failures\n * @default \"default\"\n */\n variant?: KumoCheckboxVariant;\n}\n\nexport function checkboxVariants({\n variant = KUMO_CHECKBOX_DEFAULT_VARIANTS.variant,\n}: KumoCheckboxVariantsProps = {}) {\n return cn(KUMO_CHECKBOX_VARIANTS.variant[variant].classes);\n}\n\n// Legacy type alias for backwards compatibility\nexport type CheckboxVariant = KumoCheckboxVariant;\n\n// Context for passing controlFirst from Group to Items\nconst CheckboxGroupContext = createContext<{ controlFirst: boolean }>({\n controlFirst: true,\n});\n\n/**\n * Single checkbox component props with accessibility guidance.\n *\n * **Accessible Name Required:** Checkbox should have one of:\n * 1. `label` prop (recommended) - built-in Field wrapper with horizontal layout\n * 2. `aria-label` - for checkboxes without visible label\n * 3. `aria-labelledby` - for custom label association\n *\n * **Note:** When used inside Checkbox.Group or Dropdown, label is optional (parent provides context).\n *\n * Missing accessible names will trigger console warnings in development (unless inside a group).\n *\n * @example\n * // Recommended: Built-in Field wrapper with label\n * <Checkbox label=\"Accept terms and conditions\" />\n *\n * @example\n * // Control-first layout (checkbox before label)\n * <Checkbox label=\"Remember me\" controlFirst={true} />\n *\n * @example\n * // Label-first layout (label before checkbox)\n * <Checkbox label=\"Enable notifications\" controlFirst={false} />\n *\n * @example\n * // Error variant (visual only, no error text for single checkboxes)\n * <Checkbox label=\"Required field\" variant=\"error\" />\n *\n * @example\n * // Without visible label (aria-label required)\n * <Checkbox aria-label=\"Select all items\" />\n *\n * @example\n * // Custom label association\n * <label id=\"terms-label\">I accept the terms</label>\n * <Checkbox aria-labelledby=\"terms-label\" />\n *\n * @example\n * // Inside Checkbox.Group (label optional)\n * <Checkbox.Group legend=\"Preferences\">\n * <Checkbox.Item value=\"email\" label=\"Email notifications\" />\n * <Checkbox.Item value=\"sms\" label=\"SMS notifications\" />\n * </Checkbox.Group>\n */\nexport type CheckboxProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures (visual only, no error text) */\n variant?: CheckboxVariant;\n /** Label content for the checkbox (enables built-in Field wrapper) - can be a string or any React node */\n label?: ReactNode;\n /** Tooltip content to display next to the label via an info icon */\n labelTooltip?: ReactNode;\n /** When true (default), checkbox appears before label. When false, label appears before checkbox. */\n controlFirst?: boolean;\n /** Whether the checkbox is checked (controlled) */\n checked?: boolean;\n /** Whether the checkbox is in indeterminate state */\n indeterminate?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Callback when the checked state changes */\n onCheckedChange?: (checked: boolean) => void;\n /** @deprecated Use onCheckedChange instead */\n onValueChange?: (checked: boolean) => void;\n /** @deprecated Use onCheckedChange instead */\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n /** Click handler */\n onClick?: (event: React.MouseEvent) => void;\n /** Name for form submission */\n name?: string;\n /** Whether the field is required */\n required?: boolean;\n /** Additional class name */\n className?: string;\n /** Accessible label when no visible label is provided */\n \"aria-label\"?: string;\n /** ID of element that labels this checkbox */\n \"aria-labelledby\"?: string;\n};\n\n/**\n * Checkbox group component props (with built-in Fieldset and CheckboxGroup)\n *\n * Usage:\n * ```tsx\n * <Checkbox.Group\n * legend=\"Choose preferences\"\n * defaultValue={['email']}\n * error=\"You must select at least one option\"\n * >\n * <Checkbox.Item label=\"Email notifications\" value=\"email\" />\n * <Checkbox.Item label=\"SMS notifications\" value=\"sms\" />\n * </Checkbox.Group>\n * ```\n */\nexport interface CheckboxGroupProps {\n /** Legend text for the group */\n legend: string;\n /** Child Checkbox.Item components */\n children: ReactNode;\n /** Error message for the group (only appears in groups, not single checkboxes) */\n error?: string;\n /** Helper text for the group */\n description?: ReactNode;\n /** Values of checkboxes that should be initially checked (uncontrolled) */\n defaultValue?: string[];\n /** Values of checkboxes that should be checked (controlled) */\n value?: string[];\n /** Event handler called when checkbox values change */\n onValueChange?: (value: string[]) => void;\n /** All possible checkbox values (required for parent checkbox pattern) */\n allValues?: string[];\n /** Whether all checkboxes in the group are disabled */\n disabled?: boolean;\n /** When true (default), checkbox appears before label. When false, label appears before checkbox. */\n controlFirst?: boolean;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Individual checkbox item within a group\n */\nexport type CheckboxItemProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures */\n variant?: CheckboxVariant;\n /** Label text displayed next to checkbox */\n label: string;\n /** Value of the checkbox (required when used in Checkbox.Group) */\n value?: string;\n /** Additional CSS classes for the label wrapper */\n className?: string;\n checked?: boolean;\n indeterminate?: boolean;\n disabled?: boolean;\n /** Callback when the checked state changes */\n onCheckedChange?: (checked: boolean) => void;\n /** @deprecated Use onCheckedChange instead */\n onValueChange?: (checked: boolean) => void;\n name?: string;\n};\n\n// Single checkbox with built-in Field\nconst CheckboxBase = forwardRef<HTMLButtonElement, CheckboxProps>(\n (\n {\n className,\n checked,\n indeterminate,\n disabled,\n variant = \"default\",\n label,\n labelTooltip,\n controlFirst = true,\n onCheckedChange,\n onValueChange,\n onChange,\n required,\n name,\n ...props\n },\n ref,\n ) => {\n // A11y enforcement: warn in dev if no accessible name provided\n if (process.env.NODE_ENV !== \"production\") {\n const hasLabel = Boolean(label);\n const hasAriaLabel = Boolean(props[\"aria-label\"]);\n const hasAriaLabelledBy = Boolean(props[\"aria-labelledby\"]);\n\n if (!hasLabel && !hasAriaLabel && !hasAriaLabelledBy) {\n console.warn(\n \"[Kumo Checkbox]: Checkbox must have an accessible name. Provide either:\\n\" +\n \" - label prop: <Checkbox label='Accept terms' />\\n\" +\n \" - aria-label: <Checkbox aria-label='Select item' />\\n\" +\n \" - aria-labelledby for custom label association\\n\" +\n \" Note: When used inside Checkbox.Group, label is optional\",\n );\n }\n }\n\n // Handle onCheckedChange (preferred) and deprecated onValueChange/onChange\n const handleCheckedChange = (\n newChecked: boolean,\n eventDetails: CheckboxRootChangeEventDetails,\n ) => {\n onCheckedChange?.(newChecked);\n onValueChange?.(newChecked);\n if (onChange) {\n // Backwards compatibility: extend native event with target.checked\n // so existing code using `e.target.checked` continues to work\n const event = Object.assign(eventDetails.event, {\n target: { checked: newChecked },\n });\n onChange(event as never);\n }\n };\n\n const checkboxControl = (\n <BaseCheckbox.Root\n ref={ref}\n name={name}\n checked={checked}\n indeterminate={indeterminate}\n disabled={disabled}\n onCheckedChange={handleCheckedChange}\n className={cn(\n \"relative flex h-4 w-4 items-center justify-center rounded-sm border-0 bg-kumo-base ring after:absolute after:-inset-x-3 after:-inset-y-2\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled && \"hover:ring-kumo-hairline focus-visible:ring-kumo-hairline\",\n \"data-[checked]:bg-kumo-contrast data-[checked]:ring-kumo-contrast data-[indeterminate]:bg-kumo-contrast data-[indeterminate]:ring-kumo-contrast\",\n disabled && \"cursor-not-allowed opacity-50\",\n className,\n )}\n {...props}\n >\n <BaseCheckbox.Indicator\n keepMounted\n className=\"flex items-center justify-center text-kumo-inverse data-[unchecked]:invisible\"\n render={(renderProps, state) => (\n <span {...renderProps}>\n {state.indeterminate ? (\n <MinusIcon weight=\"bold\" size={12} />\n ) : (\n <CheckIcon weight=\"bold\" size={12} />\n )}\n </span>\n )}\n />\n </BaseCheckbox.Root>\n );\n\n // If no label provided, return bare checkbox (for use in other components like Dropdown)\n if (!label) {\n return checkboxControl;\n }\n\n // Use Field.Root + Field.Label enclosing pattern for proper a11y association\n // See: https://base-ui.com/react/components/field\n return (\n <FieldBase.Root className=\"inline-flex\">\n <FieldBase.Label\n className={cn(\n \"!m-0 !min-h-0 !text-base inline-flex items-center gap-2\",\n controlFirst ? \"flex-row\" : \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed\" : \"cursor-pointer\",\n )}\n >\n {checkboxControl}\n <Label\n showOptional={required === false}\n tooltip={labelTooltip}\n asContent\n >\n {label}\n </Label>\n </FieldBase.Label>\n </FieldBase.Root>\n );\n },\n);\n\nCheckboxBase.displayName = \"Checkbox\";\n\n// Checkbox.Item for use within Checkbox.Group\nconst CheckboxItem = forwardRef<HTMLButtonElement, CheckboxItemProps>(\n (\n {\n className,\n checked,\n indeterminate,\n disabled,\n variant = \"default\",\n label,\n value,\n onCheckedChange,\n onValueChange,\n name,\n },\n ref,\n ) => {\n const { controlFirst } = useContext(CheckboxGroupContext);\n\n // Handle onCheckedChange (preferred) and deprecated onValueChange\n const handleCheckedChange = (newChecked: boolean) => {\n onCheckedChange?.(newChecked);\n onValueChange?.(newChecked);\n };\n\n return (\n <label\n className={cn(\n \"m-0 relative inline-flex items-center gap-2\",\n // Control first (default): checkbox before label\n // Label first: label before checkbox using flex-row-reverse\n !controlFirst && \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\",\n className,\n )}\n >\n <BaseCheckbox.Root\n ref={ref}\n value={value}\n name={name}\n checked={checked}\n indeterminate={indeterminate}\n disabled={disabled}\n onCheckedChange={handleCheckedChange}\n className={cn(\n \"peer relative flex h-4 w-4 items-center justify-center rounded-sm border-0 bg-kumo-base ring after:absolute after:-inset-x-3 after:-inset-y-2\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled &&\n \"group-hover:ring-kumo-hairline hover:ring-kumo-hairline focus-visible:ring-kumo-hairline\",\n \"data-[checked]:bg-kumo-contrast data-[checked]:ring-kumo-contrast data-[indeterminate]:bg-kumo-contrast data-[indeterminate]:ring-kumo-contrast\",\n )}\n >\n <BaseCheckbox.Indicator\n keepMounted\n className=\"flex items-center justify-center text-kumo-inverse data-[unchecked]:invisible\"\n render={(renderProps, state) => (\n <span {...renderProps}>\n {state.indeterminate ? (\n <MinusIcon weight=\"bold\" size={12} />\n ) : (\n <CheckIcon weight=\"bold\" size={12} />\n )}\n </span>\n )}\n />\n </BaseCheckbox.Root>\n <span className=\"text-base text-kumo-default\">{label}</span>\n </label>\n );\n },\n);\n\nCheckboxItem.displayName = \"Checkbox.Item\";\n\n// Checkbox.Group with built-in Fieldset and CheckboxGroup\nfunction CheckboxGroup({\n legend,\n children,\n error,\n description,\n defaultValue,\n value,\n onValueChange,\n allValues,\n disabled,\n controlFirst = true,\n className,\n}: CheckboxGroupProps) {\n return (\n <CheckboxGroupContext.Provider value={{ controlFirst }}>\n <BaseCheckboxGroup\n defaultValue={defaultValue}\n value={value}\n onValueChange={onValueChange}\n allValues={allValues}\n disabled={disabled}\n >\n <Fieldset.Root className={cn(\"flex flex-col gap-4\", className)}>\n <Fieldset.Legend className=\"text-base font-medium text-kumo-default\">\n {legend}\n </Fieldset.Legend>\n <div className=\"flex flex-col gap-2\">{children}</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 </BaseCheckboxGroup>\n </CheckboxGroupContext.Provider>\n );\n}\n\n// Compound component\nexport const Checkbox = Object.assign(CheckboxBase, {\n Item: CheckboxItem,\n Group: CheckboxGroup,\n});\n\nCheckbox.displayName = \"Checkbox\";\n"],"names":["KUMO_CHECKBOX_VARIANTS","KUMO_CHECKBOX_DEFAULT_VARIANTS","CheckboxGroupContext","createContext","CheckboxBase","forwardRef","className","checked","indeterminate","disabled","variant","label","labelTooltip","controlFirst","onCheckedChange","onValueChange","onChange","required","name","props","ref","hasLabel","hasAriaLabel","hasAriaLabelledBy","checkboxControl","jsx","BaseCheckbox.Root","newChecked","eventDetails","event","cn","BaseCheckbox.Indicator","renderProps","state","MinusIcon","CheckIcon","FieldBase.Root","jsxs","FieldBase.Label","Label","CheckboxItem","value","useContext","handleCheckedChange","CheckboxGroup","legend","children","error","description","defaultValue","allValues","BaseCheckboxGroup","Fieldset.Root","Fieldset.Legend","Checkbox"],"mappings":"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"}
@@ -1,58 +0,0 @@
1
- "use client";
2
- import { jsxs as a, jsx as n } from "react/jsx-runtime";
3
- import { CaretDownIcon as d } from "@phosphor-icons/react";
4
- import { forwardRef as p, useId as u, useCallback as b } from "react";
5
- import { c as t } from "./cn-ct4n7r74mh8y0f48.js";
6
- function f(e = {}) {
7
- return t(
8
- // Defensive resets to prevent global button styles from polluting the trigger
9
- "bg-transparent border-none shadow-none p-0 m-0",
10
- // Base styles for the trigger
11
- "flex cursor-pointer items-center gap-1 text-sm text-kumo-link select-none"
12
- );
13
- }
14
- const x = p(
15
- ({ label: e, open: r, onOpenChange: o, children: l, className: i }, c) => {
16
- const s = u(), m = b(() => {
17
- o?.(!r);
18
- }, [r, o]);
19
- return /* @__PURE__ */ a("div", { ref: c, children: [
20
- /* @__PURE__ */ a(
21
- "button",
22
- {
23
- type: "button",
24
- "aria-expanded": r,
25
- "aria-controls": s,
26
- className: f(),
27
- onClick: m,
28
- children: [
29
- e,
30
- " ",
31
- /* @__PURE__ */ n(
32
- d,
33
- {
34
- className: t("h-4 w-4 transition-transform", r && "rotate-180")
35
- }
36
- )
37
- ]
38
- }
39
- ),
40
- r && /* @__PURE__ */ n(
41
- "div",
42
- {
43
- id: s,
44
- className: t(
45
- "my-2 space-y-4 border-l-2 border-kumo-fill pl-4",
46
- i
47
- ),
48
- children: l
49
- }
50
- )
51
- ] });
52
- }
53
- );
54
- x.displayName = "Collapsible";
55
- export {
56
- x as C
57
- };
58
- //# sourceMappingURL=collapsible-jhzee3ks51d3xowb.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"collapsible-jhzee3ks51d3xowb.js","sources":["../../src/components/collapsible/collapsible.tsx"],"sourcesContent":["import { CaretDownIcon } from \"@phosphor-icons/react\";\nimport { type PropsWithChildren, forwardRef, useCallback, useId } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nexport const KUMO_COLLAPSIBLE_VARIANTS = {} as const;\n\nexport const KUMO_COLLAPSIBLE_DEFAULT_VARIANTS = {} as const;\n\nexport interface KumoCollapsibleVariantsProps {}\n\nexport function collapsibleVariants(_props: KumoCollapsibleVariantsProps = {}) {\n return cn(\n // Defensive resets to prevent global button styles from polluting the trigger\n \"bg-transparent border-none shadow-none p-0 m-0\",\n // Base styles for the trigger\n \"flex cursor-pointer items-center gap-1 text-sm text-kumo-link select-none\",\n );\n}\n\n/**\n * Collapsible component props.\n *\n * @example\n * ```tsx\n * <Collapsible label=\"Show details\" open={open} onOpenChange={setOpen}>\n * <Text>Hidden content revealed when expanded.</Text>\n * </Collapsible>\n * ```\n */\nexport type CollapsibleProps = PropsWithChildren<\n KumoCollapsibleVariantsProps & {\n /** Text label displayed in the trigger button */\n label: string;\n /** Whether the collapsible content is visible */\n open?: boolean;\n /** Callback fired when the open state changes */\n onOpenChange?: (open: boolean) => void;\n /** Additional CSS classes for the content panel */\n className?: string;\n }\n>;\n\n/**\n * Collapsible component for showing/hiding content.\n *\n * Features:\n * - Animated chevron indicator (rotates 180° when open)\n * - Accessible with aria-expanded and aria-controls\n * - Content panel with left border accent\n *\n * @example\n * ```tsx\n * const [open, setOpen] = useState(false);\n *\n * <Collapsible label=\"Show details\" open={open} onOpenChange={setOpen}>\n * <Text>Hidden content revealed when expanded.</Text>\n * </Collapsible>\n * ```\n *\n * @example Controlled accordion pattern\n * ```tsx\n * const [activeIndex, setActiveIndex] = useState<number | null>(null);\n *\n * {items.map((item, i) => (\n * <Collapsible\n * key={i}\n * label={item.title}\n * open={activeIndex === i}\n * onOpenChange={(open) => setActiveIndex(open ? i : null)}\n * >\n * {item.content}\n * </Collapsible>\n * ))}\n * ```\n */\nexport const Collapsible = forwardRef<HTMLDivElement, CollapsibleProps>(\n ({ label, open, onOpenChange, children, className }, ref) => {\n const contentId = useId();\n\n const handleOpen = useCallback(() => {\n onOpenChange?.(!open);\n }, [open, onOpenChange]);\n\n return (\n <div ref={ref}>\n <button\n type=\"button\"\n aria-expanded={open}\n aria-controls={contentId}\n className={collapsibleVariants()}\n onClick={handleOpen}\n >\n {label}{\" \"}\n <CaretDownIcon\n className={cn(\"h-4 w-4 transition-transform\", open && \"rotate-180\")}\n />\n </button>\n {open && (\n <div\n id={contentId}\n className={cn(\n \"my-2 space-y-4 border-l-2 border-kumo-fill pl-4\",\n className,\n )}\n >\n {children}\n </div>\n )}\n </div>\n );\n },\n);\n\nCollapsible.displayName = \"Collapsible\";\n"],"names":["collapsibleVariants","_props","cn","Collapsible","forwardRef","label","open","onOpenChange","children","className","ref","contentId","useId","handleOpen","useCallback","jsxs","jsx","CaretDownIcon"],"mappings":";;;;;AAUO,SAASA,EAAoBC,IAAuC,IAAI;AAC7E,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA,IAEA;AAAA,EAAA;AAEJ;AA0DO,MAAMC,IAAcC;AAAA,EACzB,CAAC,EAAE,OAAAC,GAAO,MAAAC,GAAM,cAAAC,GAAc,UAAAC,GAAU,WAAAC,EAAA,GAAaC,MAAQ;AAC3D,UAAMC,IAAYC,EAAA,GAEZC,IAAaC,EAAY,MAAM;AACnC,MAAAP,IAAe,CAACD,CAAI;AAAA,IACtB,GAAG,CAACA,GAAMC,CAAY,CAAC;AAEvB,WACE,gBAAAQ,EAAC,SAAI,KAAAL,GACH,UAAA;AAAA,MAAA,gBAAAK;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,iBAAeT;AAAA,UACf,iBAAeK;AAAA,UACf,WAAWX,EAAA;AAAA,UACX,SAASa;AAAA,UAER,UAAA;AAAA,YAAAR;AAAA,YAAO;AAAA,YACR,gBAAAW;AAAA,cAACC;AAAA,cAAA;AAAA,gBACC,WAAWf,EAAG,gCAAgCI,KAAQ,YAAY;AAAA,cAAA;AAAA,YAAA;AAAA,UACpE;AAAA,QAAA;AAAA,MAAA;AAAA,MAEDA,KACC,gBAAAU;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAIL;AAAA,UACJ,WAAWT;AAAA,YACT;AAAA,YACAO;AAAA,UAAA;AAAA,UAGD,UAAAD;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,EAEJ;AACF;AAEAL,EAAY,cAAc;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"combobox-he2hd9e2ruknq5mp.js","sources":["../../src/components/combobox/combobox.tsx"],"sourcesContent":["import { Combobox as ComboboxBase } from \"@base-ui/react/combobox\";\nimport { CaretDownIcon, CheckIcon, XIcon } from \"@phosphor-icons/react\";\nimport {\n Fragment,\n createContext,\n useContext,\n type PropsWithChildren,\n type ReactNode,\n} from \"react\";\nimport {\n inputVariants,\n KUMO_INPUT_VARIANTS,\n type KumoInputSize,\n} from \"../input/input\";\nimport { cn } from \"../../utils/cn\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Combobox variant definitions. */\nexport const KUMO_COMBOBOX_VARIANTS = {\n size: KUMO_INPUT_VARIANTS.size,\n inputSide: {\n right: {\n classes: \"\",\n description: \"Input positioned inline to the right of chips\",\n },\n top: {\n classes: \"\",\n description: \"Input positioned above chips\",\n },\n },\n} as const;\n\nexport const KUMO_COMBOBOX_DEFAULT_VARIANTS = {\n size: \"base\",\n inputSide: \"right\",\n} as const;\n\n// Context to pass size down to sub-components\nconst ComboboxSizeContext = createContext<KumoInputSize>(\"base\");\n\n// Derived types from KUMO_COMBOBOX_VARIANTS\nexport type KumoComboboxSize = keyof typeof KUMO_COMBOBOX_VARIANTS.size;\nexport type KumoComboboxInputSide =\n keyof typeof KUMO_COMBOBOX_VARIANTS.inputSide;\n\nexport interface KumoComboboxVariantsProps {\n /**\n * Size of the combobox trigger. Matches Input component sizes.\n * - `\"xs\"` — Extra small for compact UIs (h-5 / 20px)\n * - `\"sm\"` — Small for secondary fields (h-6.5 / 26px)\n * - `\"base\"` — Default size (h-9 / 36px)\n * - `\"lg\"` — Large for prominent fields (h-10 / 40px)\n * @default \"base\"\n */\n size?: KumoComboboxSize;\n /**\n * Position of the text input relative to chips in multi-select mode.\n * - `\"right\"` — Input inline to the right of chips\n * - `\"top\"` — Input above chips\n * @default \"right\"\n */\n inputSide?: KumoComboboxInputSide;\n}\n\nexport function comboboxVariants({\n inputSide = KUMO_COMBOBOX_DEFAULT_VARIANTS.inputSide,\n}: KumoComboboxVariantsProps = {}) {\n return cn(KUMO_COMBOBOX_VARIANTS.inputSide[inputSide].classes);\n}\n\n// Legacy type alias for backwards compatibility\nexport type ComboboxInputSide = KumoComboboxInputSide;\nexport type ComboboxSize = KumoComboboxSize;\n\nexport type ComboboxRootProps<\n Value = unknown,\n Multiple extends boolean | undefined = false,\n> = ComboboxBase.Root.Props<Value, Multiple>;\n\n/**\n * Combobox component props (simplified for documentation; the actual Root is generic).\n *\n * Combobox provides an autocomplete/typeahead input with a filterable dropdown.\n * Supports single-select, multi-select with chips, grouped items, and Field wrapper integration.\n *\n * @example\n * ```tsx\n * // Single-select with search input\n * <Combobox value={value} onValueChange={setValue} items={options}>\n * <Combobox.TriggerInput placeholder=\"Search…\" />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item.label}</Combobox.Item>}\n * </Combobox.List>\n * <Combobox.Empty>No results</Combobox.Empty>\n * </Combobox.Content>\n * </Combobox>\n *\n * // Multi-select with chips\n * <Combobox multiple items={options} label=\"Tags\">\n * <Combobox.TriggerMultipleWithInput\n * placeholder=\"Add tag…\"\n * renderItem={(item) => <Combobox.Chip value={item}>{item.label}</Combobox.Chip>}\n * />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item.label}</Combobox.Item>}\n * </Combobox.List>\n * </Combobox.Content>\n * </Combobox>\n * ```\n */\nexport interface ComboboxProps extends KumoComboboxVariantsProps {\n /** Array of items to display in the dropdown */\n items: unknown[];\n /** Currently selected value(s) */\n value?: unknown;\n /** Callback when selection changes */\n onValueChange?: (value: unknown) => void;\n /** Enable multi-select mode */\n multiple?: boolean;\n /** Combobox content (trigger, content, items) */\n children: ReactNode;\n /** Additional CSS classes */\n className?: string;\n /** Label content for the combobox (enables Field wrapper) - can be a string or any React node */\n label?: ReactNode;\n /** Whether the combobox is required */\n required?: boolean;\n /** Tooltip content to display next to the label via an info icon */\n labelTooltip?: ReactNode;\n /** Helper text displayed below the combobox */\n description?: ReactNode;\n /** Error message or validation error object */\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n}\n\nfunction Root<Value, Multiple extends boolean | undefined = false>({\n label,\n required,\n labelTooltip,\n description,\n error,\n children,\n size = \"base\",\n ...props\n}: ComboboxBase.Root.Props<Value, Multiple> & {\n label?: ReactNode;\n required?: boolean;\n labelTooltip?: ReactNode;\n description?: ReactNode;\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n size?: KumoComboboxSize;\n}) {\n const comboboxControl = (\n <ComboboxSizeContext.Provider value={size}>\n <ComboboxBase.Root {...props}>{children}</ComboboxBase.Root>\n </ComboboxSizeContext.Provider>\n );\n\n // Render with Field wrapper if label, description, or error are provided\n if (label) {\n return (\n <Field\n label={label}\n required={required}\n labelTooltip={labelTooltip}\n description={description}\n error={\n error\n ? typeof error === \"string\"\n ? { message: error, match: true }\n : error\n : undefined\n }\n >\n {comboboxControl}\n </Field>\n );\n }\n\n // Render bare combobox without Field wrapper\n return comboboxControl;\n}\n\nfunction Content({\n children,\n className,\n align = \"start\",\n sideOffset = 4,\n alignOffset,\n side,\n container: containerProp,\n}: PropsWithChildren<{\n className?: string;\n align?: ComboboxBase.Positioner.Props[\"align\"];\n alignOffset?: ComboboxBase.Positioner.Props[\"alignOffset\"];\n side?: ComboboxBase.Positioner.Props[\"side\"];\n sideOffset?: ComboboxBase.Positioner.Props[\"sideOffset\"];\n /**\n * Container element for the portal. Use this to render the combobox 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 const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n return (\n <ComboboxBase.Portal container={container}>\n <ComboboxBase.Positioner\n className=\"\"\n align={align}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n side={side}\n >\n <ComboboxBase.Popup\n className={cn(\n \"flex flex-col\", // flexbox layout for sticky input + scrollable list\n \"max-h-[min(var(--available-height),24rem)] max-w-(--available-width) min-w-(--anchor-width) py-1.5\",\n \"bg-kumo-base text-kumo-default\", // background\n \"rounded-lg shadow-lg ring ring-kumo-line\", // border part\n className,\n )}\n >\n {children}\n </ComboboxBase.Popup>\n </ComboboxBase.Positioner>\n </ComboboxBase.Portal>\n );\n}\n\n// Size-dependent styles for TriggerValue icon\nconst triggerValueIconStyles: Record<\n KumoComboboxSize,\n { padding: string; iconSize: number; iconRight: string }\n> = {\n xs: { padding: \"pr-5\", iconSize: 12, iconRight: \"right-1\" },\n sm: { padding: \"pr-6\", iconSize: 14, iconRight: \"right-1.5\" },\n base: { padding: \"pr-8\", iconSize: 16, iconRight: \"right-2\" },\n lg: { padding: \"pr-10\", iconSize: 18, iconRight: \"right-3\" },\n};\n\nfunction TriggerValue({\n className,\n ...props\n}: ComboboxBase.Value.Props & { className?: string }) {\n const size = useContext(ComboboxSizeContext);\n const iconStyles = triggerValueIconStyles[size];\n\n return (\n <ComboboxBase.Trigger\n className={cn(\n inputVariants({ size }),\n \"relative flex items-center\",\n \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed\",\n iconStyles.padding,\n className,\n )}\n >\n <ComboboxBase.Value>{props.children}</ComboboxBase.Value>\n <ComboboxBase.Icon\n className={cn(\n \"absolute top-1/2 -translate-y-1/2 flex items-center text-kumo-subtle\",\n iconStyles.iconRight,\n )}\n >\n <CaretDownIcon size={iconStyles.iconSize} className=\"fill-current\" />\n </ComboboxBase.Icon>\n </ComboboxBase.Trigger>\n );\n}\n\n// Size-dependent styles for TriggerInput icons\nconst triggerInputIconStyles: Record<\n KumoComboboxSize,\n { padding: string; iconSize: number; clearRight: string; caretRight: string }\n> = {\n xs: {\n padding: \"pr-7\",\n iconSize: 12,\n clearRight: \"right-5\",\n caretRight: \"right-1\",\n },\n sm: {\n padding: \"pr-9\",\n iconSize: 14,\n clearRight: \"right-6\",\n caretRight: \"right-1.5\",\n },\n base: {\n padding: \"pr-12\",\n iconSize: 16,\n clearRight: \"right-8\",\n caretRight: \"right-2\",\n },\n lg: {\n padding: \"pr-14\",\n iconSize: 18,\n clearRight: \"right-9\",\n caretRight: \"right-3\",\n },\n};\n\nfunction TriggerInput(props: ComboboxBase.Input.Props) {\n const size = useContext(ComboboxSizeContext);\n const iconStyles = triggerInputIconStyles[size];\n\n return (\n <div\n className={cn(\n \"relative inline-block w-full max-w-xs\",\n \"has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed\",\n props.className,\n )}\n >\n <ComboboxBase.Input\n {...props}\n className={cn(\n inputVariants({ size }),\n \"w-full\",\n iconStyles.padding,\n \"disabled:cursor-not-allowed\",\n )}\n />\n\n <ComboboxBase.Clear\n className={cn(\n \"absolute top-1/2 flex -translate-y-1/2 cursor-pointer bg-transparent p-0\",\n \"data-[disabled]:pointer-events-none data-[disabled]:opacity-0\",\n iconStyles.clearRight,\n )}\n >\n <XIcon size={iconStyles.iconSize} />\n </ComboboxBase.Clear>\n\n <ComboboxBase.Trigger className=\"p-0\">\n <ComboboxBase.Icon\n className={cn(\n \"absolute top-1/2 flex -translate-y-1/2 cursor-pointer text-kumo-subtle\",\n iconStyles.caretRight,\n )}\n >\n <CaretDownIcon size={iconStyles.iconSize} className=\"fill-current\" />\n </ComboboxBase.Icon>\n </ComboboxBase.Trigger>\n </div>\n );\n}\n\nfunction Item({ children, ...props }: ComboboxBase.Item.Props) {\n return (\n <ComboboxBase.Item\n {...props}\n className=\"group mx-1.5 grid cursor-pointer grid-cols-[1fr_16px] gap-2 rounded px-2 py-1.5 text-base data-highlighted:bg-kumo-tint\"\n >\n <div className=\"col-start-1\">{children}</div>\n <ComboboxBase.ItemIndicator className=\"col-start-2 flex items-center\">\n <CheckIcon />\n </ComboboxBase.ItemIndicator>\n </ComboboxBase.Item>\n );\n}\n\nfunction Empty(props: ComboboxBase.Empty.Props) {\n return (\n <ComboboxBase.Empty\n {...props}\n className={cn(\n \"mx-1.5 shrink-0 px-4 py-2 text-[0.925rem] leading-4 text-kumo-subtle empty:m-0 empty:p-0\",\n )}\n children={props.children ?? \"No labels found.\"}\n />\n );\n}\n\nfunction Input(props: ComboboxBase.Input.Props) {\n return (\n <ComboboxBase.Input\n {...props}\n className={cn(\n inputVariants(),\n \"mx-1.5 w-[calc(100%-0.75rem)] shrink-0 first:mb-2\",\n props.className,\n )}\n />\n );\n}\n\nfunction List({\n className,\n ...props\n}: ComboboxBase.List.Props & { className?: string }) {\n return (\n <ComboboxBase.List\n {...props}\n className={cn(\n \"min-h-0 flex-1 overflow-y-auto overscroll-contain scroll-pt-2 scroll-pb-2\",\n className,\n )}\n />\n );\n}\n\nfunction GroupLabel(props: ComboboxBase.GroupLabel.Props) {\n return (\n <ComboboxBase.GroupLabel\n {...props}\n className={cn(\n \"mx-1.5 px-2 py-1.5 text-sm text-kumo-strong\",\n props.className,\n )}\n />\n );\n}\n\nfunction Group(props: ComboboxBase.Group.Props) {\n return (\n <ComboboxBase.Group\n {...props}\n className=\"border-t border-kumo-line mt-2 pt-2 first:border-t-0 first:mt-0 first:pt-0\"\n />\n );\n}\n\nfunction Chip(props: ComboboxBase.Chip.Props) {\n return (\n <ComboboxBase.Chip\n {...props}\n className={cn(\n \"flex items-center gap-2.5\", // Layout\n \"h-6 pl-2 pr-[3px]\", // Dimensions\n \"rounded-sm ring-1 ring-kumo-line\", // Border\n \"bg-kumo-overlay\", // Background\n \"text-sm\", // Typography\n )}\n >\n {props.children}\n <ComboboxBase.ChipRemove\n className={cn(\n \"cursor-pointer rounded-md p-1 hover:bg-kumo-fill-hover\",\n \"bg-transparent flex\",\n )}\n >\n <XIcon size={10} />\n </ComboboxBase.ChipRemove>\n </ComboboxBase.Chip>\n );\n}\n\n// Map size to min-height class for TriggerMultipleWithInput\nconst sizeToMinHeight: Record<KumoComboboxSize, string> = {\n xs: \"min-h-5\",\n sm: \"min-h-6.5\",\n base: \"min-h-9\",\n lg: \"min-h-10\",\n};\n\nfunction TriggerMultipleWithInput<ValueType>({\n placeholder,\n renderItem,\n className,\n inputSide = \"right\",\n value: controlledValue,\n}: {\n placeholder?: string;\n renderItem: (value: ValueType) => React.ReactNode;\n className?: string;\n inputSide?: \"right\" | \"top\";\n /** Optional controlled value for rendering chips (use when pre-selecting values) */\n value?: ValueType[];\n}) {\n const size = useContext(ComboboxSizeContext);\n // Determine which value to use for rendering chips\n const chipsToRender = controlledValue;\n\n return (\n <ComboboxBase.Chips\n className={cn(\n inputVariants({ size }),\n \"flex flex-col\",\n \"gap-1 py-1 px-1.5\",\n sizeToMinHeight[size],\n \"h-auto\",\n \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed\",\n className,\n )}\n >\n {inputSide === \"top\" && (\n <ComboboxBase.Input\n placeholder={placeholder}\n className=\"w-full px-2 py-1 border-0 bg-inherit\"\n />\n )}\n {/* Chips container */}\n <div className=\"flex items-center flex-wrap gap-1.5 flex-1\">\n {/* Render chips from controlled value if provided */}\n {chipsToRender !== undefined &&\n chipsToRender.length > 0 &&\n chipsToRender.map((item) => renderItem(item))}\n {/* Also render from BaseUI's internal value for user selections */}\n <ComboboxBase.Value>\n {(internalValue: ValueType[]) => {\n // Skip rendering if using controlled value (to avoid duplicates)\n if (chipsToRender !== undefined) return null;\n return (\n <Fragment>\n {internalValue.map((item) => renderItem(item))}\n </Fragment>\n );\n }}\n </ComboboxBase.Value>\n {inputSide === \"right\" && (\n <ComboboxBase.Input\n placeholder={placeholder}\n className=\"min-w-[100px] flex-1 px-2 py-1 border-0 bg-inherit\"\n />\n )}\n </div>\n </ComboboxBase.Chips>\n );\n}\n\nRoot.displayName = \"Combobox.Root\";\nContent.displayName = \"Combobox.Content\";\nTriggerValue.displayName = \"Combobox.TriggerValue\";\nTriggerInput.displayName = \"Combobox.TriggerInput\";\nItem.displayName = \"Combobox.Item\";\nChip.displayName = \"Combobox.Chip\";\nTriggerMultipleWithInput.displayName = \"Combobox.TriggerMultipleWithInput\";\n\n/**\n * Combobox — autocomplete input with filterable dropdown list.\n *\n * Compound component: `Combobox` (Root), `.TriggerInput`, `.TriggerValue`,\n * `.TriggerMultipleWithInput`, `.Content`, `.Item`, `.Chip`, `.Input`,\n * `.Empty`, `.GroupLabel`, `.Group`, `.List`, `.Collection`.\n *\n * @example\n * ```tsx\n * <Combobox items={fruits} label=\"Fruit\">\n * <Combobox.TriggerInput placeholder=\"Pick a fruit…\" />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item}</Combobox.Item>}\n * </Combobox.List>\n * </Combobox.Content>\n * </Combobox>\n * ```\n *\n * @see https://base-ui.com/react/components/combobox\n */\nexport const Combobox = Object.assign(Root, {\n // Helper components\n Content,\n TriggerValue,\n TriggerInput,\n TriggerMultipleWithInput,\n\n // Slightly modified BaseUI\n Chip,\n Item,\n\n // Styled BaseUI\n Input,\n Empty,\n GroupLabel,\n Group,\n\n // Styled BaseUI\n List,\n\n // BaseUI\n Collection: ComboboxBase.Collection,\n});\n"],"names":["KUMO_INPUT_VARIANTS","ComboboxSizeContext","createContext","Root","label","required","labelTooltip","description","error","children","size","props","comboboxControl","jsx","ComboboxBase.Root","Field","Content","className","align","sideOffset","alignOffset","side","containerProp","contextContainer","usePortalContainer","ComboboxBase.Portal","ComboboxBase.Positioner","ComboboxBase.Popup","cn","triggerValueIconStyles","TriggerValue","useContext","iconStyles","jsxs","ComboboxBase.Trigger","inputVariants","ComboboxBase.Value","ComboboxBase.Icon","CaretDownIcon","triggerInputIconStyles","TriggerInput","ComboboxBase.Input","ComboboxBase.Clear","XIcon","Item","ComboboxBase.Item","ComboboxBase.ItemIndicator","CheckIcon","Empty","ComboboxBase.Empty","Input","List","ComboboxBase.List","GroupLabel","ComboboxBase.GroupLabel","Group","ComboboxBase.Group","Chip","ComboboxBase.Chip","ComboboxBase.ChipRemove","sizeToMinHeight","TriggerMultipleWithInput","placeholder","renderItem","inputSide","controlledValue","chipsToRender","ComboboxBase.Chips","item","internalValue","Fragment","Combobox","ComboboxBase.Collection"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"command-palette-jc1w07jwakxvj23a.js","sources":["../../src/components/command-palette/command-palette.tsx"],"sourcesContent":["import {\n useRef,\n useCallback,\n createContext,\n useContext,\n forwardRef,\n type CSSProperties,\n} from \"react\";\nimport { Autocomplete } from \"@base-ui/react/autocomplete\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\nimport {\n MagnifyingGlassIcon,\n ArrowRightIcon,\n ArrowSquareOutIcon,\n CaretRightIcon,\n} from \"@phosphor-icons/react\";\n\nimport { Surface } from \"../surface\";\nimport { Loader } from \"../loader\";\nimport { cn } from \"../../utils\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\nimport type {\n HighlightRange,\n CommandPaletteRootProps,\n CommandPaletteListProps,\n CommandPaletteGroupProps,\n CommandPaletteGroupLabelProps,\n CommandPaletteItemProps,\n CommandPaletteEmptyProps,\n CommandPaletteLoadingProps,\n CommandPaletteFooterProps,\n CommandPaletteResultItemProps,\n} from \"./types\";\n\n/**\n * CommandPalette - A composable command palette component for Kumo\n *\n * Uses @base-ui/react/autocomplete primitives for accessible command palette functionality.\n *\n * Keyboard navigation is built-in:\n * - Arrow keys (up/down) move highlight between items\n * - Enter selects the highlighted item (calls onSelect with newTab: false)\n * - Cmd+Enter (Mac) / Ctrl+Enter (Windows/Linux) selects with newTab: true\n * - First item is auto-highlighted when results change\n * - Escape closes the dialog\n *\n * Usage:\n * ```tsx\n * <CommandPalette.Root\n * open={open}\n * onOpenChange={setOpen}\n * items={results}\n * value={searchTerm}\n * onValueChange={setSearchTerm}\n * itemToStringValue={(group) => group.label}\n * onSelect={(item, { newTab }) => handleSelect(item, newTab)}\n * getSelectableItems={(groups) => groups.flatMap(g => g.items)}\n * >\n * <CommandPalette.Input placeholder=\"Search...\" />\n * <CommandPalette.List>\n * <Autocomplete.List>\n * {(group) => (\n * <CommandPalette.Group items={group.items}>\n * <CommandPalette.GroupLabel>{group.label}</CommandPalette.GroupLabel>\n * <Autocomplete.Collection>\n * {(item) => (\n * <CommandPalette.Item value={item} onClick={(e) => handleSelect(item, e.metaKey || e.ctrlKey)}>\n * {item.title}\n * </CommandPalette.Item>\n * )}\n * </Autocomplete.Collection>\n * </CommandPalette.Group>\n * )}\n * </Autocomplete.List>\n * <CommandPalette.Empty>No results found</CommandPalette.Empty>\n * </CommandPalette.List>\n * <CommandPalette.Footer />\n * </CommandPalette.Root>\n * ```\n */\n\n/**\n * Dialog context for passing close handler to children\n */\ninterface DialogContextValue {\n onClose?: () => void;\n}\n\nconst DialogContext = createContext<DialogContextValue>({});\n\n/**\n * Props for the Dialog component\n */\ninterface DialogProps {\n /** Whether the dialog is open */\n open: boolean;\n /** Callback when the open state changes */\n onOpenChange: (open: boolean) => void;\n /**\n * Optional callback when backdrop is clicked.\n * Receives the mouse event for position tracking (e.g., for ripple effects).\n * If not provided, backdrop click calls onOpenChange(false).\n */\n onBackdropClick?: (e: React.MouseEvent) => void;\n /** Child content - typically one or more Panel components */\n children: React.ReactNode;\n /**\n * Container element for the portal. Use this to render the command palette 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 * Dialog component - Modal wrapper for command palette content.\n *\n * Use this when you need a dialog that can swap between different Panel contents\n * without re-mounting (e.g., drill-down navigation).\n *\n * @example\n * ```tsx\n * <CommandPalette.Dialog open={open} onOpenChange={setOpen}>\n * {showDrillDown ? (\n * <ZonePicker />\n * ) : (\n * <CommandPalette.Panel items={results} ...>\n * ...\n * </CommandPalette.Panel>\n * )}\n * </CommandPalette.Dialog>\n * ```\n */\nfunction Dialog({\n open,\n onOpenChange,\n onBackdropClick,\n children,\n container: containerProp,\n}: DialogProps) {\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n const handleBackdropClick = (e: React.MouseEvent) => {\n if (onBackdropClick) {\n onBackdropClick(e);\n } else {\n onOpenChange(false);\n }\n };\n\n const handleClose = useCallback(() => {\n onOpenChange(false);\n }, [onOpenChange]);\n\n return (\n <DialogBase.Root open={open} onOpenChange={onOpenChange} modal>\n <DialogBase.Portal container={container}>\n <DialogBase.Backdrop\n className=\"fixed inset-0 bg-kumo-overlay opacity-80 transition-all duration-150 data-[ending-style]:opacity-0 data-[starting-style]:opacity-0\"\n onClick={handleBackdropClick}\n />\n <Surface\n render={<DialogBase.Popup />}\n className={cn(\n \"fixed top-[10vh] left-1/2 w-full max-w-2xl -translate-x-1/2\",\n \"overflow-hidden rounded-lg\",\n \"duration-150 data-[ending-style]:scale-90 data-[ending-style]:opacity-0 data-[starting-style]:scale-90 data-[starting-style]:opacity-0\",\n )}\n style={\n {\n transitionProperty: \"scale, opacity\",\n transitionTimingFunction:\n \"var(--default-transition-timing-function)\",\n } as CSSProperties\n }\n >\n <DialogContext.Provider value={{ onClose: handleClose }}>\n {children}\n </DialogContext.Provider>\n </Surface>\n </DialogBase.Portal>\n </DialogBase.Root>\n );\n}\n\n/**\n * Root component - Dialog + Panel combined for simple use cases.\n *\n * For cases where you need to swap content inside the dialog without\n * re-mounting (e.g., drill-down navigation), use Dialog + Panel separately.\n *\n * Keyboard navigation is always enabled:\n * - Arrow keys (up/down) move highlight\n * - Enter selects highlighted item\n * - Cmd/Ctrl+Enter selects with newTab: true\n * - First item is auto-highlighted when results change\n */\nfunction Root<TGroup, TItem = TGroup>({\n open,\n onOpenChange,\n onBackdropClick,\n children,\n items,\n value,\n onValueChange,\n onItemHighlighted,\n itemToStringValue,\n filter,\n onSelect,\n getSelectableItems,\n container,\n}: CommandPaletteRootProps<TGroup, TItem>) {\n return (\n <Dialog\n open={open}\n onOpenChange={onOpenChange}\n onBackdropClick={onBackdropClick}\n container={container}\n >\n <Panel\n items={items}\n value={value}\n onValueChange={onValueChange}\n onItemHighlighted={onItemHighlighted}\n itemToStringValue={itemToStringValue}\n filter={filter}\n open={open}\n onSelect={onSelect}\n getSelectableItems={getSelectableItems}\n >\n {children}\n </Panel>\n </Dialog>\n );\n}\n\n/**\n * InputHeader component - Internal styled container for search input.\n */\nfunction InputHeader({\n children,\n leading,\n trailing,\n}: {\n children: React.ReactNode;\n leading?: React.ReactNode;\n trailing?: React.ReactNode;\n}) {\n return (\n <div className=\"flex items-center gap-3 bg-kumo-base px-4 py-3\">\n {leading ?? (\n <MagnifyingGlassIcon\n className=\"h-4 w-4 text-kumo-subtle\"\n weight=\"bold\"\n />\n )}\n {children}\n {trailing}\n </div>\n );\n}\n\n/**\n * List component - Scrollable results container\n *\n * Wrapper div with proper styling, contains Autocomplete.List internally.\n * Supports ref forwarding for scroll control.\n */\nconst List = forwardRef<\n HTMLDivElement,\n CommandPaletteListProps & { className?: string }\n>(function List({ children, className }, ref) {\n return (\n <div\n ref={ref}\n className={cn(\n \"min-h-0 flex-1 overflow-y-auto rounded-b-lg bg-kumo-base px-2 py-2 ring-1 ring-kumo-line\",\n className,\n )}\n >\n {children}\n </div>\n );\n});\n\nList.displayName = \"CommandPalette.List\";\n\n/**\n * Group component - Category grouping\n *\n * Re-export of Autocomplete.Group with default styling.\n */\nfunction Group({\n children,\n className,\n ...props\n}: CommandPaletteGroupProps & {\n className?: string;\n items?: unknown[];\n}) {\n return (\n <Autocomplete.Group className={cn(\"space-y-0.5\", className)} {...props}>\n {children}\n </Autocomplete.Group>\n );\n}\n\n/**\n * GroupLabel component - Section header text\n *\n * Re-export of Autocomplete.GroupLabel with styling matching SectionHeader.\n */\nfunction GroupLabel({\n children,\n className,\n}: CommandPaletteGroupLabelProps & { className?: string }) {\n return (\n <Autocomplete.GroupLabel\n className={cn(\n \"mb-2 px-2 pt-1 text-xs font-semibold text-kumo-strong\",\n className,\n )}\n >\n {children}\n </Autocomplete.GroupLabel>\n );\n}\n\n/**\n * Item component - Individual result item\n *\n * Re-export of Autocomplete.Item with styling matching SearchResultItem.\n * Note: Use onClick for selection handling, matching the existing CommandPalette pattern.\n */\nfunction Item<T>({\n value,\n disabled,\n children,\n className,\n onClick,\n}: CommandPaletteItemProps<T> & {\n className?: string;\n}) {\n return (\n <Autocomplete.Item\n value={value}\n disabled={disabled}\n onClick={onClick}\n className={cn(\n \"group flex w-full items-center gap-3 px-2 py-1.5 text-left text-base transition-colors\",\n \"cursor-pointer data-[highlighted]:bg-kumo-overlay\",\n \"rounded-lg\",\n disabled && \"cursor-default opacity-50\",\n className,\n )}\n >\n {children}\n </Autocomplete.Item>\n );\n}\n\n/**\n * Empty component - Empty state when no results\n *\n * Re-export of Autocomplete.Empty with default styling.\n */\nfunction Empty({ children }: CommandPaletteEmptyProps) {\n return (\n <Autocomplete.Empty>\n <div className=\"p-8 text-center\">\n <p className=\"text-kumo-strong\">{children ?? \"No results found\"}</p>\n </div>\n </Autocomplete.Empty>\n );\n}\n\n/**\n * Loading component - Loading spinner state\n *\n * Centered loading spinner using Kumo Loader.\n */\nfunction Loading({ children }: CommandPaletteLoadingProps) {\n return (\n <div className=\"flex items-center justify-center p-8\">\n {children ?? <Loader size={24} />}\n </div>\n );\n}\n\n/**\n * Footer component - Styled container for keyboard hints or other footer content.\n *\n * Children are required - this is just a styled container.\n * Consumers should provide their own keyboard hints with proper i18n.\n */\nfunction Footer({ children }: CommandPaletteFooterProps) {\n return (\n <div className=\"flex items-center justify-between rounded-b-lg bg-kumo-elevated px-4 py-3 text-xs text-kumo-strong\">\n {children}\n </div>\n );\n}\n\n/**\n * HighlightedText - Renders text with highlighted portions based on match indices.\n * Highlighted text is shown with a background color to indicate matches.\n */\nfunction HighlightedText({\n text,\n highlights,\n className,\n}: {\n text: string;\n highlights?: HighlightRange[];\n className?: string;\n}) {\n if (!highlights || highlights.length === 0) {\n return <span className={className}>{text}</span>;\n }\n\n // Sort highlights by start index and merge overlapping ranges\n const sortedHighlights = [...highlights].sort((a, b) => a[0] - b[0]);\n const mergedHighlights: HighlightRange[] = [];\n\n for (const range of sortedHighlights) {\n const last = mergedHighlights[mergedHighlights.length - 1];\n if (last && range[0] <= last[1] + 1) {\n // Merge overlapping or adjacent ranges\n last[1] = Math.max(last[1], range[1]);\n } else {\n mergedHighlights.push([...range]);\n }\n }\n\n const parts: React.ReactNode[] = [];\n let lastIndex = 0;\n\n mergedHighlights.forEach((range, i) => {\n const [start, end] = range;\n\n // Add non-highlighted text before this match\n if (start > lastIndex) {\n parts.push(<span key={`text-${i}`}>{text.slice(lastIndex, start)}</span>);\n }\n\n // Add highlighted text (end index is inclusive)\n parts.push(\n <mark\n key={`highlight-${i}`}\n className=\"rounded-sm bg-kumo-warning/50 text-kumo-default\"\n >\n {text.slice(start, end + 1)}\n </mark>,\n );\n\n lastIndex = end + 1;\n });\n\n // Add remaining non-highlighted text\n if (lastIndex < text.length) {\n parts.push(<span key=\"text-end\">{text.slice(lastIndex)}</span>);\n }\n\n return <span className={className}>{parts}</span>;\n}\n\n/**\n * ResultItem - Rich item component with breadcrumbs, highlights, icons, and external indicators.\n *\n * Use this for search result items that need breadcrumb navigation, text highlighting,\n * or external link indicators. For simple items, use Item instead.\n */\nfunction ResultItem<T>({\n title,\n breadcrumbs,\n titleHighlights,\n breadcrumbHighlights,\n description,\n icon,\n value,\n onClick,\n showArrow = true,\n external = false,\n nonInteractive = false,\n}: CommandPaletteResultItemProps<T>) {\n return (\n <Autocomplete.Item\n value={value}\n onClick={nonInteractive ? undefined : (e: React.MouseEvent) => onClick(e)}\n className={cn(\n \"group flex w-full items-center gap-3 rounded-lg px-2 py-1.5 text-left transition-colors\",\n nonInteractive\n ? \"cursor-default\"\n : \"cursor-pointer data-[highlighted]:bg-kumo-overlay\",\n )}\n >\n {icon && (\n <div className=\"flex flex-shrink-0 items-center text-kumo-subtle\">\n {icon}\n </div>\n )}\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex items-center gap-2 truncate\">\n {breadcrumbs?.map((crumb, index) => (\n <span key={index} className=\"flex items-center gap-2\">\n <HighlightedText\n text={crumb}\n highlights={breadcrumbHighlights?.[index]}\n className=\"text-base text-kumo-default\"\n />\n <CaretRightIcon\n className=\"h-3 w-3 flex-shrink-0 text-kumo-subtle\"\n weight=\"bold\"\n />\n </span>\n ))}\n <HighlightedText\n text={title}\n highlights={titleHighlights}\n className=\"text-base text-kumo-default\"\n />\n {external && (\n <ArrowSquareOutIcon className=\"h-3.5 w-3.5 flex-shrink-0 text-kumo-subtle\" />\n )}\n {description && (\n <>\n <span className=\"text-kumo-strong\">—</span>\n <span className=\"truncate text-sm text-kumo-strong\">\n {description}\n </span>\n </>\n )}\n </div>\n </div>\n {showArrow && !external && !nonInteractive && (\n <ArrowRightIcon className=\"h-4 w-4 flex-shrink-0 text-kumo-subtle opacity-0 transition-opacity group-data-[highlighted]:opacity-100\" />\n )}\n </Autocomplete.Item>\n );\n}\n\n/**\n * Container component - Internal styled wrapper.\n */\nfunction Container({\n children,\n className,\n}: {\n children: React.ReactNode;\n className?: string;\n}) {\n return (\n <div\n className={cn(\n \"flex max-h-[60vh] flex-col overflow-hidden rounded-lg bg-kumo-elevated\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\n/**\n * Panel context for passing handlers from Panel to children\n */\ninterface PanelContextValue {\n onInputKeyDown?: (e: React.KeyboardEvent) => void;\n}\n\nconst PanelContext = createContext<PanelContextValue>({});\n\n/**\n * Props for the Panel component\n */\ninterface PanelProps<TGroup, TItem = TGroup> {\n /** Child components (Input, List, Footer, etc.) */\n children: React.ReactNode;\n /** Items for the autocomplete */\n items: TGroup[];\n /** Controlled input value */\n value?: string;\n /** Callback when input value changes */\n onValueChange?: (value: string) => void;\n /** Callback when an item is highlighted */\n onItemHighlighted?: (\n item: TGroup | undefined,\n details: { reason: string; event: Event; index: number },\n ) => void;\n /** Convert item to string for accessibility */\n itemToStringValue?: (item: TGroup) => string;\n /** Custom filter function */\n filter?: (item: TGroup, query: string) => boolean;\n /** Whether the panel is active/open (for autocomplete state) */\n open?: boolean;\n /** Optional className for the container */\n className?: string;\n /**\n * Callback when an item is selected via Cmd/Ctrl+Enter.\n * Requires getSelectableItems to be provided.\n */\n onSelect?: (item: TItem, options: { newTab: boolean }) => void;\n /**\n * Function to get flat list of selectable items from groups.\n * Required when items are grouped and onSelect is used.\n */\n getSelectableItems?: (items: TGroup[]) => TItem[];\n}\n\n/**\n * Panel component - Command palette without dialog wrapper.\n *\n * Use this when you need to render command palette content inside an existing dialog\n * (e.g., for drill-down navigation where the dialog stays open but content changes).\n *\n * Combines Container + Autocomplete functionality with a clean API.\n *\n * @example\n * ```tsx\n * <DialogRoot open={open} onOpenChange={setOpen}>\n * <Dialog>\n * <CommandPalette.Panel\n * items={results}\n * value={searchTerm}\n * onValueChange={setSearchTerm}\n * itemToStringValue={(group) => group.label}\n * >\n * <CommandPalette.Input placeholder=\"Search...\" />\n * <CommandPalette.List>\n * <CommandPalette.Results>\n * {(group) => (\n * <CommandPalette.Group items={group.items}>\n * <CommandPalette.GroupLabel>{group.label}</CommandPalette.GroupLabel>\n * <CommandPalette.Items>\n * {(item) => <CommandPalette.ResultItem ... />}\n * </CommandPalette.Items>\n * </CommandPalette.Group>\n * )}\n * </CommandPalette.Results>\n * <CommandPalette.Empty>No results</CommandPalette.Empty>\n * </CommandPalette.List>\n * <CommandPalette.Footer>...</CommandPalette.Footer>\n * </CommandPalette.Panel>\n * </Dialog>\n * </DialogRoot>\n * ```\n */\nconst defaultFilter = () => true;\n\nfunction Panel<TGroup, TItem = TGroup>({\n children,\n items,\n value,\n onValueChange,\n onItemHighlighted,\n itemToStringValue,\n filter = defaultFilter,\n open = true,\n className,\n onSelect,\n getSelectableItems,\n}: PanelProps<TGroup, TItem>) {\n const highlightedIndexRef = useRef<number>(-1);\n\n const handleItemHighlighted = useCallback(\n (\n item: TGroup | undefined,\n details: { reason: string; event: Event; index: number },\n ) => {\n highlightedIndexRef.current = details.index;\n onItemHighlighted?.(item, details);\n },\n [onItemHighlighted],\n );\n\n // Handle Cmd/Ctrl+Enter for new tab selection\n const handleInputKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n const isEnter = e.key === \"Enter\";\n const withModifier = e.metaKey || e.ctrlKey;\n\n if (isEnter && withModifier && onSelect && getSelectableItems) {\n const selectableItems = getSelectableItems(items);\n const highlightedItem = selectableItems[highlightedIndexRef.current];\n\n if (highlightedItem !== undefined) {\n e.preventDefault();\n onSelect(highlightedItem, { newTab: true });\n }\n }\n },\n [items, onSelect, getSelectableItems],\n );\n\n return (\n <Container className={className}>\n <Autocomplete.Root\n items={items}\n value={value}\n onValueChange={onValueChange}\n onItemHighlighted={handleItemHighlighted}\n itemToStringValue={itemToStringValue}\n filter={filter}\n autoHighlight=\"always\"\n keepHighlight\n open={open}\n >\n <PanelContext.Provider value={{ onInputKeyDown: handleInputKeyDown }}>\n {children}\n </PanelContext.Provider>\n </Autocomplete.Root>\n </Container>\n );\n}\n\n/**\n * PanelInput component - Input that works inside Panel.\n *\n * Similar to Input but designed for use with Panel instead of Root.\n * Automatically wires up Cmd/Ctrl+Enter handling from Panel.\n */\nfunction PanelInput({\n autoFocus = true,\n placeholder,\n className,\n onKeyDown: onKeyDownProp,\n leading,\n trailing,\n ...props\n}: {\n autoFocus?: boolean;\n placeholder?: string;\n className?: string;\n onKeyDown?: (e: React.KeyboardEvent) => void;\n /** Optional leading content (e.g., back button) */\n leading?: React.ReactNode;\n /** Optional trailing content (e.g., Esc button) */\n trailing?: React.ReactNode;\n}) {\n const { onInputKeyDown } = useContext(PanelContext);\n const { onClose } = useContext(DialogContext);\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n // Let consumer handle first (e.g., for custom Escape/Backspace behavior)\n onKeyDownProp?.(e);\n if (e.defaultPrevented) return;\n\n // Handle Escape to close the dialog\n if (e.key === \"Escape\" && onClose) {\n e.preventDefault();\n onClose();\n return;\n }\n onInputKeyDown?.(e);\n },\n [onInputKeyDown, onKeyDownProp, onClose],\n );\n\n return (\n <InputHeader leading={leading} trailing={trailing}>\n <Autocomplete.Input\n placeholder={placeholder}\n className={cn(\n \"flex-1 border-none bg-transparent text-base kumo-input-placeholder\",\n \"outline-none focus-visible:outline-none\",\n className,\n )}\n onKeyDown={handleKeyDown}\n // oxlint-disable-next-line no-autofocus -- Command palette input should autofocus for keyboard-driven UX\n autoFocus={autoFocus}\n {...props}\n />\n </InputHeader>\n );\n}\n\n/**\n * Render prop iterators - wrap base-ui primitives with cleaner names.\n */\n\n/**\n * Results component - Render prop iterator for groups.\n *\n * Wraps Autocomplete.List with default spacing between groups.\n */\nfunction Results({\n children,\n className,\n}: React.ComponentProps<typeof Autocomplete.List> & { className?: string }) {\n return (\n <Autocomplete.List className={cn(\"space-y-3\", className)}>\n {children}\n </Autocomplete.List>\n );\n}\n\nconst Items = Autocomplete.Collection;\n\n/** CommandPalette variant definitions (no user-facing variants; structure reserved for future use). */\nexport const KUMO_COMMAND_PALETTE_VARIANTS = {} as const;\n\nexport const KUMO_COMMAND_PALETTE_DEFAULT_VARIANTS = {} as const;\n\n/**\n * CommandPalette — accessible command palette / spotlight search overlay.\n *\n * Compound component: `CommandPalette.Root` (or `.Dialog` + `.Panel`),\n * `.Input`, `.List`, `.Results`, `.Items`, `.Group`, `.GroupLabel`,\n * `.Item`, `.ResultItem`, `.HighlightedText`, `.Empty`, `.Loading`, `.Footer`.\n *\n * Built on `@base-ui/react/autocomplete` + `@base-ui/react/dialog`.\n *\n * @example\n * ```tsx\n * <CommandPalette.Root\n * open={open}\n * onOpenChange={setOpen}\n * items={results}\n * value={query}\n * onValueChange={setQuery}\n * itemToStringValue={(g) => g.label}\n * onSelect={(item, { newTab }) => navigate(item, newTab)}\n * getSelectableItems={(groups) => groups.flatMap((g) => g.items)}\n * >\n * <CommandPalette.Input placeholder=\"Search…\" />\n * <CommandPalette.List>\n * <CommandPalette.Results>\n * {(group) => (\n * <CommandPalette.Group items={group.items}>\n * <CommandPalette.GroupLabel>{group.label}</CommandPalette.GroupLabel>\n * <CommandPalette.Items>\n * {(item) => (\n * <CommandPalette.ResultItem title={item.title} value={item} onClick={…} />\n * )}\n * </CommandPalette.Items>\n * </CommandPalette.Group>\n * )}\n * </CommandPalette.Results>\n * <CommandPalette.Empty>No results found</CommandPalette.Empty>\n * </CommandPalette.List>\n * <CommandPalette.Footer>…keyboard hints…</CommandPalette.Footer>\n * </CommandPalette.Root>\n * ```\n */\nexport const CommandPalette = {\n /** Modal dialog wrapper - use with Panel for content that can swap */\n Dialog,\n /** Dialog + Panel combined - for simple single-view command palettes */\n Root,\n /** Autocomplete panel without dialog - use inside Dialog for swappable content */\n Panel,\n /** Input for use inside Panel */\n Input: PanelInput,\n /** Scrollable results container */\n List,\n /** Category grouping */\n Group,\n /** Section header text */\n GroupLabel,\n /** Basic item */\n Item,\n /** Rich item with breadcrumbs, highlights, icons */\n ResultItem,\n /** Text with highlighted portions */\n HighlightedText,\n /** Empty state */\n Empty,\n /** Loading state */\n Loading,\n /** Footer for keyboard hints */\n Footer,\n /** Render prop iterator for groups */\n Results,\n /** Render prop iterator for items within a group */\n Items,\n};\n"],"names":["DialogContext","createContext","Dialog","open","onOpenChange","onBackdropClick","children","containerProp","contextContainer","usePortalContainer","container","handleBackdropClick","e","handleClose","useCallback","jsx","DialogBase.Root","jsxs","DialogBase.Portal","DialogBase.Backdrop","Surface","DialogBase.Popup","cn","Root","items","value","onValueChange","onItemHighlighted","itemToStringValue","filter","onSelect","getSelectableItems","Panel","InputHeader","leading","trailing","MagnifyingGlassIcon","List","forwardRef","className","ref","Group","props","Autocomplete.Group","GroupLabel","Autocomplete.GroupLabel","Item","disabled","onClick","Autocomplete.Item","Empty","Autocomplete.Empty","Loading","Loader","Footer","HighlightedText","text","highlights","sortedHighlights","a","b","mergedHighlights","range","last","parts","lastIndex","i","start","end","ResultItem","title","breadcrumbs","titleHighlights","breadcrumbHighlights","description","icon","showArrow","external","nonInteractive","crumb","index","CaretRightIcon","ArrowSquareOutIcon","Fragment","ArrowRightIcon","Container","PanelContext","defaultFilter","highlightedIndexRef","useRef","handleItemHighlighted","item","details","handleInputKeyDown","isEnter","withModifier","highlightedItem","Autocomplete.Root","PanelInput","autoFocus","placeholder","onKeyDownProp","onInputKeyDown","useContext","onClose","handleKeyDown","Autocomplete.Input","Results","Autocomplete.List","Items","Autocomplete.Collection","KUMO_COMMAND_PALETTE_VARIANTS","KUMO_COMMAND_PALETTE_DEFAULT_VARIANTS","CommandPalette"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"dialog-oqh8l3l3zutpibxx.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 { Surface } from \"../surface\";\nimport { cn } from \"../../utils/cn\";\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 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 KUMO_DIALOG_VARIANTS.size[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 <Surface\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 </Surface>\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","DialogContent","className","children","style","containerProp","role","contextContainer","usePortalContainer","jsxs","AlertDialogBase.Portal","DialogBase.Portal","jsx","AlertDialogBase.Backdrop","DialogBase.Backdrop","Surface","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":";;;;;;;AAiBO,MAAMA,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAaJ,GAEaC,IAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM;AACR,GAiFMC,IAAoBC,EAA8B,QAAQ;AAEhE,SAASC,IAAgB;AACvB,SAAOC,EAAWH,CAAiB;AACrC;AAEO,SAASI,EAAe;AAAA,EAC7B,MAAAC,IAAON,EAA6B;AACtC,IAA6B,IAAI;AAC/B,SAAOO;AAAA;AAAA,IAEL;AAAA;AAAA,IAEAR,EAAqB,KAAKO,CAAI,EAAE;AAAA,EAAA;AAEpC;AA6DA,SAASE,EAAc;AAAA,EACrB,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAL,IAAON,EAA6B;AAAA,EACpC,WAAWY;AACb,GAAgB;AACd,QAAMC,IAAOV,EAAA,GACPW,IAAmBC,EAAA;AAUzB,SACE,gBAAAC,EAPAH,MAAS,gBAAgBI,IAAyBC,KAOtC,WAVIN,KAAiBE,KAAoB,QAWnD,UAAA;AAAA,IAAA,gBAAAK,EANFN,MAAS,gBAAgBO,IAA2BC,GAMjD,EAAa,WAAU,kIAAA,CAAkI;AAAA,IAC1J,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,0BANJT,MAAS,gBAAgBU,IAAwBC,GAMpC,EAAU;AAAA,QACnB,WAAWjB,EAAGF,EAAe,EAAE,MAAAC,EAAA,CAAM,GAAGG,CAAS;AAAA,QACjD,OACE;AAAA,UACE,oBAAoB;AAAA,UACpB,0BACE;AAAA,UACF,eACE;AAAA,UACF,GAAGE;AAAA,QAAA;AAAA,QAIN,UAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;AAwBA,SAASe,EAAW;AAAA,EAClB,UAAAf;AAAA,EACA,MAAAG,IAAOb,EAA6B;AAAA,EACpC,GAAG0B;AACL,GAAoB;AAClB,QAAMC,IACJd,MAAS,gBAAgBe,IAAuBC;AAClD,SACE,gBAAAV,EAAClB,EAAkB,UAAlB,EAA2B,OAAOY,GACjC,UAAA,gBAAAM,EAACQ,GAAA,EAAU,GAAGD,GAAQ,UAAAhB,EAAA,CAAS,EAAA,CACjC;AAEJ;AAEAe,EAAW,cAAc;AAYzB,SAASK,EAAc,EAAE,UAAApB,GAAU,GAAGgB,KAA6B;AAEjE,QAAMK,IADO5B,EAAA,MAEF,gBAAgB6B,IAA0BC;AACrD,SAAO,gBAAAd,EAACY,GAAA,EAAa,GAAGL,GAAQ,UAAAhB,EAAA,CAAS;AAC3C;AAEAoB,EAAc,cAAc;AAU5B,SAASI,EAAY,EAAE,WAAAzB,GAAW,GAAGiB,KAA2B;AAE9D,QAAMS,IADOhC,EAAA,MAEF,gBAAgBiC,IAAwBC;AACnD,SAAO,gBAAAlB,EAACgB,GAAA,EAAU,WAAA1B,GAAuB,GAAGiB,EAAA,CAAO;AACrD;AAEAQ,EAAY,cAAc;AAY1B,SAASI,EAAkB,EAAE,WAAA7B,GAAW,GAAGiB,KAAiC;AAE1E,QAAMa,IADOpC,EAAA,MAEF,gBACLqC,IACAC;AACN,SAAO,gBAAAtB,EAACoB,GAAA,EAAgB,WAAA9B,GAAuB,GAAGiB,EAAA,CAAO;AAC3D;AAEAY,EAAkB,cAAc;AAUhC,SAASI,EAAY,EAAE,UAAAhC,GAAU,GAAGgB,KAA2B;AAE7D,QAAMiB,IADOxC,EAAA,MAEF,gBAAgByC,IAAwBC;AACnD,SAAO,gBAAA1B,EAACwB,GAAA,EAAW,GAAGjB,GAAQ,UAAAhB,EAAA,CAAS;AACzC;AAEAgC,EAAY,cAAc;AAM1B,MAAMI,IAAS,OAAO,OAAOtC,GAAe;AAAA,EAC1C,MAAMiB;AAAA,EACN,SAASK;AAAA,EACT,OAAOI;AAAA,EACP,aAAaI;AAAA,EACb,OAAOI;AACT,CAAC;"}