@cloudflare/kumo 1.15.0 → 1.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +144 -0
- package/ai/USAGE.md +3 -1
- package/ai/component-registry.json +511 -66
- package/ai/component-registry.md +776 -59
- package/ai/schemas.ts +33 -7
- package/dist/.build-complete +1 -1
- package/dist/ai/schemas.d.ts +158 -39
- package/dist/ai/schemas.d.ts.map +1 -1
- package/dist/ai/schemas.js +456 -418
- package/dist/ai/schemas.js.map +1 -1
- package/dist/chunks/{Legend-mkh1v83sz972e29d.js → Legend-o0ntojbaplmszwk0.js} +115 -101
- package/dist/chunks/Legend-o0ntojbaplmszwk0.js.map +1 -0
- package/dist/chunks/badge-n80t3z8u9ttlxi20.js +120 -0
- package/dist/chunks/badge-n80t3z8u9ttlxi20.js.map +1 -0
- package/dist/chunks/banner-nz0eryqnz3qd86ln.js +79 -0
- package/dist/chunks/banner-nz0eryqnz3qd86ln.js.map +1 -0
- package/dist/chunks/{breadcrumbs-m79gm4gjwbfajpna.js → breadcrumbs-cjgn3w4drahvqnuj.js} +3 -3
- package/dist/chunks/{breadcrumbs-m79gm4gjwbfajpna.js.map → breadcrumbs-cjgn3w4drahvqnuj.js.map} +1 -1
- package/dist/chunks/{button-j0hi0afn33w9lxgi.js → button-odxi0hp4fvi5i2w3.js} +50 -48
- package/dist/chunks/button-odxi0hp4fvi5i2w3.js.map +1 -0
- package/dist/chunks/{checkbox-bvzuggmadtqawis4.js → checkbox-dx8x0rzv582yjv7n.js} +38 -47
- package/dist/chunks/{checkbox-bvzuggmadtqawis4.js.map → checkbox-dx8x0rzv582yjv7n.js.map} +1 -1
- package/dist/chunks/{clipboard-text-mwcknzn75qdvigrd.js → clipboard-text-kyk51d1ze7zvdn4q.js} +55 -54
- package/dist/chunks/clipboard-text-kyk51d1ze7zvdn4q.js.map +1 -0
- package/dist/chunks/{combobox-ndbaroqh1c0u49ye.js → combobox-9fhjzprab46csmon.js} +97 -82
- package/dist/chunks/combobox-9fhjzprab46csmon.js.map +1 -0
- package/dist/chunks/{command-palette-ejoszjfivybu9yi5.js → command-palette-kenx2bbdzd4kpx36.js} +158 -154
- package/dist/chunks/command-palette-kenx2bbdzd4kpx36.js.map +1 -0
- package/dist/chunks/{dialog-gkmecnx48ge38jrr.js → dialog-e05ysa8t2fklw065.js} +22 -20
- package/dist/chunks/dialog-e05ysa8t2fklw065.js.map +1 -0
- package/dist/chunks/{dropdown-i8n7nv3cvkvb1x3e.js → dropdown-g587px7zv3ssaxr4.js} +96 -90
- package/dist/chunks/dropdown-g587px7zv3ssaxr4.js.map +1 -0
- package/dist/chunks/{empty-hrwtammqp0b2nvtf.js → empty-fuz1un7r7mbz0kim.js} +2 -2
- package/dist/chunks/{empty-hrwtammqp0b2nvtf.js.map → empty-fuz1un7r7mbz0kim.js.map} +1 -1
- package/dist/chunks/{field-lweivfadxgpqhuqi.js → field-fq504lyu7ttsh5m9.js} +3 -3
- package/dist/chunks/{field-lweivfadxgpqhuqi.js.map → field-fq504lyu7ttsh5m9.js.map} +1 -1
- package/dist/chunks/hcl-hcu7d6ja6t540ijn.js +8 -0
- package/dist/chunks/hcl-hcu7d6ja6t540ijn.js.map +1 -0
- package/dist/chunks/{input-area-obli4ufvu40bfpgp.js → input-area-nq40szg9110on89c.js} +4 -4
- package/dist/chunks/{input-area-obli4ufvu40bfpgp.js.map → input-area-nq40szg9110on89c.js.map} +1 -1
- package/dist/chunks/{input-group-dwtsd04lzf2bcsdo.js → input-group-hbebbyh8fo6aqydn.js} +3 -3
- package/dist/chunks/{input-group-dwtsd04lzf2bcsdo.js.map → input-group-hbebbyh8fo6aqydn.js.map} +1 -1
- package/dist/chunks/{input-ko2dne1givlxq7sz.js → input-kvhyo3p4859bexvx.js} +4 -4
- package/dist/chunks/input-kvhyo3p4859bexvx.js.map +1 -0
- package/dist/chunks/{label-kjahhybc191quieo.js → label-j9owppbgnn35mebg.js} +3 -3
- package/dist/chunks/{label-kjahhybc191quieo.js.map → label-j9owppbgnn35mebg.js.map} +1 -1
- package/dist/chunks/{layer-card-mu2w82x6ko1nhhtr.js → layer-card-l5yjvrxry1dhte57.js} +8 -8
- package/dist/chunks/{layer-card-mu2w82x6ko1nhhtr.js.map → layer-card-l5yjvrxry1dhte57.js.map} +1 -1
- package/dist/chunks/{link-lpzl5s47pmobk361.js → link-hmmf3k1xn6rm72rt.js} +2 -2
- package/dist/chunks/{link-lpzl5s47pmobk361.js.map → link-hmmf3k1xn6rm72rt.js.map} +1 -1
- package/dist/chunks/{menubar-ifxxdoa35zz79z1q.js → menubar-abojnm0uwjuni8ok.js} +20 -20
- package/dist/chunks/menubar-abojnm0uwjuni8ok.js.map +1 -0
- package/dist/chunks/{meter-fbtqfg0okpwmaiju.js → meter-i84dte2f82qmvn7y.js} +2 -2
- package/dist/chunks/{meter-fbtqfg0okpwmaiju.js.map → meter-i84dte2f82qmvn7y.js.map} +1 -1
- package/dist/chunks/{pagination-eo0gzzm7v5w8niqe.js → pagination-pbd7qqik97ac0l7m.js} +3 -3
- package/dist/chunks/{pagination-eo0gzzm7v5w8niqe.js.map → pagination-pbd7qqik97ac0l7m.js.map} +1 -1
- package/dist/chunks/{popover-dd7hi5ajeoq9od1i.js → popover-i951xjcgezeqr4iv.js} +31 -28
- package/dist/chunks/popover-i951xjcgezeqr4iv.js.map +1 -0
- package/dist/chunks/portal-provider-hwmkdmkpvct0cb76.js +18 -0
- package/dist/chunks/portal-provider-hwmkdmkpvct0cb76.js.map +1 -0
- package/dist/chunks/{radio-oi9iw7ls1t04j377.js → radio-l2vkcue40d84fmo1.js} +13 -16
- package/dist/chunks/{radio-oi9iw7ls1t04j377.js.map → radio-l2vkcue40d84fmo1.js.map} +1 -1
- package/dist/chunks/{select-0m0xklfwdlx8dwba.js → select-paedwa3nlhpq82ua.js} +39 -37
- package/dist/chunks/select-paedwa3nlhpq82ua.js.map +1 -0
- package/dist/chunks/{sensitive-input-rjpykxn2llh0thx1.js → sensitive-input-kznmknpp5h1grc6k.js} +97 -91
- package/dist/chunks/sensitive-input-kznmknpp5h1grc6k.js.map +1 -0
- package/dist/chunks/sidebar-jepeq7gaf4issuw6.js +875 -0
- package/dist/chunks/sidebar-jepeq7gaf4issuw6.js.map +1 -0
- package/dist/chunks/skeleton-line-epxenksfesr2fkcv.js +33 -0
- package/dist/chunks/skeleton-line-epxenksfesr2fkcv.js.map +1 -0
- package/dist/chunks/surface-blo81kgy9g0sexgm.js +36 -0
- package/dist/chunks/surface-blo81kgy9g0sexgm.js.map +1 -0
- package/dist/chunks/{switch-lv4mrrkfl5uc99xo.js → switch-i0zwcp3wq6vsxm1c.js} +64 -64
- package/dist/chunks/{switch-lv4mrrkfl5uc99xo.js.map → switch-i0zwcp3wq6vsxm1c.js.map} +1 -1
- package/dist/chunks/table-nrcw19tlpduayukl.js +183 -0
- package/dist/chunks/table-nrcw19tlpduayukl.js.map +1 -0
- package/dist/chunks/tabs-bw92jb303zxw7w4f.js +92 -0
- package/dist/chunks/{tabs-hy6oa7xtf96d9mxt.js.map → tabs-bw92jb303zxw7w4f.js.map} +1 -1
- package/dist/chunks/{text-gzt92mlji1lug13d.js → text-nmyi1rkwdj37f30f.js} +24 -22
- package/dist/chunks/text-nmyi1rkwdj37f30f.js.map +1 -0
- package/dist/chunks/{toast-kswfqmjysxcrwij3.js → toast-lrnwby56drs7vtae.js} +61 -59
- package/dist/chunks/toast-lrnwby56drs7vtae.js.map +1 -0
- package/dist/chunks/toml-nczb2z9n0o23o3ci.js +8 -0
- package/dist/chunks/toml-nczb2z9n0o23o3ci.js.map +1 -0
- package/dist/chunks/{tooltip-k68wcv9mrigb7rcb.js → tooltip-cit9ltlxfuhwctuj.js} +24 -21
- package/dist/chunks/tooltip-cit9ltlxfuhwctuj.js.map +1 -0
- package/dist/chunks/{vendor-base-ui-cpvkrhz4zgw9nw2b.js → vendor-base-ui-n30qblevnpk9cc5c.js} +551 -549
- package/dist/chunks/{vendor-base-ui-cpvkrhz4zgw9nw2b.js.map → vendor-base-ui-n30qblevnpk9cc5c.js.map} +1 -1
- package/dist/code/server.js +11 -9
- package/dist/code/server.js.map +1 -1
- package/dist/code.js +16 -14
- package/dist/code.js.map +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/chart.js +1 -1
- package/dist/components/checkbox.js +1 -1
- package/dist/components/clipboard-text.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/flow.js +2142 -2090
- package/dist/components/flow.js.map +1 -1
- package/dist/components/input.js +3 -3
- package/dist/components/label.js +1 -1
- package/dist/components/layer-card.js +1 -1
- package/dist/components/link.js +1 -1
- package/dist/components/loader.js +1 -1
- package/dist/components/menubar.js +1 -1
- package/dist/components/meter.js +1 -1
- package/dist/components/pagination.js +1 -1
- package/dist/components/popover.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/sidebar.js +35 -0
- package/dist/components/sidebar.js.map +1 -0
- package/dist/components/surface.js +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/tabs.js +1 -1
- package/dist/components/text.js +1 -1
- package/dist/components/toast.js +2 -2
- package/dist/components/tooltip.js +1 -1
- package/dist/index.js +192 -159
- package/dist/index.js.map +1 -1
- package/dist/primitives/accordion.js +1 -1
- package/dist/primitives/alert-dialog.js +1 -1
- package/dist/primitives/autocomplete.js +1 -1
- package/dist/primitives/avatar.js +1 -1
- package/dist/primitives/button.js +1 -1
- package/dist/primitives/checkbox-group.js +1 -1
- package/dist/primitives/checkbox.js +1 -1
- package/dist/primitives/collapsible.js +1 -1
- package/dist/primitives/combobox.js +1 -1
- package/dist/primitives/context-menu.js +1 -1
- package/dist/primitives/csp-provider.js +1 -1
- package/dist/primitives/dialog.js +1 -1
- package/dist/primitives/direction-provider.js +1 -1
- package/dist/primitives/drawer.js +1 -1
- package/dist/primitives/field.js +1 -1
- package/dist/primitives/fieldset.js +1 -1
- package/dist/primitives/form.js +1 -1
- package/dist/primitives/input.js +1 -1
- package/dist/primitives/menu.js +1 -1
- package/dist/primitives/menubar.js +1 -1
- package/dist/primitives/meter.js +1 -1
- package/dist/primitives/navigation-menu.js +1 -1
- package/dist/primitives/number-field.js +1 -1
- package/dist/primitives/popover.js +1 -1
- package/dist/primitives/preview-card.js +1 -1
- package/dist/primitives/progress.js +1 -1
- package/dist/primitives/radio-group.js +1 -1
- package/dist/primitives/radio.js +1 -1
- package/dist/primitives/scroll-area.js +1 -1
- package/dist/primitives/select.js +1 -1
- package/dist/primitives/separator.js +1 -1
- package/dist/primitives/slider.js +1 -1
- package/dist/primitives/switch.js +1 -1
- package/dist/primitives/tabs.js +1 -1
- package/dist/primitives/toast.js +1 -1
- package/dist/primitives/toggle-group.js +1 -1
- package/dist/primitives/toggle.js +1 -1
- package/dist/primitives/toolbar.js +1 -1
- package/dist/primitives/tooltip.js +1 -1
- package/dist/primitives.js +1 -1
- package/dist/scripts/theme-generator/config.d.ts.map +1 -1
- package/dist/scripts/theme-generator/config.js +288 -24
- package/dist/scripts/theme-generator/config.js.map +1 -1
- package/dist/src/code/provider.d.ts.map +1 -1
- package/dist/src/code/server.d.ts.map +1 -1
- package/dist/src/code/types.d.ts +1 -1
- package/dist/src/code/types.d.ts.map +1 -1
- package/dist/src/components/badge/badge.d.ts +95 -22
- package/dist/src/components/badge/badge.d.ts.map +1 -1
- package/dist/src/components/banner/banner.d.ts +2 -0
- package/dist/src/components/banner/banner.d.ts.map +1 -1
- package/dist/src/components/button/button.d.ts +2 -0
- package/dist/src/components/button/button.d.ts.map +1 -1
- package/dist/src/components/chart/EChart.d.ts.map +1 -1
- package/dist/src/components/chart/TimeseriesChart.d.ts +11 -1
- package/dist/src/components/chart/TimeseriesChart.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 +2 -0
- package/dist/src/components/clipboard-text/clipboard-text.d.ts.map +1 -1
- package/dist/src/components/combobox/combobox.d.ts +8 -1
- package/dist/src/components/combobox/combobox.d.ts.map +1 -1
- package/dist/src/components/command-palette/command-palette.d.ts +9 -2
- package/dist/src/components/command-palette/command-palette.d.ts.map +1 -1
- package/dist/src/components/command-palette/types.d.ts +7 -0
- package/dist/src/components/command-palette/types.d.ts.map +1 -1
- package/dist/src/components/dialog/dialog.d.ts +8 -1
- package/dist/src/components/dialog/dialog.d.ts.map +1 -1
- package/dist/src/components/dropdown/dropdown.d.ts +17 -2
- package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
- package/dist/src/components/flow/diagram.d.ts.map +1 -1
- package/dist/src/components/flow/node.d.ts.map +1 -1
- package/dist/src/components/flow/parallel.d.ts.map +1 -1
- package/dist/src/components/loader/skeleton-line.d.ts +2 -1
- package/dist/src/components/loader/skeleton-line.d.ts.map +1 -1
- package/dist/src/components/popover/popover.d.ts +8 -1
- package/dist/src/components/popover/popover.d.ts.map +1 -1
- package/dist/src/components/radio/radio.d.ts.map +1 -1
- package/dist/src/components/select/select.d.ts +8 -1
- package/dist/src/components/select/select.d.ts.map +1 -1
- package/dist/src/components/sensitive-input/sensitive-input.d.ts.map +1 -1
- package/dist/src/components/sidebar/index.d.ts +2 -0
- package/dist/src/components/sidebar/index.d.ts.map +1 -0
- package/dist/src/components/sidebar/sidebar.d.ts +556 -0
- package/dist/src/components/sidebar/sidebar.d.ts.map +1 -0
- package/dist/src/components/surface/surface.d.ts +23 -23
- package/dist/src/components/surface/surface.d.ts.map +1 -1
- package/dist/src/components/table/table.d.ts +34 -2
- package/dist/src/components/table/table.d.ts.map +1 -1
- package/dist/src/components/tabs/tabs.d.ts.map +1 -1
- package/dist/src/components/text/text.d.ts +5 -0
- package/dist/src/components/text/text.d.ts.map +1 -1
- package/dist/src/components/toast/toast.d.ts +16 -9
- package/dist/src/components/toast/toast.d.ts.map +1 -1
- package/dist/src/components/tooltip/tooltip.d.ts +11 -6
- package/dist/src/components/tooltip/tooltip.d.ts.map +1 -1
- package/dist/src/index.d.ts +2 -0
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/utils/index.d.ts +1 -0
- package/dist/src/utils/index.d.ts.map +1 -1
- package/dist/src/utils/portal-provider.d.ts +56 -0
- package/dist/src/utils/portal-provider.d.ts.map +1 -0
- package/dist/styles/kumo-binding.css +49 -46
- package/dist/styles/kumo-standalone.css +1 -1
- package/dist/styles/theme-fedramp.css +3 -3
- package/dist/styles/theme-kumo.css +202 -22
- package/dist/utils.js +8 -6
- package/dist/utils.js.map +1 -1
- package/package.json +7 -3
- package/scripts/component-registry/index.ts +12 -0
- package/scripts/theme-generator/config.ts +298 -24
- package/dist/chunks/Legend-mkh1v83sz972e29d.js.map +0 -1
- package/dist/chunks/badge-mrshucy2530o70cq.js +0 -56
- package/dist/chunks/badge-mrshucy2530o70cq.js.map +0 -1
- package/dist/chunks/banner-vzdjbqsb6em7tmdk.js +0 -75
- package/dist/chunks/banner-vzdjbqsb6em7tmdk.js.map +0 -1
- package/dist/chunks/button-j0hi0afn33w9lxgi.js.map +0 -1
- package/dist/chunks/clipboard-text-mwcknzn75qdvigrd.js.map +0 -1
- package/dist/chunks/combobox-ndbaroqh1c0u49ye.js.map +0 -1
- package/dist/chunks/command-palette-ejoszjfivybu9yi5.js.map +0 -1
- package/dist/chunks/dialog-gkmecnx48ge38jrr.js.map +0 -1
- package/dist/chunks/dropdown-i8n7nv3cvkvb1x3e.js.map +0 -1
- package/dist/chunks/input-ko2dne1givlxq7sz.js.map +0 -1
- package/dist/chunks/menubar-ifxxdoa35zz79z1q.js.map +0 -1
- package/dist/chunks/popover-dd7hi5ajeoq9od1i.js.map +0 -1
- package/dist/chunks/select-0m0xklfwdlx8dwba.js.map +0 -1
- package/dist/chunks/sensitive-input-rjpykxn2llh0thx1.js.map +0 -1
- package/dist/chunks/skeleton-line-1j5exu6vv07mmhfb.js +0 -28
- package/dist/chunks/skeleton-line-1j5exu6vv07mmhfb.js.map +0 -1
- package/dist/chunks/surface-dhshylwccuaz91d1.js +0 -21
- package/dist/chunks/surface-dhshylwccuaz91d1.js.map +0 -1
- package/dist/chunks/table-fh7jmfip27vdapxm.js +0 -155
- package/dist/chunks/table-fh7jmfip27vdapxm.js.map +0 -1
- package/dist/chunks/tabs-hy6oa7xtf96d9mxt.js +0 -86
- package/dist/chunks/text-gzt92mlji1lug13d.js.map +0 -1
- package/dist/chunks/toast-kswfqmjysxcrwij3.js.map +0 -1
- package/dist/chunks/tooltip-k68wcv9mrigb7rcb.js.map +0 -1
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as e, jsxs as b } from "react/jsx-runtime";
|
|
3
|
-
import { createContext as
|
|
4
|
-
import { S as
|
|
3
|
+
import { createContext as v, useContext as N } from "react";
|
|
4
|
+
import { S as P } from "./surface-blo81kgy9g0sexgm.js";
|
|
5
5
|
import { c as D } from "./cn-ct4n7r74mh8y0f48.js";
|
|
6
|
-
import {
|
|
7
|
-
|
|
6
|
+
import { u as A } from "./portal-provider-hwmkdmkpvct0cb76.js";
|
|
7
|
+
import { ao as h, ap as k, aq as n, ar as c, as as g, at as d, au as p, av as m, aw as u } from "./vendor-base-ui-n30qblevnpk9cc5c.js";
|
|
8
|
+
const z = {
|
|
8
9
|
size: {
|
|
9
10
|
base: {
|
|
10
11
|
classes: "sm:min-w-96",
|
|
@@ -26,34 +27,35 @@ const P = {
|
|
|
26
27
|
}, r = {
|
|
27
28
|
size: "base",
|
|
28
29
|
role: "dialog"
|
|
29
|
-
}, f =
|
|
30
|
+
}, f = v("dialog");
|
|
30
31
|
function s() {
|
|
31
|
-
return
|
|
32
|
+
return N(f);
|
|
32
33
|
}
|
|
33
|
-
function
|
|
34
|
+
function O({
|
|
34
35
|
size: a = r.size
|
|
35
36
|
} = {}) {
|
|
36
37
|
return D(
|
|
37
38
|
// Base styles
|
|
38
39
|
"shadow-m fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0",
|
|
39
40
|
// Apply size from KUMO_DIALOG_VARIANTS
|
|
40
|
-
|
|
41
|
+
z.size[a].classes
|
|
41
42
|
);
|
|
42
43
|
}
|
|
43
|
-
function
|
|
44
|
+
function S({
|
|
44
45
|
className: a,
|
|
45
46
|
children: o,
|
|
46
47
|
style: i,
|
|
47
|
-
size: t = r.size
|
|
48
|
+
size: t = r.size,
|
|
49
|
+
container: C
|
|
48
50
|
}) {
|
|
49
|
-
const l = s();
|
|
50
|
-
return /* @__PURE__ */ b(l === "alertdialog" ? p : p, { children: [
|
|
51
|
-
/* @__PURE__ */ e(l === "alertdialog" ? m : m, { className: "fixed inset-0 bg-kumo-
|
|
51
|
+
const l = s(), R = A();
|
|
52
|
+
return /* @__PURE__ */ b(l === "alertdialog" ? p : p, { container: C ?? R ?? void 0, children: [
|
|
53
|
+
/* @__PURE__ */ e(l === "alertdialog" ? m : m, { className: "fixed inset-0 bg-kumo-recessed opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0" }),
|
|
52
54
|
/* @__PURE__ */ e(
|
|
53
|
-
|
|
55
|
+
P,
|
|
54
56
|
{
|
|
55
|
-
|
|
56
|
-
className: D(
|
|
57
|
+
render: /* @__PURE__ */ e(l === "alertdialog" ? u : u, {}),
|
|
58
|
+
className: D(O({ size: t }), a),
|
|
57
59
|
style: {
|
|
58
60
|
transitionProperty: "scale, opacity",
|
|
59
61
|
transitionTimingFunction: "var(--default-transition-timing-function)",
|
|
@@ -70,7 +72,7 @@ function x({
|
|
|
70
72
|
role: o = r.role,
|
|
71
73
|
...i
|
|
72
74
|
}) {
|
|
73
|
-
const t = o === "alertdialog" ?
|
|
75
|
+
const t = o === "alertdialog" ? h : k;
|
|
74
76
|
return /* @__PURE__ */ e(f.Provider, { value: o, children: /* @__PURE__ */ e(t, { ...i, children: a }) });
|
|
75
77
|
}
|
|
76
78
|
x.displayName = "Dialog.Root";
|
|
@@ -94,7 +96,7 @@ function T({ children: a, ...o }) {
|
|
|
94
96
|
return /* @__PURE__ */ e(t, { ...o, children: a });
|
|
95
97
|
}
|
|
96
98
|
T.displayName = "Dialog.Close";
|
|
97
|
-
const
|
|
99
|
+
const K = Object.assign(S, {
|
|
98
100
|
Root: x,
|
|
99
101
|
Trigger: y,
|
|
100
102
|
Title: w,
|
|
@@ -102,11 +104,11 @@ const U = Object.assign(k, {
|
|
|
102
104
|
Close: T
|
|
103
105
|
});
|
|
104
106
|
export {
|
|
105
|
-
|
|
107
|
+
K as D,
|
|
106
108
|
x as a,
|
|
107
109
|
y as b,
|
|
108
110
|
w as c,
|
|
109
111
|
B as d,
|
|
110
112
|
T as e
|
|
111
113
|
};
|
|
112
|
-
//# sourceMappingURL=dialog-
|
|
114
|
+
//# sourceMappingURL=dialog-e05ysa8t2fklw065.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog-e05ysa8t2fklw065.js","sources":["../../src/components/dialog/dialog.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type ReactNode,\n} from \"react\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\nimport { AlertDialog as AlertDialogBase } from \"@base-ui/react/alert-dialog\";\nimport { Surface } from \"../surface\";\nimport { cn } from \"../../utils/cn\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Dialog size variant definitions mapping sizes to their minimum widths. */\nexport const KUMO_DIALOG_VARIANTS = {\n size: {\n base: {\n classes: \"sm:min-w-96\",\n description: \"Default dialog width\",\n },\n sm: {\n classes: \"min-w-72\",\n description: \"Small dialog for simple confirmations\",\n },\n lg: {\n classes: \"min-w-[32rem]\",\n description: \"Large dialog for complex content\",\n },\n xl: {\n classes: \"min-w-[48rem]\",\n description: \"Extra large dialog for detailed views\",\n },\n },\n role: {\n dialog: {\n classes: \"\",\n description: \"Standard dialog for general-purpose modals\",\n },\n alertdialog: {\n classes: \"\",\n description:\n \"Alert dialog for confirmation flows requiring explicit user acknowledgment\",\n },\n },\n} as const;\n\nexport const KUMO_DIALOG_DEFAULT_VARIANTS = {\n size: \"base\",\n role: \"dialog\",\n} as const;\n\nexport const KUMO_DIALOG_STYLING = {\n dimensions: {\n sm: {\n width: 350,\n titleSize: 20,\n descSize: 16,\n padding: 16,\n gap: 8,\n buttonSize: \"sm\",\n },\n base: {\n width: 384,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n lg: {\n width: 512,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n xl: {\n width: 768,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n },\n baseTokens: {\n background: \"color-surface\",\n text: \"text-color-surface\",\n borderRadius: 12,\n shadow: \"shadow-m\",\n },\n backdrop: {\n background: \"color-surface-secondary\",\n opacity: 0.8,\n },\n header: {\n title: { fontWeight: 600, color: \"text-color-surface\" },\n closeIcon: { name: \"ph-x\", size: 20, color: \"text-color-muted\" },\n },\n description: {\n fontWeight: 400,\n color: \"text-color-muted\",\n },\n buttons: {\n primary: { background: \"color-primary\", text: \"white\" },\n secondary: { ring: \"color-border\", text: \"text-color-surface\" },\n },\n} as const;\n\n// Derived types from KUMO_DIALOG_VARIANTS\nexport type KumoDialogSize = keyof typeof KUMO_DIALOG_VARIANTS.size;\nexport type KumoDialogRole = keyof typeof KUMO_DIALOG_VARIANTS.role;\n\nexport interface KumoDialogVariantsProps {\n /**\n * Dialog width.\n * - `\"sm\"` — Small (min 288px) for simple confirmations\n * - `\"base\"` — Default (min 384px)\n * - `\"lg\"` — Large (min 512px) for complex content\n * - `\"xl\"` — Extra large (min 768px) for detailed views\n * @default \"base\"\n */\n size?: KumoDialogSize;\n}\n\n// ============================================================================\n// Dialog Role Context\n// ============================================================================\n\nconst DialogRoleContext = createContext<KumoDialogRole>(\"dialog\");\n\nfunction useDialogRole() {\n return useContext(DialogRoleContext);\n}\n\nexport function dialogVariants({\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: KumoDialogVariantsProps = {}) {\n return cn(\n // Base styles\n \"shadow-m fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0\",\n // Apply size from KUMO_DIALOG_VARIANTS\n KUMO_DIALOG_VARIANTS.size[size].classes,\n );\n}\n\n/**\n * Dialog component props — the modal content panel.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Open</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Confirm Action</Dialog.Title>\n * <Dialog.Description>Are you sure?</Dialog.Description>\n * <Dialog.Close render={(p) => <Button {...p}>Cancel</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nexport type DialogProps = KumoDialogVariantsProps & {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Dialog content (typically Title, Description, Close, and action buttons). */\n children: ReactNode;\n /** Inline styles. */\n style?: CSSProperties;\n /**\n * Container element for the portal. Use this to render the dialog inside\n * a Shadow DOM or custom container. Overrides `KumoPortalProvider` context.\n * @default document.body (or KumoPortalProvider container if set)\n */\n container?: PortalContainer;\n};\n\n/**\n * Modal dialog overlay with backdrop. Compound component with `Dialog.Root`,\n * `Dialog.Trigger`, `Dialog.Title`, `Dialog.Description`, and `Dialog.Close`.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Delete</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Item</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n *\n * @example Alert Dialog for destructive actions\n * ```tsx\n * <Dialog.Root role=\"alertdialog\">\n * <Dialog.Trigger render={(p) => <Button variant=\"destructive\" {...p}>Delete Project</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Project?</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"secondary\" {...p}>Cancel</Button>} />\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nfunction DialogContent({\n className,\n children,\n style,\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n container: containerProp,\n}: DialogProps) {\n const role = useDialogRole();\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n const BasePortal =\n role === \"alertdialog\" ? AlertDialogBase.Portal : DialogBase.Portal;\n const BaseBackdrop =\n role === \"alertdialog\" ? AlertDialogBase.Backdrop : DialogBase.Backdrop;\n const BasePopup =\n role === \"alertdialog\" ? AlertDialogBase.Popup : DialogBase.Popup;\n\n return (\n <BasePortal container={container}>\n <BaseBackdrop className=\"fixed inset-0 bg-kumo-recessed opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0\" />\n <Surface\n render={<BasePopup />}\n className={cn(dialogVariants({ size }), className)}\n style={\n {\n transitionProperty: \"scale, opacity\",\n transitionTimingFunction:\n \"var(--default-transition-timing-function)\",\n \"--tw-shadow\":\n \"0 20px 25px -5px rgb(0 0 0 / 0.03), 0 8px 10px -6px rgb(0 0 0 / 0.03)\",\n ...style,\n } as CSSProperties\n }\n >\n {children}\n </Surface>\n </BasePortal>\n );\n}\n\n// ============================================================================\n// Dialog Root\n// ============================================================================\n\ntype BaseDialogRootProps = ComponentPropsWithoutRef<typeof DialogBase.Root>;\n\nexport type DialogRootProps = BaseDialogRootProps & {\n /**\n * The ARIA role for the dialog.\n * - `\"dialog\"` — Standard dialog for general-purpose modals. Dismissible via outside click by default.\n * - `\"alertdialog\"` — Alert dialog for destructive or confirmation flows. Not dismissible via outside click.\n *\n * Use `role=\"alertdialog\"` for:\n * - Destructive actions (delete, discard, remove)\n * - Confirmation dialogs requiring explicit user acknowledgment\n * - Actions that cannot be undone\n *\n * @default \"dialog\"\n */\n role?: KumoDialogRole;\n};\n\nfunction DialogRoot({\n children,\n role = KUMO_DIALOG_DEFAULT_VARIANTS.role,\n ...props\n}: DialogRootProps) {\n const BaseRoot =\n role === \"alertdialog\" ? AlertDialogBase.Root : DialogBase.Root;\n return (\n <DialogRoleContext.Provider value={role}>\n <BaseRoot {...props}>{children}</BaseRoot>\n </DialogRoleContext.Provider>\n );\n}\n\nDialogRoot.displayName = \"Dialog.Root\";\n\n// ============================================================================\n// Dialog Trigger\n// ============================================================================\n\ntype BaseDialogTriggerProps = ComponentPropsWithoutRef<\n typeof DialogBase.Trigger\n>;\n\nexport type DialogTriggerProps = BaseDialogTriggerProps;\n\nfunction DialogTrigger({ children, ...props }: DialogTriggerProps) {\n const role = useDialogRole();\n const BaseTrigger =\n role === \"alertdialog\" ? AlertDialogBase.Trigger : DialogBase.Trigger;\n return <BaseTrigger {...props}>{children}</BaseTrigger>;\n}\n\nDialogTrigger.displayName = \"Dialog.Trigger\";\n\n// ============================================================================\n// Dialog Title\n// ============================================================================\n\ntype BaseDialogTitleProps = ComponentPropsWithoutRef<typeof DialogBase.Title>;\n\nexport type DialogTitleProps = BaseDialogTitleProps;\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n const role = useDialogRole();\n const BaseTitle =\n role === \"alertdialog\" ? AlertDialogBase.Title : DialogBase.Title;\n return <BaseTitle className={className} {...props} />;\n}\n\nDialogTitle.displayName = \"Dialog.Title\";\n\n// ============================================================================\n// Dialog Description\n// ============================================================================\n\ntype BaseDialogDescriptionProps = ComponentPropsWithoutRef<\n typeof DialogBase.Description\n>;\n\nexport type DialogDescriptionProps = BaseDialogDescriptionProps;\n\nfunction DialogDescription({ className, ...props }: DialogDescriptionProps) {\n const role = useDialogRole();\n const BaseDescription =\n role === \"alertdialog\"\n ? AlertDialogBase.Description\n : DialogBase.Description;\n return <BaseDescription className={className} {...props} />;\n}\n\nDialogDescription.displayName = \"Dialog.Description\";\n\n// ============================================================================\n// Dialog Close\n// ============================================================================\n\ntype BaseDialogCloseProps = ComponentPropsWithoutRef<typeof DialogBase.Close>;\n\nexport type DialogCloseProps = BaseDialogCloseProps;\n\nfunction DialogClose({ children, ...props }: DialogCloseProps) {\n const role = useDialogRole();\n const BaseClose =\n role === \"alertdialog\" ? AlertDialogBase.Close : DialogBase.Close;\n return <BaseClose {...props}>{children}</BaseClose>;\n}\n\nDialogClose.displayName = \"Dialog.Close\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nconst Dialog = Object.assign(DialogContent, {\n Root: DialogRoot,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n});\n\nexport {\n Dialog,\n DialogRoot,\n DialogTrigger,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"names":["KUMO_DIALOG_VARIANTS","KUMO_DIALOG_DEFAULT_VARIANTS","DialogRoleContext","createContext","useDialogRole","useContext","dialogVariants","size","cn","DialogContent","className","children","style","containerProp","role","contextContainer","usePortalContainer","jsxs","AlertDialogBase.Portal","DialogBase.Portal","jsx","AlertDialogBase.Backdrop","DialogBase.Backdrop","Surface","AlertDialogBase.Popup","DialogBase.Popup","DialogRoot","props","BaseRoot","AlertDialogBase.Root","DialogBase.Root","DialogTrigger","BaseTrigger","AlertDialogBase.Trigger","DialogBase.Trigger","DialogTitle","BaseTitle","AlertDialogBase.Title","DialogBase.Title","DialogDescription","BaseDescription","AlertDialogBase.Description","DialogBase.Description","DialogClose","BaseClose","AlertDialogBase.Close","DialogBase.Close","Dialog"],"mappings":"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"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as o, jsxs as u, Fragment as F } from "react/jsx-runtime";
|
|
3
|
-
import * as
|
|
3
|
+
import * as s from "react";
|
|
4
4
|
import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
|
|
5
5
|
import { u as K } from "./link-provider-mn2voeohon7cj9o4.js";
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
6
|
+
import { u as U } from "./portal-provider-hwmkdmkpvct0cb76.js";
|
|
7
|
+
import { CheckIcon as f, CaretRightIcon as W } from "@phosphor-icons/react";
|
|
8
|
+
import { ax as B, ay as H, az as J, aA as q, aB as w, S as M, aC as N, aD as Q, aE as X, aF as k, aG as Y, aH as Z, aI as y, aJ as $, aK as ee, aL as R, aM as te } from "./vendor-base-ui-n30qblevnpk9cc5c.js";
|
|
9
|
+
const ae = {
|
|
9
10
|
variant: {
|
|
10
11
|
default: {
|
|
11
12
|
classes: "",
|
|
@@ -16,18 +17,18 @@ const te = {
|
|
|
16
17
|
description: "Destructive action item"
|
|
17
18
|
}
|
|
18
19
|
}
|
|
19
|
-
},
|
|
20
|
+
}, ne = {
|
|
20
21
|
variant: "default"
|
|
21
22
|
};
|
|
22
23
|
function D({
|
|
23
|
-
variant: e =
|
|
24
|
+
variant: e = ne.variant
|
|
24
25
|
} = {}) {
|
|
25
|
-
return i(
|
|
26
|
+
return i(ae.variant[e].classes);
|
|
26
27
|
}
|
|
27
|
-
const I =
|
|
28
|
+
const I = s.forwardRef(({ className: e, inset: t, children: a, icon: n, ...r }, d) => /* @__PURE__ */ u(
|
|
28
29
|
R,
|
|
29
30
|
{
|
|
30
|
-
ref:
|
|
31
|
+
ref: d,
|
|
31
32
|
className: i(
|
|
32
33
|
"flex cursor-default items-center rounded-sm text-base outline-hidden select-none",
|
|
33
34
|
// base styles
|
|
@@ -45,91 +46,96 @@ const I = d.forwardRef(({ className: e, inset: t, children: a, icon: n, ...r },
|
|
|
45
46
|
children: [
|
|
46
47
|
n && /* @__PURE__ */ o(n, { className: "mr-2 h-4 w-4" }),
|
|
47
48
|
a,
|
|
48
|
-
/* @__PURE__ */ o(
|
|
49
|
+
/* @__PURE__ */ o(W, { className: "ml-auto h-4 w-4" })
|
|
49
50
|
]
|
|
50
51
|
}
|
|
51
52
|
));
|
|
52
53
|
I.displayName = R.displayName;
|
|
53
|
-
const
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
sideOffset: t,
|
|
58
|
-
...n,
|
|
59
|
-
children: /* @__PURE__ */ o(
|
|
54
|
+
const b = s.forwardRef(
|
|
55
|
+
({ className: e, sideOffset: t = 8, children: a, container: n, ...r }, d) => {
|
|
56
|
+
const l = U();
|
|
57
|
+
return /* @__PURE__ */ o(w, { container: n ?? l ?? void 0, children: /* @__PURE__ */ o(
|
|
60
58
|
$,
|
|
61
59
|
{
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
60
|
+
ref: d,
|
|
61
|
+
sideOffset: t,
|
|
62
|
+
...r,
|
|
63
|
+
children: /* @__PURE__ */ o(
|
|
64
|
+
ee,
|
|
65
|
+
{
|
|
66
|
+
className: i(
|
|
67
|
+
"overflow-hidden bg-kumo-control text-kumo-default",
|
|
68
|
+
// background
|
|
69
|
+
"rounded-lg shadow-lg ring ring-kumo-line",
|
|
70
|
+
// border part
|
|
71
|
+
"min-w-36 p-1.5",
|
|
72
|
+
// spacing
|
|
73
|
+
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
74
|
+
// open animation
|
|
75
|
+
"data-[side=bottom]:slide-in-from-top-2",
|
|
76
|
+
// bottom side animation
|
|
77
|
+
"data-[side=left]:slide-in-from-right-2",
|
|
78
|
+
// left side animation
|
|
79
|
+
"data-[side=right]:slide-in-from-left-2",
|
|
80
|
+
// right side animation
|
|
81
|
+
"data-[side=top]:slide-in-from-bottom-2",
|
|
82
|
+
// top side animation
|
|
83
|
+
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
|
84
|
+
// close animation
|
|
85
|
+
e
|
|
86
|
+
),
|
|
87
|
+
children: a
|
|
88
|
+
}
|
|
89
|
+
)
|
|
84
90
|
}
|
|
85
|
-
)
|
|
91
|
+
) });
|
|
86
92
|
}
|
|
87
|
-
)
|
|
93
|
+
), g = (e) => e ? s.isValidElement(e) ? e : /* @__PURE__ */ o(e, { className: "mr-2 h-4 w-4" }) : null, v = s.forwardRef(
|
|
88
94
|
({
|
|
89
95
|
className: e,
|
|
90
96
|
inset: t,
|
|
91
97
|
icon: a,
|
|
92
98
|
children: n,
|
|
93
99
|
selected: r,
|
|
94
|
-
render:
|
|
100
|
+
render: d,
|
|
95
101
|
href: l,
|
|
96
|
-
variant:
|
|
102
|
+
variant: m = "default",
|
|
97
103
|
...G
|
|
98
104
|
}, _) => {
|
|
99
|
-
const h = K(),
|
|
105
|
+
const h = K(), c = s.useMemo(
|
|
100
106
|
() => /* @__PURE__ */ u(F, { children: [
|
|
101
107
|
a && g(a),
|
|
102
108
|
n,
|
|
103
109
|
r && /* @__PURE__ */ o("span", { className: "inline-flex", children: /* @__PURE__ */ o(f, {}) })
|
|
104
110
|
] }),
|
|
105
111
|
[a, n, r]
|
|
106
|
-
), V =
|
|
112
|
+
), V = s.useMemo(() => {
|
|
107
113
|
if (!l) return;
|
|
108
|
-
const z = /^(https?:)?\/\//.test(l),
|
|
114
|
+
const z = /^(https?:)?\/\//.test(l), x = i(
|
|
109
115
|
"flex items-center",
|
|
110
|
-
|
|
116
|
+
m === "danger" && "text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger"
|
|
111
117
|
);
|
|
112
118
|
return z ? /* @__PURE__ */ o(
|
|
113
119
|
"a",
|
|
114
120
|
{
|
|
115
|
-
className: i(
|
|
121
|
+
className: i(x, "w-full text-inherit! no-underline!"),
|
|
116
122
|
href: l,
|
|
117
123
|
target: "_blank",
|
|
118
124
|
rel: "noreferrer",
|
|
119
125
|
onClick: (p) => p.stopPropagation(),
|
|
120
|
-
children:
|
|
126
|
+
children: c
|
|
121
127
|
}
|
|
122
128
|
) : /* @__PURE__ */ o(
|
|
123
129
|
h,
|
|
124
130
|
{
|
|
125
|
-
className: i(
|
|
131
|
+
className: i(x, "w-full text-inherit! no-underline!"),
|
|
126
132
|
href: l,
|
|
127
133
|
to: l,
|
|
128
134
|
onClick: (p) => p.stopPropagation(),
|
|
129
|
-
children:
|
|
135
|
+
children: c
|
|
130
136
|
}
|
|
131
137
|
);
|
|
132
|
-
}, [l,
|
|
138
|
+
}, [l, c, m, h]), j = l || d;
|
|
133
139
|
return /* @__PURE__ */ o(
|
|
134
140
|
y,
|
|
135
141
|
{
|
|
@@ -137,27 +143,27 @@ const x = d.forwardRef(({ className: e, sideOffset: t = 8, children: a, ...n },
|
|
|
137
143
|
className: i(
|
|
138
144
|
"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none focus:text-kumo-default data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay",
|
|
139
145
|
t && "pl-8",
|
|
140
|
-
D({ variant:
|
|
146
|
+
D({ variant: m }),
|
|
141
147
|
e
|
|
142
148
|
),
|
|
143
|
-
render: l ? V :
|
|
149
|
+
render: l ? V : d,
|
|
144
150
|
...G,
|
|
145
|
-
children: j ? void 0 :
|
|
151
|
+
children: j ? void 0 : c
|
|
146
152
|
}
|
|
147
153
|
);
|
|
148
154
|
}
|
|
149
155
|
);
|
|
150
156
|
v.displayName = y.displayName;
|
|
151
|
-
const S =
|
|
157
|
+
const S = s.forwardRef(
|
|
152
158
|
({
|
|
153
159
|
className: e,
|
|
154
160
|
inset: t,
|
|
155
161
|
icon: a,
|
|
156
162
|
children: n,
|
|
157
163
|
variant: r = "default",
|
|
158
|
-
...
|
|
164
|
+
...d
|
|
159
165
|
}, l) => /* @__PURE__ */ u(
|
|
160
|
-
|
|
166
|
+
Z,
|
|
161
167
|
{
|
|
162
168
|
ref: l,
|
|
163
169
|
className: i(
|
|
@@ -168,7 +174,7 @@ const S = d.forwardRef(
|
|
|
168
174
|
D({ variant: r }),
|
|
169
175
|
e
|
|
170
176
|
),
|
|
171
|
-
...
|
|
177
|
+
...d,
|
|
172
178
|
children: [
|
|
173
179
|
a && g(a),
|
|
174
180
|
n
|
|
@@ -177,7 +183,7 @@ const S = d.forwardRef(
|
|
|
177
183
|
)
|
|
178
184
|
);
|
|
179
185
|
S.displayName = "DropdownMenuLinkItem";
|
|
180
|
-
const
|
|
186
|
+
const C = s.forwardRef(({ className: e, children: t, checked: a, ...n }, r) => /* @__PURE__ */ u(
|
|
181
187
|
k,
|
|
182
188
|
{
|
|
183
189
|
ref: r,
|
|
@@ -188,13 +194,13 @@ const L = d.forwardRef(({ className: e, children: t, checked: a, ...n }, r) => /
|
|
|
188
194
|
checked: a,
|
|
189
195
|
...n,
|
|
190
196
|
children: [
|
|
191
|
-
/* @__PURE__ */ o(
|
|
197
|
+
/* @__PURE__ */ o(Y, { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit", children: /* @__PURE__ */ o(f, { weight: "bold", size: 12 }) }),
|
|
192
198
|
t
|
|
193
199
|
]
|
|
194
200
|
}
|
|
195
201
|
));
|
|
196
|
-
|
|
197
|
-
const
|
|
202
|
+
C.displayName = k.displayName;
|
|
203
|
+
const L = s.forwardRef(({ className: e, inset: t, ...a }, n) => /* @__PURE__ */ o(
|
|
198
204
|
N,
|
|
199
205
|
{
|
|
200
206
|
ref: n,
|
|
@@ -206,8 +212,8 @@ const C = d.forwardRef(({ className: e, inset: t, ...a }, n) => /* @__PURE__ */
|
|
|
206
212
|
...a
|
|
207
213
|
}
|
|
208
214
|
));
|
|
209
|
-
|
|
210
|
-
const
|
|
215
|
+
L.displayName = N.displayName;
|
|
216
|
+
const P = s.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ o(
|
|
211
217
|
M,
|
|
212
218
|
{
|
|
213
219
|
ref: a,
|
|
@@ -215,8 +221,8 @@ const T = d.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ o(
|
|
|
215
221
|
...t
|
|
216
222
|
}
|
|
217
223
|
));
|
|
218
|
-
|
|
219
|
-
const
|
|
224
|
+
P.displayName = M.displayName;
|
|
225
|
+
const T = ({
|
|
220
226
|
className: e,
|
|
221
227
|
...t
|
|
222
228
|
}) => /* @__PURE__ */ o(
|
|
@@ -226,11 +232,11 @@ const P = ({
|
|
|
226
232
|
...t
|
|
227
233
|
}
|
|
228
234
|
);
|
|
229
|
-
|
|
230
|
-
const O =
|
|
231
|
-
|
|
235
|
+
T.displayName = "DropdownMenuShortcut";
|
|
236
|
+
const O = s.forwardRef(({ className: e, children: t, inset: a, icon: n, ...r }, d) => /* @__PURE__ */ u(
|
|
237
|
+
X,
|
|
232
238
|
{
|
|
233
|
-
ref:
|
|
239
|
+
ref: d,
|
|
234
240
|
className: i(
|
|
235
241
|
"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none",
|
|
236
242
|
"data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-tint",
|
|
@@ -245,8 +251,8 @@ const O = d.forwardRef(({ className: e, children: t, inset: a, icon: n, ...r },
|
|
|
245
251
|
}
|
|
246
252
|
));
|
|
247
253
|
O.displayName = "DropdownMenuRadioItem";
|
|
248
|
-
const A =
|
|
249
|
-
|
|
254
|
+
const A = s.forwardRef(({ className: e, children: t, ...a }, n) => /* @__PURE__ */ o(
|
|
255
|
+
Q,
|
|
250
256
|
{
|
|
251
257
|
ref: n,
|
|
252
258
|
className: i("ml-auto", e),
|
|
@@ -255,40 +261,40 @@ const A = d.forwardRef(({ className: e, children: t, ...a }, n) => /* @__PURE__
|
|
|
255
261
|
}
|
|
256
262
|
));
|
|
257
263
|
A.displayName = "DropdownMenuRadioItemIndicator";
|
|
258
|
-
const E =
|
|
259
|
-
const r =
|
|
264
|
+
const E = s.forwardRef(({ children: e, render: t, ...a }, n) => {
|
|
265
|
+
const r = s.isValidElement(e) ? e : null, d = t ?? r;
|
|
260
266
|
return /* @__PURE__ */ o(
|
|
261
|
-
|
|
267
|
+
te,
|
|
262
268
|
{
|
|
263
269
|
ref: n,
|
|
264
270
|
...a,
|
|
265
|
-
...
|
|
266
|
-
render:
|
|
271
|
+
...d && {
|
|
272
|
+
render: d
|
|
267
273
|
},
|
|
268
274
|
children: r ? void 0 : e
|
|
269
275
|
}
|
|
270
276
|
);
|
|
271
277
|
});
|
|
272
278
|
E.displayName = "DropdownMenuTrigger";
|
|
273
|
-
const
|
|
279
|
+
const ue = Object.assign(B, {
|
|
274
280
|
Trigger: E,
|
|
275
281
|
Portal: w,
|
|
276
|
-
Sub:
|
|
282
|
+
Sub: q,
|
|
277
283
|
SubTrigger: I,
|
|
278
|
-
SubContent:
|
|
279
|
-
Content:
|
|
284
|
+
SubContent: b,
|
|
285
|
+
Content: b,
|
|
280
286
|
Item: v,
|
|
281
287
|
LinkItem: S,
|
|
282
|
-
CheckboxItem:
|
|
283
|
-
RadioGroup:
|
|
288
|
+
CheckboxItem: C,
|
|
289
|
+
RadioGroup: J,
|
|
284
290
|
RadioItem: O,
|
|
285
291
|
RadioItemIndicator: A,
|
|
286
|
-
Label:
|
|
287
|
-
Separator:
|
|
288
|
-
Shortcut:
|
|
289
|
-
Group:
|
|
292
|
+
Label: L,
|
|
293
|
+
Separator: P,
|
|
294
|
+
Shortcut: T,
|
|
295
|
+
Group: H
|
|
290
296
|
});
|
|
291
297
|
export {
|
|
292
|
-
|
|
298
|
+
ue as D
|
|
293
299
|
};
|
|
294
|
-
//# sourceMappingURL=dropdown-
|
|
300
|
+
//# sourceMappingURL=dropdown-g587px7zv3ssaxr4.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-g587px7zv3ssaxr4.js","sources":["../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import { Menu as DropdownMenuPrimitive } from \"@base-ui/react/menu\";\nimport * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\nimport {\n CaretRightIcon as CaretRight,\n CheckIcon,\n CheckIcon as Check,\n type Icon,\n} from \"@phosphor-icons/react\";\n\n/** Dropdown item variant definitions (default and danger styles). */\nexport const KUMO_DROPDOWN_VARIANTS = {\n variant: {\n default: {\n classes: \"\",\n description: \"Default dropdown item appearance\",\n },\n danger: {\n classes:\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n description: \"Destructive action item\",\n },\n },\n} as const;\n\nexport const KUMO_DROPDOWN_DEFAULT_VARIANTS = {\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_DROPDOWN_VARIANTS\nexport type KumoDropdownVariant = keyof typeof KUMO_DROPDOWN_VARIANTS.variant;\n\nexport interface KumoDropdownVariantsProps {\n /**\n * Visual style of the dropdown item.\n * - `\"default\"` — Standard item appearance\n * - `\"danger\"` — Destructive action with red text\n * @default \"default\"\n */\n variant?: KumoDropdownVariant;\n}\n\nexport function dropdownVariants({\n variant = KUMO_DROPDOWN_DEFAULT_VARIANTS.variant,\n}: KumoDropdownVariantsProps = {}) {\n return cn(KUMO_DROPDOWN_VARIANTS.variant[variant].classes);\n}\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubmenuTrigger\n > & {\n inset?: boolean;\n icon?: Icon;\n }\n>(({ className, inset, children, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.SubmenuTrigger\n ref={ref}\n className={cn(\n \"flex cursor-default items-center rounded-sm text-base outline-hidden select-none\", // base styles\n \"px-2 py-1.5\", // spacing\n \"focus:bg-kumo-tint\", // focus state\n \"data-[state=open]:bg-kumo-tint\", // open state\n inset && \"pl-8\", // conditional inset\n className,\n )}\n {...props}\n >\n {IconComponent && <IconComponent className=\"mr-2 h-4 w-4\" />}\n {children}\n <CaretRight className=\"ml-auto h-4 w-4\" />\n </DropdownMenuPrimitive.SubmenuTrigger>\n));\n\nDropdownMenuSubTrigger.displayName =\n DropdownMenuPrimitive.SubmenuTrigger.displayName;\n\nconst DropdownMenuContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Positioner>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Positioner> & {\n /**\n * Container element for the portal. Use this to render the dropdown inside\n * a Shadow DOM or custom container. Overrides `KumoPortalProvider` context.\n * @default document.body (or KumoPortalProvider container if set)\n */\n container?: PortalContainer;\n }\n>(\n (\n { className, sideOffset = 8, children, container: containerProp, ...props },\n ref,\n ) => {\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n return (\n <DropdownMenuPrimitive.Portal container={container}>\n <DropdownMenuPrimitive.Positioner\n ref={ref}\n sideOffset={sideOffset}\n {...props}\n >\n <DropdownMenuPrimitive.Popup\n className={cn(\n \"overflow-hidden bg-kumo-control text-kumo-default\", // background\n \"rounded-lg shadow-lg ring ring-kumo-line\", // border part\n \"min-w-36 p-1.5\", // spacing\n \"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\", // open animation\n \"data-[side=bottom]:slide-in-from-top-2\", // bottom side animation\n \"data-[side=left]:slide-in-from-right-2\", // left side animation\n \"data-[side=right]:slide-in-from-left-2\", // right side animation\n \"data-[side=top]:slide-in-from-bottom-2\", // top side animation\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\", // close animation\n className,\n )}\n >\n {children}\n </DropdownMenuPrimitive.Popup>\n </DropdownMenuPrimitive.Positioner>\n </DropdownMenuPrimitive.Portal>\n );\n },\n);\n\nconst renderIconNode = (IconComponent?: Icon | React.ReactNode) => {\n if (!IconComponent) return null;\n if (React.isValidElement(IconComponent)) return IconComponent;\n const Comp = IconComponent as React.ComponentType<Record<string, unknown>>;\n return <Comp className=\"mr-2 h-4 w-4\" />;\n};\n\n/**\n * DropdownMenuItem — a single actionable item within a dropdown menu.\n *\n * For navigation links, use `DropdownMenu.LinkItem` instead.\n *\n * @example\n * ```tsx\n * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n * <DropdownMenu.Item icon={CopyIcon}>Duplicate</DropdownMenu.Item>\n * <DropdownMenu.Item variant=\"danger\">Delete</DropdownMenu.Item>\n * ```\n */\nconst DropdownMenuItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n selected?: boolean;\n /**\n * @deprecated Use `DropdownMenu.LinkItem` instead for navigation links.\n * This prop will be removed in a future major version.\n */\n href?: string;\n variant?: \"default\" | \"danger\";\n }\n>(\n (\n {\n className,\n inset,\n icon: IconComponent,\n children,\n selected,\n render,\n href,\n variant = \"default\",\n ...props\n },\n ref,\n ) => {\n const LinkComponent = useLinkComponent();\n\n // Build the inner content with icon, children, and selected indicator\n const innerContent = React.useMemo(\n () => (\n <>\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n {selected && (\n <span className=\"inline-flex\">\n <Check />\n </span>\n )}\n </>\n ),\n [IconComponent, children, selected],\n );\n\n // Legacy href support (deprecated)\n const linkContent = React.useMemo(() => {\n if (!href) return undefined;\n\n // Matches http://, https://, or protocol-relative //\n const isExternal = /^(https?:)?\\/\\//.test(href);\n const styles = cn(\n \"flex items-center\",\n variant === \"danger\" &&\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n );\n if (isExternal) {\n return (\n <a\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n target=\"_blank\"\n rel=\"noreferrer\"\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </a>\n );\n }\n return (\n <LinkComponent\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n to={href}\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </LinkComponent>\n );\n }, [href, innerContent, variant, LinkComponent]);\n\n // When href is provided, use linkContent as render prop\n // When render prop is provided, caller controls children rendering\n const useRenderProp = href || render;\n\n return (\n <DropdownMenuPrimitive.Item\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none focus:text-kumo-default data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay\",\n inset && \"pl-8\",\n dropdownVariants({ variant }),\n className,\n )}\n render={href ? linkContent : render}\n {...props}\n >\n {useRenderProp ? undefined : innerContent}\n </DropdownMenuPrimitive.Item>\n );\n },\n);\n\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\n/**\n * DropdownMenuLinkItem — a menu item that navigates to a URL.\n *\n * Use this instead of `DropdownMenu.Item` with `href` for navigation links.\n * Provides full control over link attributes like `target` and `rel`.\n *\n * @example\n * ```tsx\n * // External link\n * <DropdownMenu.LinkItem href=\"https://example.com\" target=\"_blank\">\n * Documentation\n * </DropdownMenu.LinkItem>\n *\n * // Internal link\n * <DropdownMenu.LinkItem href=\"/settings\">\n * Settings\n * </DropdownMenu.LinkItem>\n *\n * // With icon\n * <DropdownMenu.LinkItem href=\"/profile\" icon={UserIcon}>\n * Profile\n * </DropdownMenu.LinkItem>\n * ```\n */\nconst DropdownMenuLinkItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.LinkItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.LinkItem> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n variant?: \"default\" | \"danger\";\n }\n>(\n (\n {\n className,\n inset,\n icon: IconComponent,\n children,\n variant = \"default\",\n ...props\n },\n ref,\n ) => {\n return (\n <DropdownMenuPrimitive.LinkItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none\",\n \"focus:text-kumo-default data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay\",\n \"text-inherit no-underline\",\n inset && \"pl-8\",\n dropdownVariants({ variant }),\n className,\n )}\n {...props}\n >\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n </DropdownMenuPrimitive.LinkItem>\n );\n },\n);\n\nDropdownMenuLinkItem.displayName = \"DropdownMenuLinkItem\";\n\nconst DropdownMenuCheckboxItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n <DropdownMenuPrimitive.CheckboxItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-base outline-hidden transition-colors select-none focus:bg-kumo-tint focus:text-kumo-default data-disabled:pointer-events-none data-disabled:opacity-50\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <DropdownMenuPrimitive.CheckboxItemIndicator className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit\">\n <CheckIcon weight=\"bold\" size={12} />\n </DropdownMenuPrimitive.CheckboxItemIndicator>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName =\n DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuLabel = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.GroupLabel>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.GroupLabel> & {\n inset?: boolean;\n }\n>(({ className, inset, ...props }, ref) => (\n <DropdownMenuPrimitive.GroupLabel\n ref={ref}\n className={cn(\n \"px-2 py-1.5 text-base font-semibold\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n />\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.GroupLabel.displayName;\n\nconst DropdownMenuSeparator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.Separator\n ref={ref}\n className={cn(\"-mx-1 my-1 h-px bg-kumo-line\", className)}\n {...props}\n />\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={cn(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n {...props}\n />\n );\n};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nconst DropdownMenuRadioItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n }\n>(({ className, children, inset, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none\",\n \"data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-tint\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n >\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n </DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = \"DropdownMenuRadioItem\";\n\nconst DropdownMenuRadioItemIndicator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItemIndicator>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.RadioItemIndicator\n >\n>(({ className, children, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItemIndicator\n ref={ref}\n className={cn(\"ml-auto\", className)}\n {...props}\n >\n {children ?? <Check className=\"h-4 w-4\" />}\n </DropdownMenuPrimitive.RadioItemIndicator>\n));\nDropdownMenuRadioItemIndicator.displayName = \"DropdownMenuRadioItemIndicator\";\n\n/**\n * Custom Trigger that converts a single child element to the `render` prop\n * to avoid nested button issues with base-ui's Menu.Trigger.\n */\nconst DropdownMenuTrigger = React.forwardRef<\n HTMLButtonElement,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger>\n>(({ children, render, ...props }, ref) => {\n // If render prop is provided, use it directly\n // Otherwise, convert single child element to render prop\n const childElement = React.isValidElement(children) ? children : null;\n const effectiveRender = render ?? childElement;\n\n return (\n <DropdownMenuPrimitive.Trigger\n ref={ref}\n {...props}\n {...(effectiveRender && {\n render: effectiveRender as React.ReactElement<Record<string, unknown>>,\n })}\n >\n {/* Only pass children if not using as render prop */}\n {childElement ? undefined : children}\n </DropdownMenuPrimitive.Trigger>\n );\n});\nDropdownMenuTrigger.displayName = \"DropdownMenuTrigger\";\n\n/**\n * DropdownMenu — accessible dropdown menu anchored to a trigger.\n *\n * Compound component: `DropdownMenu` (Root), `.Trigger`, `.Content`, `.Item`,\n * `.LinkItem`, `.CheckboxItem`, `.RadioGroup`, `.RadioItem`, `.RadioItemIndicator`,\n * `.Sub`, `.SubTrigger`, `.SubContent`, `.Label`, `.Separator`, `.Shortcut`, `.Group`.\n *\n * Built on `@base-ui/react/menu`.\n *\n * @example\n * ```tsx\n * <DropdownMenu>\n * <DropdownMenu.Trigger>\n * <Button>Actions</Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n * <DropdownMenu.Item icon={CopyIcon}>Duplicate</DropdownMenu.Item>\n * <DropdownMenu.LinkItem href=\"/settings\" icon={GearIcon}>Settings</DropdownMenu.LinkItem>\n * <DropdownMenu.Separator />\n * <DropdownMenu.Item variant=\"danger\">Delete</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu>\n * ```\n *\n * @see https://base-ui.com/react/components/menu\n */\nexport const DropdownMenu = Object.assign(DropdownMenuPrimitive.Root, {\n Trigger: DropdownMenuTrigger,\n Portal: DropdownMenuPrimitive.Portal,\n Sub: DropdownMenuPrimitive.SubmenuRoot,\n SubTrigger: DropdownMenuSubTrigger,\n SubContent: DropdownMenuContent,\n Content: DropdownMenuContent,\n Item: DropdownMenuItem,\n LinkItem: DropdownMenuLinkItem,\n CheckboxItem: DropdownMenuCheckboxItem,\n RadioGroup: DropdownMenuPrimitive.RadioGroup,\n RadioItem: DropdownMenuRadioItem,\n RadioItemIndicator: DropdownMenuRadioItemIndicator,\n Label: DropdownMenuLabel,\n Separator: DropdownMenuSeparator,\n Shortcut: DropdownMenuShortcut,\n Group: DropdownMenuPrimitive.Group,\n});\n"],"names":["KUMO_DROPDOWN_VARIANTS","KUMO_DROPDOWN_DEFAULT_VARIANTS","dropdownVariants","variant","cn","DropdownMenuSubTrigger","React","className","inset","children","IconComponent","props","ref","jsxs","DropdownMenuPrimitive.SubmenuTrigger","jsx","CaretRight","DropdownMenuContent","sideOffset","containerProp","contextContainer","usePortalContainer","DropdownMenuPrimitive.Portal","DropdownMenuPrimitive.Positioner","DropdownMenuPrimitive.Popup","renderIconNode","DropdownMenuItem","selected","render","href","LinkComponent","useLinkComponent","innerContent","Fragment","Check","linkContent","isExternal","styles","e","useRenderProp","DropdownMenuPrimitive.Item","DropdownMenuLinkItem","DropdownMenuPrimitive.LinkItem","DropdownMenuCheckboxItem","checked","DropdownMenuPrimitive.CheckboxItem","DropdownMenuPrimitive.CheckboxItemIndicator","CheckIcon","DropdownMenuLabel","DropdownMenuPrimitive.GroupLabel","DropdownMenuSeparator","DropdownMenuPrimitive.Separator","DropdownMenuShortcut","DropdownMenuRadioItem","DropdownMenuPrimitive.RadioItem","DropdownMenuRadioItemIndicator","DropdownMenuPrimitive.RadioItemIndicator","DropdownMenuTrigger","childElement","effectiveRender","DropdownMenuPrimitive.Trigger","DropdownMenu","DropdownMenuPrimitive.Root","DropdownMenuPrimitive.SubmenuRoot","DropdownMenuPrimitive.RadioGroup","DropdownMenuPrimitive.Group"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { jsxs as l, jsx as e } from "react/jsx-runtime";
|
|
3
3
|
import { CheckIcon as u, CopyIcon as d } from "@phosphor-icons/react";
|
|
4
4
|
import { useState as x } from "react";
|
|
5
|
-
import { B as f } from "./button-
|
|
5
|
+
import { B as f } from "./button-odxi0hp4fvi5i2w3.js";
|
|
6
6
|
import { c as a } from "./cn-ct4n7r74mh8y0f48.js";
|
|
7
7
|
const h = {
|
|
8
8
|
size: {
|
|
@@ -90,4 +90,4 @@ export {
|
|
|
90
90
|
b as a,
|
|
91
91
|
g as e
|
|
92
92
|
};
|
|
93
|
-
//# sourceMappingURL=empty-
|
|
93
|
+
//# sourceMappingURL=empty-fuz1un7r7mbz0kim.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"empty-
|
|
1
|
+
{"version":3,"file":"empty-fuz1un7r7mbz0kim.js","sources":["../../src/components/empty/empty.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { useState } from \"react\";\nimport { Button } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\n\n/** Empty state size variant definitions mapping sizes to their Tailwind classes. */\nexport const KUMO_EMPTY_VARIANTS = {\n size: {\n sm: {\n classes: \"px-6 py-8 gap-4\",\n description: \"Compact empty state for smaller containers\",\n },\n base: {\n classes: \"px-10 py-16 gap-6\",\n description: \"Default empty state size\",\n },\n lg: {\n classes: \"px-12 py-20 gap-8\",\n description: \"Large empty state for prominent placement\",\n },\n },\n} as const;\n\nexport const KUMO_EMPTY_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\nexport type KumoEmptySize = keyof typeof KUMO_EMPTY_VARIANTS.size;\n\nexport interface KumoEmptyVariantsProps {\n /**\n * Size of the empty state container.\n * - `\"sm\"` — Compact empty state for smaller containers\n * - `\"base\"` — Default empty state size\n * - `\"lg\"` — Large empty state for prominent placement\n * @default \"base\"\n */\n size?: KumoEmptySize;\n}\n\nexport function emptyVariants({\n size = KUMO_EMPTY_DEFAULT_VARIANTS.size,\n}: KumoEmptyVariantsProps = {}) {\n return cn(\n \"flex w-full flex-col items-center rounded-xl border border-kumo-fill bg-kumo-control text-kumo-default\",\n KUMO_EMPTY_VARIANTS.size[size].classes,\n );\n}\n\n/**\n * Empty state component props.\n *\n * @example\n * ```tsx\n * <Empty\n * icon={<PackageIcon size={48} />}\n * title=\"No packages found\"\n * description=\"Get started by installing your first package.\"\n * commandLine=\"npm install @cloudflare/kumo\"\n * />\n * ```\n */\nexport interface EmptyProps extends KumoEmptyVariantsProps {\n /** Decorative icon displayed above the title (e.g. from `@phosphor-icons/react`). */\n icon?: React.ReactNode;\n /** Primary heading text for the empty state. */\n title: string;\n /** Secondary description text displayed below the title. */\n description?: string;\n /** Shell command displayed in a copyable code block. */\n commandLine?: string;\n /** Additional content (buttons, links) rendered below the description. */\n contents?: React.ReactNode;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n}\n\n/**\n * Placeholder shown when a list, table, or page has no content to display.\n *\n * @example\n * ```tsx\n * <Empty title=\"No results found\" description=\"Try adjusting your search.\" />\n * ```\n */\nexport function Empty({\n icon,\n title,\n description,\n commandLine,\n contents,\n size = \"base\",\n className,\n}: EmptyProps) {\n const [emptyStateCopied, setEmptyStateCopied] = useState<boolean>(false);\n\n return (\n <div className={cn(emptyVariants({ size }), className)}>\n {icon}\n <h2 className=\"text-2xl font-semibold\">{title}</h2>\n\n {description && (\n <p className=\"max-w-140 text-center text-kumo-strong\">{description}</p>\n )}\n\n {commandLine && (\n <div\n className={cn(\n \"group/cmd relative inline-flex h-10 max-w-8/10 transform-gpu items-center gap-2 rounded-lg font-mono shadow-sm\",\n \"bg-kumo-overlay pr-2 pl-3\",\n \"transition-all duration-300 hover:border-kumo-interact/80 hover:shadow-md\",\n \"border border-kumo-fill/60\",\n )}\n >\n <span className=\"text-xs text-kumo-inactive select-none\">$</span>\n <span className=\"no-scrollbar overflow-scroll text-[14px] whitespace-nowrap text-kumo-brand\">\n {commandLine}\n </span>\n <Button\n className=\"group\"\n size=\"sm\"\n variant=\"ghost\"\n shape=\"square\"\n aria-label=\"Copy command\"\n onClick={async () => {\n setEmptyStateCopied(true);\n setTimeout(() => {\n setEmptyStateCopied(false);\n }, 1000);\n await navigator.clipboard.writeText(commandLine);\n }}\n >\n {emptyStateCopied ? (\n <CheckIcon size={16} className=\"animate-bounce-in text-kumo-success\" />\n ) : (\n <CopyIcon\n size={16}\n className=\"text-kumo-inactive group-hover:text-kumo-brand\"\n />\n )}\n </Button>\n </div>\n )}\n\n {contents}\n </div>\n );\n}\n"],"names":["KUMO_EMPTY_VARIANTS","KUMO_EMPTY_DEFAULT_VARIANTS","emptyVariants","size","cn","Empty","icon","title","description","commandLine","contents","className","emptyStateCopied","setEmptyStateCopied","useState","jsxs","jsx","Button","CheckIcon","CopyIcon"],"mappings":";;;;;;AAMO,MAAMA,IAAsB;AAAA,EACjC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA8B;AAAA,EACzC,MAAM;AACR;AAeO,SAASC,EAAc;AAAA,EAC5B,MAAAC,IAAOF,EAA4B;AACrC,IAA4B,IAAI;AAC9B,SAAOG;AAAA,IACL;AAAA,IACAJ,EAAoB,KAAKG,CAAI,EAAE;AAAA,EAAA;AAEnC;AAsCO,SAASE,EAAM;AAAA,EACpB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAP,IAAO;AAAA,EACP,WAAAQ;AACF,GAAe;AACb,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAkB,EAAK;AAEvE,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWX,EAAGF,EAAc,EAAE,MAAAC,EAAA,CAAM,GAAGQ,CAAS,GAClD,UAAA;AAAA,IAAAL;AAAA,IACD,gBAAAU,EAAC,MAAA,EAAG,WAAU,0BAA0B,UAAAT,GAAM;AAAA,IAE7CC,KACC,gBAAAQ,EAAC,KAAA,EAAE,WAAU,0CAA0C,UAAAR,GAAY;AAAA,IAGpEC,KACC,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWX;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAGF,UAAA;AAAA,UAAA,gBAAAY,EAAC,QAAA,EAAK,WAAU,0CAAyC,UAAA,KAAC;AAAA,UAC1D,gBAAAA,EAAC,QAAA,EAAK,WAAU,8EACb,UAAAP,GACH;AAAA,UACA,gBAAAO;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,MAAK;AAAA,cACL,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,cAAW;AAAA,cACX,SAAS,YAAY;AACnB,gBAAAJ,EAAoB,EAAI,GACxB,WAAW,MAAM;AACf,kBAAAA,EAAoB,EAAK;AAAA,gBAC3B,GAAG,GAAI,GACP,MAAM,UAAU,UAAU,UAAUJ,CAAW;AAAA,cACjD;AAAA,cAEC,cACC,gBAAAO,EAACE,GAAA,EAAU,MAAM,IAAI,WAAU,uCAAsC,IAErE,gBAAAF;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,MAAM;AAAA,kBACN,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,YACZ;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,IAIHT;AAAA,EAAA,GACH;AAEJ;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs as h, jsx as e } from "react/jsx-runtime";
|
|
3
3
|
import { c as a } from "./cn-ct4n7r74mh8y0f48.js";
|
|
4
|
-
import { L as m } from "./label-
|
|
5
|
-
import { N as f, O as p, aN as u, aO as x } from "./vendor-base-ui-
|
|
4
|
+
import { L as m } from "./label-j9owppbgnn35mebg.js";
|
|
5
|
+
import { N as f, O as p, aN as u, aO as x } from "./vendor-base-ui-n30qblevnpk9cc5c.js";
|
|
6
6
|
const F = {
|
|
7
7
|
// Field currently has no variant options but structure is ready for future additions
|
|
8
8
|
}, N = {};
|
|
@@ -68,4 +68,4 @@ export {
|
|
|
68
68
|
N as a,
|
|
69
69
|
d as f
|
|
70
70
|
};
|
|
71
|
-
//# sourceMappingURL=field-
|
|
71
|
+
//# sourceMappingURL=field-fq504lyu7ttsh5m9.js.map
|