@cloudflare/kumo 2.0.3 → 2.0.4

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 (70) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/.build-complete +1 -1
  3. package/dist/chunks/{autocomplete-ln55iimq2n2s5uex.js → autocomplete-hbs51xgjf9iglbmq.js} +3 -3
  4. package/dist/chunks/{autocomplete-ln55iimq2n2s5uex.js.map → autocomplete-hbs51xgjf9iglbmq.js.map} +1 -1
  5. package/dist/chunks/{breadcrumbs-do6uyvm4msqus0sz.js → breadcrumbs-er08s9swoctwoj69.js} +2 -2
  6. package/dist/chunks/{breadcrumbs-do6uyvm4msqus0sz.js.map → breadcrumbs-er08s9swoctwoj69.js.map} +1 -1
  7. package/dist/chunks/{button-dh366jtvswxj0fw3.js → button-fe5rvewji3e5xd7m.js} +35 -20
  8. package/dist/chunks/button-fe5rvewji3e5xd7m.js.map +1 -0
  9. package/dist/chunks/{checkbox-cf2pwdupyjweg184.js → checkbox-l7kc0vcs0o7a6fgn.js} +2 -2
  10. package/dist/chunks/{checkbox-cf2pwdupyjweg184.js.map → checkbox-l7kc0vcs0o7a6fgn.js.map} +1 -1
  11. package/dist/chunks/{clipboard-text-hn2uwdj4ozenezd5.js → clipboard-text-je4e2q880wngmmuc.js} +3 -3
  12. package/dist/chunks/{clipboard-text-hn2uwdj4ozenezd5.js.map → clipboard-text-je4e2q880wngmmuc.js.map} +1 -1
  13. package/dist/chunks/{cloudflare-logo-pbavoe1wu8nr5c4n.js → cloudflare-logo-fya2cd2ljozkzjh8.js} +84 -75
  14. package/dist/chunks/cloudflare-logo-fya2cd2ljozkzjh8.js.map +1 -0
  15. package/dist/chunks/{combobox-fivcg1oorkmmmk78.js → combobox-ck95wketqoqbxjwb.js} +3 -3
  16. package/dist/chunks/{combobox-fivcg1oorkmmmk78.js.map → combobox-ck95wketqoqbxjwb.js.map} +1 -1
  17. package/dist/chunks/{empty-fr78te81o3qaj3in.js → empty-bmacg9ap2gjmyqiw.js} +2 -2
  18. package/dist/chunks/{empty-fr78te81o3qaj3in.js.map → empty-bmacg9ap2gjmyqiw.js.map} +1 -1
  19. package/dist/chunks/{field-dgf36p7cmz1crlnu.js → field-hmucpi6d4sqci1zu.js} +2 -2
  20. package/dist/chunks/{field-dgf36p7cmz1crlnu.js.map → field-hmucpi6d4sqci1zu.js.map} +1 -1
  21. package/dist/chunks/{input-area-i5wulip5pau3u6ss.js → input-area-dpgn5810c269jwbu.js} +3 -3
  22. package/dist/chunks/{input-area-i5wulip5pau3u6ss.js.map → input-area-dpgn5810c269jwbu.js.map} +1 -1
  23. package/dist/chunks/{input-group-bm9wxzovpvzn1c25.js → input-group-k1xa9cu8ochl1arh.js} +4 -4
  24. package/dist/chunks/{input-group-bm9wxzovpvzn1c25.js.map → input-group-k1xa9cu8ochl1arh.js.map} +1 -1
  25. package/dist/chunks/{input-2y9vg81trmamkb6k.js → input-k2ychlh2zo6hsocz.js} +2 -2
  26. package/dist/chunks/{input-2y9vg81trmamkb6k.js.map → input-k2ychlh2zo6hsocz.js.map} +1 -1
  27. package/dist/chunks/{label-efa0uvb8zqyjwpc8.js → label-ni6chzu01wns3cs2.js} +2 -2
  28. package/dist/chunks/{label-efa0uvb8zqyjwpc8.js.map → label-ni6chzu01wns3cs2.js.map} +1 -1
  29. package/dist/chunks/{pagination-fdmcwreb27eej9l3.js → pagination-l9inbujoqp5swmyg.js} +3 -3
  30. package/dist/chunks/{pagination-fdmcwreb27eej9l3.js.map → pagination-l9inbujoqp5swmyg.js.map} +1 -1
  31. package/dist/chunks/{select-j8evv2iblgs5fa9s.js → select-n6u3p44qgtb0in3z.js} +4 -4
  32. package/dist/chunks/{select-j8evv2iblgs5fa9s.js.map → select-n6u3p44qgtb0in3z.js.map} +1 -1
  33. package/dist/chunks/{sensitive-input-cmb9jt42bv8jftei.js → sensitive-input-yoawqvvvmtdod430.js} +3 -3
  34. package/dist/chunks/{sensitive-input-cmb9jt42bv8jftei.js.map → sensitive-input-yoawqvvvmtdod430.js.map} +1 -1
  35. package/dist/chunks/{sidebar-kb9kykqfgy5yzqwr.js → sidebar-jjptencqv1jgztgu.js} +85 -84
  36. package/dist/chunks/sidebar-jjptencqv1jgztgu.js.map +1 -0
  37. package/dist/chunks/{switch-c4qjga6x3axmoi20.js → switch-dsnh8onvu1sxzdoe.js} +2 -2
  38. package/dist/chunks/{switch-c4qjga6x3axmoi20.js.map → switch-dsnh8onvu1sxzdoe.js.map} +1 -1
  39. package/dist/chunks/{table-jvqy3tu48xa75n2t.js → table-ngrghrfy9qsk6091.js} +2 -2
  40. package/dist/chunks/{table-jvqy3tu48xa75n2t.js.map → table-ngrghrfy9qsk6091.js.map} +1 -1
  41. package/dist/chunks/{toast-c7kqwuj7qj9dx6gs.js → toast-ksnnyrf2o8yfvc3m.js} +2 -2
  42. package/dist/chunks/{toast-c7kqwuj7qj9dx6gs.js.map → toast-ksnnyrf2o8yfvc3m.js.map} +1 -1
  43. package/dist/code.js +1 -1
  44. package/dist/components/autocomplete.js +1 -1
  45. package/dist/components/breadcrumbs.js +1 -1
  46. package/dist/components/button.js +1 -1
  47. package/dist/components/checkbox.js +1 -1
  48. package/dist/components/clipboard-text.js +1 -1
  49. package/dist/components/cloudflare-logo.js +1 -1
  50. package/dist/components/combobox.js +1 -1
  51. package/dist/components/empty.js +1 -1
  52. package/dist/components/field.js +1 -1
  53. package/dist/components/input-group.js +1 -1
  54. package/dist/components/input.js +3 -3
  55. package/dist/components/label.js +1 -1
  56. package/dist/components/pagination.js +1 -1
  57. package/dist/components/select.js +1 -1
  58. package/dist/components/sensitive-input.js +1 -1
  59. package/dist/components/sidebar.js +1 -1
  60. package/dist/components/switch.js +1 -1
  61. package/dist/components/table.js +1 -1
  62. package/dist/components/toast.js +1 -1
  63. package/dist/index.js +22 -22
  64. package/dist/src/components/button/button.d.ts.map +1 -1
  65. package/dist/src/components/cloudflare-logo/cloudflare-logo.d.ts.map +1 -1
  66. package/dist/src/components/sidebar/sidebar.d.ts.map +1 -1
  67. package/package.json +1 -1
  68. package/dist/chunks/button-dh366jtvswxj0fw3.js.map +0 -1
  69. package/dist/chunks/cloudflare-logo-pbavoe1wu8nr5c4n.js.map +0 -1
  70. package/dist/chunks/sidebar-kb9kykqfgy5yzqwr.js.map +0 -1
@@ -1,8 +1,29 @@
1
1
  "use client";
2
- import { jsxs as h, jsx as t } from "react/jsx-runtime";
3
- import { forwardRef as L } from "react";
4
- import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
5
- const m = "#F48120", v = "#FAAD3F", w = "#404041", p = "M33.204 20.4C33.3649 19.9741 33.4217 19.5159 33.3695 19.0636C33.3173 18.6113 33.1577 18.1781 32.904 17.8C32.6435 17.4876 32.3239 17.2297 31.9636 17.0409C31.6032 16.8522 31.2092 16.7363 30.804 16.7L13.404 16.5C13.304 16.5 13.204 16.4 13.104 16.4C13.0808 16.3825 13.0618 16.3599 13.0488 16.3339C13.0358 16.3078 13.029 16.2791 13.029 16.25C13.029 16.2209 13.0358 16.1922 13.0488 16.1662C13.0618 16.1401 13.0808 16.1175 13.104 16.1C13.204 15.9 13.304 15.8 13.504 15.8L31.004 15.6C32.115 15.4767 33.1731 15.0597 34.0695 14.3918C34.9659 13.7239 35.6681 12.8293 36.104 11.8L37.104 9.20002C37.104 9.10002 37.204 9.00001 37.104 8.90001C36.5604 6.47843 35.2411 4.30052 33.3466 2.69721C31.4521 1.09391 29.086 0.152865 26.6079 0.0170769C24.1298 -0.118712 21.675 0.558179 19.6167 1.94489C17.5584 3.33161 16.009 5.35233 15.204 7.70002C14.159 6.95365 12.8843 6.59957 11.604 6.70002C10.4291 6.83102 9.33369 7.35777 8.49774 8.19372C7.66179 9.02966 7.13505 10.1251 7.00404 11.3C6.93745 11.9014 6.97125 12.5097 7.10404 13.1C5.20298 13.1526 3.39743 13.9448 2.07147 15.3081C0.745511 16.6714 0.00377461 18.4982 0.00403983 20.4C-0.0123708 20.7695 0.0212659 21.1395 0.104038 21.5C0.10863 21.5781 0.141713 21.6517 0.19701 21.707C0.252307 21.7623 0.325975 21.7954 0.404041 21.8H32.504C32.704 21.8 32.904 21.7 32.904 21.5L33.204 20.4Z", u = "M38.704 9.20002H38.204C38.104 9.20002 38.004 9.30001 37.904 9.40001L37.204 11.8C37.0431 12.2259 36.9864 12.6841 37.0386 13.1364C37.0908 13.5887 37.2504 14.0219 37.504 14.4C37.7646 14.7124 38.0842 14.9704 38.4445 15.1591C38.8049 15.3479 39.1989 15.4637 39.604 15.5L43.304 15.7C43.404 15.7 43.504 15.8 43.604 15.8C43.6273 15.8175 43.6462 15.8401 43.6592 15.8662C43.6723 15.8922 43.679 15.9209 43.679 15.95C43.679 15.9791 43.6723 16.0078 43.6592 16.0339C43.6462 16.0599 43.6273 16.0826 43.604 16.1C43.504 16.3 43.404 16.4 43.204 16.4L39.404 16.6C38.293 16.7233 37.2349 17.1403 36.3386 17.8082C35.4422 18.4761 34.74 19.3707 34.304 20.4L34.104 21.3C34.004 21.4 34.104 21.6 34.304 21.6H47.504C47.5448 21.6058 47.5863 21.6021 47.6254 21.5891C47.6644 21.5761 47.6999 21.5541 47.729 21.525C47.7581 21.4959 47.7801 21.4604 47.7931 21.4214C47.8061 21.3823 47.8099 21.3408 47.804 21.3C48.0421 20.4527 48.1764 19.5797 48.204 18.7C48.1882 16.1854 47.1822 13.7782 45.404 12C43.6259 10.2218 41.2187 9.21587 38.704 9.20002Z", A = "M100.5,27.2a.9.9,0,1,1,.9-.9.89626.89626,0,0,1-.9.9m0-1.6a.7.7,0,1,0,.7.7.68354.68354,0,0,0-.7-.7m.4,1.2h-.2l-.2-.3h-.2v.3h-.2v-.9h.5a.26517.26517,0,0,1,.3.3c0,.1-.1.2-.2.3l.2.3Zm-.3-.5c.1,0,.1,0,.1-.1a.09794.09794,0,0,0-.1-.1h-.3v.3h.3Zm-89.7-.9h2.2v6h3.8v1.9h-6Zm8.3,3.9a4.10491,4.10491,0,0,1,4.3-4.1,4.02,4.02,0,0,1,4.2,4.1,4.10491,4.10491,0,0,1-4.3,4.1,4.07888,4.07888,0,0,1-4.2-4.1m6.3,0a2.05565,2.05565,0,0,0-2-2.2,2.1025,2.1025,0,0,0,0,4.2c1.2.2,2-.8,2-2m4.9.5V25.4h2.2v4.4c0,1.1.6,1.7,1.5,1.7a1.39926,1.39926,0,0,0,1.5-1.6V25.4h2.2v4.4c0,2.6-1.5,3.7-3.7,3.7-2.3-.1-3.7-1.2-3.7-3.7m10.7-4.4h3.1c2.8,0,4.5,1.6,4.5,3.9s-1.7,4-4.5,4h-3V25.4Zm3.1,5.9a2.00909,2.00909,0,1,0,0-4h-.9v4Zm7.6-5.9h6.3v1.9H54v1.3h3.7v1.8H54v2.9H51.8Zm9.4,0h2.2v6h3.8v1.9h-6Zm11.7-.1h2.2l3.4,8H76.1l-.6-1.4H72.4l-.6,1.4H69.5Zm2,4.9L74,28l-.9,2.2Zm6.4-4.8H85a3.41818,3.41818,0,0,1,2.6.9,2.62373,2.62373,0,0,1-.9,4.2l1.9,2.8H86.1l-1.6-2.4h-1v2.4H81.3Zm3.6,3.8c.7,0,1.2-.4,1.2-.9,0-.6-.5-.9-1.2-.9H83.5v1.9h1.4Zm6.5-3.8h6.4v1.8H93.6v1.2h3.8v1.8H93.6v1.2h4.3v1.9H91.4ZM6.1,30.3a1.97548,1.97548,0,0,1-1.8,1.2,2.1025,2.1025,0,0,1,0-4.2,2.0977,2.0977,0,0,1,1.9,1.3H8.5a4.13459,4.13459,0,0,0-4.2-3.3A4.1651,4.1651,0,0,0,0,29.4a4.07888,4.07888,0,0,0,4.2,4.1,4.31812,4.31812,0,0,0,4.2-3.2Z", O = "M84.2,20.4a2.85546,2.85546,0,0,0-.3-2.6,3.09428,3.09428,0,0,0-2.1-1.1l-17.4-.2c-.1,0-.2-.1-.3-.1a.1875.1875,0,0,1,0-.3c.1-.2.2-.3.4-.3L82,15.6a6.29223,6.29223,0,0,0,5.1-3.8l1-2.6c0-.1.1-.2,0-.3A11.39646,11.39646,0,0,0,66.2,7.7a5.45941,5.45941,0,0,0-3.6-1A5.20936,5.20936,0,0,0,58,11.3a5.46262,5.46262,0,0,0,.1,1.8A7.30177,7.30177,0,0,0,51,20.4a4.102,4.102,0,0,0,.1,1.1.3193.3193,0,0,0,.3.3H83.5c.2,0,.4-.1.4-.3Z", _ = "M89.7,9.2h-.5c-.1,0-.2.1-.3.2l-.7,2.4a2.85546,2.85546,0,0,0,.3,2.6,3.09428,3.09428,0,0,0,2.1,1.1l3.7.2c.1,0,.2.1.3.1a.1875.1875,0,0,1,0,.3c-.1.2-.2.3-.4.3l-3.8.2a6.29223,6.29223,0,0,0-5.1,3.8l-.2.9c-.1.1,0,.3.2.3H98.5a.26517.26517,0,0,0,.3-.3,10.87184,10.87184,0,0,0,.4-2.6,9.56045,9.56045,0,0,0-9.5-9.5", d = "0 0 49 22", g = "0 0 101.4 33.5", k = {
2
+ import { jsxs as i, jsx as a } from "react/jsx-runtime";
3
+ import { forwardRef as g } from "react";
4
+ import { c as s } from "./cn-ct4n7r74mh8y0f48.js";
5
+ const h = "#F48120", f = "#FAAD3F", x = "#404041", b = "M33.204 20.4C33.3649 19.9741 33.4217 19.5159 33.3695 19.0636C33.3173 18.6113 33.1577 18.1781 32.904 17.8C32.6435 17.4876 32.3239 17.2297 31.9636 17.0409C31.6032 16.8522 31.2092 16.7363 30.804 16.7L13.404 16.5C13.304 16.5 13.204 16.4 13.104 16.4C13.0808 16.3825 13.0618 16.3599 13.0488 16.3339C13.0358 16.3078 13.029 16.2791 13.029 16.25C13.029 16.2209 13.0358 16.1922 13.0488 16.1662C13.0618 16.1401 13.0808 16.1175 13.104 16.1C13.204 15.9 13.304 15.8 13.504 15.8L31.004 15.6C32.115 15.4767 33.1731 15.0597 34.0695 14.3918C34.9659 13.7239 35.6681 12.8293 36.104 11.8L37.104 9.20002C37.104 9.10002 37.204 9.00001 37.104 8.90001C36.5604 6.47843 35.2411 4.30052 33.3466 2.69721C31.4521 1.09391 29.086 0.152865 26.6079 0.0170769C24.1298 -0.118712 21.675 0.558179 19.6167 1.94489C17.5584 3.33161 16.009 5.35233 15.204 7.70002C14.159 6.95365 12.8843 6.59957 11.604 6.70002C10.4291 6.83102 9.33369 7.35777 8.49774 8.19372C7.66179 9.02966 7.13505 10.1251 7.00404 11.3C6.93745 11.9014 6.97125 12.5097 7.10404 13.1C5.20298 13.1526 3.39743 13.9448 2.07147 15.3081C0.745511 16.6714 0.00377461 18.4982 0.00403983 20.4C-0.0123708 20.7695 0.0212659 21.1395 0.104038 21.5C0.10863 21.5781 0.141713 21.6517 0.19701 21.707C0.252307 21.7623 0.325975 21.7954 0.404041 21.8H32.504C32.704 21.8 32.904 21.7 32.904 21.5L33.204 20.4Z", k = "M38.704 9.20002H38.204C38.104 9.20002 38.004 9.30001 37.904 9.40001L37.204 11.8C37.0431 12.2259 36.9864 12.6841 37.0386 13.1364C37.0908 13.5887 37.2504 14.0219 37.504 14.4C37.7646 14.7124 38.0842 14.9704 38.4445 15.1591C38.8049 15.3479 39.1989 15.4637 39.604 15.5L43.304 15.7C43.404 15.7 43.504 15.8 43.604 15.8C43.6273 15.8175 43.6462 15.8401 43.6592 15.8662C43.6723 15.8922 43.679 15.9209 43.679 15.95C43.679 15.9791 43.6723 16.0078 43.6592 16.0339C43.6462 16.0599 43.6273 16.0826 43.604 16.1C43.504 16.3 43.404 16.4 43.204 16.4L39.404 16.6C38.293 16.7233 37.2349 17.1403 36.3386 17.8082C35.4422 18.4761 34.74 19.3707 34.304 20.4L34.104 21.3C34.004 21.4 34.104 21.6 34.304 21.6H47.504C47.5448 21.6058 47.5863 21.6021 47.6254 21.5891C47.6644 21.5761 47.6999 21.5541 47.729 21.525C47.7581 21.4959 47.7801 21.4604 47.7931 21.4214C47.8061 21.3823 47.8099 21.3408 47.804 21.3C48.0421 20.4527 48.1764 19.5797 48.204 18.7C48.1882 16.1854 47.1822 13.7782 45.404 12C43.6259 10.2218 41.2187 9.21587 38.704 9.20002Z", w = [
6
+ // L
7
+ "M47.34 108.53 L56.88 108.53 L56.88 134.59 L73.54 134.59 L73.54 142.94 L47.34 142.94 L47.34 108.53",
8
+ // O
9
+ "M83.42,125.84v-.10c0-9.88,8-17.9,18.58-17.9s18.48,7.92,18.48,17.8v.1c0,9.88-8,17.89-18.58,17.89s-18.48-7.91-18.48-17.79m27.33,0v-.1c0-5-3.59-9.29-8.85-9.29s-8.7,4.23-8.7,9.19v.1c0,5,3.59,9.29,8.8,9.29s8.75-4.23,8.75-9.19",
10
+ // U
11
+ "M132.15,127.85V108.53h9.69v19.13c0,5,2.51,7.32,6.34,7.32s6.34-2.26,6.34-7.08V108.53h9.69v19.08c0,11.11-6.34,16-16.13,16s-15.93-5-15.93-15.73",
12
+ // D
13
+ "M178.8,108.53h13.27c12.29,0,19.42,7.08,19.42,17v.1c0,9.93-7.22,17.3-19.61,17.3H178.8Zm13.42,26c5.71,0,9.49-3.15,9.49-8.7v-.1c0-5.51-3.78-8.7-9.49-8.7h-3.88v17.5Z",
14
+ // F
15
+ "M225.35 108.53 L252.88 108.53 L252.88 116.89 L234.89 116.89 L234.89 122.74 L251.16 122.74 L251.16 130.65 L234.89 130.65 L234.89 142.94 L225.35 142.94 L225.35 108.53",
16
+ // L
17
+ "M266.15 108.53 L275.69 108.53 L275.69 134.59 L292.35 134.59 L292.35 142.94 L266.15 142.94 L266.15 108.53",
18
+ // A
19
+ "M317.27,108.29h9.19l14.65,34.65H330.89l-2.51-6.14H315.11l-2.46,6.14h-10Zm8.36,21.09-3.84-9.79-3.88,9.79Z",
20
+ // R
21
+ "M353.4,108.53h16.27c5.26,0,8.89,1.38,11.21,3.74a10.69,10.69,0,0,1,3,8v.1A10.89,10.89,0,0,1,376.85,131l8.21,12H374l-6.93-10.42h-4.18v10.42H353.4Zm15.83,16.52c3.24,0,5.11-1.57,5.11-4.08v-.1c0-2.7-2-4.08-5.16-4.08h-6.25v8.26Z",
22
+ // E
23
+ "M397.68 108.53 L425.36 108.53 L425.36 116.64 L407.12 116.64 L407.12 121.85 L423.64 121.85 L423.64 129.38 L407.12 129.38 L407.12 134.83 L425.61 134.83 L425.61 142.94 L397.68 142.94 L397.68 108.53",
24
+ // C
25
+ "M26.46,129.87A8.44,8.44,0,0,1,18.58,135c-5.21,0-8.8-4.33-8.8-9.29v-.1c0-5,3.49-9.19,8.7-9.19a8.63,8.63,0,0,1,8.18,5.7H36.72c-1.61-8.19-8.81-14.31-18.14-14.31C8,107.84,0,115.86,0,125.74v.09c0,9.89,7.86,17.8,18.48,17.8,9.08,0,16.18-5.88,18.05-13.76Z"
26
+ ], p = "M360.8,90.69l1-3.6c1.24-4.28.78-8.24-1.3-11.15a11.32,11.32,0,0,0-9-4.43l-73.35-.94a1.49,1.49,0,0,1-1.16-.61,1.51,1.51,0,0,1-.15-1.33,2,2,0,0,1,1.7-1.3l74-.94c8.78-.4,18.29-7.53,21.62-16.22l4.22-11a2.51,2.51,0,0,0,.16-.94,2.35,2.35,0,0,0-.05-.52,48.21,48.21,0,0,0-92.7-5,21.69,21.69,0,0,0-34.58,15.15,22,22,0,0,0,.56,7.59,30.83,30.83,0,0,0-29.93,30.82,31.22,31.22,0,0,0,.32,4.46A1.44,1.44,0,0,0,223.68,92H359.13A1.79,1.79,0,0,0,360.8,90.69Z", m = "M385.24,40c-.68,0-1.36,0-2,0a1.55,1.55,0,0,0-.31.07,1.14,1.14,0,0,0-.74.78l-2.89,10c-1.24,4.28-.77,8.24,1.31,11.14a11.3,11.3,0,0,0,9,4.44l15.63.94a1.44,1.44,0,0,1,1.12.6,1.5,1.5,0,0,1,.16,1.34,2,2,0,0,1-1.7,1.3l-16.24.94c-8.82.4-18.33,7.52-21.66,16.21l-1.17,3.07a.87.87,0,0,0,.77,1.18h55.94a1.49,1.49,0,0,0,1.45-1.07A40.15,40.15,0,0,0,385.24,40Z", u = "0 0 49 22", v = "0 0 425.6 143.63", M = {
6
27
  variant: {
7
28
  glyph: {
8
29
  description: "Cloud glyph only (logomark)"
@@ -22,41 +43,41 @@ const m = "#F48120", v = "#FAAD3F", w = "#404041", p = "M33.204 20.4C33.3649 19.
22
43
  description: "Solid white logo (for dark backgrounds)"
23
44
  }
24
45
  }
25
- }, s = {
46
+ }, d = {
26
47
  variant: "full",
27
48
  color: "color"
28
- }, f = L(
49
+ }, O = g(
29
50
  ({
30
- variant: o = s.variant,
31
- color: l = s.color,
32
- className: a,
51
+ variant: C = d.variant,
52
+ color: l = d.color,
53
+ className: o,
33
54
  ...e
34
- }, C) => {
35
- const r = o === "glyph", c = l === "color" ? m : "currentColor", n = l === "color" ? v : "currentColor", H = "currentColor";
36
- return r ? /* @__PURE__ */ h(
55
+ }, t) => {
56
+ const r = C === "glyph", L = l === "color" ? h : "currentColor", n = l === "color" ? f : "currentColor", c = "currentColor";
57
+ return r ? /* @__PURE__ */ i(
37
58
  "svg",
38
59
  {
39
- ref: C,
40
- viewBox: d,
60
+ ref: t,
61
+ viewBox: u,
41
62
  fill: "none",
42
63
  xmlns: "http://www.w3.org/2000/svg",
43
64
  role: "img",
44
65
  "aria-label": "Cloudflare logo",
45
- className: i(
66
+ className: s(
46
67
  l === "white" && "text-white",
47
68
  l === "black" && "text-black",
48
- a
69
+ o
49
70
  ),
50
71
  ...e,
51
72
  children: [
52
- /* @__PURE__ */ t(
73
+ /* @__PURE__ */ a(
53
74
  "path",
54
75
  {
55
76
  d: "M33.204 20.4C33.3649 19.9741 33.4217 19.5159 33.3695 19.0636C33.3173 18.6113 33.1577 18.1781 32.904 17.8C32.6435 17.4876 32.3239 17.2297 31.9636 17.0409C31.6032 16.8522 31.2092 16.7363 30.804 16.7L13.404 16.5C13.304 16.5 13.204 16.4 13.104 16.4C13.0808 16.3825 13.0618 16.3599 13.0488 16.3339C13.0358 16.3078 13.029 16.2791 13.029 16.25C13.029 16.2209 13.0358 16.1922 13.0488 16.1662C13.0618 16.1401 13.0808 16.1175 13.104 16.1C13.204 15.9 13.304 15.8 13.504 15.8L31.004 15.6C32.115 15.4767 33.1731 15.0597 34.0695 14.3918C34.9659 13.7239 35.6681 12.8293 36.104 11.8L37.104 9.20002C37.104 9.10002 37.204 9.00001 37.104 8.90001C36.5604 6.47843 35.2411 4.30052 33.3466 2.69721C31.4521 1.09391 29.086 0.152865 26.6079 0.0170769C24.1298 -0.118712 21.675 0.558179 19.6167 1.94489C17.5584 3.33161 16.009 5.35233 15.204 7.70002C14.159 6.95365 12.8843 6.59957 11.604 6.70002C10.4291 6.83102 9.33369 7.35777 8.49774 8.19372C7.66179 9.02966 7.13505 10.1251 7.00404 11.3C6.93745 11.9014 6.97125 12.5097 7.10404 13.1C5.20298 13.1526 3.39743 13.9448 2.07147 15.3081C0.745511 16.6714 0.00377461 18.4982 0.00403983 20.4C-0.0123708 20.7695 0.0212659 21.1395 0.104038 21.5C0.10863 21.5781 0.141713 21.6517 0.19701 21.707C0.252307 21.7623 0.325975 21.7954 0.404041 21.8H32.504C32.704 21.8 32.904 21.7 32.904 21.5L33.204 20.4Z",
56
- fill: c
77
+ fill: L
57
78
  }
58
79
  ),
59
- /* @__PURE__ */ t(
80
+ /* @__PURE__ */ a(
60
81
  "path",
61
82
  {
62
83
  d: "M38.704 9.20002H38.204C38.104 9.20002 38.004 9.30001 37.904 9.40001L37.204 11.8C37.0431 12.2259 36.9864 12.6841 37.0386 13.1364C37.0908 13.5887 37.2504 14.0219 37.504 14.4C37.7646 14.7124 38.0842 14.9704 38.4445 15.1591C38.8049 15.3479 39.1989 15.4637 39.604 15.5L43.304 15.7C43.404 15.7 43.504 15.8 43.604 15.8C43.6273 15.8175 43.6462 15.8401 43.6592 15.8662C43.6723 15.8922 43.679 15.9209 43.679 15.95C43.679 15.9791 43.6723 16.0078 43.6592 16.0339C43.6462 16.0599 43.6273 16.0826 43.604 16.1C43.504 16.3 43.404 16.4 43.204 16.4L39.404 16.6C38.293 16.7233 37.2349 17.1403 36.3386 17.8082C35.4422 18.4761 34.74 19.3707 34.304 20.4L34.104 21.3C34.004 21.4 34.104 21.6 34.304 21.6H47.504C47.5448 21.6058 47.5863 21.6021 47.6254 21.5891C47.6644 21.5761 47.6999 21.5541 47.729 21.525C47.7581 21.4959 47.7801 21.4604 47.7931 21.4214C47.8061 21.3823 47.8099 21.3408 47.804 21.3C48.0421 20.4527 48.1764 19.5797 48.204 18.7C48.1882 16.1854 47.1822 13.7782 45.404 12C43.6259 10.2218 41.2187 9.21587 38.704 9.20002Z",
@@ -65,102 +86,90 @@ const m = "#F48120", v = "#FAAD3F", w = "#404041", p = "M33.204 20.4C33.3649 19.
65
86
  )
66
87
  ]
67
88
  }
68
- ) : /* @__PURE__ */ h(
89
+ ) : /* @__PURE__ */ i(
69
90
  "svg",
70
91
  {
71
- ref: C,
72
- viewBox: g,
92
+ ref: t,
93
+ viewBox: v,
73
94
  fill: "none",
74
95
  xmlns: "http://www.w3.org/2000/svg",
75
96
  role: "img",
76
97
  "aria-label": "Cloudflare logo",
77
- className: i(
98
+ className: s(
78
99
  // Wordmark text color - respects dark mode
79
100
  l === "color" && "text-kumo-default",
80
101
  l === "white" && "text-white",
81
102
  l === "black" && "text-black",
82
- a
103
+ o
83
104
  ),
84
105
  ...e,
85
106
  children: [
86
- /* @__PURE__ */ t(
87
- "path",
88
- {
89
- d: "M84.2,20.4a2.85546,2.85546,0,0,0-.3-2.6,3.09428,3.09428,0,0,0-2.1-1.1l-17.4-.2c-.1,0-.2-.1-.3-.1a.1875.1875,0,0,1,0-.3c.1-.2.2-.3.4-.3L82,15.6a6.29223,6.29223,0,0,0,5.1-3.8l1-2.6c0-.1.1-.2,0-.3A11.39646,11.39646,0,0,0,66.2,7.7a5.45941,5.45941,0,0,0-3.6-1A5.20936,5.20936,0,0,0,58,11.3a5.46262,5.46262,0,0,0,.1,1.8A7.30177,7.30177,0,0,0,51,20.4a4.102,4.102,0,0,0,.1,1.1.3193.3193,0,0,0,.3.3H83.5c.2,0,.4-.1.4-.3Z",
90
- fill: c
91
- }
92
- ),
93
- /* @__PURE__ */ t(
94
- "path",
95
- {
96
- d: "M89.7,9.2h-.5c-.1,0-.2.1-.3.2l-.7,2.4a2.85546,2.85546,0,0,0,.3,2.6,3.09428,3.09428,0,0,0,2.1,1.1l3.7.2c.1,0,.2.1.3.1a.1875.1875,0,0,1,0,.3c-.1.2-.2.3-.4.3l-3.8.2a6.29223,6.29223,0,0,0-5.1,3.8l-.2.9c-.1.1,0,.3.2.3H98.5a.26517.26517,0,0,0,.3-.3,10.87184,10.87184,0,0,0,.4-2.6,9.56045,9.56045,0,0,0-9.5-9.5",
97
- fill: n
98
- }
99
- ),
100
- /* @__PURE__ */ t(
101
- "path",
102
- {
103
- d: "M100.5,27.2a.9.9,0,1,1,.9-.9.89626.89626,0,0,1-.9.9m0-1.6a.7.7,0,1,0,.7.7.68354.68354,0,0,0-.7-.7m.4,1.2h-.2l-.2-.3h-.2v.3h-.2v-.9h.5a.26517.26517,0,0,1,.3.3c0,.1-.1.2-.2.3l.2.3Zm-.3-.5c.1,0,.1,0,.1-.1a.09794.09794,0,0,0-.1-.1h-.3v.3h.3Zm-89.7-.9h2.2v6h3.8v1.9h-6Zm8.3,3.9a4.10491,4.10491,0,0,1,4.3-4.1,4.02,4.02,0,0,1,4.2,4.1,4.10491,4.10491,0,0,1-4.3,4.1,4.07888,4.07888,0,0,1-4.2-4.1m6.3,0a2.05565,2.05565,0,0,0-2-2.2,2.1025,2.1025,0,0,0,0,4.2c1.2.2,2-.8,2-2m4.9.5V25.4h2.2v4.4c0,1.1.6,1.7,1.5,1.7a1.39926,1.39926,0,0,0,1.5-1.6V25.4h2.2v4.4c0,2.6-1.5,3.7-3.7,3.7-2.3-.1-3.7-1.2-3.7-3.7m10.7-4.4h3.1c2.8,0,4.5,1.6,4.5,3.9s-1.7,4-4.5,4h-3V25.4Zm3.1,5.9a2.00909,2.00909,0,1,0,0-4h-.9v4Zm7.6-5.9h6.3v1.9H54v1.3h3.7v1.8H54v2.9H51.8Zm9.4,0h2.2v6h3.8v1.9h-6Zm11.7-.1h2.2l3.4,8H76.1l-.6-1.4H72.4l-.6,1.4H69.5Zm2,4.9L74,28l-.9,2.2Zm6.4-4.8H85a3.41818,3.41818,0,0,1,2.6.9,2.62373,2.62373,0,0,1-.9,4.2l1.9,2.8H86.1l-1.6-2.4h-1v2.4H81.3Zm3.6,3.8c.7,0,1.2-.4,1.2-.9,0-.6-.5-.9-1.2-.9H83.5v1.9h1.4Zm6.5-3.8h6.4v1.8H93.6v1.2h3.8v1.8H93.6v1.2h4.3v1.9H91.4ZM6.1,30.3a1.97548,1.97548,0,0,1-1.8,1.2,2.1025,2.1025,0,0,1,0-4.2,2.0977,2.0977,0,0,1,1.9,1.3H8.5a4.13459,4.13459,0,0,0-4.2-3.3A4.1651,4.1651,0,0,0,0,29.4a4.07888,4.07888,0,0,0,4.2,4.1,4.31812,4.31812,0,0,0,4.2-3.2Z",
104
- fill: H
105
- }
106
- )
107
+ /* @__PURE__ */ a("path", { d: p, fill: L }),
108
+ /* @__PURE__ */ a("path", { d: m, fill: n }),
109
+ w.map((A, _) => /* @__PURE__ */ a("path", { d: A, fill: c }, _))
107
110
  ]
108
111
  }
109
112
  );
110
113
  }
111
114
  );
112
- f.displayName = "CloudflareLogo";
113
- const Z = L(
115
+ O.displayName = "CloudflareLogo";
116
+ const E = g(
114
117
  ({
115
- color: o = "color",
118
+ color: C = "color",
116
119
  href: l = "https://www.cloudflare.com",
117
- className: a,
120
+ className: o,
118
121
  ...e
119
- }, C) => /* @__PURE__ */ h(
122
+ }, t) => /* @__PURE__ */ i(
120
123
  "a",
121
124
  {
122
- ref: C,
125
+ ref: t,
123
126
  href: l,
124
127
  target: "_blank",
125
128
  rel: "noopener noreferrer",
126
- className: i(
129
+ className: s(
127
130
  // Base badge styles
128
131
  "inline-flex items-center gap-2 rounded-lg py-2 pl-2.5 pr-3 text-sm font-medium",
129
132
  "ring-1 ring-inset transition-all hover:shadow-sm",
130
133
  // Color variants using semantic tokens
131
- o === "color" && "bg-kumo-base text-kumo-default ring-kumo-hairline",
132
- o === "black" && "bg-white text-black ring-black/20",
133
- o === "white" && "bg-black text-white ring-white/20",
134
- a
134
+ C === "color" && "bg-kumo-base text-kumo-default ring-kumo-hairline",
135
+ C === "black" && "bg-white text-black ring-black/20",
136
+ C === "white" && "bg-black text-white ring-white/20",
137
+ o
135
138
  ),
136
139
  ...e,
137
140
  children: [
138
- /* @__PURE__ */ t(f, { variant: "glyph", color: o, className: "h-4 w-auto" }),
139
- /* @__PURE__ */ h("span", { children: [
141
+ /* @__PURE__ */ a(O, { variant: "glyph", color: C, className: "h-4 w-auto" }),
142
+ /* @__PURE__ */ i("span", { children: [
140
143
  "Powered by ",
141
- /* @__PURE__ */ t("span", { className: "font-semibold", children: "Cloudflare" })
144
+ /* @__PURE__ */ a("span", { className: "font-semibold", children: "Cloudflare" })
142
145
  ] })
143
146
  ]
144
147
  }
145
148
  )
146
149
  );
147
- Z.displayName = "PoweredByCloudflare";
148
- function R(o = {}) {
149
- const { variant: l = "full", color: a = "color" } = o, e = l === "glyph", C = a === "color" ? m : a, r = a === "color" ? v : a, c = a === "color" ? w : a;
150
- return e ? `<svg viewBox="${d}" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Cloudflare logo">
151
- <path d="${p}" fill="${C}"/>
152
- <path d="${u}" fill="${r}"/>
153
- </svg>` : `<svg viewBox="${g}" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Cloudflare logo">
154
- <path d="${O}" fill="${C}"/>
155
- <path d="${_}" fill="${r}"/>
156
- <path d="${A}" fill="${c}"/>
150
+ E.displayName = "PoweredByCloudflare";
151
+ function U(C = {}) {
152
+ const { variant: l = "full", color: o = "color" } = C, e = l === "glyph", t = o === "color" ? h : o, r = o === "color" ? f : o, L = o === "color" ? x : o;
153
+ if (e)
154
+ return `<svg viewBox="${u}" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Cloudflare logo">
155
+ <path d="${b}" fill="${t}"/>
156
+ <path d="${k}" fill="${r}"/>
157
+ </svg>`;
158
+ const n = w.map(
159
+ (c) => ` <path d="${c}" fill="${L}"/>`
160
+ ).join(`
161
+ `);
162
+ return `<svg viewBox="${v}" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Cloudflare logo">
163
+ <path d="${p}" fill="${t}"/>
164
+ <path d="${m}" fill="${r}"/>
165
+ ${n}
157
166
  </svg>`;
158
167
  }
159
168
  export {
160
- f as C,
161
- k as K,
162
- Z as P,
163
- s as a,
164
- R as g
169
+ O as C,
170
+ M as K,
171
+ E as P,
172
+ d as a,
173
+ U as g
165
174
  };
166
- //# sourceMappingURL=cloudflare-logo-pbavoe1wu8nr5c4n.js.map
175
+ //# sourceMappingURL=cloudflare-logo-fya2cd2ljozkzjh8.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cloudflare-logo-fya2cd2ljozkzjh8.js","sources":["../../src/components/cloudflare-logo/cloudflare-logo.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n// =============================================================================\n// Brand Colors (internal)\n// =============================================================================\n\nconst CLOUDFLARE_ORANGE = \"#F48120\";\nconst CLOUDFLARE_YELLOW = \"#FAAD3F\";\nconst CLOUDFLARE_TEXT_GRAY = \"#404041\";\n\n// =============================================================================\n// SVG Path Data (internal)\n// =============================================================================\n\nconst CLOUDFLARE_GLYPH_ORANGE_PATH =\n \"M33.204 20.4C33.3649 19.9741 33.4217 19.5159 33.3695 19.0636C33.3173 18.6113 33.1577 18.1781 32.904 17.8C32.6435 17.4876 32.3239 17.2297 31.9636 17.0409C31.6032 16.8522 31.2092 16.7363 30.804 16.7L13.404 16.5C13.304 16.5 13.204 16.4 13.104 16.4C13.0808 16.3825 13.0618 16.3599 13.0488 16.3339C13.0358 16.3078 13.029 16.2791 13.029 16.25C13.029 16.2209 13.0358 16.1922 13.0488 16.1662C13.0618 16.1401 13.0808 16.1175 13.104 16.1C13.204 15.9 13.304 15.8 13.504 15.8L31.004 15.6C32.115 15.4767 33.1731 15.0597 34.0695 14.3918C34.9659 13.7239 35.6681 12.8293 36.104 11.8L37.104 9.20002C37.104 9.10002 37.204 9.00001 37.104 8.90001C36.5604 6.47843 35.2411 4.30052 33.3466 2.69721C31.4521 1.09391 29.086 0.152865 26.6079 0.0170769C24.1298 -0.118712 21.675 0.558179 19.6167 1.94489C17.5584 3.33161 16.009 5.35233 15.204 7.70002C14.159 6.95365 12.8843 6.59957 11.604 6.70002C10.4291 6.83102 9.33369 7.35777 8.49774 8.19372C7.66179 9.02966 7.13505 10.1251 7.00404 11.3C6.93745 11.9014 6.97125 12.5097 7.10404 13.1C5.20298 13.1526 3.39743 13.9448 2.07147 15.3081C0.745511 16.6714 0.00377461 18.4982 0.00403983 20.4C-0.0123708 20.7695 0.0212659 21.1395 0.104038 21.5C0.10863 21.5781 0.141713 21.6517 0.19701 21.707C0.252307 21.7623 0.325975 21.7954 0.404041 21.8H32.504C32.704 21.8 32.904 21.7 32.904 21.5L33.204 20.4Z\";\n\nconst CLOUDFLARE_GLYPH_YELLOW_PATH =\n \"M38.704 9.20002H38.204C38.104 9.20002 38.004 9.30001 37.904 9.40001L37.204 11.8C37.0431 12.2259 36.9864 12.6841 37.0386 13.1364C37.0908 13.5887 37.2504 14.0219 37.504 14.4C37.7646 14.7124 38.0842 14.9704 38.4445 15.1591C38.8049 15.3479 39.1989 15.4637 39.604 15.5L43.304 15.7C43.404 15.7 43.504 15.8 43.604 15.8C43.6273 15.8175 43.6462 15.8401 43.6592 15.8662C43.6723 15.8922 43.679 15.9209 43.679 15.95C43.679 15.9791 43.6723 16.0078 43.6592 16.0339C43.6462 16.0599 43.6273 16.0826 43.604 16.1C43.504 16.3 43.404 16.4 43.204 16.4L39.404 16.6C38.293 16.7233 37.2349 17.1403 36.3386 17.8082C35.4422 18.4761 34.74 19.3707 34.304 20.4L34.104 21.3C34.004 21.4 34.104 21.6 34.304 21.6H47.504C47.5448 21.6058 47.5863 21.6021 47.6254 21.5891C47.6644 21.5761 47.6999 21.5541 47.729 21.525C47.7581 21.4959 47.7801 21.4604 47.7931 21.4214C47.8061 21.3823 47.8099 21.3408 47.804 21.3C48.0421 20.4527 48.1764 19.5797 48.204 18.7C48.1882 16.1854 47.1822 13.7782 45.404 12C43.6259 10.2218 41.2187 9.21587 38.704 9.20002Z\";\n\n// Wordmark paths from official SVG (no trademark symbol)\nconst CLOUDFLARE_WORDMARK_PATHS = [\n // L\n \"M47.34 108.53 L56.88 108.53 L56.88 134.59 L73.54 134.59 L73.54 142.94 L47.34 142.94 L47.34 108.53\",\n // O\n \"M83.42,125.84v-.10c0-9.88,8-17.9,18.58-17.9s18.48,7.92,18.48,17.8v.1c0,9.88-8,17.89-18.58,17.89s-18.48-7.91-18.48-17.79m27.33,0v-.1c0-5-3.59-9.29-8.85-9.29s-8.7,4.23-8.7,9.19v.1c0,5,3.59,9.29,8.8,9.29s8.75-4.23,8.75-9.19\",\n // U\n \"M132.15,127.85V108.53h9.69v19.13c0,5,2.51,7.32,6.34,7.32s6.34-2.26,6.34-7.08V108.53h9.69v19.08c0,11.11-6.34,16-16.13,16s-15.93-5-15.93-15.73\",\n // D\n \"M178.8,108.53h13.27c12.29,0,19.42,7.08,19.42,17v.1c0,9.93-7.22,17.3-19.61,17.3H178.8Zm13.42,26c5.71,0,9.49-3.15,9.49-8.7v-.1c0-5.51-3.78-8.7-9.49-8.7h-3.88v17.5Z\",\n // F\n \"M225.35 108.53 L252.88 108.53 L252.88 116.89 L234.89 116.89 L234.89 122.74 L251.16 122.74 L251.16 130.65 L234.89 130.65 L234.89 142.94 L225.35 142.94 L225.35 108.53\",\n // L\n \"M266.15 108.53 L275.69 108.53 L275.69 134.59 L292.35 134.59 L292.35 142.94 L266.15 142.94 L266.15 108.53\",\n // A\n \"M317.27,108.29h9.19l14.65,34.65H330.89l-2.51-6.14H315.11l-2.46,6.14h-10Zm8.36,21.09-3.84-9.79-3.88,9.79Z\",\n // R\n \"M353.4,108.53h16.27c5.26,0,8.89,1.38,11.21,3.74a10.69,10.69,0,0,1,3,8v.1A10.89,10.89,0,0,1,376.85,131l8.21,12H374l-6.93-10.42h-4.18v10.42H353.4Zm15.83,16.52c3.24,0,5.11-1.57,5.11-4.08v-.1c0-2.7-2-4.08-5.16-4.08h-6.25v8.26Z\",\n // E\n \"M397.68 108.53 L425.36 108.53 L425.36 116.64 L407.12 116.64 L407.12 121.85 L423.64 121.85 L423.64 129.38 L407.12 129.38 L407.12 134.83 L425.61 134.83 L425.61 142.94 L397.68 142.94 L397.68 108.53\",\n // C\n \"M26.46,129.87A8.44,8.44,0,0,1,18.58,135c-5.21,0-8.8-4.33-8.8-9.29v-.1c0-5,3.49-9.19,8.7-9.19a8.63,8.63,0,0,1,8.18,5.7H36.72c-1.61-8.19-8.81-14.31-18.14-14.31C8,107.84,0,115.86,0,125.74v.09c0,9.89,7.86,17.8,18.48,17.8,9.08,0,16.18-5.88,18.05-13.76Z\",\n];\n\nconst CLOUDFLARE_FULL_LOGO_ORANGE_PATH =\n \"M360.8,90.69l1-3.6c1.24-4.28.78-8.24-1.3-11.15a11.32,11.32,0,0,0-9-4.43l-73.35-.94a1.49,1.49,0,0,1-1.16-.61,1.51,1.51,0,0,1-.15-1.33,2,2,0,0,1,1.7-1.3l74-.94c8.78-.4,18.29-7.53,21.62-16.22l4.22-11a2.51,2.51,0,0,0,.16-.94,2.35,2.35,0,0,0-.05-.52,48.21,48.21,0,0,0-92.7-5,21.69,21.69,0,0,0-34.58,15.15,22,22,0,0,0,.56,7.59,30.83,30.83,0,0,0-29.93,30.82,31.22,31.22,0,0,0,.32,4.46A1.44,1.44,0,0,0,223.68,92H359.13A1.79,1.79,0,0,0,360.8,90.69Z\";\n\nconst CLOUDFLARE_FULL_LOGO_YELLOW_PATH =\n \"M385.24,40c-.68,0-1.36,0-2,0a1.55,1.55,0,0,0-.31.07,1.14,1.14,0,0,0-.74.78l-2.89,10c-1.24,4.28-.77,8.24,1.31,11.14a11.3,11.3,0,0,0,9,4.44l15.63.94a1.44,1.44,0,0,1,1.12.6,1.5,1.5,0,0,1,.16,1.34,2,2,0,0,1-1.7,1.3l-16.24.94c-8.82.4-18.33,7.52-21.66,16.21l-1.17,3.07a.87.87,0,0,0,.77,1.18h55.94a1.49,1.49,0,0,0,1.45-1.07A40.15,40.15,0,0,0,385.24,40Z\";\n\nconst CLOUDFLARE_GLYPH_VIEWBOX = \"0 0 49 22\";\nconst CLOUDFLARE_FULL_LOGO_VIEWBOX = \"0 0 425.6 143.63\";\n\n// =============================================================================\n// Component Variants\n// =============================================================================\n\nexport const KUMO_CLOUDFLARE_LOGO_VARIANTS = {\n variant: {\n glyph: {\n description: \"Cloud glyph only (logomark)\",\n },\n full: {\n description: \"Full logo with cloud glyph and wordmark stacked\",\n },\n },\n color: {\n color: {\n description:\n \"Brand colors (orange/yellow gradient cloud, dark gray text)\",\n },\n black: {\n description: \"Solid black logo\",\n },\n white: {\n description: \"Solid white logo (for dark backgrounds)\",\n },\n },\n} as const;\n\nexport const KUMO_CLOUDFLARE_LOGO_DEFAULT_VARIANTS = {\n variant: \"full\",\n color: \"color\",\n} as const;\n\nexport type CloudflareLogoVariant =\n keyof typeof KUMO_CLOUDFLARE_LOGO_VARIANTS.variant;\nexport type CloudflareLogoColor =\n keyof typeof KUMO_CLOUDFLARE_LOGO_VARIANTS.color;\n\nexport interface CloudflareLogoProps\n extends React.SVGAttributes<SVGSVGElement> {\n /**\n * Logo variant\n * - `glyph`: Cloud icon only\n * - `full`: Cloud icon with \"CLOUDFLARE\" wordmark below\n * @default \"full\"\n */\n variant?: CloudflareLogoVariant;\n /**\n * Color scheme\n * - `color`: Brand colors (orange/yellow cloud, dark gray wordmark)\n * - `black`: Solid black\n * - `white`: Solid white (for dark backgrounds)\n * @default \"color\"\n */\n color?: CloudflareLogoColor;\n}\n\n/**\n * Cloudflare logo component.\n *\n * @example Glyph only (cloud icon)\n * ```tsx\n * <CloudflareLogo variant=\"glyph\" className=\"w-12\" />\n * ```\n *\n * @example Full logo with wordmark\n * ```tsx\n * <CloudflareLogo variant=\"full\" className=\"w-40\" />\n * ```\n *\n * @example White logo for dark backgrounds\n * ```tsx\n * <CloudflareLogo color=\"white\" className=\"w-32\" />\n * ```\n *\n * @example Black logo\n * ```tsx\n * <CloudflareLogo color=\"black\" className=\"w-32\" />\n * ```\n */\nexport const CloudflareLogo = forwardRef<SVGSVGElement, CloudflareLogoProps>(\n (\n {\n variant = KUMO_CLOUDFLARE_LOGO_DEFAULT_VARIANTS.variant,\n color = KUMO_CLOUDFLARE_LOGO_DEFAULT_VARIANTS.color,\n className,\n ...props\n },\n ref,\n ) => {\n const isGlyph = variant === \"glyph\";\n\n // Determine fill colors\n // Cloud glyph always uses brand colors when color=\"color\", otherwise currentColor\n const fillOrange = color === \"color\" ? CLOUDFLARE_ORANGE : \"currentColor\";\n const fillYellow = color === \"color\" ? CLOUDFLARE_YELLOW : \"currentColor\";\n // Wordmark uses currentColor to respect dark mode (via text-kumo-default class)\n const fillText = \"currentColor\";\n\n if (isGlyph) {\n return (\n <svg\n ref={ref}\n viewBox={CLOUDFLARE_GLYPH_VIEWBOX}\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n role=\"img\"\n aria-label=\"Cloudflare logo\"\n className={cn(\n color === \"white\" && \"text-white\",\n color === \"black\" && \"text-black\",\n className,\n )}\n {...props}\n >\n <path\n d=\"M33.204 20.4C33.3649 19.9741 33.4217 19.5159 33.3695 19.0636C33.3173 18.6113 33.1577 18.1781 32.904 17.8C32.6435 17.4876 32.3239 17.2297 31.9636 17.0409C31.6032 16.8522 31.2092 16.7363 30.804 16.7L13.404 16.5C13.304 16.5 13.204 16.4 13.104 16.4C13.0808 16.3825 13.0618 16.3599 13.0488 16.3339C13.0358 16.3078 13.029 16.2791 13.029 16.25C13.029 16.2209 13.0358 16.1922 13.0488 16.1662C13.0618 16.1401 13.0808 16.1175 13.104 16.1C13.204 15.9 13.304 15.8 13.504 15.8L31.004 15.6C32.115 15.4767 33.1731 15.0597 34.0695 14.3918C34.9659 13.7239 35.6681 12.8293 36.104 11.8L37.104 9.20002C37.104 9.10002 37.204 9.00001 37.104 8.90001C36.5604 6.47843 35.2411 4.30052 33.3466 2.69721C31.4521 1.09391 29.086 0.152865 26.6079 0.0170769C24.1298 -0.118712 21.675 0.558179 19.6167 1.94489C17.5584 3.33161 16.009 5.35233 15.204 7.70002C14.159 6.95365 12.8843 6.59957 11.604 6.70002C10.4291 6.83102 9.33369 7.35777 8.49774 8.19372C7.66179 9.02966 7.13505 10.1251 7.00404 11.3C6.93745 11.9014 6.97125 12.5097 7.10404 13.1C5.20298 13.1526 3.39743 13.9448 2.07147 15.3081C0.745511 16.6714 0.00377461 18.4982 0.00403983 20.4C-0.0123708 20.7695 0.0212659 21.1395 0.104038 21.5C0.10863 21.5781 0.141713 21.6517 0.19701 21.707C0.252307 21.7623 0.325975 21.7954 0.404041 21.8H32.504C32.704 21.8 32.904 21.7 32.904 21.5L33.204 20.4Z\"\n fill={fillOrange}\n />\n <path\n d=\"M38.704 9.20002H38.204C38.104 9.20002 38.004 9.30001 37.904 9.40001L37.204 11.8C37.0431 12.2259 36.9864 12.6841 37.0386 13.1364C37.0908 13.5887 37.2504 14.0219 37.504 14.4C37.7646 14.7124 38.0842 14.9704 38.4445 15.1591C38.8049 15.3479 39.1989 15.4637 39.604 15.5L43.304 15.7C43.404 15.7 43.504 15.8 43.604 15.8C43.6273 15.8175 43.6462 15.8401 43.6592 15.8662C43.6723 15.8922 43.679 15.9209 43.679 15.95C43.679 15.9791 43.6723 16.0078 43.6592 16.0339C43.6462 16.0599 43.6273 16.0826 43.604 16.1C43.504 16.3 43.404 16.4 43.204 16.4L39.404 16.6C38.293 16.7233 37.2349 17.1403 36.3386 17.8082C35.4422 18.4761 34.74 19.3707 34.304 20.4L34.104 21.3C34.004 21.4 34.104 21.6 34.304 21.6H47.504C47.5448 21.6058 47.5863 21.6021 47.6254 21.5891C47.6644 21.5761 47.6999 21.5541 47.729 21.525C47.7581 21.4959 47.7801 21.4604 47.7931 21.4214C47.8061 21.3823 47.8099 21.3408 47.804 21.3C48.0421 20.4527 48.1764 19.5797 48.204 18.7C48.1882 16.1854 47.1822 13.7782 45.404 12C43.6259 10.2218 41.2187 9.21587 38.704 9.20002Z\"\n fill={fillYellow}\n />\n </svg>\n );\n }\n\n // Full logo with wordmark\n return (\n <svg\n ref={ref}\n viewBox={CLOUDFLARE_FULL_LOGO_VIEWBOX}\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n role=\"img\"\n aria-label=\"Cloudflare logo\"\n className={cn(\n // Wordmark text color - respects dark mode\n color === \"color\" && \"text-kumo-default\",\n color === \"white\" && \"text-white\",\n color === \"black\" && \"text-black\",\n className,\n )}\n {...props}\n >\n {/* Cloud glyph */}\n <path d={CLOUDFLARE_FULL_LOGO_ORANGE_PATH} fill={fillOrange} />\n <path d={CLOUDFLARE_FULL_LOGO_YELLOW_PATH} fill={fillYellow} />\n {/* Wordmark */}\n {CLOUDFLARE_WORDMARK_PATHS.map((d, i) => (\n <path key={i} d={d} fill={fillText} />\n ))}\n </svg>\n );\n },\n);\n\nCloudflareLogo.displayName = \"CloudflareLogo\";\n\n// =============================================================================\n// PoweredByCloudflare Component\n// =============================================================================\n\nexport interface PoweredByCloudflareProps\n extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n /**\n * Color scheme for the logo and text\n * @default \"color\"\n */\n color?: CloudflareLogoColor;\n}\n\n/**\n * \"Powered by Cloudflare\" badge component.\n *\n * Renders a link to cloudflare.com with the Cloudflare glyph and \"Powered by Cloudflare\" text.\n *\n * @example Basic usage\n * ```tsx\n * <PoweredByCloudflare />\n * ```\n *\n * @example White variant for dark backgrounds\n * ```tsx\n * <PoweredByCloudflare color=\"white\" />\n * ```\n *\n * @example Custom link\n * ```tsx\n * <PoweredByCloudflare href=\"https://cloudflare.com/products/workers\" />\n * ```\n */\nexport const PoweredByCloudflare = forwardRef<\n HTMLAnchorElement,\n PoweredByCloudflareProps\n>(\n (\n {\n color = \"color\",\n href = \"https://www.cloudflare.com\",\n className,\n ...props\n },\n ref,\n ) => {\n return (\n <a\n ref={ref}\n href={href}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={cn(\n // Base badge styles\n \"inline-flex items-center gap-2 rounded-lg py-2 pl-2.5 pr-3 text-sm font-medium\",\n \"ring-1 ring-inset transition-all hover:shadow-sm\",\n // Color variants using semantic tokens\n color === \"color\" && \"bg-kumo-base text-kumo-default ring-kumo-hairline\",\n color === \"black\" && \"bg-white text-black ring-black/20\",\n color === \"white\" && \"bg-black text-white ring-white/20\",\n className,\n )}\n {...props}\n >\n <CloudflareLogo variant=\"glyph\" color={color} className=\"h-4 w-auto\" />\n <span>\n Powered by <span className=\"font-semibold\">Cloudflare</span>\n </span>\n </a>\n );\n },\n);\n\nPoweredByCloudflare.displayName = \"PoweredByCloudflare\";\n\n// =============================================================================\n// SVG Generation Helper\n// =============================================================================\n\nexport type CloudflareLogoSvgVariant = \"glyph\" | \"full\";\nexport type CloudflareLogoSvgColor = \"color\" | \"black\" | \"white\";\n\nexport interface GenerateCloudflareLogoSvgOptions {\n /**\n * Logo variant\n * - `glyph`: Cloud icon only\n * - `full`: Cloud icon with \"CLOUDFLARE\" wordmark\n * @default \"full\"\n */\n variant?: CloudflareLogoSvgVariant;\n /**\n * Color scheme\n * - `color`: Brand colors (orange/yellow cloud, dark gray wordmark)\n * - `black`: Solid black\n * - `white`: Solid white\n * @default \"color\"\n */\n color?: CloudflareLogoSvgColor;\n}\n\n/**\n * Generates SVG markup string for the Cloudflare logo.\n *\n * Useful for copying to clipboard or embedding in non-React contexts.\n *\n * @example Copy glyph SVG to clipboard\n * ```tsx\n * const svg = generateCloudflareLogoSvg({ variant: \"glyph\" });\n * await navigator.clipboard.writeText(svg);\n * ```\n *\n * @example Generate full logo in black\n * ```tsx\n * const svg = generateCloudflareLogoSvg({ variant: \"full\", color: \"black\" });\n * ```\n */\nexport function generateCloudflareLogoSvg(\n options: GenerateCloudflareLogoSvgOptions = {},\n): string {\n const { variant = \"full\", color = \"color\" } = options;\n\n const isGlyph = variant === \"glyph\";\n\n // Determine fill colors\n const fillOrange = color === \"color\" ? CLOUDFLARE_ORANGE : color;\n const fillYellow = color === \"color\" ? CLOUDFLARE_YELLOW : color;\n const fillText = color === \"color\" ? CLOUDFLARE_TEXT_GRAY : color;\n\n if (isGlyph) {\n return `<svg viewBox=\"${CLOUDFLARE_GLYPH_VIEWBOX}\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" aria-label=\"Cloudflare logo\">\n <path d=\"${CLOUDFLARE_GLYPH_ORANGE_PATH}\" fill=\"${fillOrange}\"/>\n <path d=\"${CLOUDFLARE_GLYPH_YELLOW_PATH}\" fill=\"${fillYellow}\"/>\n</svg>`;\n }\n\n // Full logo with wordmark\n const wordmarkPaths = CLOUDFLARE_WORDMARK_PATHS.map(\n (d) => ` <path d=\"${d}\" fill=\"${fillText}\"/>`,\n ).join(\"\\n\");\n\n return `<svg viewBox=\"${CLOUDFLARE_FULL_LOGO_VIEWBOX}\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" aria-label=\"Cloudflare logo\">\n <path d=\"${CLOUDFLARE_FULL_LOGO_ORANGE_PATH}\" fill=\"${fillOrange}\"/>\n <path d=\"${CLOUDFLARE_FULL_LOGO_YELLOW_PATH}\" fill=\"${fillYellow}\"/>\n${wordmarkPaths}\n</svg>`;\n}\n"],"names":["CLOUDFLARE_ORANGE","CLOUDFLARE_YELLOW","CLOUDFLARE_TEXT_GRAY","CLOUDFLARE_GLYPH_ORANGE_PATH","CLOUDFLARE_GLYPH_YELLOW_PATH","CLOUDFLARE_WORDMARK_PATHS","CLOUDFLARE_FULL_LOGO_ORANGE_PATH","CLOUDFLARE_FULL_LOGO_YELLOW_PATH","CLOUDFLARE_GLYPH_VIEWBOX","CLOUDFLARE_FULL_LOGO_VIEWBOX","KUMO_CLOUDFLARE_LOGO_VARIANTS","KUMO_CLOUDFLARE_LOGO_DEFAULT_VARIANTS","CloudflareLogo","forwardRef","variant","color","className","props","ref","isGlyph","fillOrange","fillYellow","fillText","jsxs","cn","jsx","d","i","PoweredByCloudflare","href","generateCloudflareLogoSvg","options","wordmarkPaths"],"mappings":";;;;AAOA,MAAMA,IAAoB,WACpBC,IAAoB,WACpBC,IAAuB,WAMvBC,IACJ,+xCAEIC,IACJ,k/BAGIC,IAA4B;AAAA;AAAA,EAEhC;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AACF,GAEMC,IACJ,2bAEIC,IACJ,6VAEIC,IAA2B,aAC3BC,IAA+B,oBAMxBC,IAAgC;AAAA,EAC3C,SAAS;AAAA,IACP,OAAO;AAAA,MACL,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,OAAO;AAAA,IACL,OAAO;AAAA,MACL,aACE;AAAA,IAAA;AAAA,IAEJ,OAAO;AAAA,MACL,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAAwC;AAAA,EACnD,SAAS;AAAA,EACT,OAAO;AACT,GAiDaC,IAAiBC;AAAA,EAC5B,CACE;AAAA,IACE,SAAAC,IAAUH,EAAsC;AAAA,IAChD,OAAAI,IAAQJ,EAAsC;AAAA,IAC9C,WAAAK;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAUL,MAAY,SAItBM,IAAaL,MAAU,UAAUf,IAAoB,gBACrDqB,IAAaN,MAAU,UAAUd,IAAoB,gBAErDqB,IAAW;AAEjB,WAAIH,IAEA,gBAAAI;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAL;AAAA,QACA,SAASV;AAAA,QACT,MAAK;AAAA,QACL,OAAM;AAAA,QACN,MAAK;AAAA,QACL,cAAW;AAAA,QACX,WAAWgB;AAAA,UACTT,MAAU,WAAW;AAAA,UACrBA,MAAU,WAAW;AAAA,UACrBC;AAAA,QAAA;AAAA,QAED,GAAGC;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAQ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,GAAE;AAAA,cACF,MAAML;AAAA,YAAA;AAAA,UAAA;AAAA,UAER,gBAAAK;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,GAAE;AAAA,cACF,MAAMJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACR;AAAA,MAAA;AAAA,IAAA,IAOJ,gBAAAE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAL;AAAA,QACA,SAAST;AAAA,QACT,MAAK;AAAA,QACL,OAAM;AAAA,QACN,MAAK;AAAA,QACL,cAAW;AAAA,QACX,WAAWe;AAAA;AAAA,UAETT,MAAU,WAAW;AAAA,UACrBA,MAAU,WAAW;AAAA,UACrBA,MAAU,WAAW;AAAA,UACrBC;AAAA,QAAA;AAAA,QAED,GAAGC;AAAA,QAGJ,UAAA;AAAA,UAAA,gBAAAQ,EAAC,QAAA,EAAK,GAAGnB,GAAkC,MAAMc,GAAY;AAAA,UAC7D,gBAAAK,EAAC,QAAA,EAAK,GAAGlB,GAAkC,MAAMc,GAAY;AAAA,UAE5DhB,EAA0B,IAAI,CAACqB,GAAGC,MACjC,gBAAAF,EAAC,QAAA,EAAa,GAAAC,GAAM,MAAMJ,EAAA,GAAfK,CAAyB,CACrC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEAf,EAAe,cAAc;AAmCtB,MAAMgB,IAAsBf;AAAA,EAIjC,CACE;AAAA,IACE,OAAAE,IAAQ;AAAA,IACR,MAAAc,IAAO;AAAA,IACP,WAAAb;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGE,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAL;AAAA,MACA,MAAAW;AAAA,MACA,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,WAAWL;AAAA;AAAA,QAET;AAAA,QACA;AAAA;AAAA,QAEAT,MAAU,WAAW;AAAA,QACrBA,MAAU,WAAW;AAAA,QACrBA,MAAU,WAAW;AAAA,QACrBC;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAQ,EAACb,GAAA,EAAe,SAAQ,SAAQ,OAAAG,GAAc,WAAU,cAAa;AAAA,0BACpE,QAAA,EAAK,UAAA;AAAA,UAAA;AAAA,UACO,gBAAAU,EAAC,QAAA,EAAK,WAAU,iBAAgB,UAAA,aAAA,CAAU;AAAA,QAAA,EAAA,CACvD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;AAEAG,EAAoB,cAAc;AA2C3B,SAASE,EACdC,IAA4C,IACpC;AACR,QAAM,EAAE,SAAAjB,IAAU,QAAQ,OAAAC,IAAQ,YAAYgB,GAExCZ,IAAUL,MAAY,SAGtBM,IAAaL,MAAU,UAAUf,IAAoBe,GACrDM,IAAaN,MAAU,UAAUd,IAAoBc,GACrDO,IAAWP,MAAU,UAAUb,IAAuBa;AAE5D,MAAII;AACF,WAAO,iBAAiBX,CAAwB;AAAA,aACvCL,CAA4B,WAAWiB,CAAU;AAAA,aACjDhB,CAA4B,WAAWiB,CAAU;AAAA;AAK5D,QAAMW,IAAgB3B,EAA0B;AAAA,IAC9C,CAACqB,MAAM,cAAcA,CAAC,WAAWJ,CAAQ;AAAA,EAAA,EACzC,KAAK;AAAA,CAAI;AAEX,SAAO,iBAAiBb,CAA4B;AAAA,aACzCH,CAAgC,WAAWc,CAAU;AAAA,aACrDb,CAAgC,WAAWc,CAAU;AAAA,EAChEW,CAAa;AAAA;AAEf;"}
@@ -2,9 +2,9 @@
2
2
  import { jsx as e, jsxs as m } from "react/jsx-runtime";
3
3
  import { CheckIcon as S, XIcon as h, CaretDownIcon as x } from "@phosphor-icons/react";
4
4
  import { createContext as T, useContext as g, Fragment as P } from "react";
5
- import { i as p, K as V } from "./input-2y9vg81trmamkb6k.js";
5
+ import { i as p, K as V } from "./input-k2ychlh2zo6hsocz.js";
6
6
  import { c as t } from "./cn-ct4n7r74mh8y0f48.js";
7
- import { F as j } from "./field-dgf36p7cmz1crlnu.js";
7
+ import { F as j } from "./field-hmucpi6d4sqci1zu.js";
8
8
  import { u as G } from "./portal-provider-hwmkdmkpvct0cb76.js";
9
9
  import { a6 as L, a7 as M, a8 as F, a9 as _, aa as A, ab as E, ac as b, ad as K, ae as O, af as U, ag as W, ah as D, ai as f, aj as H, ak as C, al as N, am as X, an as q, ao as B } from "./vendor-base-ui-ie71jahf0czyf58j.js";
10
10
  V.size;
@@ -390,4 +390,4 @@ const de = Object.assign(y, {
390
390
  export {
391
391
  de as C
392
392
  };
393
- //# sourceMappingURL=combobox-fivcg1oorkmmmk78.js.map
393
+ //# sourceMappingURL=combobox-ck95wketqoqbxjwb.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"combobox-fivcg1oorkmmmk78.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 { resolveVariant } from \"../../utils/resolve-variant\";\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(resolveVariant(KUMO_COMBOBOX_VARIANTS.inputSide, inputSide, KUMO_COMBOBOX_DEFAULT_VARIANTS.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 \"data-[placeholder]:text-kumo-placeholder\",\n iconStyles.padding,\n className,\n )}\n >\n <ComboboxBase.Value {...props} />\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({\n clearLabel = \"Clear selection\",\n showOptionsLabel = \"Show options\",\n ...props\n}: ComboboxBase.Input.Props & {\n /** Accessible label for the clear button. Pass a translated string for i18n.\n * @default \"Clear selection\"\n */\n clearLabel?: string;\n /** Accessible label for the dropdown trigger. Pass a translated string for i18n.\n * @default \"Show options\"\n */\n showOptionsLabel?: string;\n}) {\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 aria-label={clearLabel}\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\n aria-label={showOptionsLabel}\n className={cn(\n \"absolute top-1/2 -translate-y-1/2 flex items-center justify-center cursor-pointer text-kumo-subtle\",\n \"m-0 bg-transparent p-0\", // Reset Stratus global button styles\n iconStyles.caretRight,\n )}\n >\n <ComboboxBase.Icon>\n <CaretDownIcon size={iconStyles.iconSize} className=\"fill-current\" />\n </ComboboxBase.Icon>\n </ComboboxBase.Trigger>\n </div>\n );\n}\n\nfunction Item({\n children,\n className,\n ...props\n}: ComboboxBase.Item.Props & { className?: string }) {\n return (\n <ComboboxBase.Item\n {...props}\n className={cn(\n \"group mx-1.5 grid grid-cols-[1fr_16px] gap-2 rounded px-2 py-1.5 text-base\",\n \"cursor-pointer data-highlighted:bg-kumo-tint\",\n // Disabled rows: muted text, no pointer, suppress highlight bg even\n // when keyboard nav lands on them. Base UI sets `data-disabled` on\n // the element when the `disabled` prop is true.\n \"data-[disabled]:cursor-not-allowed data-[disabled]:text-kumo-subtle data-[disabled]:opacity-60 data-[disabled]:data-highlighted:bg-transparent\",\n className,\n )}\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-subtle\",\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-hairline mt-2 pt-2 first:border-t-0 first:mt-0 first:pt-0\"\n />\n );\n}\n\nfunction Chip({\n removeLabel = \"Remove\",\n ...props\n}: ComboboxBase.Chip.Props & {\n /** Accessible label for the chip remove button. Pass a translated string for i18n.\n * @default \"Remove\"\n */\n removeLabel?: string;\n}) {\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-hairline\", // Border\n \"bg-kumo-overlay\", // Background\n \"text-sm\", // Typography\n )}\n >\n {props.children}\n <ComboboxBase.ChipRemove\n aria-label={removeLabel}\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","clearLabel","showOptionsLabel","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","removeLabel","ComboboxBase.Chip","ComboboxBase.ChipRemove","sizeToMinHeight","TriggerMultipleWithInput","placeholder","renderItem","inputSide","controlledValue","chipsToRender","ComboboxBase.Chips","item","internalValue","Fragment","Combobox","ComboboxBase.Collection"],"mappings":";;;;;;;;;AAwBQA,EAAoB;AAmB5B,MAAMC,IAAsBC,EAA6B,MAAM;AAmG/D,SAASC,EAA0D;AAAA,EACjE,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,GAAGC;AACL,GAOG;AACD,QAAMC,IACJ,gBAAAC,EAACZ,EAAoB,UAApB,EAA6B,OAAOS,GACnC,UAAA,gBAAAG,EAACC,GAAA,EAAmB,GAAGH,GAAQ,UAAAF,GAAS,EAAA,CAC1C;AAIF,SAAIL,IAEA,gBAAAS;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,OAAAX;AAAA,MACA,UAAAC;AAAA,MACA,cAAAC;AAAA,MACA,aAAAC;AAAA,MACA,OACEC,IACI,OAAOA,KAAU,WACf,EAAE,SAASA,GAAO,OAAO,GAAA,IACzBA,IACF;AAAA,MAGL,UAAAI;AAAA,IAAA;AAAA,EAAA,IAMAA;AACT;AAEA,SAASI,EAAQ;AAAA,EACf,UAAAP;AAAA,EACA,WAAAQ;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,YAAAC,IAAa;AAAA,EACb,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAWC;AACb,GAYI;AACF,QAAMC,IAAmBC,EAAA;AAGzB,SACE,gBAAAX,EAACY,GAAA,EAAoB,WAHLH,KAAiBC,KAAoB,QAInD,UAAA,gBAAAV;AAAA,IAACa;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAAR;AAAA,MACA,YAAAC;AAAA,MACA,aAAAC;AAAA,MACA,MAAAC;AAAA,MAEA,UAAA,gBAAAR;AAAA,QAACc;AAAAA,QAAA;AAAA,UACC,WAAWC;AAAA,YACT;AAAA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,YACA;AAAA;AAAA,YACAX;AAAA,UAAA;AAAA,UAGD,UAAAR;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA,GAEJ;AAEJ;AAGA,MAAMoB,IAGF;AAAA,EACF,IAAI,EAAE,SAAS,QAAQ,UAAU,IAAI,WAAW,UAAA;AAAA,EAChD,IAAI,EAAE,SAAS,QAAQ,UAAU,IAAI,WAAW,YAAA;AAAA,EAChD,MAAM,EAAE,SAAS,QAAQ,UAAU,IAAI,WAAW,UAAA;AAAA,EAClD,IAAI,EAAE,SAAS,SAAS,UAAU,IAAI,WAAW,UAAA;AACnD;AAEA,SAASC,EAAa;AAAA,EACpB,WAAAb;AAAA,EACA,GAAGN;AACL,GAAsD;AACpD,QAAMD,IAAOqB,EAAW9B,CAAmB,GACrC+B,IAAaH,EAAuBnB,CAAI;AAE9C,SACE,gBAAAuB;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWN;AAAA,QACTO,EAAc,EAAE,MAAAzB,GAAM;AAAA,QACtB;AAAA,QACA;AAAA,QACA;AAAA,QACAsB,EAAW;AAAA,QACXf;AAAA,MAAA;AAAA,MAGF,UAAA;AAAA,QAAA,gBAAAJ,EAACuB,GAAA,EAAoB,GAAGzB,GAAO;AAAA,QAC/B,gBAAAE;AAAA,UAACwB;AAAAA,UAAA;AAAA,YACC,WAAWT;AAAA,cACT;AAAA,cACAI,EAAW;AAAA,YAAA;AAAA,YAGb,4BAACM,GAAA,EAAc,MAAMN,EAAW,UAAU,WAAU,eAAA,CAAe;AAAA,UAAA;AAAA,QAAA;AAAA,MACrE;AAAA,IAAA;AAAA,EAAA;AAGN;AAGA,MAAMO,IAGF;AAAA,EACF,IAAI;AAAA,IACF,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,YAAY;AAAA,EAAA;AAAA,EAEd,IAAI;AAAA,IACF,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,YAAY;AAAA,EAAA;AAAA,EAEd,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,YAAY;AAAA,EAAA;AAAA,EAEd,IAAI;AAAA,IACF,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,YAAY;AAAA,EAAA;AAEhB;AAEA,SAASC,EAAa;AAAA,EACpB,YAAAC,IAAa;AAAA,EACb,kBAAAC,IAAmB;AAAA,EACnB,GAAG/B;AACL,GASG;AACD,QAAMD,IAAOqB,EAAW9B,CAAmB,GACrC+B,IAAaO,EAAuB7B,CAAI;AAE9C,SACE,gBAAAuB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWL;AAAA,QACT;AAAA,QACA;AAAA,QACAjB,EAAM;AAAA,MAAA;AAAA,MAGR,UAAA;AAAA,QAAA,gBAAAE;AAAA,UAAC8B;AAAAA,UAAA;AAAA,YACE,GAAGhC;AAAA,YACJ,WAAWiB;AAAA,cACTO,EAAc,EAAE,MAAAzB,GAAM;AAAA,cACtB;AAAA,cACAsB,EAAW;AAAA,cACX;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,QAGF,gBAAAnB;AAAA,UAAC+B;AAAAA,UAAA;AAAA,YACC,cAAYH;AAAA,YACZ,WAAWb;AAAA,cACT;AAAA,cACA;AAAA,cACAI,EAAW;AAAA,YAAA;AAAA,YAGb,UAAA,gBAAAnB,EAACgC,GAAA,EAAM,MAAMb,EAAW,SAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QAGpC,gBAAAnB;AAAA,UAACqB;AAAAA,UAAA;AAAA,YACC,cAAYQ;AAAA,YACZ,WAAWd;AAAA,cACT;AAAA,cACA;AAAA;AAAA,cACAI,EAAW;AAAA,YAAA;AAAA,YAGb,UAAA,gBAAAnB,EAACwB,GAAA,EACC,UAAA,gBAAAxB,EAACyB,GAAA,EAAc,MAAMN,EAAW,UAAU,WAAU,eAAA,CAAe,EAAA,CACrE;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,SAASc,EAAK;AAAA,EACZ,UAAArC;AAAA,EACA,WAAAQ;AAAA,EACA,GAAGN;AACL,GAAqD;AACnD,SACE,gBAAAsB;AAAA,IAACc;AAAAA,IAAA;AAAA,MACE,GAAGpC;AAAA,MACJ,WAAWiB;AAAA,QACT;AAAA,QACA;AAAA;AAAA;AAAA;AAAA,QAIA;AAAA,QACAX;AAAA,MAAA;AAAA,MAGF,UAAA;AAAA,QAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAU,eAAe,UAAAJ,EAAA,CAAS;AAAA,QACvC,gBAAAI,EAACmC,GAAA,EAA2B,WAAU,iCACpC,UAAA,gBAAAnC,EAACoC,KAAU,EAAA,CACb;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,SAASC,EAAMvC,GAAiC;AAC9C,SACE,gBAAAE;AAAA,IAACsC;AAAAA,IAAA;AAAA,MACE,GAAGxC;AAAA,MACJ,WAAWiB;AAAA,QACT;AAAA,MAAA;AAAA,MAEF,UAAUjB,EAAM,YAAY;AAAA,IAAA;AAAA,EAAA;AAGlC;AAEA,SAASyC,EAAMzC,GAAiC;AAC9C,SACE,gBAAAE;AAAA,IAAC8B;AAAAA,IAAA;AAAA,MACE,GAAGhC;AAAA,MACJ,WAAWiB;AAAA,QACTO,EAAA;AAAA,QACA;AAAA,QACAxB,EAAM;AAAA,MAAA;AAAA,IACR;AAAA,EAAA;AAGN;AAEA,SAAS0C,EAAK;AAAA,EACZ,WAAApC;AAAA,EACA,GAAGN;AACL,GAAqD;AACnD,SACE,gBAAAE;AAAA,IAACyC;AAAAA,IAAA;AAAA,MACE,GAAG3C;AAAA,MACJ,WAAWiB;AAAA,QACT;AAAA,QACAX;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;AAEA,SAASsC,GAAW5C,GAAsC;AACxD,SACE,gBAAAE;AAAA,IAAC2C;AAAAA,IAAA;AAAA,MACE,GAAG7C;AAAA,MACJ,WAAWiB;AAAA,QACT;AAAA,QACAjB,EAAM;AAAA,MAAA;AAAA,IACR;AAAA,EAAA;AAGN;AAEA,SAAS8C,GAAM9C,GAAiC;AAC9C,SACE,gBAAAE;AAAA,IAAC6C;AAAAA,IAAA;AAAA,MACE,GAAG/C;AAAA,MACJ,WAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;AAEA,SAASgD,EAAK;AAAA,EACZ,aAAAC,IAAc;AAAA,EACd,GAAGjD;AACL,GAKG;AACD,SACE,gBAAAsB;AAAA,IAAC4B;AAAAA,IAAA;AAAA,MACE,GAAGlD;AAAA,MACJ,WAAWiB;AAAA,QACT;AAAA;AAAA,QACA;AAAA;AAAA,QACA;AAAA;AAAA,QACA;AAAA;AAAA,QACA;AAAA;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAAjB,EAAM;AAAA,QACP,gBAAAE;AAAA,UAACiD;AAAAA,UAAA;AAAA,YACC,cAAYF;AAAA,YACZ,WAAWhC;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,YAGF,UAAA,gBAAAf,EAACgC,GAAA,EAAM,MAAM,GAAA,CAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MACnB;AAAA,IAAA;AAAA,EAAA;AAGN;AAGA,MAAMkB,KAAoD;AAAA,EACxD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,IAAI;AACN;AAEA,SAASC,EAAoC;AAAA,EAC3C,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAjD;AAAA,EACA,WAAAkD,IAAY;AAAA,EACZ,OAAOC;AACT,GAOG;AACD,QAAM1D,IAAOqB,EAAW9B,CAAmB,GAErCoE,IAAgBD;AAEtB,SACE,gBAAAnC;AAAA,IAACqC;AAAAA,IAAA;AAAA,MACC,WAAW1C;AAAA,QACTO,EAAc,EAAE,MAAAzB,GAAM;AAAA,QACtB;AAAA,QACA;AAAA,QACAqD,GAAgBrD,CAAI;AAAA,QACpB;AAAA,QACA;AAAA,QACAO;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAAkD,MAAc,SACb,gBAAAtD;AAAA,UAAC8B;AAAAA,UAAA;AAAA,YACC,aAAAsB;AAAA,YACA,WAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QAId,gBAAAhC,EAAC,OAAA,EAAI,WAAU,8CAEZ,UAAA;AAAA,UAAAoC,MAAkB,UACjBA,EAAc,SAAS,KACvBA,EAAc,IAAI,CAACE,MAASL,EAAWK,CAAI,CAAC;AAAA,UAE9C,gBAAA1D,EAACuB,GAAA,EACE,WAACoC,MAEIH,MAAkB,SAAkB,OAEtC,gBAAAxD,EAAC4D,KACE,UAAAD,EAAc,IAAI,CAACD,MAASL,EAAWK,CAAI,CAAC,EAAA,CAC/C,GAGN;AAAA,UACCJ,MAAc,WACb,gBAAAtD;AAAA,YAAC8B;AAAAA,YAAA;AAAA,cACC,aAAAsB;AAAA,cACA,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACZ,EAAA,CAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA9D,EAAK,cAAc;AACnBa,EAAQ,cAAc;AACtBc,EAAa,cAAc;AAC3BU,EAAa,cAAc;AAC3BM,EAAK,cAAc;AACnBa,EAAK,cAAc;AACnBK,EAAyB,cAAc;AAuBhC,MAAMU,KAAW,OAAO,OAAOvE,GAAM;AAAA;AAAA,EAE1C,SAAAa;AAAA,EACA,cAAAc;AAAA,EACA,cAAAU;AAAA,EACA,0BAAAwB;AAAA;AAAA,EAGA,MAAAL;AAAA,EACA,MAAAb;AAAA;AAAA,EAGA,OAAAM;AAAA,EACA,OAAAF;AAAA,EACA,YAAAK;AAAA,EACA,OAAAE;AAAA;AAAA,EAGA,MAAAJ;AAAA;AAAA,EAGA,YAAYsB;AACd,CAAC;"}
1
+ {"version":3,"file":"combobox-ck95wketqoqbxjwb.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 { resolveVariant } from \"../../utils/resolve-variant\";\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(resolveVariant(KUMO_COMBOBOX_VARIANTS.inputSide, inputSide, KUMO_COMBOBOX_DEFAULT_VARIANTS.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 \"data-[placeholder]:text-kumo-placeholder\",\n iconStyles.padding,\n className,\n )}\n >\n <ComboboxBase.Value {...props} />\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({\n clearLabel = \"Clear selection\",\n showOptionsLabel = \"Show options\",\n ...props\n}: ComboboxBase.Input.Props & {\n /** Accessible label for the clear button. Pass a translated string for i18n.\n * @default \"Clear selection\"\n */\n clearLabel?: string;\n /** Accessible label for the dropdown trigger. Pass a translated string for i18n.\n * @default \"Show options\"\n */\n showOptionsLabel?: string;\n}) {\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 aria-label={clearLabel}\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\n aria-label={showOptionsLabel}\n className={cn(\n \"absolute top-1/2 -translate-y-1/2 flex items-center justify-center cursor-pointer text-kumo-subtle\",\n \"m-0 bg-transparent p-0\", // Reset Stratus global button styles\n iconStyles.caretRight,\n )}\n >\n <ComboboxBase.Icon>\n <CaretDownIcon size={iconStyles.iconSize} className=\"fill-current\" />\n </ComboboxBase.Icon>\n </ComboboxBase.Trigger>\n </div>\n );\n}\n\nfunction Item({\n children,\n className,\n ...props\n}: ComboboxBase.Item.Props & { className?: string }) {\n return (\n <ComboboxBase.Item\n {...props}\n className={cn(\n \"group mx-1.5 grid grid-cols-[1fr_16px] gap-2 rounded px-2 py-1.5 text-base\",\n \"cursor-pointer data-highlighted:bg-kumo-tint\",\n // Disabled rows: muted text, no pointer, suppress highlight bg even\n // when keyboard nav lands on them. Base UI sets `data-disabled` on\n // the element when the `disabled` prop is true.\n \"data-[disabled]:cursor-not-allowed data-[disabled]:text-kumo-subtle data-[disabled]:opacity-60 data-[disabled]:data-highlighted:bg-transparent\",\n className,\n )}\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-subtle\",\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-hairline mt-2 pt-2 first:border-t-0 first:mt-0 first:pt-0\"\n />\n );\n}\n\nfunction Chip({\n removeLabel = \"Remove\",\n ...props\n}: ComboboxBase.Chip.Props & {\n /** Accessible label for the chip remove button. Pass a translated string for i18n.\n * @default \"Remove\"\n */\n removeLabel?: string;\n}) {\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-hairline\", // Border\n \"bg-kumo-overlay\", // Background\n \"text-sm\", // Typography\n )}\n >\n {props.children}\n <ComboboxBase.ChipRemove\n aria-label={removeLabel}\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","clearLabel","showOptionsLabel","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","removeLabel","ComboboxBase.Chip","ComboboxBase.ChipRemove","sizeToMinHeight","TriggerMultipleWithInput","placeholder","renderItem","inputSide","controlledValue","chipsToRender","ComboboxBase.Chips","item","internalValue","Fragment","Combobox","ComboboxBase.Collection"],"mappings":"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"}
@@ -2,7 +2,7 @@
2
2
  import { jsxs as i, jsx as e } from "react/jsx-runtime";
3
3
  import { CheckIcon as d, CopyIcon as x } from "@phosphor-icons/react";
4
4
  import { useState as f } from "react";
5
- import { B as b } from "./button-dh366jtvswxj0fw3.js";
5
+ import { B as b } from "./button-fe5rvewji3e5xd7m.js";
6
6
  import { c as a } from "./cn-ct4n7r74mh8y0f48.js";
7
7
  import { r as h } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
8
8
  const g = {
@@ -91,4 +91,4 @@ export {
91
91
  l as a,
92
92
  k as e
93
93
  };
94
- //# sourceMappingURL=empty-fr78te81o3qaj3in.js.map
94
+ //# sourceMappingURL=empty-bmacg9ap2gjmyqiw.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"empty-fr78te81o3qaj3in.js","sources":["../../src/components/empty/empty.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { useState } from \"react\";\nimport { Button } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\n\n/** Empty state size variant definitions mapping sizes to their Tailwind classes. */\nexport const KUMO_EMPTY_VARIANTS = {\n size: {\n sm: {\n classes: \"px-6 py-8 gap-4\",\n description: \"Compact empty state for smaller containers\",\n },\n base: {\n classes: \"px-10 py-16 gap-6\",\n description: \"Default empty state size\",\n },\n lg: {\n classes: \"px-12 py-20 gap-8\",\n description: \"Large empty state for prominent placement\",\n },\n },\n} as const;\n\nexport const KUMO_EMPTY_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\nexport type KumoEmptySize = keyof typeof KUMO_EMPTY_VARIANTS.size;\n\nexport interface KumoEmptyVariantsProps {\n /**\n * Size of the empty state container.\n * - `\"sm\"` — Compact empty state for smaller containers\n * - `\"base\"` — Default empty state size\n * - `\"lg\"` — Large empty state for prominent placement\n * @default \"base\"\n */\n size?: KumoEmptySize;\n}\n\nexport function emptyVariants({\n size = KUMO_EMPTY_DEFAULT_VARIANTS.size,\n}: KumoEmptyVariantsProps = {}) {\n return cn(\n \"flex w-full flex-col items-center rounded-xl border border-kumo-fill bg-kumo-control text-kumo-default\",\n resolveVariant(KUMO_EMPTY_VARIANTS.size, size, KUMO_EMPTY_DEFAULT_VARIANTS.size).classes,\n );\n}\n\n/**\n * Empty state component props.\n *\n * @example\n * ```tsx\n * <Empty\n * icon={<PackageIcon size={48} />}\n * title=\"No packages found\"\n * description=\"Get started by installing your first package.\"\n * commandLine=\"npm install @cloudflare/kumo\"\n * />\n * ```\n */\nexport interface EmptyProps extends KumoEmptyVariantsProps {\n /** Decorative icon displayed above the title (e.g. from `@phosphor-icons/react`). */\n icon?: React.ReactNode;\n /** Primary heading text for the empty state. */\n title: string;\n /** Secondary description text displayed below the title. */\n description?: string;\n /** Shell command displayed in a copyable code block. */\n commandLine?: string;\n /** Additional content (buttons, links) rendered below the description. */\n contents?: React.ReactNode;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n}\n\n/**\n * Placeholder shown when a list, table, or page has no content to display.\n *\n * @example\n * ```tsx\n * <Empty title=\"No results found\" description=\"Try adjusting your search.\" />\n * ```\n */\nexport function Empty({\n icon,\n title,\n description,\n commandLine,\n contents,\n size = \"base\",\n className,\n}: EmptyProps) {\n const [emptyStateCopied, setEmptyStateCopied] = useState<boolean>(false);\n\n return (\n <div className={cn(emptyVariants({ size }), className)}>\n {icon}\n <h2 className=\"text-2xl font-semibold\">{title}</h2>\n\n {description && (\n <p className=\"max-w-140 text-center text-kumo-subtle\">{description}</p>\n )}\n\n {commandLine && (\n <div\n className={cn(\n \"group/cmd relative inline-flex h-10 max-w-8/10 transform-gpu items-center gap-2 rounded-lg font-mono shadow-sm\",\n \"bg-kumo-overlay pr-2 pl-3\",\n \"transition-all duration-300 hover:border-kumo-interact/80 hover:shadow-md\",\n \"border border-kumo-fill/60\",\n )}\n >\n <span className=\"text-xs text-kumo-inactive select-none\">$</span>\n <span className=\"no-scrollbar overflow-scroll text-base whitespace-nowrap text-kumo-brand\">\n {commandLine}\n </span>\n <Button\n className=\"group\"\n size=\"sm\"\n variant=\"ghost\"\n shape=\"square\"\n aria-label=\"Copy command\"\n onClick={async () => {\n setEmptyStateCopied(true);\n setTimeout(() => {\n setEmptyStateCopied(false);\n }, 1000);\n await navigator.clipboard.writeText(commandLine);\n }}\n >\n {emptyStateCopied ? (\n <CheckIcon size={16} className=\"animate-bounce-in text-kumo-success\" />\n ) : (\n <CopyIcon\n size={16}\n className=\"text-kumo-inactive group-hover:text-kumo-brand\"\n />\n )}\n </Button>\n </div>\n )}\n\n {contents}\n </div>\n );\n}\n"],"names":["KUMO_EMPTY_VARIANTS","KUMO_EMPTY_DEFAULT_VARIANTS","emptyVariants","size","cn","resolveVariant","Empty","icon","title","description","commandLine","contents","className","emptyStateCopied","setEmptyStateCopied","useState","jsxs","jsx","Button","CheckIcon","CopyIcon"],"mappings":";;;;;;;AAOO,MAAMA,IAAsB;AAAA,EACjC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA8B;AAAA,EACzC,MAAM;AACR;AAeO,SAASC,EAAc;AAAA,EAC5B,MAAAC,IAAOF,EAA4B;AACrC,IAA4B,IAAI;AAC9B,SAAOG;AAAA,IACL;AAAA,IACAC,EAAeL,EAAoB,MAAMG,GAAMF,EAA4B,IAAI,EAAE;AAAA,EAAA;AAErF;AAsCO,SAASK,EAAM;AAAA,EACpB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAR,IAAO;AAAA,EACP,WAAAS;AACF,GAAe;AACb,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAkB,EAAK;AAEvE,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWZ,EAAGF,EAAc,EAAE,MAAAC,EAAA,CAAM,GAAGS,CAAS,GAClD,UAAA;AAAA,IAAAL;AAAA,IACD,gBAAAU,EAAC,MAAA,EAAG,WAAU,0BAA0B,UAAAT,GAAM;AAAA,IAE7CC,KACC,gBAAAQ,EAAC,KAAA,EAAE,WAAU,0CAA0C,UAAAR,GAAY;AAAA,IAGpEC,KACC,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWZ;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAGF,UAAA;AAAA,UAAA,gBAAAa,EAAC,QAAA,EAAK,WAAU,0CAAyC,UAAA,KAAC;AAAA,UAC1D,gBAAAA,EAAC,QAAA,EAAK,WAAU,4EACb,UAAAP,GACH;AAAA,UACA,gBAAAO;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,MAAK;AAAA,cACL,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,cAAW;AAAA,cACX,SAAS,YAAY;AACnB,gBAAAJ,EAAoB,EAAI,GACxB,WAAW,MAAM;AACf,kBAAAA,EAAoB,EAAK;AAAA,gBAC3B,GAAG,GAAI,GACP,MAAM,UAAU,UAAU,UAAUJ,CAAW;AAAA,cACjD;AAAA,cAEC,cACC,gBAAAO,EAACE,GAAA,EAAU,MAAM,IAAI,WAAU,uCAAsC,IAErE,gBAAAF;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,MAAM;AAAA,kBACN,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,YACZ;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,IAIHT;AAAA,EAAA,GACH;AAEJ;"}
1
+ {"version":3,"file":"empty-bmacg9ap2gjmyqiw.js","sources":["../../src/components/empty/empty.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { useState } from \"react\";\nimport { Button } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\n\n/** Empty state size variant definitions mapping sizes to their Tailwind classes. */\nexport const KUMO_EMPTY_VARIANTS = {\n size: {\n sm: {\n classes: \"px-6 py-8 gap-4\",\n description: \"Compact empty state for smaller containers\",\n },\n base: {\n classes: \"px-10 py-16 gap-6\",\n description: \"Default empty state size\",\n },\n lg: {\n classes: \"px-12 py-20 gap-8\",\n description: \"Large empty state for prominent placement\",\n },\n },\n} as const;\n\nexport const KUMO_EMPTY_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\nexport type KumoEmptySize = keyof typeof KUMO_EMPTY_VARIANTS.size;\n\nexport interface KumoEmptyVariantsProps {\n /**\n * Size of the empty state container.\n * - `\"sm\"` — Compact empty state for smaller containers\n * - `\"base\"` — Default empty state size\n * - `\"lg\"` — Large empty state for prominent placement\n * @default \"base\"\n */\n size?: KumoEmptySize;\n}\n\nexport function emptyVariants({\n size = KUMO_EMPTY_DEFAULT_VARIANTS.size,\n}: KumoEmptyVariantsProps = {}) {\n return cn(\n \"flex w-full flex-col items-center rounded-xl border border-kumo-fill bg-kumo-control text-kumo-default\",\n resolveVariant(KUMO_EMPTY_VARIANTS.size, size, KUMO_EMPTY_DEFAULT_VARIANTS.size).classes,\n );\n}\n\n/**\n * Empty state component props.\n *\n * @example\n * ```tsx\n * <Empty\n * icon={<PackageIcon size={48} />}\n * title=\"No packages found\"\n * description=\"Get started by installing your first package.\"\n * commandLine=\"npm install @cloudflare/kumo\"\n * />\n * ```\n */\nexport interface EmptyProps extends KumoEmptyVariantsProps {\n /** Decorative icon displayed above the title (e.g. from `@phosphor-icons/react`). */\n icon?: React.ReactNode;\n /** Primary heading text for the empty state. */\n title: string;\n /** Secondary description text displayed below the title. */\n description?: string;\n /** Shell command displayed in a copyable code block. */\n commandLine?: string;\n /** Additional content (buttons, links) rendered below the description. */\n contents?: React.ReactNode;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n}\n\n/**\n * Placeholder shown when a list, table, or page has no content to display.\n *\n * @example\n * ```tsx\n * <Empty title=\"No results found\" description=\"Try adjusting your search.\" />\n * ```\n */\nexport function Empty({\n icon,\n title,\n description,\n commandLine,\n contents,\n size = \"base\",\n className,\n}: EmptyProps) {\n const [emptyStateCopied, setEmptyStateCopied] = useState<boolean>(false);\n\n return (\n <div className={cn(emptyVariants({ size }), className)}>\n {icon}\n <h2 className=\"text-2xl font-semibold\">{title}</h2>\n\n {description && (\n <p className=\"max-w-140 text-center text-kumo-subtle\">{description}</p>\n )}\n\n {commandLine && (\n <div\n className={cn(\n \"group/cmd relative inline-flex h-10 max-w-8/10 transform-gpu items-center gap-2 rounded-lg font-mono shadow-sm\",\n \"bg-kumo-overlay pr-2 pl-3\",\n \"transition-all duration-300 hover:border-kumo-interact/80 hover:shadow-md\",\n \"border border-kumo-fill/60\",\n )}\n >\n <span className=\"text-xs text-kumo-inactive select-none\">$</span>\n <span className=\"no-scrollbar overflow-scroll text-base whitespace-nowrap text-kumo-brand\">\n {commandLine}\n </span>\n <Button\n className=\"group\"\n size=\"sm\"\n variant=\"ghost\"\n shape=\"square\"\n aria-label=\"Copy command\"\n onClick={async () => {\n setEmptyStateCopied(true);\n setTimeout(() => {\n setEmptyStateCopied(false);\n }, 1000);\n await navigator.clipboard.writeText(commandLine);\n }}\n >\n {emptyStateCopied ? (\n <CheckIcon size={16} className=\"animate-bounce-in text-kumo-success\" />\n ) : (\n <CopyIcon\n size={16}\n className=\"text-kumo-inactive group-hover:text-kumo-brand\"\n />\n )}\n </Button>\n </div>\n )}\n\n {contents}\n </div>\n );\n}\n"],"names":["KUMO_EMPTY_VARIANTS","KUMO_EMPTY_DEFAULT_VARIANTS","emptyVariants","size","cn","resolveVariant","Empty","icon","title","description","commandLine","contents","className","emptyStateCopied","setEmptyStateCopied","useState","jsxs","jsx","Button","CheckIcon","CopyIcon"],"mappings":";;;;;;;AAOO,MAAMA,IAAsB;AAAA,EACjC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA8B;AAAA,EACzC,MAAM;AACR;AAeO,SAASC,EAAc;AAAA,EAC5B,MAAAC,IAAOF,EAA4B;AACrC,IAA4B,IAAI;AAC9B,SAAOG;AAAA,IACL;AAAA,IACAC,EAAeL,EAAoB,MAAMG,GAAMF,EAA4B,IAAI,EAAE;AAAA,EAAA;AAErF;AAsCO,SAASK,EAAM;AAAA,EACpB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAR,IAAO;AAAA,EACP,WAAAS;AACF,GAAe;AACb,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAkB,EAAK;AAEvE,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWZ,EAAGF,EAAc,EAAE,MAAAC,EAAA,CAAM,GAAGS,CAAS,GAClD,UAAA;AAAA,IAAAL;AAAA,IACD,gBAAAU,EAAC,MAAA,EAAG,WAAU,0BAA0B,UAAAT,GAAM;AAAA,IAE7CC,KACC,gBAAAQ,EAAC,KAAA,EAAE,WAAU,0CAA0C,UAAAR,GAAY;AAAA,IAGpEC,KACC,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWZ;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAGF,UAAA;AAAA,UAAA,gBAAAa,EAAC,QAAA,EAAK,WAAU,0CAAyC,UAAA,KAAC;AAAA,UAC1D,gBAAAA,EAAC,QAAA,EAAK,WAAU,4EACb,UAAAP,GACH;AAAA,UACA,gBAAAO;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,MAAK;AAAA,cACL,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,cAAW;AAAA,cACX,SAAS,YAAY;AACnB,gBAAAJ,EAAoB,EAAI,GACxB,WAAW,MAAM;AACf,kBAAAA,EAAoB,EAAK;AAAA,gBAC3B,GAAG,GAAI,GACP,MAAM,UAAU,UAAU,UAAUJ,CAAW;AAAA,cACjD;AAAA,cAEC,cACC,gBAAAO,EAACE,GAAA,EAAU,MAAM,IAAI,WAAU,uCAAsC,IAErE,gBAAAF;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,MAAM;AAAA,kBACN,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,YACZ;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,IAIHT;AAAA,EAAA,GACH;AAEJ;"}
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { jsxs as h, jsx as e } from "react/jsx-runtime";
3
3
  import { c as a } from "./cn-ct4n7r74mh8y0f48.js";
4
- import { L as m } from "./label-efa0uvb8zqyjwpc8.js";
4
+ import { L as m } from "./label-ni6chzu01wns3cs2.js";
5
5
  import { O as f, P as p, aR as u, aS as x } from "./vendor-base-ui-ie71jahf0czyf58j.js";
6
6
  const F = {
7
7
  // Field currently has no variant options but structure is ready for future additions
@@ -68,4 +68,4 @@ export {
68
68
  _ as a,
69
69
  d as f
70
70
  };
71
- //# sourceMappingURL=field-dgf36p7cmz1crlnu.js.map
71
+ //# sourceMappingURL=field-hmucpi6d4sqci1zu.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"field-dgf36p7cmz1crlnu.js","sources":["../../src/components/field/field.tsx"],"sourcesContent":["import { Field as FieldBase } from \"@base-ui/react/field\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\n\n/** Field variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_FIELD_VARIANTS = {\n // Field currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_FIELD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_FIELD_VARIANTS\nexport interface KumoFieldVariantsProps {\n /**\n * When true, places the control (checkbox/switch) before the label visually.\n * When false (default), places the label before the control.\n * Used to support different layout patterns (e.g., iOS-style toggles on the right).\n */\n controlFirst?: boolean;\n}\n\nexport function fieldVariants({\n controlFirst = false,\n}: KumoFieldVariantsProps = {}) {\n return cn(\n // Base styles - vertical layout (default)\n \"grid gap-2\",\n\n // Horizontal layout for checkbox and switch\n // Default: Grid auto-reverses in RTL (desired)\n \"has-[input[type=checkbox]]:grid-cols-[auto_1fr] has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:grid-cols-[auto_1fr] has-[[role=switch]]:items-center\",\n\n // Control first: use flexbox with row-reverse to flip visual order without affecting text direction\n // flex-row-reverse in LTR: Control→Label, in RTL: Label→Control (opposite of grid default)\n controlFirst && [\n \"has-[input[type=checkbox]]:flex has-[input[type=checkbox]]:flex-row-reverse has-[input[type=checkbox]]:flex-wrap has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:flex has-[[role=switch]]:flex-row-reverse has-[[role=switch]]:flex-wrap has-[[role=switch]]:items-center\",\n \"[&>label]:flex-1\",\n ],\n );\n}\n\n/**\n * Match type for field validation errors.\n * Can be a boolean or a key from the browser's ValidityState interface.\n * Source: BaseErrorProps[\"match\"] (ComponentPropsWithoutRef<typeof FieldBase.Error>)\n */\nexport type FieldErrorMatch =\n | boolean\n | \"badInput\"\n | \"customError\"\n | \"patternMismatch\"\n | \"rangeOverflow\"\n | \"rangeUnderflow\"\n | \"stepMismatch\"\n | \"tooLong\"\n | \"tooShort\"\n | \"typeMismatch\"\n | \"valid\"\n | \"valueMissing\";\n\n/**\n * Field component props — wraps a form control with label, description, and error message.\n *\n * @example\n * ```tsx\n * <Field label=\"Email\" required>\n * <Input placeholder=\"you@example.com\" />\n * </Field>\n *\n * <Field label=\"Phone\" required={false} description=\"We'll only use this for account recovery.\">\n * <Input placeholder=\"+1 555-0000\" />\n * </Field>\n * ```\n */\nexport interface FieldProps extends KumoFieldVariantsProps {\n /** The form control element(s) to wrap (Input, Select, Checkbox, etc.). */\n children: ReactNode;\n /** The label content — can be a string or any React node. */\n label: ReactNode;\n /**\n * When explicitly `false`, shows gray \"(optional)\" text after the label.\n * When `true` or `undefined`, no indicator is shown.\n */\n required?: boolean;\n /** Tooltip content displayed next to the label via an info icon. */\n labelTooltip?: ReactNode;\n /** Validation error with a message and a browser `ValidityState` match key. */\n error?: {\n message: ReactNode;\n match: FieldErrorMatch;\n };\n /** Helper text displayed below the control (hidden when `error` is present). */\n description?: ReactNode;\n /** When `true`, places the control before the label (for checkbox/switch layouts). */\n controlFirst?: boolean;\n}\n\n/**\n * Form field wrapper that provides a label, optional description, and error display\n * around any form control. Built on Base UI Field primitives.\n *\n * @example\n * ```tsx\n * <Field label=\"Username\">\n * <Input placeholder=\"Choose a username\" />\n * </Field>\n * ```\n */\nexport function Field({\n children,\n label,\n required,\n labelTooltip,\n error,\n description,\n controlFirst = false,\n}: FieldProps) {\n // Show \"(optional)\" when required is explicitly false\n const showOptional = required === false;\n\n return (\n <FieldBase.Root className={fieldVariants({ controlFirst })}>\n <FieldBase.Label className=\"m-0 text-base font-medium text-kumo-default\">\n <Label showOptional={showOptional} tooltip={labelTooltip} asContent>\n {label}\n </Label>\n </FieldBase.Label>\n {children}\n {error ? (\n <FieldBase.Error\n className={cn(\n \"text-sm leading-snug text-kumo-danger\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n match={error.match}\n >\n {error.message}\n </FieldBase.Error>\n ) : (\n description && (\n <FieldBase.Description\n className={cn(\n \"text-sm leading-snug text-kumo-subtle\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n >\n {description}\n </FieldBase.Description>\n )\n )}\n </FieldBase.Root>\n );\n}\n"],"names":["KUMO_FIELD_VARIANTS","KUMO_FIELD_DEFAULT_VARIANTS","fieldVariants","controlFirst","cn","Field","children","label","required","labelTooltip","error","description","showOptional","jsxs","FieldBase.Root","jsx","FieldBase.Label","Label","FieldBase.Error","FieldBase.Description"],"mappings":";;;;;AAMO,MAAMA,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAYpC,SAASC,EAAc;AAAA,EAC5B,cAAAC,IAAe;AACjB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA;AAAA,IAIA;AAAA,IACA;AAAA;AAAA;AAAA,IAIAD,KAAgB;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;AAqEO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAR,IAAe;AACjB,GAAe;AAEb,QAAMS,IAAeJ,MAAa;AAElC,SACE,gBAAAK,EAACC,GAAA,EAAe,WAAWZ,EAAc,EAAE,cAAAC,EAAA,CAAc,GACvD,UAAA;AAAA,IAAA,gBAAAY,EAACC,GAAA,EAAgB,WAAU,+CACzB,UAAA,gBAAAD,EAACE,GAAA,EAAM,cAAAL,GAA4B,SAASH,GAAc,WAAS,IAChE,aACH,GACF;AAAA,IACCH;AAAA,IACAI,IACC,gBAAAK;AAAA,MAACG;AAAAA,MAAA;AAAA,QACC,WAAWd;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAEF,OAAOM,EAAM;AAAA,QAEZ,UAAAA,EAAM;AAAA,MAAA;AAAA,IAAA,IAGTC,KACE,gBAAAI;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,WAAWf;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAGD,UAAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAGN;AAEJ;"}
1
+ {"version":3,"file":"field-hmucpi6d4sqci1zu.js","sources":["../../src/components/field/field.tsx"],"sourcesContent":["import { Field as FieldBase } from \"@base-ui/react/field\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\n\n/** Field variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_FIELD_VARIANTS = {\n // Field currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_FIELD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_FIELD_VARIANTS\nexport interface KumoFieldVariantsProps {\n /**\n * When true, places the control (checkbox/switch) before the label visually.\n * When false (default), places the label before the control.\n * Used to support different layout patterns (e.g., iOS-style toggles on the right).\n */\n controlFirst?: boolean;\n}\n\nexport function fieldVariants({\n controlFirst = false,\n}: KumoFieldVariantsProps = {}) {\n return cn(\n // Base styles - vertical layout (default)\n \"grid gap-2\",\n\n // Horizontal layout for checkbox and switch\n // Default: Grid auto-reverses in RTL (desired)\n \"has-[input[type=checkbox]]:grid-cols-[auto_1fr] has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:grid-cols-[auto_1fr] has-[[role=switch]]:items-center\",\n\n // Control first: use flexbox with row-reverse to flip visual order without affecting text direction\n // flex-row-reverse in LTR: Control→Label, in RTL: Label→Control (opposite of grid default)\n controlFirst && [\n \"has-[input[type=checkbox]]:flex has-[input[type=checkbox]]:flex-row-reverse has-[input[type=checkbox]]:flex-wrap has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:flex has-[[role=switch]]:flex-row-reverse has-[[role=switch]]:flex-wrap has-[[role=switch]]:items-center\",\n \"[&>label]:flex-1\",\n ],\n );\n}\n\n/**\n * Match type for field validation errors.\n * Can be a boolean or a key from the browser's ValidityState interface.\n * Source: BaseErrorProps[\"match\"] (ComponentPropsWithoutRef<typeof FieldBase.Error>)\n */\nexport type FieldErrorMatch =\n | boolean\n | \"badInput\"\n | \"customError\"\n | \"patternMismatch\"\n | \"rangeOverflow\"\n | \"rangeUnderflow\"\n | \"stepMismatch\"\n | \"tooLong\"\n | \"tooShort\"\n | \"typeMismatch\"\n | \"valid\"\n | \"valueMissing\";\n\n/**\n * Field component props — wraps a form control with label, description, and error message.\n *\n * @example\n * ```tsx\n * <Field label=\"Email\" required>\n * <Input placeholder=\"you@example.com\" />\n * </Field>\n *\n * <Field label=\"Phone\" required={false} description=\"We'll only use this for account recovery.\">\n * <Input placeholder=\"+1 555-0000\" />\n * </Field>\n * ```\n */\nexport interface FieldProps extends KumoFieldVariantsProps {\n /** The form control element(s) to wrap (Input, Select, Checkbox, etc.). */\n children: ReactNode;\n /** The label content — can be a string or any React node. */\n label: ReactNode;\n /**\n * When explicitly `false`, shows gray \"(optional)\" text after the label.\n * When `true` or `undefined`, no indicator is shown.\n */\n required?: boolean;\n /** Tooltip content displayed next to the label via an info icon. */\n labelTooltip?: ReactNode;\n /** Validation error with a message and a browser `ValidityState` match key. */\n error?: {\n message: ReactNode;\n match: FieldErrorMatch;\n };\n /** Helper text displayed below the control (hidden when `error` is present). */\n description?: ReactNode;\n /** When `true`, places the control before the label (for checkbox/switch layouts). */\n controlFirst?: boolean;\n}\n\n/**\n * Form field wrapper that provides a label, optional description, and error display\n * around any form control. Built on Base UI Field primitives.\n *\n * @example\n * ```tsx\n * <Field label=\"Username\">\n * <Input placeholder=\"Choose a username\" />\n * </Field>\n * ```\n */\nexport function Field({\n children,\n label,\n required,\n labelTooltip,\n error,\n description,\n controlFirst = false,\n}: FieldProps) {\n // Show \"(optional)\" when required is explicitly false\n const showOptional = required === false;\n\n return (\n <FieldBase.Root className={fieldVariants({ controlFirst })}>\n <FieldBase.Label className=\"m-0 text-base font-medium text-kumo-default\">\n <Label showOptional={showOptional} tooltip={labelTooltip} asContent>\n {label}\n </Label>\n </FieldBase.Label>\n {children}\n {error ? (\n <FieldBase.Error\n className={cn(\n \"text-sm leading-snug text-kumo-danger\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n match={error.match}\n >\n {error.message}\n </FieldBase.Error>\n ) : (\n description && (\n <FieldBase.Description\n className={cn(\n \"text-sm leading-snug text-kumo-subtle\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n >\n {description}\n </FieldBase.Description>\n )\n )}\n </FieldBase.Root>\n );\n}\n"],"names":["KUMO_FIELD_VARIANTS","KUMO_FIELD_DEFAULT_VARIANTS","fieldVariants","controlFirst","cn","Field","children","label","required","labelTooltip","error","description","showOptional","jsxs","FieldBase.Root","jsx","FieldBase.Label","Label","FieldBase.Error","FieldBase.Description"],"mappings":";;;;;AAMO,MAAMA,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAYpC,SAASC,EAAc;AAAA,EAC5B,cAAAC,IAAe;AACjB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA;AAAA,IAIA;AAAA,IACA;AAAA;AAAA;AAAA,IAIAD,KAAgB;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;AAqEO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAR,IAAe;AACjB,GAAe;AAEb,QAAMS,IAAeJ,MAAa;AAElC,SACE,gBAAAK,EAACC,GAAA,EAAe,WAAWZ,EAAc,EAAE,cAAAC,EAAA,CAAc,GACvD,UAAA;AAAA,IAAA,gBAAAY,EAACC,GAAA,EAAgB,WAAU,+CACzB,UAAA,gBAAAD,EAACE,GAAA,EAAM,cAAAL,GAA4B,SAASH,GAAc,WAAS,IAChE,aACH,GACF;AAAA,IACCH;AAAA,IACAI,IACC,gBAAAK;AAAA,MAACG;AAAAA,MAAA;AAAA,QACC,WAAWd;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAEF,OAAOM,EAAM;AAAA,QAEZ,UAAAA,EAAM;AAAA,MAAA;AAAA,IAAA,IAGTC,KACE,gBAAAI;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,WAAWf;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAGD,UAAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAGN;AAEJ;"}
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import { jsx as e } from "react/jsx-runtime";
3
- import { i as y } from "./input-2y9vg81trmamkb6k.js";
3
+ import { i as y } from "./input-k2ychlh2zo6hsocz.js";
4
4
  import { c as N } from "./cn-ct4n7r74mh8y0f48.js";
5
5
  import * as x from "react";
6
6
  import { useCallback as I } from "react";
7
- import { F as b } from "./field-dgf36p7cmz1crlnu.js";
7
+ import { F as b } from "./field-hmucpi6d4sqci1zu.js";
8
8
  import { aT as w } from "./vendor-base-ui-ie71jahf0czyf58j.js";
9
9
  const c = x.forwardRef(
10
10
  (u, t) => {
@@ -75,4 +75,4 @@ export {
75
75
  c as I,
76
76
  j as T
77
77
  };
78
- //# sourceMappingURL=input-area-i5wulip5pau3u6ss.js.map
78
+ //# sourceMappingURL=input-area-dpgn5810c269jwbu.js.map