@cloudflare/kumo 2.0.2 → 2.0.3
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.
- package/CHANGELOG.md +19 -0
- package/ai/component-registry.json +17 -3
- package/ai/component-registry.md +34 -4
- package/ai/schemas.ts +5 -2
- package/dist/.build-complete +1 -1
- package/dist/ai/schemas.d.ts +10 -4
- package/dist/ai/schemas.d.ts.map +1 -1
- package/dist/ai/schemas.js +510 -504
- package/dist/ai/schemas.js.map +1 -1
- package/dist/chunks/{autocomplete-48aq0d244bs2e8zv.js → autocomplete-ln55iimq2n2s5uex.js} +27 -26
- package/dist/chunks/autocomplete-ln55iimq2n2s5uex.js.map +1 -0
- package/dist/chunks/{badge-dan90i0rzy4pwa1j.js → badge-kqox9toi0sygfbno.js} +16 -16
- package/dist/chunks/badge-kqox9toi0sygfbno.js.map +1 -0
- package/dist/chunks/{banner-eiwcnk7ts21s3bnb.js → banner-eux4y8xaogjg64af.js} +32 -31
- package/dist/chunks/banner-eux4y8xaogjg64af.js.map +1 -0
- package/dist/chunks/{breadcrumbs-cxcwf2l1ki3ffg5d.js → breadcrumbs-do6uyvm4msqus0sz.js} +33 -32
- package/dist/chunks/breadcrumbs-do6uyvm4msqus0sz.js.map +1 -0
- package/dist/chunks/{button-6by9ntsa3nj553mq.js → button-dh366jtvswxj0fw3.js} +63 -62
- package/dist/chunks/button-dh366jtvswxj0fw3.js.map +1 -0
- package/dist/chunks/{checkbox-hvxfvhtx1qjo2mww.js → checkbox-cf2pwdupyjweg184.js} +2 -2
- package/dist/chunks/checkbox-cf2pwdupyjweg184.js.map +1 -0
- package/dist/chunks/{clipboard-text-hswydzx3iql369sd.js → clipboard-text-hn2uwdj4ozenezd5.js} +57 -56
- package/dist/chunks/clipboard-text-hn2uwdj4ozenezd5.js.map +1 -0
- package/dist/chunks/{code-f9v1ikwhekqw274q.js → code-bbnjm8vk9hxl129r.js} +20 -19
- package/dist/chunks/code-bbnjm8vk9hxl129r.js.map +1 -0
- package/dist/chunks/{combobox-fq36ye0hstote16x.js → combobox-fivcg1oorkmmmk78.js} +11 -10
- package/dist/chunks/combobox-fivcg1oorkmmmk78.js.map +1 -0
- package/dist/chunks/{command-palette-md65owxt5hv4rt9r.js → command-palette-kgiso245exdons4r.js} +2 -2
- package/dist/chunks/{command-palette-md65owxt5hv4rt9r.js.map → command-palette-kgiso245exdons4r.js.map} +1 -1
- package/dist/chunks/{dialog-k3f1fbam6nt96k8x.js → dialog-mqpvaidy0vnjwrfp.js} +16 -15
- package/dist/chunks/dialog-mqpvaidy0vnjwrfp.js.map +1 -0
- package/dist/chunks/{dropdown-zbax0zowy6m9zhmt.js → dropdown-gp5iptj1niq14lpv.js} +76 -75
- package/dist/chunks/dropdown-gp5iptj1niq14lpv.js.map +1 -0
- package/dist/chunks/{empty-b82oer7npkhtkx7k.js → empty-fr78te81o3qaj3in.js} +27 -26
- package/dist/chunks/empty-fr78te81o3qaj3in.js.map +1 -0
- package/dist/chunks/{field-c0wf94plit2gci59.js → field-dgf36p7cmz1crlnu.js} +2 -2
- package/dist/chunks/{field-c0wf94plit2gci59.js.map → field-dgf36p7cmz1crlnu.js.map} +1 -1
- package/dist/chunks/{grid-hj1ylz16p7g5uelh.js → grid-do93dv1rjggqxx7p.js} +30 -29
- package/dist/chunks/grid-do93dv1rjggqxx7p.js.map +1 -0
- package/dist/chunks/{input-ncfowphv81yq7fyy.js → input-2y9vg81trmamkb6k.js} +51 -50
- package/dist/chunks/input-2y9vg81trmamkb6k.js.map +1 -0
- package/dist/chunks/{input-area-bkyzu6f7gsck479h.js → input-area-i5wulip5pau3u6ss.js} +3 -3
- package/dist/chunks/{input-area-bkyzu6f7gsck479h.js.map → input-area-i5wulip5pau3u6ss.js.map} +1 -1
- package/dist/chunks/{input-group-bidweffa0zyg8gt0.js → input-group-bm9wxzovpvzn1c25.js} +4 -4
- package/dist/chunks/{input-group-bidweffa0zyg8gt0.js.map → input-group-bm9wxzovpvzn1c25.js.map} +1 -1
- package/dist/chunks/{label-c3h9i3y4wiccelt7.js → label-efa0uvb8zqyjwpc8.js} +2 -2
- package/dist/chunks/{label-c3h9i3y4wiccelt7.js.map → label-efa0uvb8zqyjwpc8.js.map} +1 -1
- package/dist/chunks/{link-kt74pxkud4olmcer.js → link-m9hlspftl34nseme.js} +28 -27
- package/dist/chunks/link-m9hlspftl34nseme.js.map +1 -0
- package/dist/chunks/{loader-hr2w7cpqeev3p3vl.js → loader-g8a6j76ue5nq0lr8.js} +15 -14
- package/dist/chunks/loader-g8a6j76ue5nq0lr8.js.map +1 -0
- package/dist/chunks/{pagination-jb3mncivbwsoi1se.js → pagination-fdmcwreb27eej9l3.js} +3 -3
- package/dist/chunks/pagination-fdmcwreb27eej9l3.js.map +1 -0
- package/dist/chunks/{radio-datzh3pilz8ojak1.js → radio-f95mt237ru8fyc03.js} +44 -43
- package/dist/chunks/radio-f95mt237ru8fyc03.js.map +1 -0
- package/dist/chunks/resolve-variant-gw6eh7fa4st8ej7m.js +11 -0
- package/dist/chunks/resolve-variant-gw6eh7fa4st8ej7m.js.map +1 -0
- package/dist/chunks/{select-g261chvosodu22i8.js → select-j8evv2iblgs5fa9s.js} +4 -4
- package/dist/chunks/{select-g261chvosodu22i8.js.map → select-j8evv2iblgs5fa9s.js.map} +1 -1
- package/dist/chunks/{sensitive-input-cijagk551mesdtk4.js → sensitive-input-cmb9jt42bv8jftei.js} +3 -3
- package/dist/chunks/{sensitive-input-cijagk551mesdtk4.js.map → sensitive-input-cmb9jt42bv8jftei.js.map} +1 -1
- package/dist/chunks/surface-k0e8mq1x00b7i8r6.js.map +1 -1
- package/dist/chunks/{switch-jdfsr3j3oa1qxegw.js → switch-c4qjga6x3axmoi20.js} +2 -2
- package/dist/chunks/switch-c4qjga6x3axmoi20.js.map +1 -0
- package/dist/chunks/{table-iudje0lva0z68jto.js → table-jvqy3tu48xa75n2t.js} +56 -55
- package/dist/chunks/table-jvqy3tu48xa75n2t.js.map +1 -0
- package/dist/chunks/{text-f7t467waymhb30sx.js → text-be7ehenoyldhyjma.js} +32 -28
- package/dist/chunks/text-be7ehenoyldhyjma.js.map +1 -0
- package/dist/chunks/{toast-h573o0tc7tefivk2.js → toast-c7kqwuj7qj9dx6gs.js} +75 -74
- package/dist/chunks/toast-c7kqwuj7qj9dx6gs.js.map +1 -0
- package/dist/chunks/tooltip-odudhkxe282wxinq.js.map +1 -1
- package/dist/code.js +1 -1
- package/dist/components/autocomplete.js +1 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/banner.js +1 -1
- package/dist/components/breadcrumbs.js +1 -1
- package/dist/components/button.js +1 -1
- package/dist/components/checkbox.js +1 -1
- package/dist/components/clipboard-text.js +1 -1
- package/dist/components/code.js +1 -1
- package/dist/components/combobox.js +1 -1
- package/dist/components/command-palette.js +1 -1
- package/dist/components/dialog.js +1 -1
- package/dist/components/dropdown.js +1 -1
- package/dist/components/empty.js +1 -1
- package/dist/components/field.js +1 -1
- package/dist/components/grid.js +1 -1
- package/dist/components/input-group.js +1 -1
- package/dist/components/input.js +3 -3
- package/dist/components/label.js +1 -1
- package/dist/components/link.js +1 -1
- package/dist/components/loader.js +1 -1
- package/dist/components/pagination.js +1 -1
- package/dist/components/radio.js +1 -1
- package/dist/components/select.js +1 -1
- package/dist/components/sensitive-input.js +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/text.js +1 -1
- package/dist/components/toast.js +1 -1
- package/dist/index.js +33 -33
- package/dist/src/components/autocomplete/autocomplete.d.ts.map +1 -1
- package/dist/src/components/badge/badge.d.ts.map +1 -1
- package/dist/src/components/banner/banner.d.ts.map +1 -1
- package/dist/src/components/breadcrumbs/breadcrumbs.d.ts.map +1 -1
- package/dist/src/components/button/button.d.ts.map +1 -1
- package/dist/src/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/src/components/clipboard-text/clipboard-text.d.ts.map +1 -1
- package/dist/src/components/code/code.d.ts.map +1 -1
- package/dist/src/components/combobox/combobox.d.ts.map +1 -1
- package/dist/src/components/dialog/dialog.d.ts.map +1 -1
- package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
- package/dist/src/components/empty/empty.d.ts.map +1 -1
- package/dist/src/components/grid/grid.d.ts.map +1 -1
- package/dist/src/components/input/input.d.ts.map +1 -1
- package/dist/src/components/link/link.d.ts.map +1 -1
- package/dist/src/components/loader/loader.d.ts.map +1 -1
- package/dist/src/components/pagination/pagination.d.ts.map +1 -1
- package/dist/src/components/radio/radio.d.ts.map +1 -1
- package/dist/src/components/surface/surface.d.ts.map +1 -1
- package/dist/src/components/switch/switch.d.ts.map +1 -1
- package/dist/src/components/table/table.d.ts.map +1 -1
- package/dist/src/components/text/text.d.ts.map +1 -1
- package/dist/src/components/toast/toast.d.ts.map +1 -1
- package/dist/src/components/tooltip/tooltip.d.ts.map +1 -1
- package/dist/src/utils/resolve-variant.d.ts +27 -0
- package/dist/src/utils/resolve-variant.d.ts.map +1 -0
- package/package.json +1 -1
- package/scripts/component-registry/metadata.ts +18 -3
- package/dist/chunks/autocomplete-48aq0d244bs2e8zv.js.map +0 -1
- package/dist/chunks/badge-dan90i0rzy4pwa1j.js.map +0 -1
- package/dist/chunks/banner-eiwcnk7ts21s3bnb.js.map +0 -1
- package/dist/chunks/breadcrumbs-cxcwf2l1ki3ffg5d.js.map +0 -1
- package/dist/chunks/button-6by9ntsa3nj553mq.js.map +0 -1
- package/dist/chunks/checkbox-hvxfvhtx1qjo2mww.js.map +0 -1
- package/dist/chunks/clipboard-text-hswydzx3iql369sd.js.map +0 -1
- package/dist/chunks/code-f9v1ikwhekqw274q.js.map +0 -1
- package/dist/chunks/combobox-fq36ye0hstote16x.js.map +0 -1
- package/dist/chunks/dialog-k3f1fbam6nt96k8x.js.map +0 -1
- package/dist/chunks/dropdown-zbax0zowy6m9zhmt.js.map +0 -1
- package/dist/chunks/empty-b82oer7npkhtkx7k.js.map +0 -1
- package/dist/chunks/grid-hj1ylz16p7g5uelh.js.map +0 -1
- package/dist/chunks/input-ncfowphv81yq7fyy.js.map +0 -1
- package/dist/chunks/link-kt74pxkud4olmcer.js.map +0 -1
- package/dist/chunks/loader-hr2w7cpqeev3p3vl.js.map +0 -1
- package/dist/chunks/pagination-jb3mncivbwsoi1se.js.map +0 -1
- package/dist/chunks/radio-datzh3pilz8ojak1.js.map +0 -1
- package/dist/chunks/switch-jdfsr3j3oa1qxegw.js.map +0 -1
- package/dist/chunks/table-iudje0lva0z68jto.js.map +0 -1
- package/dist/chunks/text-f7t467waymhb30sx.js.map +0 -1
- package/dist/chunks/toast-h573o0tc7tefivk2.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../../src/components/pagination/pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../../src/components/pagination/pagination.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../../src/components/radio/radio.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../../src/components/radio/radio.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAO9E,iFAAiF;AACjF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;CAuBtB,CAAC;AAEX,eAAO,MAAM,2BAA2B;;;CAG9B,CAAC;AAGX,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,mBAAmB,CAAC,OAAO,CAAC;AACxE,MAAM,MAAM,mBAAmB,GAAG,MAAM,OAAO,mBAAmB,CAAC,UAAU,CAAC;AAE9E,MAAM,WAAW,sBAAsB;IACrC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,mBAAmB,CAAC;CAClC;AAED,wBAAgB,aAAa,CAAC,EAC5B,OAA6C,EAC7C,UAAmD,GACpD,GAAE,sBAA2B,UAK7B;AAGD,MAAM,MAAM,YAAY,GAAG,gBAAgB,CAAC;AAE5C,0DAA0D;AAC1D,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,KAAK,CAAC;AAanD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDG;AACH;;;;;;;;;;;;;GAaG;AACH,MAAM,WAAW,gBAAgB;IAC/B,qBAAqB;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kEAAkE;IAClE,QAAQ,EAAE,SAAS,CAAC;IACpB,0CAA0C;IAC1C,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,0EAA0E;IAC1E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6LAA6L;IAC7L,eAAe,CAAC,EAAE,oBAAoB,CAAC;IACvC,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,mEAAmE;IACnE,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,yGAAyG;IACzG,KAAK,EAAE,SAAS,CAAC;IACjB,mFAAmF;IACnF,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AA4HF,iBAAS,WAAW,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAQ7D;kBARQ,WAAW;;;AAapB,iBAAS,UAAU,CAAC,EAClB,MAAM,EACN,QAAQ,EACR,WAAwB,EACxB,UAAsB,EACtB,KAAK,EACL,WAAW,EACX,YAAY,EACZ,KAAK,EACL,aAAa,EACb,QAAQ,EACR,eAAe,EACf,IAAI,EACJ,SAAS,GACV,EAAE,eAAe,2CAsCjB;kBApDQ,UAAU;;;AAyDnB,OAAO,EAAE,UAAU,EAAE,CAAC;AAEtB;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,KAAK;;;;CAIhB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"surface.d.ts","sourceRoot":"","sources":["../../../../src/components/surface/surface.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"surface.d.ts","sourceRoot":"","sources":["../../../../src/components/surface/surface.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,OAAO,CAAC;AAGxD,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE1E,yCAAyC;AACzC,eAAO,MAAM,qBAAqB;;;;;;;;;;;CAWxB,CAAC;AAEX,eAAO,MAAM,6BAA6B;;CAEhC,CAAC;AAGX,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,qBAAqB,CAAC,KAAK,CAAC;AAExE,MAAM,WAAW,wBAAwB;IACvC;;;;;OAKG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B;AAED,wBAAgB,eAAe,CAAC,EAC9B,KAA2C,GAC5C,GAAE,wBAA6B,MAE/B;AAED;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,YAAY,GAAG,cAAc,GACvC,wBAAwB,GAAG;IACzB;;;OAGG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB,CAAC;AAEJ;;;;;;;;;;GAUG;AACH,eAAO,MAAM,OAAO;iDAMjB,YAAY;;CAWd,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../../src/components/switch/switch.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,oBAAoB,EAEzB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../../src/components/switch/switch.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../../src/components/table/table.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../../src/components/table/table.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAY,KAAK,0BAA0B,EAAE,MAAM,aAAa,CAAC;AAExE,wFAAwF;AACxF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCtB,CAAC;AAEX,MAAM,MAAM,qBAAqB,GAAG,MAAM,OAAO,mBAAmB,CAAC,MAAM,CAAC;AA+C5E,eAAO,MAAM,2BAA2B;;;CAG9B,CAAC;AAEX,MAAM,MAAM,mBAAmB,GAAG,MAAM,OAAO,mBAAmB,CAAC,OAAO,CAAC;AAC3E,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,mBAAmB,CAAC,MAAM,CAAC;AAqStE;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,KAAK;IArSd;;;;;OAKG;aACM,eAAe;;;kBAoBd,SAAS,GAAG,SAAS;QAC/B;;;;WAIG;iBACM,OAAO;;;QAwBhB;;;;;WAKG;iBACM,qBAAqB;;;kBAcpB,mBAAmB;;;;QAqB7B;;;;WAIG;iBACM,qBAAqB;;;kBAiDpB,OAAO;wBACD,OAAO;QACvB;;;;WAIG;0BACe,CAChB,OAAO,EAAE,OAAO,EAChB,YAAY,CAAC,EAAE,0BAA0B,KACtC,IAAI;QACT,4FAA4F;wBAC5E,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI;gBAClC,MAAM;mBACH,OAAO;;;kBAwCR,OAAO;wBACD,OAAO;QACvB;;;;WAIG;0BACe,CAChB,OAAO,EAAE,OAAO,EAChB,YAAY,CAAC,EAAE,0BAA0B,KACtC,IAAI;QACT,4FAA4F;wBAC5E,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI;gBAClC,MAAM;mBACH,OAAO;;;;CAoFpB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../src/components/text/text.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,wBAAwB,EAC7B,KAAK,UAAU,EACf,KAAK,YAAY,EAGlB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../src/components/text/text.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../../src/components/toast/toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,sBAAsB,EACtB,WAAW,EACZ,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../../src/components/toast/toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,sBAAsB,EACtB,WAAW,EACZ,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAU,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAEL,KAAK,eAAe,EACrB,MAAM,6BAA6B,CAAC;AASrC;;;GAGG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiDtB,CAAC;AAEX,eAAO,MAAM,2BAA2B;;CAE9B,CAAC;AAEX;;;GAGG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BrB,CAAC;AAGX,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,mBAAmB,CAAC,OAAO,CAAC;AAExE,MAAM,WAAW,sBAAsB;IACrC,OAAO,CAAC,EAAE,gBAAgB,CAAC;CAC5B;AAED,wBAAgB,aAAa,CAAC,EAC5B,OAA6C,GAC9C,GAAE,sBAA2B,UAO7B;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,WAAW,WAAY,SAAQ,sBAAsB;IACzD,kEAAkE;IAClE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;CAC7B;AAED,KAAK,oBAAoB,GAAG;IAC1B,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,CAAC;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,IAAI,SAAS,MAAM,IAAI,WAAW,CAAC,IAAI,CAAC,GACnE,oBAAoB,CAAC;AAEvB,MAAM,MAAM,0BAA0B,CAAC,IAAI,SAAS,MAAM,IACxD,sBAAsB,CAAC,IAAI,CAAC,GAAG,oBAAoB,CAAC;AAyFtD,eAAO,MAAM,mBAAmB;YAIF,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;4FArFvC,0BAA0B,CAAC,GAAG,CAAC;mBApGf,CAAA;qIAwIlB,MAAM,WAAW,OAAO,CAAC,0BAA0B,CAAC,GAAG,CAAC,CAAC;mKAM5D,CAAC;iBAGE,0BAA0B,CAAC,GAAG,CAAC;iEAGtB,0BAA0B,CAAC,GAAG,CAAC;0DAGpC,KAAK,KAAK,0BAA0B,CAAC,GAAG,CAAC;;CAoC7D,CAAC;AAEF,eAAO,MAAM,sBAAsB;mBAzFhB,0BAA0B,CAAC,GAAG,CAAC;iBAoCjC,MAAM,WAAW,OAAO,CAAC,0BAA0B,CAAC,GAAG,CAAC,CAAC;cAM5D,CAAC;iBAGE,0BAA0B,CAAC,GAAG,CAAC;iEAGtB,0BAA0B,CAAC,GAAG,CAAC;0DAGpC,KAAK,KAAK,0BAA0B,CAAC,GAAG,CAAC;;CAwC7D,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,EAAE,WAAW,2CAczE;AAED,0FAA0F;AAC1F,eAAO,MAAM,aAAa,eAAS,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/tooltip/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/tooltip/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGjE,OAAO,EAEL,KAAK,eAAe,EACrB,MAAM,6BAA6B,CAAC;AAErC,oFAAoF;AACpF,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;CAmBxB,CAAC;AAEX,eAAO,MAAM,6BAA6B;;CAEhC,CAAC;AAGX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,qBAAqB,CAAC,IAAI,CAAC;AAEtE,MAAM,WAAW,wBAAwB;IACvC;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAyC,GAC1C,GAAE,wBAA6B,UAY/B;AAED,eAAO,MAAM,eAAe,mEAAuB,CAAC;AAEpD,KAAK,gBAAgB,GAAG,wBAAwB,CAAC,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;AAE1E,KAAK,YAAY,GAAG,wBAAwB,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,CAAC;AAEzE,kFAAkF;AAClF,KAAK,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAE/C;;;;;;;;;GASG;AACH,MAAM,MAAM,YAAY,GAAG,gBAAgB,GACzC,wBAAwB,GAAG;IACzB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,OAAO,EAAE,SAAS,CAAC;IACnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;CACjC,CAAC;AAEJ;;;;;;;;;;GAUG;AACH,wBAAgB,OAAO,CAAC,EACtB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,OAAO,EACP,MAAM,EACN,IAAI,EACJ,SAAS,EACT,SAAS,EAAE,aAAa,EACxB,UAAU,EACV,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,2CAyDd"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Safely resolve a variant config from a variants map, falling back
|
|
3
|
+
* to a known-good default when the key doesn't match any entry.
|
|
4
|
+
*
|
|
5
|
+
* This prevents `TypeError: Cannot read properties of undefined`
|
|
6
|
+
* when a component receives an invalid variant value at runtime
|
|
7
|
+
* (e.g. from untyped JS consumers, server data, or stale props).
|
|
8
|
+
*
|
|
9
|
+
* @param variants – A dimension of a KUMO_*_VARIANTS object
|
|
10
|
+
* (e.g. `KUMO_BUTTON_VARIANTS.variant`)
|
|
11
|
+
* @param key – The runtime value of the variant prop
|
|
12
|
+
* @param fallback – A key guaranteed to exist (typically from
|
|
13
|
+
* KUMO_*_DEFAULT_VARIANTS)
|
|
14
|
+
* @returns The matched config entry, or the fallback entry
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* ```ts
|
|
18
|
+
* const config = resolveVariant(
|
|
19
|
+
* KUMO_BUTTON_VARIANTS.variant,
|
|
20
|
+
* variant,
|
|
21
|
+
* KUMO_BUTTON_DEFAULT_VARIANTS.variant,
|
|
22
|
+
* );
|
|
23
|
+
* // config.classes is always safe to access
|
|
24
|
+
* ```
|
|
25
|
+
*/
|
|
26
|
+
export declare function resolveVariant<T extends Record<string, unknown>>(variants: T, key: string, fallback: keyof T & string): T[keyof T];
|
|
27
|
+
//# sourceMappingURL=resolve-variant.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"resolve-variant.d.ts","sourceRoot":"","sources":["../../../src/utils/resolve-variant.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9D,QAAQ,EAAE,CAAC,EACX,GAAG,EAAE,MAAM,EACX,QAAQ,EAAE,MAAM,CAAC,GAAG,MAAM,GACzB,CAAC,CAAC,MAAM,CAAC,CAAC,CAcZ"}
|
package/package.json
CHANGED
|
@@ -289,13 +289,28 @@ export const ADDITIONAL_COMPONENT_PROPS: Record<
|
|
|
289
289
|
},
|
|
290
290
|
Select: {
|
|
291
291
|
onValueChange: {
|
|
292
|
-
type: "(value:
|
|
292
|
+
type: "(value: T) => void",
|
|
293
293
|
description: "Callback when selection changes",
|
|
294
294
|
},
|
|
295
295
|
defaultValue: {
|
|
296
|
-
type: "
|
|
296
|
+
type: "T",
|
|
297
297
|
description: "Initial value for uncontrolled mode",
|
|
298
298
|
},
|
|
299
|
+
renderValue: {
|
|
300
|
+
type: "(value: T) => ReactNode",
|
|
301
|
+
description:
|
|
302
|
+
"A function that returns a ReactNode to format the selected value in the trigger. Required when using object values. Use `placeholder` for the empty state.",
|
|
303
|
+
},
|
|
304
|
+
items: {
|
|
305
|
+
type: 'Record<string, string> | Array<{ label: ReactNode; value: T }>',
|
|
306
|
+
description:
|
|
307
|
+
"Data structure of items rendered in the popup. Accepts a plain object map (`{ key: \"Label\" }`) or an array of `{ label, value }` for object/complex values.",
|
|
308
|
+
},
|
|
309
|
+
isItemEqualToValue: {
|
|
310
|
+
type: "(item: T, value: T) => boolean",
|
|
311
|
+
description:
|
|
312
|
+
"Custom equality function for comparing items. Required when value is an object, since object identity (`===`) won't match across renders.",
|
|
313
|
+
},
|
|
299
314
|
},
|
|
300
315
|
DateRangePicker: {
|
|
301
316
|
onStartDateChange: {
|
|
@@ -532,7 +547,7 @@ export const PROP_TYPE_OVERRIDES: Record<string, Record<string, string>> = {
|
|
|
532
547
|
value: "T | T[]",
|
|
533
548
|
},
|
|
534
549
|
Select: {
|
|
535
|
-
value: "
|
|
550
|
+
value: "T",
|
|
536
551
|
},
|
|
537
552
|
};
|
|
538
553
|
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"autocomplete-48aq0d244bs2e8zv.js","sources":["../../src/components/autocomplete/autocomplete.tsx"],"sourcesContent":["import { Autocomplete as AutocompleteBase } from \"@base-ui/react/autocomplete\";\nimport { CheckIcon } from \"@phosphor-icons/react\";\nimport { type ReactNode } from \"react\";\nimport { inputVariants, KUMO_INPUT_VARIANTS } from \"../input/input\";\nimport { cn } from \"../../utils/cn\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\n\n/** Autocomplete variant definitions. */\nexport const KUMO_AUTOCOMPLETE_VARIANTS = {\n size: KUMO_INPUT_VARIANTS.size,\n} as const;\n\nexport const KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\n// Derived types from KUMO_AUTOCOMPLETE_VARIANTS\nexport type KumoAutocompleteSize = keyof typeof KUMO_AUTOCOMPLETE_VARIANTS.size;\n\nexport interface KumoAutocompleteVariantsProps {\n /**\n * Size of the autocomplete input. 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?: KumoAutocompleteSize;\n}\n\nexport function autocompleteVariants({\n size = KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS.size,\n}: KumoAutocompleteVariantsProps = {}) {\n return cn(KUMO_INPUT_VARIANTS.size[size].classes);\n}\n\n/**\n * Autocomplete component props.\n *\n * Autocomplete provides a free-form text input with optional suggestions in a\n * filterable dropdown. Unlike Combobox, the input value is not constrained to\n * the suggestion list items.\n *\n * @example\n * ```tsx\n * <Autocomplete label=\"Country\" items={countries}>\n * <Autocomplete.InputGroup />\n * <Autocomplete.Content>\n * <Autocomplete.List>\n * {(item) => <Autocomplete.Item value={item}>{item}</Autocomplete.Item>}\n * </Autocomplete.List>\n * </Autocomplete.Content>\n * </Autocomplete>\n * ```\n */\nexport interface AutocompleteProps {\n /** Array of items to display in the dropdown */\n items: unknown[];\n /** The controlled input value */\n value?: string | number | string[];\n /** The uncontrolled default input value */\n defaultValue?: string | number | string[];\n /** Callback when the input value changes */\n onValueChange?: AutocompleteBase.Root.Props<unknown>[\"onValueChange\"];\n /** Whether the popup is open (controlled) */\n open?: boolean;\n /** Callback when the popup opens or closes */\n onOpenChange?: AutocompleteBase.Root.Props<unknown>[\"onOpenChange\"];\n /** Autocomplete content (input group, popup content) */\n children: ReactNode;\n /** Additional CSS classes */\n className?: string;\n /** Label content (enables Field wrapper) */\n label?: ReactNode;\n /** Whether the field is required */\n required?: boolean;\n /** Tooltip content to display next to the label */\n labelTooltip?: ReactNode;\n /** Helper text displayed below the field */\n description?: ReactNode;\n /** Error message or validation error object */\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n}\n\nfunction Root<ItemValue>({\n label,\n required,\n labelTooltip,\n description,\n error,\n children,\n ...props\n}: AutocompleteBase.Root.Props<ItemValue> & {\n label?: ReactNode;\n required?: boolean;\n labelTooltip?: ReactNode;\n description?: ReactNode;\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n}) {\n const rootProps = props as Omit<\n AutocompleteBase.Root.Props<ItemValue>,\n \"items\"\n > & {\n items?: readonly ItemValue[];\n };\n const control = (\n <AutocompleteBase.Root {...rootProps}>{children}</AutocompleteBase.Root>\n );\n\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 {control}\n </Field>\n );\n }\n\n return control;\n}\n\nfunction InputGroup({\n className,\n size = KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS.size,\n placeholder,\n}: {\n className?: string;\n size?: KumoAutocompleteSize;\n placeholder?: string;\n}) {\n return (\n <AutocompleteBase.Input\n className={cn(\n inputVariants({ size, focusIndicator: true }),\n \"w-full\",\n className,\n )}\n placeholder={placeholder}\n />\n );\n}\n\nfunction Content({\n children,\n className,\n align = \"start\",\n sideOffset = 4,\n alignOffset,\n side,\n}: {\n children?: ReactNode;\n className?: string;\n align?: AutocompleteBase.Positioner.Props[\"align\"];\n alignOffset?: AutocompleteBase.Positioner.Props[\"alignOffset\"];\n side?: AutocompleteBase.Positioner.Props[\"side\"];\n sideOffset?: AutocompleteBase.Positioner.Props[\"sideOffset\"];\n}) {\n return (\n <AutocompleteBase.Portal>\n <AutocompleteBase.Positioner\n className=\"outline-none\"\n align={align}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n side={side}\n >\n <AutocompleteBase.Popup\n className={(state: AutocompleteBase.Popup.State) =>\n cn(\n \"flex flex-col\",\n \"max-h-[min(var(--available-height),24rem)] max-w-(--available-width) min-w-(--anchor-width) py-1.5\",\n \"bg-kumo-control text-kumo-default\",\n \"rounded-lg shadow-lg ring ring-kumo-line\",\n state.empty && \"hidden\",\n className,\n )\n }\n >\n {children}\n </AutocompleteBase.Popup>\n </AutocompleteBase.Positioner>\n </AutocompleteBase.Portal>\n );\n}\n\nfunction List({\n className,\n ...props\n}: AutocompleteBase.List.Props & { className?: string }) {\n return (\n <AutocompleteBase.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 Item({ children, ...props }: AutocompleteBase.Item.Props) {\n return (\n <AutocompleteBase.Item\n {...props}\n className=\"group mx-1.5 grid cursor-pointer grid-cols-[1fr_16px] gap-2 rounded px-2 py-1.5 text-base data-highlighted:bg-kumo-overlay data-selected:font-medium\"\n >\n <div className=\"col-start-1\">{children}</div>\n <span className=\"col-start-2 hidden items-center group-data-selected:flex\">\n <CheckIcon size={14} />\n </span>\n </AutocompleteBase.Item>\n );\n}\n\nfunction GroupLabel(props: AutocompleteBase.GroupLabel.Props) {\n return (\n <AutocompleteBase.GroupLabel\n {...props}\n className={cn(\n \"mx-1.5 px-2 py-1.5 text-sm text-kumo-strong\",\n props.className,\n )}\n />\n );\n}\n\nfunction Group(props: AutocompleteBase.Group.Props) {\n return (\n <AutocompleteBase.Group\n {...props}\n className=\"border-t border-kumo-line mt-2 pt-2 first:border-t-0 first:mt-0 first:pt-0\"\n />\n );\n}\n\nfunction Separator(props: AutocompleteBase.Separator.Props) {\n return (\n <AutocompleteBase.Separator\n {...props}\n className={cn(\"mx-0 my-1 h-px bg-kumo-line\", props.className)}\n />\n );\n}\n\nRoot.displayName = \"Autocomplete.Root\";\nInputGroup.displayName = \"Autocomplete.InputGroup\";\nContent.displayName = \"Autocomplete.Content\";\nItem.displayName = \"Autocomplete.Item\";\nGroupLabel.displayName = \"Autocomplete.GroupLabel\";\nGroup.displayName = \"Autocomplete.Group\";\nSeparator.displayName = \"Autocomplete.Separator\";\n\n/**\n * Autocomplete — free-form text input with an optional filtered suggestion list.\n *\n * Unlike Combobox, the input value is not restricted to items in the list.\n * Use Combobox when the selected value must come from the list.\n *\n * Compound component: `Autocomplete` (Root), `.InputGroup`, `.Content`, `.Item`,\n * `.GroupLabel`, `.Group`, `.Separator`, `.List`, `.Collection`.\n *\n * `InputGroup` renders the text input with Input component styling.\n * Pass a `size` prop to `InputGroup` to match the Input component sizes.\n *\n * @example\n * ```tsx\n * <Autocomplete items={fruits} label=\"Fruit\">\n * <Autocomplete.InputGroup size=\"base\" />\n * <Autocomplete.Content>\n * <Autocomplete.List>\n * {(item) => <Autocomplete.Item value={item}>{item}</Autocomplete.Item>}\n * </Autocomplete.List>\n * </Autocomplete.Content>\n * </Autocomplete>\n * ```\n *\n * @see https://base-ui.com/react/components/autocomplete\n */\nexport const Autocomplete = Object.assign(Root, {\n // Styled compound sub-components\n InputGroup,\n Content,\n Item,\n GroupLabel,\n Group,\n Separator,\n List,\n\n // Pass-through Base UI sub-components\n Empty: AutocompleteBase.Empty,\n Collection: AutocompleteBase.Collection,\n});\n"],"names":["KUMO_AUTOCOMPLETE_VARIANTS","KUMO_INPUT_VARIANTS","KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS","autocompleteVariants","size","cn","Root","label","required","labelTooltip","description","error","children","props","control","jsx","AutocompleteBase.Root","Field","InputGroup","className","placeholder","AutocompleteBase.Input","inputVariants","Content","align","sideOffset","alignOffset","side","AutocompleteBase.Portal","AutocompleteBase.Positioner","AutocompleteBase.Popup","state","List","AutocompleteBase.List","Item","jsxs","AutocompleteBase.Item","CheckIcon","GroupLabel","AutocompleteBase.GroupLabel","Group","AutocompleteBase.Group","Separator","AutocompleteBase.Separator","Autocomplete","AutocompleteBase.Empty","AutocompleteBase.Collection"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"badge-dan90i0rzy4pwa1j.js","sources":["../../src/components/badge/badge.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Base styles applied to all badge variants. */\nexport const KUMO_BADGE_BASE_STYLES =\n \"inline-flex w-fit flex-none shrink-0 items-center justify-self-start rounded-full px-2 py-0.5 text-xs font-medium whitespace-nowrap\";\n\n/** Badge variant definitions mapping variant names to their Tailwind classes and descriptions. */\nexport const KUMO_BADGE_VARIANTS = {\n variant: {\n /** Semantic token badges */\n primary: {\n classes: \"bg-kumo-badge-inverted text-kumo-badge-inverted\",\n description: \"Primary badge\",\n },\n secondary: {\n classes: \"bg-kumo-fill text-kumo-badge-neutral-subtle\",\n description: \"Secondary badge\",\n },\n error: {\n classes: \"bg-kumo-danger-tint/60 text-kumo-danger\",\n description: \"Error badge\",\n },\n warning: {\n classes: \"bg-kumo-warning-tint/70 text-kumo-warning\",\n description: \"Warning badge\",\n },\n success: {\n classes: \"bg-kumo-success-tint/70 text-kumo-success\",\n description: \"Success badge\",\n },\n destructive: {\n classes: \"bg-kumo-badge-red text-white\",\n description: \"Deprecated. Use red instead.\",\n },\n info: {\n classes: \"bg-kumo-info-tint/70 text-kumo-info\",\n description: \"Info badge\",\n },\n beta: {\n classes:\n \"border border-dashed border-kumo-brand bg-transparent text-kumo-link\",\n description: \"Indicates beta or experimental features\",\n },\n outline: {\n classes: \"border border-kumo-fill bg-transparent text-kumo-default\",\n description: \"Bordered badge with transparent background\",\n },\n\n /** Other color token variants */\n\n red: {\n classes: \"bg-kumo-badge-red text-white\",\n description: \"Red badge\",\n },\n green: {\n classes: \"bg-kumo-badge-green text-white\",\n description: \"Green badge\",\n },\n neutral: {\n classes: \"bg-kumo-badge-neutral text-white\",\n description: \"Neutral badge\",\n },\n orange: {\n classes: \"bg-kumo-badge-orange text-black\",\n description: \"Orange badge\",\n },\n purple: {\n classes: \"bg-kumo-badge-purple text-white\",\n description: \"Purple badge\",\n },\n teal: {\n classes: \"bg-kumo-badge-teal text-white\",\n description: \"Teal badge\",\n },\n \"teal-subtle\": {\n classes: \"bg-kumo-badge-teal-subtle text-kumo-badge-teal-subtle\",\n description: \"Subtle teal badge\",\n },\n blue: {\n classes: \"bg-kumo-badge-blue text-white\",\n description: \"Blue badge\",\n },\n },\n} as const;\n\nexport const KUMO_BADGE_DEFAULT_VARIANTS = {\n variant: \"primary\",\n} as const;\n\n// Derived types from KUMO_BADGE_VARIANTS\nexport type KumoBadgeVariant = keyof typeof KUMO_BADGE_VARIANTS.variant;\n\nexport interface KumoBadgeVariantsProps {\n variant?: KumoBadgeVariant;\n}\n\nexport function badgeVariants({\n variant = KUMO_BADGE_DEFAULT_VARIANTS.variant,\n}: KumoBadgeVariantsProps = {}) {\n const variantConfig = KUMO_BADGE_VARIANTS.variant[variant];\n return cn(\n // Base styles (exported as KUMO_BADGE_BASE_STYLES for Figma plugin)\n KUMO_BADGE_BASE_STYLES,\n // Apply variant styles from KUMO_BADGE_VARIANTS (fallback to primary if variant not found)\n variantConfig?.classes ??\n KUMO_BADGE_VARIANTS.variant[KUMO_BADGE_DEFAULT_VARIANTS.variant].classes,\n );\n}\n\n// Legacy type alias for backwards compatibility\nexport type BadgeVariant = KumoBadgeVariant;\n\n/**\n * Badge component props.\n *\n * @example\n * ```tsx\n * <Badge variant=\"green\">Active</Badge>\n * <Badge variant=\"red\">Error</Badge>\n * <Badge variant=\"neutral\">Inactive</Badge>\n * ```\n */\nexport interface BadgeProps {\n /**\n * Color variant of the badge.\n * Recommended semantic variants:\n * - `\"primary\"` — Primary badge\n * - `\"secondary\"` — Secondary badge\n * - `\"error\"` — Error badge\n * - `\"warning\"` — Warning badge\n * - `\"success\"` — Success badge\n * - `\"info\"` — Info badge\n *\n * Additional token variants:\n * - `\"red\"`, `\"orange\"`, `\"green\"`, `\"teal\"`, `\"blue\"`, `\"purple\"`, `\"neutral\"`\n * - `\"teal-subtle\"`, `\"neutral-subtle\"`\n * - `\"inverted\"`\n * - `\"outline\"` — Bordered badge with transparent background\n * - `\"beta\"` — Dashed-border badge for beta/experimental features\n * @default \"secondary\"\n */\n variant?: KumoBadgeVariant;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Content rendered inside the badge. */\n children: ReactNode;\n}\n\n/**\n * Small status label for categorizing or highlighting content.\n *\n * @example\n * ```tsx\n * <Badge variant=\"green\">Active</Badge>\n * ```\n */\nexport function Badge({\n variant = KUMO_BADGE_DEFAULT_VARIANTS.variant,\n className,\n children,\n}: BadgeProps) {\n return (\n <span className={cn(badgeVariants({ variant }), className)}>\n {children}\n </span>\n );\n}\n"],"names":["KUMO_BADGE_BASE_STYLES","KUMO_BADGE_VARIANTS","KUMO_BADGE_DEFAULT_VARIANTS","badgeVariants","variant","variantConfig","cn","Badge","className","children","jsx"],"mappings":";;;AAIO,MAAMA,IACX,uIAGWC,IAAsB;AAAA,EACjC,SAAS;AAAA;AAAA,IAEP,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,WAAW;AAAA,MACT,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,aAAa;AAAA,MACX,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA;AAAA,IAKf,KAAK;AAAA,MACH,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,eAAe;AAAA,MACb,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA8B;AAAA,EACzC,SAAS;AACX;AASO,SAASC,EAAc;AAAA,EAC5B,SAAAC,IAAUF,EAA4B;AACxC,IAA4B,IAAI;AAC9B,QAAMG,IAAgBJ,EAAoB,QAAQG,CAAO;AACzD,SAAOE;AAAA;AAAA,IAELN;AAAA;AAAA,IAEAK,GAAe,WACbJ,EAAoB,QAAQC,EAA4B,OAAO,EAAE;AAAA,EAAA;AAEvE;AAiDO,SAASK,EAAM;AAAA,EACpB,SAAAH,IAAUF,EAA4B;AAAA,EACtC,WAAAM;AAAA,EACA,UAAAC;AACF,GAAe;AACb,SACE,gBAAAC,EAAC,QAAA,EAAK,WAAWJ,EAAGH,EAAc,EAAE,SAAAC,GAAS,GAAGI,CAAS,GACtD,UAAAC,EAAA,CACH;AAEJ;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"banner-eiwcnk7ts21s3bnb.js","sources":["../../src/components/banner/banner.tsx"],"sourcesContent":["import { type ReactNode, isValidElement, forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Base styles applied to all banner variants. */\nexport const KUMO_BANNER_BASE_STYLES =\n \"flex w-full items-start gap-3 rounded-lg border px-4 py-3 text-base\";\n\n/** Banner variant definitions mapping variant names to their Tailwind classes and descriptions. */\nexport const KUMO_BANNER_VARIANTS = {\n variant: {\n default: {\n classes:\n \"bg-kumo-info-tint/30 border-kumo-info/50 text-kumo-info selection:bg-kumo-info\",\n iconClasses: \"text-kumo-info\",\n description: \"Informational banner for general messages\",\n },\n alert: {\n classes:\n \"bg-kumo-warning-tint/15 border-kumo-warning/50 text-kumo-warning selection:bg-kumo-warning\",\n iconClasses: \"text-kumo-warning\",\n description: \"Warning banner for cautionary messages\",\n },\n error: {\n classes:\n \"bg-kumo-danger-tint/15 border-kumo-danger/50 text-kumo-danger selection:bg-kumo-danger\",\n iconClasses: \"text-kumo-danger\",\n description: \"Error banner for critical issues\",\n },\n },\n} as const;\n\nexport const KUMO_BANNER_DEFAULT_VARIANTS = {\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_BANNER_VARIANTS\nexport type KumoBannerVariant = keyof typeof KUMO_BANNER_VARIANTS.variant;\n\nexport interface KumoBannerVariantsProps {\n /**\n * Visual style of the banner.\n * - `\"default\"` — Informational banner for general messages\n * - `\"alert\"` — Warning banner for cautionary messages\n * - `\"error\"` — Error banner for critical issues\n * @default \"default\"\n */\n variant?: KumoBannerVariant;\n}\n\nexport function bannerVariants({\n variant = KUMO_BANNER_DEFAULT_VARIANTS.variant,\n}: KumoBannerVariantsProps = {}) {\n return cn(\n // Base styles (exported as KUMO_BANNER_BASE_STYLES for Figma plugin)\n KUMO_BANNER_BASE_STYLES,\n // Apply variant styles from KUMO_BANNER_VARIANTS\n KUMO_BANNER_VARIANTS.variant[variant].classes,\n );\n}\n\n// Legacy enum for backwards compatibility\nexport enum BannerVariant {\n DEFAULT,\n ALERT,\n ERROR,\n}\n\n/**\n * Banner component props.\n *\n * @example\n * ```tsx\n * <Banner title=\"Update available\" description=\"A new version is ready to install.\" />\n * <Banner variant=\"alert\" title=\"Session expiring\" description=\"Your session will expire soon.\" />\n * <Banner variant=\"error\" title=\"Save failed\" description=\"We couldn't save your changes.\" />\n * ```\n */\nexport interface BannerProps {\n /** Icon element rendered before the banner content (e.g. from `@phosphor-icons/react`). */\n icon?: ReactNode;\n /** Primary heading text for the banner. Use for i18n string injection. */\n title?: string;\n /** Secondary description text displayed below the title. Use for i18n string injection. */\n description?: ReactNode;\n /** Action slot rendered at the trailing end of the banner (e.g. a CTA button or link). Only used in structured mode (with `title` or `description`). */\n action?: ReactNode;\n /** @deprecated Use `title` and `description` instead. Will be removed in a future major version. */\n text?: string;\n /** @deprecated Use `title` and `description` instead for better i18n support. */\n children?: ReactNode;\n /**\n * Visual style of the banner.\n * - `\"default\"` — Informational blue banner for general messages\n * - `\"alert\"` — Warning yellow banner for cautionary messages\n * - `\"error\"` — Error red banner for critical issues\n * @default \"default\"\n */\n variant?: KumoBannerVariant;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n}\n\n/**\n * Full-width message bar for informational, warning, or error notices.\n * Supports structured title/description for i18n, or simple children for basic usage.\n *\n * @example\n * ```tsx\n * // Structured (recommended for i18n)\n * <Banner\n * variant=\"alert\"\n * icon={<WarningCircle />}\n * title=\"Review required\"\n * description=\"Please review your billing information.\"\n * />\n *\n * // Simple (backwards compatible)\n * <Banner variant=\"alert\" icon={<WarningCircle />}>\n * Review your billing information.\n * </Banner>\n * ```\n */\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner(\n {\n icon,\n title,\n description,\n action,\n children,\n text,\n variant = KUMO_BANNER_DEFAULT_VARIANTS.variant,\n className,\n },\n ref,\n) {\n const variantConfig = KUMO_BANNER_VARIANTS.variant[variant];\n\n // Structured mode: title and/or description provided\n if (title || description) {\n return (\n <div ref={ref} className={cn(bannerVariants({ variant }), className)}>\n {icon && (\n <span\n className={cn(\n \"shrink-0 flex items-center h-[1.375em]\",\n variantConfig.iconClasses,\n )}\n >\n {icon}\n </span>\n )}\n <div className=\"flex min-w-0 flex-1 items-center justify-between gap-3\">\n <div className=\"flex flex-col gap-0.5\">\n {title && <p className=\"font-medium leading-snug\">{title}</p>}\n {description && (\n <div className=\"text-sm leading-snug\">\n {isValidElement(description) ? (\n description\n ) : (\n <p>{description}</p>\n )}\n </div>\n )}\n </div>\n {action && (\n <div className=\"flex shrink-0 items-center gap-2\">{action}</div>\n )}\n </div>\n </div>\n );\n }\n\n // Legacy mode: children or text prop\n const value = children ?? text;\n const content = isValidElement(value) ? value : <p>{value}</p>;\n\n return (\n <div ref={ref} className={cn(bannerVariants({ variant }), className)}>\n {icon && (\n <span className={cn(\"shrink-0\", variantConfig.iconClasses)}>\n {icon}\n </span>\n )}\n {content}\n </div>\n );\n});\n\nBanner.displayName = \"Banner\";\n"],"names":["KUMO_BANNER_BASE_STYLES","KUMO_BANNER_VARIANTS","KUMO_BANNER_DEFAULT_VARIANTS","bannerVariants","variant","cn","BannerVariant","Banner","forwardRef","icon","title","description","action","children","text","className","ref","variantConfig","jsxs","jsx","isValidElement","value","content"],"mappings":";;;;AAIO,MAAMA,IACX,uEAGWC,IAAuB;AAAA,EAClC,SAAS;AAAA,IACP,SAAS;AAAA,MACP,SACE;AAAA,MACF,aAAa;AAAA,MACb,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SACE;AAAA,MACF,aAAa;AAAA,MACb,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SACE;AAAA,MACF,aAAa;AAAA,MACb,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA+B;AAAA,EAC1C,SAAS;AACX;AAgBO,SAASC,EAAe;AAAA,EAC7B,SAAAC,IAAUF,EAA6B;AACzC,IAA6B,IAAI;AAC/B,SAAOG;AAAA;AAAA,IAELL;AAAA;AAAA,IAEAC,EAAqB,QAAQG,CAAO,EAAE;AAAA,EAAA;AAE1C;AAGO,IAAKE,sBAAAA,OACVA,EAAAA,EAAA,UAAA,CAAA,IAAA,WACAA,EAAAA,EAAA,QAAA,CAAA,IAAA,SACAA,EAAAA,EAAA,QAAA,CAAA,IAAA,SAHUA,IAAAA,KAAA,CAAA,CAAA;AA6DL,MAAMC,IAASC,EAAwC,SAC5D;AAAA,EACE,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAV,IAAUF,EAA6B;AAAA,EACvC,WAAAa;AACF,GACAC,GACA;AACA,QAAMC,IAAgBhB,EAAqB,QAAQG,CAAO;AAG1D,MAAIM,KAASC;AACX,WACE,gBAAAO,EAAC,OAAA,EAAI,KAAAF,GAAU,WAAWX,EAAGF,EAAe,EAAE,SAAAC,EAAA,CAAS,GAAGW,CAAS,GAChE,UAAA;AAAA,MAAAN,KACC,gBAAAU;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWd;AAAA,YACT;AAAA,YACAY,EAAc;AAAA,UAAA;AAAA,UAGf,UAAAR;AAAA,QAAA;AAAA,MAAA;AAAA,MAGL,gBAAAS,EAAC,OAAA,EAAI,WAAU,0DACb,UAAA;AAAA,QAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,yBACZ,UAAA;AAAA,UAAAR,KAAS,gBAAAS,EAAC,KAAA,EAAE,WAAU,4BAA4B,UAAAT,GAAM;AAAA,UACxDC,KACC,gBAAAQ,EAAC,OAAA,EAAI,WAAU,wBACZ,UAAAC,EAAeT,CAAW,IACzBA,IAEA,gBAAAQ,EAAC,KAAA,EAAG,UAAAR,EAAA,CAAY,EAAA,CAEpB;AAAA,QAAA,GAEJ;AAAA,QACCC,KACC,gBAAAO,EAAC,OAAA,EAAI,WAAU,oCAAoC,UAAAP,EAAA,CAAO;AAAA,MAAA,EAAA,CAE9D;AAAA,IAAA,GACF;AAKJ,QAAMS,IAAQR,KAAYC,GACpBQ,IAAUF,EAAeC,CAAK,IAAIA,IAAQ,gBAAAF,EAAC,OAAG,UAAAE,GAAM;AAE1D,SACE,gBAAAH,EAAC,OAAA,EAAI,KAAAF,GAAU,WAAWX,EAAGF,EAAe,EAAE,SAAAC,EAAA,CAAS,GAAGW,CAAS,GAChE,UAAA;AAAA,IAAAN,KACC,gBAAAU,EAAC,UAAK,WAAWd,EAAG,YAAYY,EAAc,WAAW,GACtD,UAAAR,EAAA,CACH;AAAA,IAEDa;AAAA,EAAA,GACH;AAEJ,CAAC;AAEDf,EAAO,cAAc;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumbs-cxcwf2l1ki3ffg5d.js","sources":["../../src/components/breadcrumbs/breadcrumbs.tsx"],"sourcesContent":["import {\n Children,\n cloneElement,\n isValidElement,\n useEffect,\n useState,\n type PropsWithChildren,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { Button } from \"../../components/button\";\nimport { SkeletonLine } from \"../../components/loader/skeleton-line\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport { cn } from \"../../utils/cn\";\n\n/** Breadcrumbs size variant definitions. */\nexport const KUMO_BREADCRUMBS_VARIANTS = {\n size: {\n sm: {\n classes: \"text-sm h-10 gap-0.5\",\n description: \"Compact breadcrumbs for dense UIs\",\n },\n base: {\n classes: \"text-base h-12 gap-1\",\n description: \"Default breadcrumbs size\",\n },\n },\n} as const;\n\nexport const KUMO_BREADCRUMBS_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\nexport type KumoBreadcrumbsSize = keyof typeof KUMO_BREADCRUMBS_VARIANTS.size;\n\nexport interface KumoBreadcrumbsVariantsProps {\n /**\n * Size of the breadcrumbs.\n * - `\"sm\"` — Compact breadcrumbs for dense UIs\n * - `\"base\"` — Default breadcrumbs size\n * @default \"base\"\n */\n size?: KumoBreadcrumbsSize;\n}\n\nexport function breadcrumbsVariants({\n size = KUMO_BREADCRUMBS_DEFAULT_VARIANTS.size,\n}: KumoBreadcrumbsVariantsProps = {}) {\n return cn(\n \"group mr-4 flex min-w-0 grow items-center overflow-hidden whitespace-nowrap\",\n KUMO_BREADCRUMBS_VARIANTS.size[size].classes,\n );\n}\n\nexport interface BreadcrumbsItemProps {\n href: string;\n icon?: React.ReactNode;\n}\n\nconst Link = ({\n href,\n icon,\n children,\n}: PropsWithChildren<BreadcrumbsItemProps>) => {\n const LinkComponent = useLinkComponent();\n\n return (\n <LinkComponent\n to={href}\n className=\"flex min-w-0 max-w-full items-center gap-1 text-kumo-subtle no-underline\"\n >\n {!!icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n <span className=\"truncate\">{children}</span>\n </LinkComponent>\n );\n};\n\ninterface BreadcrumbsCurrentProps {\n loading?: boolean;\n icon?: React.ReactNode;\n}\n\nfunction Current({\n children,\n icon,\n loading,\n}: PropsWithChildren<BreadcrumbsCurrentProps>) {\n if (loading) {\n return (\n <div className=\"flex w-[125px] min-w-0 items-center gap-1\">\n {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n <SkeletonLine />\n </div>\n );\n }\n\n return (\n <div\n className=\"flex min-w-0 max-w-full items-center gap-1 font-medium\"\n aria-current=\"page\"\n >\n {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n <span className=\"truncate\">{children}</span>\n </div>\n );\n}\n\nfunction Separator() {\n return (\n <span\n className=\"flex shrink-0 items-center text-kumo-inactive\"\n aria-hidden=\"true\"\n >\n <svg width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\">\n <path\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"1.5\"\n d=\"M10.75 8.75L14.25 12L10.75 15.25\"\n />\n </svg>\n </span>\n );\n}\n\nfunction MobileEllipsis() {\n return (\n <span className=\"flex shrink-0 items-center text-kumo-subtle\" aria-hidden>\n ...\n </span>\n );\n}\n\nfunction Clipboard({ text }: { text: string }) {\n const [isCopied, setIsCopied] = useState(false);\n\n useEffect(() => {\n if (!isCopied) return;\n\n const timeoutId = setTimeout(() => setIsCopied(false), 2000);\n return () => clearTimeout(timeoutId);\n }, [isCopied]);\n\n const handleCopyDeeplink = async () => {\n if (!text) return;\n\n try {\n await navigator.clipboard.writeText(text);\n setIsCopied(true);\n } catch (err) {\n console.error(\"Failed to copy deeplink:\", err);\n }\n };\n\n return (\n <Button\n variant=\"ghost\"\n shape=\"square\"\n size=\"sm\"\n className=\"opacity-0 transition-[opacity] group-hover:opacity-100\"\n onClick={handleCopyDeeplink}\n title=\"Click to copy\"\n aria-label=\"Copy\"\n >\n {isCopied ? (\n <CheckIcon weight=\"bold\" className=\"text-kumo-success\" />\n ) : (\n <CopyIcon weight=\"regular\" />\n )}\n </Button>\n );\n}\n\n/**\n * Breadcrumbs component props.\n *\n * @example\n * ```tsx\n * <Breadcrumbs>\n * <Breadcrumbs.Link href=\"/\">Home</Breadcrumbs.Link>\n * <Breadcrumbs.Separator />\n * <Breadcrumbs.Link href=\"/docs\">Docs</Breadcrumbs.Link>\n * <Breadcrumbs.Separator />\n * <Breadcrumbs.Current>Current Page</Breadcrumbs.Current>\n * </Breadcrumbs>\n * ```\n */\nexport interface BreadcrumbsProps\n extends PropsWithChildren,\n KumoBreadcrumbsVariantsProps {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n}\n\n/**\n * Navigation breadcrumb trail showing the current page's location in a hierarchy.\n * Compound component with `Breadcrumbs.Link`, `Breadcrumbs.Current`, `Breadcrumbs.Separator`, and `Breadcrumbs.Clipboard`.\n *\n * @example\n * ```tsx\n * <Breadcrumbs>\n * <Breadcrumbs.Link href=\"/\">Home</Breadcrumbs.Link>\n * <Breadcrumbs.Separator />\n * <Breadcrumbs.Current>Dashboard</Breadcrumbs.Current>\n * </Breadcrumbs>\n * ```\n */\nexport function Breadcrumb({\n children,\n size = \"base\",\n className,\n}: BreadcrumbsProps) {\n const childArray = Children.toArray(children);\n const mobileChildren = getMobileBreadcrumbChildren(childArray);\n\n return (\n <nav\n className={cn(breadcrumbsVariants({ size }), className)}\n aria-label=\"breadcrumb\"\n >\n <div className=\"contents sm:hidden\">{mobileChildren}</div>\n <div className=\"hidden sm:contents\">{childArray}</div>\n </nav>\n );\n}\n\nfunction isComponentElement(\n child: ReactNode,\n component: unknown,\n): child is ReactElement {\n return isValidElement(child) && child.type === component;\n}\n\nfunction getMobileBreadcrumbChildren(children: ReactNode[]): ReactNode[] {\n const breadcrumbItems = children.filter(\n (child) =>\n isComponentElement(child, Link) || isComponentElement(child, Current),\n ) as ReactElement[];\n\n if (breadcrumbItems.length <= 2) {\n return children;\n }\n\n const [parentItem, currentItem] = breadcrumbItems.slice(-2);\n const trailingItems: ReactNode[] = [\n <MobileEllipsis key=\"kumo-breadcrumb-mobile-ellipsis\" />,\n <Separator key=\"kumo-breadcrumb-mobile-separator-leading\" />,\n cloneElement(parentItem, { key: \"kumo-breadcrumb-mobile-parent\" }),\n <Separator key=\"kumo-breadcrumb-mobile-separator-trailing\" />,\n cloneElement(currentItem, { key: \"kumo-breadcrumb-mobile-current\" }),\n ];\n\n const extras = children.filter(\n (child) =>\n !isComponentElement(child, Link) &&\n !isComponentElement(child, Current) &&\n !isComponentElement(child, Separator),\n );\n\n return [...trailingItems, ...extras];\n}\n\nBreadcrumb.Link = Link;\nBreadcrumb.Current = Current;\nBreadcrumb.Separator = Separator;\nBreadcrumb.Clipboard = Clipboard;\n"],"names":["KUMO_BREADCRUMBS_VARIANTS","KUMO_BREADCRUMBS_DEFAULT_VARIANTS","breadcrumbsVariants","size","cn","Link","href","icon","children","LinkComponent","useLinkComponent","jsxs","jsx","Current","loading","SkeletonLine","Separator","MobileEllipsis","Clipboard","text","isCopied","setIsCopied","useState","useEffect","timeoutId","Button","err","CheckIcon","CopyIcon","Breadcrumb","className","childArray","Children","mobileChildren","getMobileBreadcrumbChildren","isComponentElement","child","component","isValidElement","breadcrumbItems","parentItem","currentItem","trailingItems","cloneElement","extras"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"button-6by9ntsa3nj553mq.js","sources":["../../src/components/button/button.tsx"],"sourcesContent":["import React from \"react\";\nimport { ArrowsClockwise, type Icon } from \"@phosphor-icons/react\";\nimport { Loader } from \"../loader/loader\";\nimport { Tooltip } from \"../tooltip/tooltip\";\nimport { cn } from \"../../utils/cn\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\n\n/** Button variant definitions mapping shape, size, and variant names to their Tailwind classes. */\nexport const KUMO_BUTTON_VARIANTS = {\n shape: {\n base: {\n classes: \"\",\n description: \"Default rectangular button shape\",\n },\n square: {\n classes: \"items-center justify-center p-0\",\n description: \"Square button for icon-only actions\",\n },\n circle: {\n classes: \"items-center justify-center p-0 rounded-full\",\n description: \"Circular button for icon-only actions\",\n },\n },\n size: {\n xs: {\n classes: \"h-5 gap-1 rounded-sm px-1.5 text-xs\",\n description: \"Extra small button for compact UIs\",\n },\n sm: {\n classes: \"h-6.5 gap-1 rounded-md px-2 text-xs\",\n description: \"Small button for secondary actions\",\n },\n base: {\n classes: \"h-9 gap-1.5 rounded-lg px-3 text-base\",\n description: \"Default button size\",\n },\n lg: {\n classes: \"h-10 gap-2 rounded-lg px-4 text-base\",\n description: \"Large button for primary CTAs\",\n },\n },\n compactSize: {\n xs: { classes: \"size-3.5\" },\n sm: { classes: \"size-6.5\" },\n base: { classes: \"size-9\" },\n lg: { classes: \"size-10\" },\n },\n variant: {\n primary: {\n classes:\n \"bg-kumo-brand !text-white hover:bg-kumo-brand-hover disabled:bg-kumo-brand/50\",\n description: \"High-emphasis button for primary actions\",\n },\n secondary: {\n classes:\n \"bg-kumo-base !text-kumo-default ring not-disabled:hover:bg-kumo-tint disabled:bg-kumo-base/50 disabled:!text-kumo-default/70 ring-kumo-hairline data-[state=open]:bg-kumo-base\",\n description: \"Default button style for most actions\",\n },\n ghost: {\n classes: \"text-kumo-default hover:bg-kumo-tint shadow-none bg-inherit\",\n description: \"Minimal button with no background\",\n },\n destructive: {\n classes: \"bg-kumo-danger !text-white hover:bg-kumo-danger/70\",\n description: \"Danger button for destructive actions like delete\",\n },\n \"secondary-destructive\": {\n classes:\n \"bg-kumo-base !text-kumo-danger ring not-disabled:hover:bg-kumo-base disabled:bg-kumo-base/50 disabled:!text-kumo-danger/70 ring-kumo-hairline data-[state=open]:bg-kumo-base\",\n description:\n \"Secondary button with destructive text for less prominent dangerous actions\",\n },\n outline: {\n classes: \"bg-transparent text-kumo-default ring ring-kumo-hairline\",\n description: \"Bordered button with transparent background\",\n },\n },\n} as const;\n\nexport const KUMO_BUTTON_DEFAULT_VARIANTS = {\n shape: \"base\",\n size: \"base\",\n variant: \"secondary\",\n} as const;\n\n// Derived types from KUMO_BUTTON_VARIANTS\nexport type KumoButtonShape = keyof typeof KUMO_BUTTON_VARIANTS.shape;\nexport type KumoButtonSize = keyof typeof KUMO_BUTTON_VARIANTS.size;\nexport type KumoButtonVariant = keyof typeof KUMO_BUTTON_VARIANTS.variant;\n\nexport interface KumoButtonVariantsProps {\n /**\n * Button shape.\n * - `\"base\"` — Default rectangular button\n * - `\"square\"` — Square button for icon-only actions\n * - `\"circle\"` — Circular button for icon-only actions\n * @default \"base\"\n */\n shape?: KumoButtonShape;\n /**\n * Button size.\n * - `\"xs\"` — Extra small for compact UIs\n * - `\"sm\"` — Small for secondary actions\n * - `\"base\"` — Default size\n * - `\"lg\"` — Large for primary CTAs\n * @default \"base\"\n */\n size?: KumoButtonSize;\n /**\n * Visual style of the button.\n * - `\"primary\"` — High-emphasis, brand-colored for primary actions\n * - `\"secondary\"` — Default style with border for most actions\n * - `\"ghost\"` — Minimal, no background for tertiary actions\n * - `\"destructive\"` — Danger button for destructive actions\n * - `\"secondary-destructive\"` — Secondary style with destructive text\n * - `\"outline\"` — Bordered with transparent background\n * @default \"secondary\"\n */\n variant?: KumoButtonVariant;\n}\n\nexport function buttonVariants({\n variant = KUMO_BUTTON_DEFAULT_VARIANTS.variant,\n size = KUMO_BUTTON_DEFAULT_VARIANTS.size,\n shape = KUMO_BUTTON_DEFAULT_VARIANTS.shape,\n}: KumoButtonVariantsProps = {}) {\n const isCompactShape = shape === \"square\" || shape === \"circle\";\n\n return cn(\n // Base styles\n \"group flex w-max shrink-0 items-center font-medium select-none\",\n \"border-0 shadow-xs\",\n \"focus:outline-none focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n \"cursor-pointer\",\n // Disabled state\n \"disabled:cursor-not-allowed disabled:text-kumo-subtle\",\n // Apply variant, size, shape styles from KUMO_BUTTON_VARIANTS\n KUMO_BUTTON_VARIANTS.variant[variant].classes,\n KUMO_BUTTON_VARIANTS.size[size].classes,\n KUMO_BUTTON_VARIANTS.shape[shape].classes,\n isCompactShape && KUMO_BUTTON_VARIANTS.compactSize[size].classes,\n );\n}\n\n// Normalize icon prop to support both React elements and component types\nconst renderIconNode = (IconComponent?: Icon | React.ReactNode) => {\n if (!IconComponent) return null;\n if (React.isValidElement(IconComponent)) return IconComponent;\n const Comp = IconComponent as React.ComponentType<Record<string, unknown>>;\n return <Comp />;\n};\n\n/**\n * Button component props.\n *\n * Uses a discriminated union on `shape` so that icon-only buttons\n * (`shape=\"square\"` or `shape=\"circle\"`) require an `aria-label`.\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\">Save</Button>\n * <Button variant=\"secondary\" shape=\"square\" icon={PlusIcon} aria-label=\"Add\" />\n * <Button variant=\"destructive\" loading>Deleting...</Button>\n * ```\n */\ntype ButtonBaseProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n /** Content rendered inside the button. */\n children?: React.ReactNode;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Icon from `@phosphor-icons/react` or a React element. Rendered before children. */\n icon?: Icon | React.ReactNode;\n /** Shows a loading spinner and disables interaction. */\n loading?: boolean;\n /** When set, wraps the button in a Tooltip with this content. */\n title?: React.ReactNode;\n};\n\ntype ButtonWithTextProps = ButtonBaseProps & {\n shape?: \"base\";\n size?: KumoButtonSize;\n variant?: KumoButtonVariant;\n};\n\ntype IconOnlyButtonProps = ButtonBaseProps & {\n shape: \"square\" | \"circle\";\n size?: KumoButtonSize;\n variant?: KumoButtonVariant;\n /** Required for icon-only buttons to provide accessible label for screen readers */\n \"aria-label\": string;\n};\n\nexport type ButtonProps = ButtonWithTextProps | IconOnlyButtonProps;\n\n/**\n * LinkButton component props — renders an anchor styled as a button.\n *\n * @example\n * ```tsx\n * <LinkButton href=\"/docs\" variant=\"ghost\" icon={BookIcon}>Docs</LinkButton>\n * <LinkButton href=\"https://example.com\" external>Visit Site</LinkButton>\n * ```\n */\nexport type LinkButtonProps = React.AnchorHTMLAttributes<HTMLAnchorElement> &\n KumoButtonVariantsProps & {\n /** Content rendered inside the link button. */\n children?: React.ReactNode;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Icon from `@phosphor-icons/react` or a React element. Rendered before children. */\n icon?: Icon | React.ReactNode;\n /** When `true`, opens in a new tab with `rel=\"noopener noreferrer\"`. */\n external?: boolean;\n linksExternal?: boolean;\n };\n\n/**\n * Primary action trigger. Supports multiple variants, sizes, shapes, icons, and loading state.\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\">Save</Button>\n * <Button variant=\"secondary\" icon={PlusIcon}>Create Worker</Button>\n * ```\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n children,\n className,\n disabled,\n loading,\n shape = \"base\",\n size = \"base\",\n variant = \"secondary\",\n icon: IconComponent,\n title,\n ...props\n },\n ref,\n ) => {\n const { type, ...restProps } = props;\n const button = (\n <button\n ref={ref}\n className={cn(\n buttonVariants({ variant, size, shape }),\n disabled && \"cursor-not-allowed opacity-50\",\n className,\n )}\n disabled={loading || disabled}\n type={type ?? \"button\"}\n {...restProps}\n >\n {loading && <Loader size={size === \"lg\" ? 16 : 14} />}\n {!loading && renderIconNode(IconComponent)}\n\n {children}\n </button>\n );\n\n if (title) {\n return <Tooltip content={title} render={button} />;\n }\n\n return button;\n },\n);\n\nButton.displayName = \"Button\";\n\n/**\n * Square button with a rotating arrows icon, used to trigger data refresh actions.\n *\n * @example\n * ```tsx\n * <RefreshButton loading={isRefreshing} onClick={refresh} />\n * ```\n */\nexport const RefreshButton = ({\n \"aria-label\": ariaLabel = \"Refresh\",\n loading,\n ...props\n}: ButtonProps) => (\n <Button shape=\"square\" aria-label={ariaLabel} {...props}>\n <ArrowsClockwise\n className={cn({\n \"animate-refresh\": loading,\n \"size-4.5\": props.size === \"base\" || !props.size,\n \"size-4\": props.size === \"sm\",\n \"size-5\": props.size === \"lg\",\n })}\n />\n </Button>\n);\n\n/**\n * Anchor element styled as a button. Integrates with `LinkProvider` for framework routing.\n *\n * @example\n * ```tsx\n * <LinkButton href=\"/settings\" variant=\"ghost\">Settings</LinkButton>\n * ```\n */\nexport const LinkButton = React.forwardRef<HTMLAnchorElement, LinkButtonProps>(\n (\n {\n children,\n className,\n external,\n href,\n shape = \"base\",\n size = \"base\",\n variant = \"ghost\",\n icon: IconComponent,\n // linksExternal = false,\n ...props\n },\n ref,\n ) => {\n const LinkComponent = useLinkComponent();\n const externalProps = external\n ? { target: \"_blank\", rel: \"noopener noreferrer\" }\n : {};\n\n return (\n <LinkComponent\n ref={ref}\n className={cn(\n buttonVariants({ variant, size, shape }),\n \"flex items-center no-underline!\",\n className,\n )}\n href={href}\n to={typeof href === \"string\" ? href : undefined}\n {...externalProps}\n {...props}\n >\n {renderIconNode(IconComponent)}\n {children}\n </LinkComponent>\n );\n },\n);\n\nLinkButton.displayName = \"LinkButton\";\n"],"names":["KUMO_BUTTON_VARIANTS","KUMO_BUTTON_DEFAULT_VARIANTS","buttonVariants","variant","size","shape","isCompactShape","cn","renderIconNode","IconComponent","React","Button","children","className","disabled","loading","title","props","ref","type","restProps","button","jsxs","Loader","jsx","Tooltip","RefreshButton","ariaLabel","ArrowsClockwise","LinkButton","external","href","LinkComponent","useLinkComponent","externalProps"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox-hvxfvhtx1qjo2mww.js","sources":["../../src/components/checkbox/checkbox.tsx"],"sourcesContent":["import { forwardRef, createContext, useContext, type ReactNode } from \"react\";\nimport { CheckIcon, MinusIcon } from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\nimport { Fieldset } from \"@base-ui/react/fieldset\";\nimport { Field as FieldBase } from \"@base-ui/react/field\";\nimport { CheckboxGroup as BaseCheckboxGroup } from \"@base-ui/react/checkbox-group\";\nimport { Checkbox as BaseCheckbox } from \"@base-ui/react/checkbox\";\n\n/** Event details passed to onCheckedChange callback. Re-exported from Base UI. */\nexport type CheckboxChangeEventDetails = Parameters<\n NonNullable<BaseCheckbox.Root.Props[\"onCheckedChange\"]>\n>[1];\n\n/** Checkbox variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_CHECKBOX_VARIANTS = {\n variant: {\n default: {\n classes:\n \"[&:focus-within>span]:ring-kumo-focus [&:hover>span]:ring-kumo-hairline\",\n description: \"Default checkbox appearance\",\n },\n error: {\n classes: \"[&>span]:ring-kumo-danger\",\n description: \"Error state for validation failures\",\n },\n },\n} as const;\n\nexport const KUMO_CHECKBOX_DEFAULT_VARIANTS = {\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_CHECKBOX_VARIANTS\nexport type KumoCheckboxVariant = keyof typeof KUMO_CHECKBOX_VARIANTS.variant;\n\nexport interface KumoCheckboxVariantsProps {\n /**\n * Visual variant.\n * - `\"default\"` — Standard checkbox appearance\n * - `\"error\"` — Error state for validation failures\n * @default \"default\"\n */\n variant?: KumoCheckboxVariant;\n}\n\nexport function checkboxVariants({\n variant = KUMO_CHECKBOX_DEFAULT_VARIANTS.variant,\n}: KumoCheckboxVariantsProps = {}) {\n return cn(KUMO_CHECKBOX_VARIANTS.variant[variant].classes);\n}\n\n// Legacy type alias for backwards compatibility\nexport type CheckboxVariant = KumoCheckboxVariant;\n\n// Context for passing controlFirst from Group to Items\nconst CheckboxGroupContext = createContext<{ controlFirst: boolean }>({\n controlFirst: true,\n});\n\n/**\n * Single checkbox component props with accessibility guidance.\n *\n * **Accessible Name Required:** Checkbox should have one of:\n * 1. `label` prop (recommended) - built-in Field wrapper with horizontal layout\n * 2. `aria-label` - for checkboxes without visible label\n * 3. `aria-labelledby` - for custom label association\n *\n * **Note:** When used inside Checkbox.Group or Dropdown, label is optional (parent provides context).\n *\n * Missing accessible names will trigger console warnings in development (unless inside a group).\n *\n * @example\n * // Recommended: Built-in Field wrapper with label\n * <Checkbox label=\"Accept terms and conditions\" />\n *\n * @example\n * // Control-first layout (checkbox before label)\n * <Checkbox label=\"Remember me\" controlFirst={true} />\n *\n * @example\n * // Label-first layout (label before checkbox)\n * <Checkbox label=\"Enable notifications\" controlFirst={false} />\n *\n * @example\n * // Error variant (visual only, no error text for single checkboxes)\n * <Checkbox label=\"Required field\" variant=\"error\" />\n *\n * @example\n * // Without visible label (aria-label required)\n * <Checkbox aria-label=\"Select all items\" />\n *\n * @example\n * // Custom label association\n * <label id=\"terms-label\">I accept the terms</label>\n * <Checkbox aria-labelledby=\"terms-label\" />\n *\n * @example\n * // Inside Checkbox.Group (label optional)\n * <Checkbox.Group legend=\"Preferences\">\n * <Checkbox.Item value=\"email\" label=\"Email notifications\" />\n * <Checkbox.Item value=\"sms\" label=\"SMS notifications\" />\n * </Checkbox.Group>\n */\nexport type CheckboxProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures (visual only, no error text) */\n variant?: CheckboxVariant;\n /** Label content for the checkbox (enables built-in Field wrapper) - can be a string or any React node */\n label?: ReactNode;\n /** Tooltip content to display next to the label via an info icon */\n labelTooltip?: ReactNode;\n /** When true (default), checkbox appears before label. When false, label appears before checkbox. */\n controlFirst?: boolean;\n /** Whether the checkbox is checked (controlled) */\n checked?: boolean;\n /** Whether the checkbox is in indeterminate state */\n indeterminate?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Callback when the checked state changes */\n onCheckedChange?: BaseCheckbox.Root.Props[\"onCheckedChange\"];\n /** Name for form submission */\n name?: string;\n /** Whether the field is required */\n required?: boolean;\n /** Additional class name */\n className?: string;\n /** Accessible label when no visible label is provided */\n \"aria-label\"?: string;\n /** ID of element that labels this checkbox */\n \"aria-labelledby\"?: string;\n};\n\n/**\n * Checkbox group component props (with built-in Fieldset and CheckboxGroup)\n *\n * Usage:\n * ```tsx\n * <Checkbox.Group\n * legend=\"Choose preferences\"\n * defaultValue={['email']}\n * error=\"You must select at least one option\"\n * >\n * <Checkbox.Item label=\"Email notifications\" value=\"email\" />\n * <Checkbox.Item label=\"SMS notifications\" value=\"sms\" />\n * </Checkbox.Group>\n * ```\n */\n/**\n * Props for Checkbox.Legend — a composable sub-component for labeling a Checkbox.Group.\n *\n * Place as a direct child of `<Checkbox.Group>` to provide a styled, accessible legend.\n * Accepts `className` for full styling control (e.g. `className=\"sr-only\"` to visually hide).\n *\n * @example\n * ```tsx\n * <Checkbox.Group>\n * <Checkbox.Legend className=\"sr-only\">Preferences</Checkbox.Legend>\n * <Checkbox.Item label=\"Email\" value=\"email\" />\n * </Checkbox.Group>\n * ```\n */\nexport interface CheckboxLegendProps {\n /** Legend content */\n children: ReactNode;\n /** Additional CSS classes (e.g. \"sr-only\" to visually hide the legend) */\n className?: string;\n}\n\nexport interface CheckboxGroupProps {\n /**\n * Legend text for the group.\n * For more control over legend styling, omit this prop and use `<Checkbox.Legend>` as a child instead.\n */\n legend?: string;\n /** Child Checkbox.Item components (and optionally a Checkbox.Legend) */\n children: ReactNode;\n /** Error message for the group (only appears in groups, not single checkboxes) */\n error?: string;\n /** Helper text for the group */\n description?: ReactNode;\n /** Values of checkboxes that should be initially checked (uncontrolled) */\n defaultValue?: string[];\n /** Values of checkboxes that should be checked (controlled) */\n value?: string[];\n /** Event handler called when checkbox values change */\n onValueChange?: (value: string[]) => void;\n /** All possible checkbox values (required for parent checkbox pattern) */\n allValues?: string[];\n /** Whether all checkboxes in the group are disabled */\n disabled?: boolean;\n /** When true (default), checkbox appears before label. When false, label appears before checkbox. */\n controlFirst?: boolean;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Individual checkbox item within a group\n */\nexport type CheckboxItemProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures */\n variant?: CheckboxVariant;\n /** Label text displayed next to checkbox */\n label: string;\n /** Value of the checkbox (required when used in Checkbox.Group) */\n value?: string;\n /** Additional CSS classes for the label wrapper */\n className?: string;\n checked?: boolean;\n indeterminate?: boolean;\n disabled?: boolean;\n /** Callback when the checked state changes */\n onCheckedChange?: BaseCheckbox.Root.Props[\"onCheckedChange\"];\n name?: string;\n};\n\n// Single checkbox with built-in Field\nconst CheckboxBase = forwardRef<HTMLButtonElement, CheckboxProps>(\n (\n {\n className,\n checked,\n indeterminate,\n disabled,\n variant = \"default\",\n label,\n labelTooltip,\n controlFirst = true,\n onCheckedChange,\n required,\n name,\n ...props\n },\n ref,\n ) => {\n // A11y enforcement: warn in dev if no accessible name provided\n if (process.env.NODE_ENV !== \"production\") {\n const hasLabel = Boolean(label);\n const hasAriaLabel = Boolean(props[\"aria-label\"]);\n const hasAriaLabelledBy = Boolean(props[\"aria-labelledby\"]);\n\n if (!hasLabel && !hasAriaLabel && !hasAriaLabelledBy) {\n console.warn(\n \"[Kumo Checkbox]: Checkbox must have an accessible name. Provide either:\\n\" +\n \" - label prop: <Checkbox label='Accept terms' />\\n\" +\n \" - aria-label: <Checkbox aria-label='Select item' />\\n\" +\n \" - aria-labelledby for custom label association\\n\" +\n \" Note: When used inside Checkbox.Group, label is optional\",\n );\n }\n }\n\n const checkboxControl = (\n <BaseCheckbox.Root\n ref={ref}\n name={name}\n checked={checked}\n indeterminate={indeterminate}\n disabled={disabled}\n onCheckedChange={onCheckedChange}\n className={cn(\n \"relative flex h-4 w-4 items-center justify-center rounded-sm border-0 bg-kumo-base ring focus:outline-none after:absolute after:-inset-x-3 after:-inset-y-2\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-hairline\",\n !disabled &&\n \"hover:ring-kumo-hairline focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n \"data-[checked]:bg-kumo-contrast data-[checked]:ring-kumo-contrast data-[indeterminate]:bg-kumo-contrast data-[indeterminate]:ring-kumo-contrast\",\n disabled && \"cursor-not-allowed opacity-50\",\n className,\n )}\n {...props}\n >\n <BaseCheckbox.Indicator\n keepMounted\n className=\"flex items-center justify-center text-kumo-inverse data-[unchecked]:invisible\"\n render={(renderProps, state) => (\n <span {...renderProps}>\n {state.indeterminate ? (\n <MinusIcon weight=\"bold\" size={12} />\n ) : (\n <CheckIcon weight=\"bold\" size={12} />\n )}\n </span>\n )}\n />\n </BaseCheckbox.Root>\n );\n\n // If no label provided, return bare checkbox (for use in other components like Dropdown)\n if (!label) {\n return checkboxControl;\n }\n\n // Use Field.Root + Field.Label enclosing pattern for proper a11y association\n // See: https://base-ui.com/react/components/field\n return (\n <FieldBase.Root className=\"inline-flex\">\n <FieldBase.Label\n className={cn(\n \"!m-0 !min-h-0 !text-base inline-flex items-center gap-2\",\n controlFirst ? \"flex-row\" : \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed\" : \"cursor-pointer\",\n )}\n >\n {checkboxControl}\n <Label\n showOptional={required === false}\n tooltip={labelTooltip}\n asContent\n >\n {label}\n </Label>\n </FieldBase.Label>\n </FieldBase.Root>\n );\n },\n);\n\nCheckboxBase.displayName = \"Checkbox\";\n\n// Checkbox.Item for use within Checkbox.Group\nconst CheckboxItem = forwardRef<HTMLButtonElement, CheckboxItemProps>(\n (\n {\n className,\n checked,\n indeterminate,\n disabled,\n variant = \"default\",\n label,\n value,\n onCheckedChange,\n name,\n },\n ref,\n ) => {\n const { controlFirst } = useContext(CheckboxGroupContext);\n\n return (\n <label\n className={cn(\n \"m-0 relative inline-flex items-center gap-2\",\n // Control first (default): checkbox before label\n // Label first: label before checkbox using flex-row-reverse\n !controlFirst && \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\",\n className,\n )}\n >\n <BaseCheckbox.Root\n ref={ref}\n value={value}\n name={name}\n checked={checked}\n indeterminate={indeterminate}\n disabled={disabled}\n onCheckedChange={onCheckedChange}\n className={cn(\n \"peer relative flex h-4 w-4 items-center justify-center rounded-sm border-0 bg-kumo-base ring after:absolute after:-inset-x-3 after:-inset-y-2\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-hairline\",\n !disabled &&\n \"group-hover:ring-kumo-hairline hover:ring-kumo-hairline focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n \"data-[checked]:bg-kumo-contrast data-[checked]:ring-kumo-contrast data-[indeterminate]:bg-kumo-contrast data-[indeterminate]:ring-kumo-contrast\",\n )}\n >\n <BaseCheckbox.Indicator\n keepMounted\n className=\"flex items-center justify-center text-kumo-inverse data-[unchecked]:invisible\"\n render={(renderProps, state) => (\n <span {...renderProps}>\n {state.indeterminate ? (\n <MinusIcon weight=\"bold\" size={12} />\n ) : (\n <CheckIcon weight=\"bold\" size={12} />\n )}\n </span>\n )}\n />\n </BaseCheckbox.Root>\n <span className=\"text-base text-kumo-default\">{label}</span>\n </label>\n );\n },\n);\n\nCheckboxItem.displayName = \"Checkbox.Item\";\n\n// Checkbox.Legend — composable legend sub-component for Checkbox.Group\nfunction CheckboxLegend({ children, className }: CheckboxLegendProps) {\n return (\n <Fieldset.Legend\n className={cn(\"text-base font-medium text-kumo-default\", className)}\n >\n {children}\n </Fieldset.Legend>\n );\n}\n\nCheckboxLegend.displayName = \"Checkbox.Legend\";\n\n// Checkbox.Group with built-in Fieldset and CheckboxGroup\nfunction CheckboxGroup({\n legend,\n children,\n error,\n description,\n defaultValue,\n value,\n onValueChange,\n allValues,\n disabled,\n controlFirst = true,\n className,\n}: CheckboxGroupProps) {\n return (\n <CheckboxGroupContext.Provider value={{ controlFirst }}>\n <BaseCheckboxGroup\n defaultValue={defaultValue}\n value={value}\n onValueChange={onValueChange}\n allValues={allValues}\n disabled={disabled}\n >\n <Fieldset.Root className={cn(\"flex flex-col gap-4\", className)}>\n {legend && (\n <Fieldset.Legend className=\"text-base font-medium text-kumo-default\">\n {legend}\n </Fieldset.Legend>\n )}\n <div className=\"flex flex-col gap-2\">{children}</div>\n {error && <p className=\"text-sm text-kumo-danger\">{error}</p>}\n {description && (\n <p className=\"text-sm text-kumo-subtle\">{description}</p>\n )}\n </Fieldset.Root>\n </BaseCheckboxGroup>\n </CheckboxGroupContext.Provider>\n );\n}\n\n// Compound component\nexport const Checkbox = Object.assign(CheckboxBase, {\n Item: CheckboxItem,\n Group: CheckboxGroup,\n Legend: CheckboxLegend,\n});\n\nCheckbox.displayName = \"Checkbox\";\n"],"names":["KUMO_CHECKBOX_VARIANTS","KUMO_CHECKBOX_DEFAULT_VARIANTS","CheckboxGroupContext","createContext","CheckboxBase","forwardRef","className","checked","indeterminate","disabled","variant","label","labelTooltip","controlFirst","onCheckedChange","required","name","props","ref","hasLabel","hasAriaLabel","hasAriaLabelledBy","checkboxControl","jsx","BaseCheckbox.Root","cn","BaseCheckbox.Indicator","renderProps","state","MinusIcon","CheckIcon","FieldBase.Root","jsxs","FieldBase.Label","Label","CheckboxItem","value","useContext","CheckboxLegend","children","Fieldset.Legend","CheckboxGroup","legend","error","description","defaultValue","onValueChange","allValues","BaseCheckboxGroup","Fieldset.Root","Checkbox"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"clipboard-text-hswydzx3iql369sd.js","sources":["../../src/components/clipboard-text/clipboard-text.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { forwardRef, useCallback, useRef, useState } from \"react\";\nimport { Toast } from \"@base-ui/react/toast\";\nimport { Tooltip } from \"@base-ui/react/tooltip\";\nimport { Button } from \"../button\";\nimport { inputVariants } from \"../input\";\nimport { cn } from \"../../utils/cn\";\n\n// Create a toast manager for anchored \"Copied\" toasts\nconst clipboardToastManager = Toast.createToastManager();\n\n/** ClipboardText size variant definitions mapping sizes to their Tailwind classes. */\nexport const KUMO_CLIPBOARD_TEXT_VARIANTS = {\n size: {\n sm: {\n classes: \"text-xs\",\n buttonSize: \"sm\" as const,\n description: \"Small clipboard text for compact UIs\",\n },\n base: {\n classes: \"text-sm\",\n buttonSize: \"base\" as const,\n description: \"Default clipboard text size\",\n },\n lg: {\n classes: \"text-sm\",\n buttonSize: \"lg\" as const,\n description: \"Large clipboard text for prominent display\",\n },\n },\n} as const;\n\nexport const KUMO_CLIPBOARD_TEXT_DEFAULT_VARIANTS = {\n size: \"lg\",\n} as const;\n\nconst clipboardTextAnimations = {\n slide: {\n initial:\n \"pointer-events-none absolute inset-0 flex items-center justify-center opacity-0 translate-y-full\",\n animate: \"translate-y-0 opacity-100\",\n end: \"pointer-events-none absolute inset-0 flex items-center justify-center opacity-0 -translate-y-full\",\n },\n} as const;\n\n// Derived types from KUMO_CLIPBOARD_TEXT_VARIANTS\nexport type KumoClipboardTextSize =\n keyof typeof KUMO_CLIPBOARD_TEXT_VARIANTS.size;\n\nexport interface KumoClipboardTextVariantsProps {\n /**\n * Size of the clipboard text field.\n * - `\"sm\"` — Small clipboard text for compact UIs\n * - `\"base\"` — Default clipboard text size\n * - `\"lg\"` — Large clipboard text for prominent display\n * @default \"lg\"\n */\n size?: KumoClipboardTextSize;\n}\n\nexport function clipboardTextVariants({\n size = KUMO_CLIPBOARD_TEXT_DEFAULT_VARIANTS.size,\n}: KumoClipboardTextVariantsProps = {}) {\n return cn(\n // Base styles\n \"flex items-center overflow-hidden bg-kumo-base px-0 font-mono\",\n // Apply size styles from KUMO_CLIPBOARD_TEXT_VARIANTS\n KUMO_CLIPBOARD_TEXT_VARIANTS.size[size].classes,\n );\n}\n\n// Legacy type alias for backwards compatibility\nexport type ClipboardTextSize = KumoClipboardTextSize;\n\n/**\n * ClipboardText component props.\n *\n * @example\n * ```tsx\n * <ClipboardText text=\"sk_live_abc123\" />\n * <ClipboardText text=\"npm install @cloudflare/kumo\" size=\"sm\" />\n * ```\n */\nexport interface ClipboardTextProps extends KumoClipboardTextVariantsProps {\n /** The text to display and copy to clipboard. */\n text: string;\n /** If provided, this text will be copied to clipboard instead of the `text` prop. */\n textToCopy?: string;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Callback fired after text is copied to clipboard. */\n onCopy?: () => void;\n /**\n * Tooltip config. Shows tooltip on hover, anchored toast on click.\n * @example\n * ```tsx\n * <ClipboardText\n * text=\"abc123\"\n * tooltip={{ text: \"Copy\", copiedText: \"Copied!\", side: \"top\" }}\n * />\n * ```\n */\n tooltip?: {\n /** Text shown in tooltip on hover. @default \"Copy\" */\n text?: string;\n /** Text shown in toast after copying. @default \"Copied\" */\n copiedText?: string;\n /** Tooltip/toast placement. @default \"top\" */\n side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n };\n /** Accessible labels for i18n. */\n labels?: {\n /** @default \"Copy to clipboard\" */\n copyAction?: string;\n };\n}\n\n/**\n * Anchored toasts viewport - renders \"Copied\" toasts anchored to buttons\n */\nfunction AnchoredToasts() {\n const { toasts } = Toast.useToastManager();\n return (\n <Toast.Viewport className=\"pointer-events-none fixed inset-0 isolate\">\n {toasts.map((toast) => (\n <Toast.Positioner key={toast.id} toast={toast} className=\"absolute\">\n <Toast.Root\n toast={toast}\n className={cn(\n \"flex origin-[var(--transform-origin)] flex-col rounded-md bg-kumo-base px-3 py-1.5 text-xs text-kumo-default font-sans\",\n \"shadow-lg shadow-kumo-tip-shadow outline outline-kumo-fill\",\n )}\n >\n <Toast.Description />\n </Toast.Root>\n </Toast.Positioner>\n ))}\n </Toast.Viewport>\n );\n}\n\n/**\n * Internal wrapper that provides Toast context when tooltip is enabled.\n */\nfunction TooltipWrapper({ children }: { children: React.ReactNode }) {\n return (\n <Tooltip.Provider>\n <Toast.Provider toastManager={clipboardToastManager}>\n <AnchoredToasts />\n {children}\n </Toast.Provider>\n </Tooltip.Provider>\n );\n}\n\n/**\n * Read-only text field with a one-click copy-to-clipboard button.\n *\n * @example\n * ```tsx\n * <ClipboardText text=\"0c239dd2\" />\n * ```\n */\nexport const ClipboardText = forwardRef<HTMLDivElement, ClipboardTextProps>(\n (\n {\n text,\n textToCopy,\n className,\n size = KUMO_CLIPBOARD_TEXT_DEFAULT_VARIANTS.size,\n onCopy,\n tooltip,\n labels: { copyAction = \"Copy to clipboard\" } = {},\n },\n ref,\n ) => {\n const [copied, setCopied] = useState(false);\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n const sizeConfig = KUMO_CLIPBOARD_TEXT_VARIANTS.size[size];\n\n // Destructure tooltip config with defaults\n const {\n text: tooltipText = \"Copy\",\n copiedText = \"Copied\",\n side: tooltipSide = \"top\",\n } = tooltip ?? {};\n\n const copyToClipboard = useCallback(async () => {\n try {\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard &&\n typeof navigator.clipboard.writeText === \"function\"\n ) {\n await navigator.clipboard.writeText(textToCopy ?? text);\n } else if (typeof document !== \"undefined\") {\n // Fallback for older browsers\n const textarea = document.createElement(\"textarea\");\n textarea.value = textToCopy ?? text;\n textarea.setAttribute(\"readonly\", \"\");\n textarea.style.position = \"absolute\";\n textarea.style.left = \"-9999px\";\n document.body.appendChild(textarea);\n const selection = document.getSelection();\n const previousRange = selection?.rangeCount\n ? selection.getRangeAt(0)\n : null;\n textarea.select();\n try {\n document.execCommand(\"copy\");\n } finally {\n document.body.removeChild(textarea);\n if (previousRange) {\n selection?.removeAllRanges();\n selection?.addRange(previousRange);\n }\n }\n }\n\n setCopied(true);\n\n // Show anchored toast if tooltip mode is enabled\n if (tooltip) {\n clipboardToastManager.add({\n description: copiedText,\n positionerProps: {\n anchor: buttonRef.current,\n side: tooltipSide,\n sideOffset: 8,\n },\n timeout: 1500,\n onClose() {\n setCopied(false);\n },\n });\n } else {\n // Reset copied state after delay when no tooltip\n setTimeout(() => setCopied(false), 1500);\n }\n\n onCopy?.();\n } catch (error) {\n console.warn(\"Clipboard copy failed\", error);\n }\n }, [text, onCopy, tooltip, copiedText, tooltipSide]);\n\n const copyButton = (\n <Button\n ref={buttonRef}\n size={sizeConfig.buttonSize}\n variant=\"ghost\"\n className={cn(\n \"rounded-l-none rounded-r-[inherit] border-l! border-kumo-line! px-3 relative isolate overflow-hidden transition-all duration-200\",\n \"focus:ring-inset focus:ring-kumo-focus/50\",\n \"focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-kumo-brand\",\n )}\n onClick={copyToClipboard}\n aria-label={copyAction}\n >\n <span\n className={cn(\n \"flex items-center gap-1 transition-all duration-200\",\n copied\n ? clipboardTextAnimations.slide.animate\n : clipboardTextAnimations.slide.initial,\n )}\n >\n <CheckIcon />\n </span>\n <span\n className={cn(\n \"flex items-center justify-center transition-all duration-200\",\n copied\n ? clipboardTextAnimations.slide.end\n : clipboardTextAnimations.slide.animate,\n )}\n >\n <CopyIcon />\n </span>\n </Button>\n );\n\n return (\n <div\n ref={ref}\n className={cn(\n inputVariants({ size: sizeConfig.buttonSize }),\n clipboardTextVariants({ size }),\n className,\n )}\n >\n <span className=\"grow truncate ps-4 pe-2\">{text}</span>\n {tooltip ? (\n <TooltipWrapper>\n <Tooltip.Root\n disabled={copied}\n onOpenChange={(open, eventDetails) => {\n // Prevent tooltip from closing when button is clicked\n if (eventDetails.reason === \"trigger-press\") {\n eventDetails.cancel();\n }\n }}\n >\n <Tooltip.Trigger render={copyButton} />\n <Tooltip.Portal>\n <Tooltip.Positioner side={tooltipSide} sideOffset={8}>\n <Tooltip.Popup\n className={cn(\n \"flex origin-[var(--transform-origin)] flex-col rounded-md bg-kumo-base px-3 py-1.5 text-xs text-kumo-default\",\n \"shadow-lg shadow-kumo-tip-shadow outline outline-kumo-fill\",\n )}\n >\n {tooltipText}\n </Tooltip.Popup>\n </Tooltip.Positioner>\n </Tooltip.Portal>\n </Tooltip.Root>\n </TooltipWrapper>\n ) : (\n copyButton\n )}\n <span className=\"sr-only\" aria-live=\"polite\">\n {copied ? copiedText : \"\"}\n </span>\n </div>\n );\n },\n);\n\nClipboardText.displayName = \"ClipboardText\";\n"],"names":["clipboardToastManager","Toast.createToastManager","KUMO_CLIPBOARD_TEXT_VARIANTS","KUMO_CLIPBOARD_TEXT_DEFAULT_VARIANTS","clipboardTextAnimations","clipboardTextVariants","size","cn","AnchoredToasts","toasts","Toast.useToastManager","Toast.Viewport","toast","Toast.Positioner","jsx","Toast.Root","Toast.Description","TooltipWrapper","children","Tooltip.Provider","Toast.Provider","ClipboardText","forwardRef","text","textToCopy","className","onCopy","tooltip","copyAction","ref","copied","setCopied","useState","buttonRef","useRef","sizeConfig","tooltipText","copiedText","tooltipSide","copyToClipboard","useCallback","textarea","selection","previousRange","error","copyButton","jsxs","Button","CheckIcon","CopyIcon","inputVariants","Tooltip.Root","open","eventDetails","Tooltip.Trigger","Tooltip.Portal","Tooltip.Positioner","Tooltip.Popup"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"code-f9v1ikwhekqw274q.js","sources":["../../src/components/code/code.tsx"],"sourcesContent":["import { type CSSProperties } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Code language variant definitions. */\nexport const KUMO_CODE_VARIANTS = {\n lang: {\n ts: {\n classes: \"\",\n description: \"TypeScript code\",\n },\n tsx: {\n classes: \"\",\n description: \"TypeScript JSX code\",\n },\n jsonc: {\n classes: \"\",\n description: \"JSON with comments\",\n },\n bash: {\n classes: \"\",\n description: \"Shell/Bash commands\",\n },\n css: {\n classes: \"\",\n description: \"CSS styles\",\n },\n },\n} as const;\n\nexport const KUMO_CODE_DEFAULT_VARIANTS = {\n lang: \"ts\",\n} as const;\n\n/**\n * Styling metadata for Code component (for AI/Figma plugin consumption)\n */\nexport const KUMO_CODE_STYLING = {\n /** Base semantic tokens used */\n baseTokens: [\"text-kumo-subtle\"],\n /** Typography and layout */\n typography: {\n fontFamily: \"font-mono\",\n fontSize: \"text-sm\",\n lineHeight: \"leading-[20px]\",\n },\n /** Container dimensions */\n dimensions: {\n margin: \"m-0\",\n padding: \"p-0\",\n width: \"w-auto\",\n },\n /** Border and background */\n appearance: {\n borderRadius: \"rounded-none\",\n border: \"border-none\",\n background: \"bg-transparent\",\n },\n} as const;\n\n/**\n * Styling metadata for CodeBlock component (for AI/Figma plugin consumption)\n */\nexport const KUMO_CODEBLOCK_STYLING = {\n /** Base semantic tokens used */\n baseTokens: [\"bg-kumo-base\", \"border-kumo-fill\"],\n /** Container styling */\n container: {\n minWidth: \"min-w-0\",\n borderRadius: \"rounded-md\",\n border: \"border border-kumo-fill\",\n background: \"bg-kumo-base\",\n },\n /** Inner code element padding */\n innerPadding: \"[&>pre]:p-2.5\",\n /** Parsed dimensions */\n dimensions: {\n borderRadius: 6, // md = 6px\n padding: 10, // p-2.5 = 10px\n },\n} as const;\n\n// Derived types from KUMO_CODE_VARIANTS\nexport type KumoCodeLang = keyof typeof KUMO_CODE_VARIANTS.lang;\n\nexport interface KumoCodeVariantsProps {\n /**\n * Language hint for the code content.\n * - `\"ts\"` — TypeScript code\n * - `\"tsx\"` — TypeScript JSX code\n * - `\"jsonc\"` — JSON with comments\n * - `\"bash\"` — Shell/Bash commands\n * - `\"css\"` — CSS styles\n * @default \"ts\"\n */\n lang?: KumoCodeLang;\n}\n\nexport function codeVariants({\n lang = KUMO_CODE_DEFAULT_VARIANTS.lang,\n}: KumoCodeVariantsProps = {}) {\n return cn(\n // Base styles\n \"m-0 w-auto rounded-none border-none bg-transparent p-0 font-mono text-sm leading-[20px] text-kumo-subtle\",\n // Apply lang-specific styles (fallback to default if lang not in map)\n KUMO_CODE_VARIANTS.lang[lang]?.classes ??\n KUMO_CODE_VARIANTS.lang[KUMO_CODE_DEFAULT_VARIANTS.lang].classes,\n );\n}\n\n// Legacy type alias for backwards compatibility\nexport type CodeLang = KumoCodeLang;\n\n/** @deprecated Use CodeLang instead */\nexport type BundledLanguage = CodeLang;\n\n/**\n * Code component props.\n *\n * @example\n * ```tsx\n * <Code code=\"const x = 1;\" lang=\"ts\" />\n * <Code code=\"export API_KEY={{apiKey}}\" lang=\"bash\"\n * values={{ apiKey: { value: \"sk_live_123\", highlight: true } }}\n * />\n * ```\n */\nexport interface CodeProps extends KumoCodeVariantsProps {\n /** The code string to display. */\n code: string;\n /** Template values for `{{key}}` interpolation. Values with `highlight: true` are visually emphasized. */\n values?: Record<\n string,\n {\n value: string;\n highlight?: boolean;\n }\n >;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Inline styles. */\n style?: CSSProperties;\n}\n\n/**\n * Simple code component without syntax highlighting.\n *\n * Renders code in a monospace font with customizable language metadata.\n * For a bordered container version, use `Code.Block` or `CodeBlock`.\n *\n * **Styling:**\n * - Typography: `font-mono text-sm leading-[20px]`\n * - Colors: `text-kumo-subtle` with `bg-transparent`\n * - No borders or padding (use CodeBlock for styled container)\n * - Supports all semantic tokens via className prop\n *\n * @deprecated Use `CodeHighlighted` from `@cloudflare/kumo/code` for syntax highlighting.\n * This component will be removed in v2.0.\n *\n * @example Migration:\n * ```tsx\n * // Before\n * import { Code } from \"@cloudflare/kumo\";\n * <Code code=\"const x = 1;\" lang=\"ts\" />\n *\n * // After\n * import { ShikiProvider, CodeHighlighted } from \"@cloudflare/kumo/code\";\n * <ShikiProvider engine=\"javascript\" languages={['tsx']} themes={{ light: 'github-light', dark: 'github-dark' }}>\n * <CodeHighlighted code=\"const x = 1;\" lang=\"tsx\" />\n * </ShikiProvider>\n * ```\n */\nfunction CodeComponent({\n code,\n lang = KUMO_CODE_DEFAULT_VARIANTS.lang,\n className,\n style,\n}: CodeProps) {\n return (\n <pre className={cn(codeVariants({ lang }), className)} style={style}>\n {code}\n </pre>\n );\n}\n\nCodeComponent.displayName = \"Code\";\n\n/**\n * CodeBlock component props — code inside a bordered container.\n *\n * @example\n * ```tsx\n * <CodeBlock lang=\"tsx\" code={`const greeting = \"Hello!\";`} />\n * ```\n */\nexport interface CodeBlockProps {\n /** The code string to display. */\n code: string;\n /**\n * Language hint for the code content.\n * @default \"ts\"\n */\n lang?: CodeLang;\n}\n\n/**\n * Code block with border and background container.\n *\n * A styled wrapper around Code that adds a bordered container with surface background.\n * Useful for displaying code snippets with visual separation from surrounding content.\n *\n * **Styling:**\n * - Container: `min-w-0 rounded-md border border-kumo-fill bg-kumo-base`\n * - Inner padding: `p-2.5` (10px)\n * - Uses semantic tokens: `bg-kumo-base`, `border-kumo-fill`\n *\n * @deprecated Use `CodeHighlighted` from `@cloudflare/kumo/code` for syntax highlighting.\n * This component will be removed in v2.0.\n */\nfunction CodeBlockComponent({ code, lang }: CodeBlockProps) {\n return (\n <div className=\"min-w-0 rounded-md border border-kumo-fill bg-kumo-base [&>pre]:p-2.5!\">\n <CodeComponent lang={lang} code={code} />\n </div>\n );\n}\n\nCodeBlockComponent.displayName = \"CodeBlock\";\n\n// Export Code with Block sub-component (for registry detection)\nexport const Code = Object.assign(CodeComponent, {\n Block: CodeBlockComponent,\n});\n\n// Backward-compatible standalone export\nexport const CodeBlock = CodeBlockComponent;\n"],"names":["KUMO_CODE_VARIANTS","KUMO_CODE_DEFAULT_VARIANTS","codeVariants","lang","cn","CodeComponent","code","className","style","jsx","CodeBlockComponent","Code","CodeBlock"],"mappings":";;;AAIO,MAAMA,IAAqB;AAAA,EAChC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,KAAK;AAAA,MACH,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,KAAK;AAAA,MACH,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,MAAM;AACR;AAkEO,SAASC,EAAa;AAAA,EAC3B,MAAAC,IAAOF,EAA2B;AACpC,IAA2B,IAAI;AAC7B,SAAOG;AAAA;AAAA,IAEL;AAAA;AAAA,IAEAJ,EAAmB,KAAKG,CAAI,GAAG,WAC7BH,EAAmB,KAAKC,EAA2B,IAAI,EAAE;AAAA,EAAA;AAE/D;AAgEA,SAASI,EAAc;AAAA,EACrB,MAAAC;AAAA,EACA,MAAAH,IAAOF,EAA2B;AAAA,EAClC,WAAAM;AAAA,EACA,OAAAC;AACF,GAAc;AACZ,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWL,EAAGF,EAAa,EAAE,MAAAC,EAAA,CAAM,GAAGI,CAAS,GAAG,OAAAC,GACpD,UAAAF,EAAA,CACH;AAEJ;AAEAD,EAAc,cAAc;AAkC5B,SAASK,EAAmB,EAAE,MAAAJ,GAAM,MAAAH,KAAwB;AAC1D,SACE,gBAAAM,EAAC,SAAI,WAAU,0EACb,4BAACJ,GAAA,EAAc,MAAAF,GAAY,MAAAG,GAAY,EAAA,CACzC;AAEJ;AAEAI,EAAmB,cAAc;AAG1B,MAAMC,IAAO,OAAO,OAAON,GAAe;AAAA,EAC/C,OAAOK;AACT,CAAC,GAGYE,IAAYF;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"combobox-fq36ye0hstote16x.js","sources":["../../src/components/combobox/combobox.tsx"],"sourcesContent":["import { Combobox as ComboboxBase } from \"@base-ui/react/combobox\";\nimport { CaretDownIcon, CheckIcon, XIcon } from \"@phosphor-icons/react\";\nimport {\n Fragment,\n createContext,\n useContext,\n type PropsWithChildren,\n type ReactNode,\n} from \"react\";\nimport {\n inputVariants,\n KUMO_INPUT_VARIANTS,\n type KumoInputSize,\n} from \"../input/input\";\nimport { cn } from \"../../utils/cn\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Combobox variant definitions. */\nexport const KUMO_COMBOBOX_VARIANTS = {\n size: KUMO_INPUT_VARIANTS.size,\n inputSide: {\n right: {\n classes: \"\",\n description: \"Input positioned inline to the right of chips\",\n },\n top: {\n classes: \"\",\n description: \"Input positioned above chips\",\n },\n },\n} as const;\n\nexport const KUMO_COMBOBOX_DEFAULT_VARIANTS = {\n size: \"base\",\n inputSide: \"right\",\n} as const;\n\n// Context to pass size down to sub-components\nconst ComboboxSizeContext = createContext<KumoInputSize>(\"base\");\n\n// Derived types from KUMO_COMBOBOX_VARIANTS\nexport type KumoComboboxSize = keyof typeof KUMO_COMBOBOX_VARIANTS.size;\nexport type KumoComboboxInputSide =\n keyof typeof KUMO_COMBOBOX_VARIANTS.inputSide;\n\nexport interface KumoComboboxVariantsProps {\n /**\n * Size of the combobox trigger. Matches Input component sizes.\n * - `\"xs\"` — Extra small for compact UIs (h-5 / 20px)\n * - `\"sm\"` — Small for secondary fields (h-6.5 / 26px)\n * - `\"base\"` — Default size (h-9 / 36px)\n * - `\"lg\"` — Large for prominent fields (h-10 / 40px)\n * @default \"base\"\n */\n size?: KumoComboboxSize;\n /**\n * Position of the text input relative to chips in multi-select mode.\n * - `\"right\"` — Input inline to the right of chips\n * - `\"top\"` — Input above chips\n * @default \"right\"\n */\n inputSide?: KumoComboboxInputSide;\n}\n\nexport function comboboxVariants({\n inputSide = KUMO_COMBOBOX_DEFAULT_VARIANTS.inputSide,\n}: KumoComboboxVariantsProps = {}) {\n return cn(KUMO_COMBOBOX_VARIANTS.inputSide[inputSide].classes);\n}\n\n// Legacy type alias for backwards compatibility\nexport type ComboboxInputSide = KumoComboboxInputSide;\nexport type ComboboxSize = KumoComboboxSize;\n\nexport type ComboboxRootProps<\n Value = unknown,\n Multiple extends boolean | undefined = false,\n> = ComboboxBase.Root.Props<Value, Multiple>;\n\n/**\n * Combobox component props (simplified for documentation; the actual Root is generic).\n *\n * Combobox provides an autocomplete/typeahead input with a filterable dropdown.\n * Supports single-select, multi-select with chips, grouped items, and Field wrapper integration.\n *\n * @example\n * ```tsx\n * // Single-select with search input\n * <Combobox value={value} onValueChange={setValue} items={options}>\n * <Combobox.TriggerInput placeholder=\"Search…\" />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item.label}</Combobox.Item>}\n * </Combobox.List>\n * <Combobox.Empty>No results</Combobox.Empty>\n * </Combobox.Content>\n * </Combobox>\n *\n * // Multi-select with chips\n * <Combobox multiple items={options} label=\"Tags\">\n * <Combobox.TriggerMultipleWithInput\n * placeholder=\"Add tag…\"\n * renderItem={(item) => <Combobox.Chip value={item}>{item.label}</Combobox.Chip>}\n * />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item.label}</Combobox.Item>}\n * </Combobox.List>\n * </Combobox.Content>\n * </Combobox>\n * ```\n */\nexport interface ComboboxProps extends KumoComboboxVariantsProps {\n /** Array of items to display in the dropdown */\n items: unknown[];\n /** Currently selected value(s) */\n value?: unknown;\n /** Callback when selection changes */\n onValueChange?: (value: unknown) => void;\n /** Enable multi-select mode */\n multiple?: boolean;\n /** Combobox content (trigger, content, items) */\n children: ReactNode;\n /** Additional CSS classes */\n className?: string;\n /** Label content for the combobox (enables Field wrapper) - can be a string or any React node */\n label?: ReactNode;\n /** Whether the combobox is required */\n required?: boolean;\n /** Tooltip content to display next to the label via an info icon */\n labelTooltip?: ReactNode;\n /** Helper text displayed below the combobox */\n description?: ReactNode;\n /** Error message or validation error object */\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n}\n\nfunction Root<Value, Multiple extends boolean | undefined = false>({\n label,\n required,\n labelTooltip,\n description,\n error,\n children,\n size = \"base\",\n ...props\n}: ComboboxBase.Root.Props<Value, Multiple> & {\n label?: ReactNode;\n required?: boolean;\n labelTooltip?: ReactNode;\n description?: ReactNode;\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n size?: KumoComboboxSize;\n}) {\n const comboboxControl = (\n <ComboboxSizeContext.Provider value={size}>\n <ComboboxBase.Root {...props}>{children}</ComboboxBase.Root>\n </ComboboxSizeContext.Provider>\n );\n\n // Render with Field wrapper if label, description, or error are provided\n if (label) {\n return (\n <Field\n label={label}\n required={required}\n labelTooltip={labelTooltip}\n description={description}\n error={\n error\n ? typeof error === \"string\"\n ? { message: error, match: true }\n : error\n : undefined\n }\n >\n {comboboxControl}\n </Field>\n );\n }\n\n // Render bare combobox without Field wrapper\n return comboboxControl;\n}\n\nfunction Content({\n children,\n className,\n align = \"start\",\n sideOffset = 4,\n alignOffset,\n side,\n container: containerProp,\n}: PropsWithChildren<{\n className?: string;\n align?: ComboboxBase.Positioner.Props[\"align\"];\n alignOffset?: ComboboxBase.Positioner.Props[\"alignOffset\"];\n side?: ComboboxBase.Positioner.Props[\"side\"];\n sideOffset?: ComboboxBase.Positioner.Props[\"sideOffset\"];\n /**\n * Container element for the portal. Use this to render the combobox inside\n * a Shadow DOM or custom container. Overrides `KumoPortalProvider` context.\n * @default document.body (or KumoPortalProvider container if set)\n */\n container?: PortalContainer;\n}>) {\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n return (\n <ComboboxBase.Portal container={container}>\n <ComboboxBase.Positioner\n className=\"\"\n align={align}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n side={side}\n >\n <ComboboxBase.Popup\n className={cn(\n \"flex flex-col\", // flexbox layout for sticky input + scrollable list\n \"max-h-[min(var(--available-height),24rem)] max-w-(--available-width) min-w-(--anchor-width) py-1.5\",\n \"bg-kumo-base text-kumo-default\", // background\n \"rounded-lg shadow-lg ring ring-kumo-line\", // border part\n className,\n )}\n >\n {children}\n </ComboboxBase.Popup>\n </ComboboxBase.Positioner>\n </ComboboxBase.Portal>\n );\n}\n\n// Size-dependent styles for TriggerValue icon\nconst triggerValueIconStyles: Record<\n KumoComboboxSize,\n { padding: string; iconSize: number; iconRight: string }\n> = {\n xs: { padding: \"pr-5\", iconSize: 12, iconRight: \"right-1\" },\n sm: { padding: \"pr-6\", iconSize: 14, iconRight: \"right-1.5\" },\n base: { padding: \"pr-8\", iconSize: 16, iconRight: \"right-2\" },\n lg: { padding: \"pr-10\", iconSize: 18, iconRight: \"right-3\" },\n};\n\nfunction TriggerValue({\n className,\n ...props\n}: ComboboxBase.Value.Props & { className?: string }) {\n const size = useContext(ComboboxSizeContext);\n const iconStyles = triggerValueIconStyles[size];\n\n return (\n <ComboboxBase.Trigger\n className={cn(\n inputVariants({ size }),\n \"relative flex items-center\",\n \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed\",\n iconStyles.padding,\n className,\n )}\n >\n <ComboboxBase.Value>{props.children}</ComboboxBase.Value>\n <ComboboxBase.Icon\n className={cn(\n \"absolute top-1/2 -translate-y-1/2 flex items-center text-kumo-subtle\",\n iconStyles.iconRight,\n )}\n >\n <CaretDownIcon size={iconStyles.iconSize} className=\"fill-current\" />\n </ComboboxBase.Icon>\n </ComboboxBase.Trigger>\n );\n}\n\n// Size-dependent styles for TriggerInput icons\nconst triggerInputIconStyles: Record<\n KumoComboboxSize,\n { padding: string; iconSize: number; clearRight: string; caretRight: string }\n> = {\n xs: {\n padding: \"pr-7\",\n iconSize: 12,\n clearRight: \"right-5\",\n caretRight: \"right-1\",\n },\n sm: {\n padding: \"pr-9\",\n iconSize: 14,\n clearRight: \"right-6\",\n caretRight: \"right-1.5\",\n },\n base: {\n padding: \"pr-12\",\n iconSize: 16,\n clearRight: \"right-8\",\n caretRight: \"right-2\",\n },\n lg: {\n padding: \"pr-14\",\n iconSize: 18,\n clearRight: \"right-9\",\n caretRight: \"right-3\",\n },\n};\n\nfunction TriggerInput({\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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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dialog-k3f1fbam6nt96k8x.js","sources":["../../src/components/dialog/dialog.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type ReactNode,\n} from \"react\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\nimport { AlertDialog as AlertDialogBase } from \"@base-ui/react/alert-dialog\";\nimport { LayerCard } from \"../layer-card\";\nimport { cn } from \"../../utils/cn\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Dialog size variant definitions mapping sizes to their minimum widths. */\nexport const KUMO_DIALOG_VARIANTS = {\n size: {\n base: {\n classes: \"sm:min-w-96\",\n description: \"Default dialog width\",\n },\n sm: {\n classes: \"min-w-72\",\n description: \"Small dialog for simple confirmations\",\n },\n lg: {\n classes: \"min-w-[32rem]\",\n description: \"Large dialog for complex content\",\n },\n xl: {\n classes: \"min-w-[48rem]\",\n description: \"Extra large dialog for detailed views\",\n },\n },\n role: {\n dialog: {\n classes: \"\",\n description: \"Standard dialog for general-purpose modals\",\n },\n alertdialog: {\n classes: \"\",\n description:\n \"Alert dialog for confirmation flows requiring explicit user acknowledgment\",\n },\n },\n} as const;\n\nexport const KUMO_DIALOG_DEFAULT_VARIANTS = {\n size: \"base\",\n role: \"dialog\",\n} as const;\n\nexport const KUMO_DIALOG_STYLING = {\n dimensions: {\n sm: {\n width: 350,\n titleSize: 20,\n descSize: 16,\n padding: 16,\n gap: 8,\n buttonSize: \"sm\",\n },\n base: {\n width: 384,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n lg: {\n width: 512,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n xl: {\n width: 768,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n },\n baseTokens: {\n background: \"color-surface\",\n text: \"text-color-surface\",\n borderRadius: 12,\n shadow: \"shadow-m\",\n },\n backdrop: {\n background: \"color-surface-secondary\",\n opacity: 0.8,\n },\n header: {\n title: { fontWeight: 600, color: \"text-color-surface\" },\n closeIcon: { name: \"ph-x\", size: 20, color: \"text-color-muted\" },\n },\n description: {\n fontWeight: 400,\n color: \"text-color-muted\",\n },\n buttons: {\n primary: { background: \"color-primary\", text: \"white\" },\n secondary: { ring: \"color-border\", text: \"text-color-surface\" },\n },\n} as const;\n\n// Derived types from KUMO_DIALOG_VARIANTS\nexport type KumoDialogSize = keyof typeof KUMO_DIALOG_VARIANTS.size;\nexport type KumoDialogRole = keyof typeof KUMO_DIALOG_VARIANTS.role;\n\nexport interface KumoDialogVariantsProps {\n /**\n * Dialog width.\n * - `\"sm\"` — Small (min 288px) for simple confirmations\n * - `\"base\"` — Default (min 384px)\n * - `\"lg\"` — Large (min 512px) for complex content\n * - `\"xl\"` — Extra large (min 768px) for detailed views\n * @default \"base\"\n */\n size?: KumoDialogSize;\n}\n\n// ============================================================================\n// Dialog Role Context\n// ============================================================================\n\nconst DialogRoleContext = createContext<KumoDialogRole>(\"dialog\");\n\nfunction useDialogRole() {\n return useContext(DialogRoleContext);\n}\n\nexport function dialogVariants({\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: KumoDialogVariantsProps = {}) {\n return cn(\n // Base styles\n \"shadow-m ring ring-kumo-line fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0\",\n // Apply size from KUMO_DIALOG_VARIANTS\n KUMO_DIALOG_VARIANTS.size[size].classes,\n );\n}\n\n/**\n * Dialog component props — the modal content panel.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Open</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Confirm Action</Dialog.Title>\n * <Dialog.Description>Are you sure?</Dialog.Description>\n * <Dialog.Close render={(p) => <Button {...p}>Cancel</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nexport type DialogProps = KumoDialogVariantsProps & {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Dialog content (typically Title, Description, Close, and action buttons). */\n children: ReactNode;\n /** Inline styles. */\n style?: CSSProperties;\n /**\n * Container element for the portal. Use this to render the dialog inside\n * a Shadow DOM or custom container. Overrides `KumoPortalProvider` context.\n * @default document.body (or KumoPortalProvider container if set)\n */\n container?: PortalContainer;\n};\n\n/**\n * Modal dialog overlay with backdrop. Compound component with `Dialog.Root`,\n * `Dialog.Trigger`, `Dialog.Title`, `Dialog.Description`, and `Dialog.Close`.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Delete</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Item</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n *\n * @example Alert Dialog for destructive actions\n * ```tsx\n * <Dialog.Root role=\"alertdialog\">\n * <Dialog.Trigger render={(p) => <Button variant=\"destructive\" {...p}>Delete Project</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Project?</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"secondary\" {...p}>Cancel</Button>} />\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nfunction DialogContent({\n className,\n children,\n style,\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n container: containerProp,\n}: DialogProps) {\n const role = useDialogRole();\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n const BasePortal =\n role === \"alertdialog\" ? AlertDialogBase.Portal : DialogBase.Portal;\n const BaseBackdrop =\n role === \"alertdialog\" ? AlertDialogBase.Backdrop : DialogBase.Backdrop;\n const BasePopup =\n role === \"alertdialog\" ? AlertDialogBase.Popup : DialogBase.Popup;\n\n return (\n <BasePortal container={container}>\n <BaseBackdrop className=\"fixed inset-0 bg-kumo-recessed opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0\" />\n <LayerCard\n render={<BasePopup />}\n className={cn(dialogVariants({ size }), className)}\n style={\n {\n transitionProperty: \"scale, opacity\",\n transitionTimingFunction:\n \"var(--default-transition-timing-function)\",\n \"--tw-shadow\":\n \"0 20px 25px -5px rgb(0 0 0 / 0.03), 0 8px 10px -6px rgb(0 0 0 / 0.03)\",\n ...style,\n } as CSSProperties\n }\n >\n {children}\n </LayerCard>\n </BasePortal>\n );\n}\n\n// ============================================================================\n// Dialog Root\n// ============================================================================\n\ntype BaseDialogRootProps = ComponentPropsWithoutRef<typeof DialogBase.Root>;\n\nexport type DialogRootProps = BaseDialogRootProps & {\n /**\n * The ARIA role for the dialog.\n * - `\"dialog\"` — Standard dialog for general-purpose modals. Dismissible via outside click by default.\n * - `\"alertdialog\"` — Alert dialog for destructive or confirmation flows. Not dismissible via outside click.\n *\n * Use `role=\"alertdialog\"` for:\n * - Destructive actions (delete, discard, remove)\n * - Confirmation dialogs requiring explicit user acknowledgment\n * - Actions that cannot be undone\n *\n * @default \"dialog\"\n */\n role?: KumoDialogRole;\n};\n\nfunction DialogRoot({\n children,\n role = KUMO_DIALOG_DEFAULT_VARIANTS.role,\n ...props\n}: DialogRootProps) {\n const BaseRoot =\n role === \"alertdialog\" ? AlertDialogBase.Root : DialogBase.Root;\n return (\n <DialogRoleContext.Provider value={role}>\n <BaseRoot {...props}>{children}</BaseRoot>\n </DialogRoleContext.Provider>\n );\n}\n\nDialogRoot.displayName = \"Dialog.Root\";\n\n// ============================================================================\n// Dialog Trigger\n// ============================================================================\n\ntype BaseDialogTriggerProps = ComponentPropsWithoutRef<\n typeof DialogBase.Trigger\n>;\n\nexport type DialogTriggerProps = BaseDialogTriggerProps;\n\nfunction DialogTrigger({ children, ...props }: DialogTriggerProps) {\n const role = useDialogRole();\n const BaseTrigger =\n role === \"alertdialog\" ? AlertDialogBase.Trigger : DialogBase.Trigger;\n return <BaseTrigger {...props}>{children}</BaseTrigger>;\n}\n\nDialogTrigger.displayName = \"Dialog.Trigger\";\n\n// ============================================================================\n// Dialog Title\n// ============================================================================\n\ntype BaseDialogTitleProps = ComponentPropsWithoutRef<typeof DialogBase.Title>;\n\nexport type DialogTitleProps = BaseDialogTitleProps;\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n const role = useDialogRole();\n const BaseTitle =\n role === \"alertdialog\" ? AlertDialogBase.Title : DialogBase.Title;\n return <BaseTitle className={className} {...props} />;\n}\n\nDialogTitle.displayName = \"Dialog.Title\";\n\n// ============================================================================\n// Dialog Description\n// ============================================================================\n\ntype BaseDialogDescriptionProps = ComponentPropsWithoutRef<\n typeof DialogBase.Description\n>;\n\nexport type DialogDescriptionProps = BaseDialogDescriptionProps;\n\nfunction DialogDescription({ className, ...props }: DialogDescriptionProps) {\n const role = useDialogRole();\n const BaseDescription =\n role === \"alertdialog\"\n ? AlertDialogBase.Description\n : DialogBase.Description;\n return <BaseDescription className={className} {...props} />;\n}\n\nDialogDescription.displayName = \"Dialog.Description\";\n\n// ============================================================================\n// Dialog Close\n// ============================================================================\n\ntype BaseDialogCloseProps = ComponentPropsWithoutRef<typeof DialogBase.Close>;\n\nexport type DialogCloseProps = BaseDialogCloseProps;\n\nfunction DialogClose({ children, ...props }: DialogCloseProps) {\n const role = useDialogRole();\n const BaseClose =\n role === \"alertdialog\" ? AlertDialogBase.Close : DialogBase.Close;\n return <BaseClose {...props}>{children}</BaseClose>;\n}\n\nDialogClose.displayName = \"Dialog.Close\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nconst Dialog = Object.assign(DialogContent, {\n Root: DialogRoot,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n});\n\nexport {\n Dialog,\n DialogRoot,\n DialogTrigger,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"names":["KUMO_DIALOG_VARIANTS","KUMO_DIALOG_DEFAULT_VARIANTS","DialogRoleContext","createContext","useDialogRole","useContext","dialogVariants","size","cn","DialogContent","className","children","style","containerProp","role","contextContainer","usePortalContainer","jsxs","AlertDialogBase.Portal","DialogBase.Portal","jsx","AlertDialogBase.Backdrop","DialogBase.Backdrop","LayerCard","AlertDialogBase.Popup","DialogBase.Popup","DialogRoot","props","BaseRoot","AlertDialogBase.Root","DialogBase.Root","DialogTrigger","BaseTrigger","AlertDialogBase.Trigger","DialogBase.Trigger","DialogTitle","BaseTitle","AlertDialogBase.Title","DialogBase.Title","DialogDescription","BaseDescription","AlertDialogBase.Description","DialogBase.Description","DialogClose","BaseClose","AlertDialogBase.Close","DialogBase.Close","Dialog"],"mappings":"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"}
|