@cloudflare/kumo 1.7.0 → 1.9.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 +65 -0
- package/ai/component-registry.json +146 -70
- package/ai/component-registry.md +178 -46
- package/ai/schemas.ts +11 -8
- package/dist/.build-complete +1 -1
- package/dist/ai/schemas.d.ts +54 -44
- package/dist/ai/schemas.d.ts.map +1 -1
- package/dist/banner-BKDBfLHA.js +75 -0
- package/dist/banner-BKDBfLHA.js.map +1 -0
- package/dist/catalog.js +1 -1
- package/dist/{checkbox-Dt8iSNOg.js → checkbox-CfFoTNFI.js} +60 -60
- package/dist/checkbox-CfFoTNFI.js.map +1 -0
- package/dist/{clipboard-text-CeoyR28P.js → clipboard-text-1d0rHIhb.js} +24 -24
- package/dist/{clipboard-text-CeoyR28P.js.map → clipboard-text-1d0rHIhb.js.map} +1 -1
- package/dist/{combobox-BIC-YZ2L.js → combobox-vnvi22pn.js} +83 -61
- package/dist/combobox-vnvi22pn.js.map +1 -0
- package/dist/{command-palette-D3MNR7w9.js → command-palette-B80cqB7K.js} +2 -2
- package/dist/{command-palette-D3MNR7w9.js.map → command-palette-B80cqB7K.js.map} +1 -1
- package/dist/components/banner.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/field.js +1 -1
- package/dist/components/flow.js +1472 -1412
- 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/link.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/switch.js +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/tabs.js +1 -1
- package/dist/components/toast.js +2 -2
- package/dist/components/tooltip.js +1 -1
- package/dist/{dialog-toS9krNF.js → dialog-C4BIM-74.js} +6 -6
- package/dist/{dialog-toS9krNF.js.map → dialog-C4BIM-74.js.map} +1 -1
- package/dist/dropdown-CfS4QcSR.js +295 -0
- package/dist/dropdown-CfS4QcSR.js.map +1 -0
- package/dist/{field-DCq04TgZ.js → field-B8xISAuX.js} +5 -5
- package/dist/{field-DCq04TgZ.js.map → field-B8xISAuX.js.map} +1 -1
- package/dist/index.js +29 -29
- package/dist/{input-CCR8NGG7.js → input-DCzpefuq.js} +3 -3
- package/dist/{input-CCR8NGG7.js.map → input-DCzpefuq.js.map} +1 -1
- package/dist/{input-area-DU2Yvp_t.js → input-area-DCaAN9nG.js} +3 -3
- package/dist/{input-area-DU2Yvp_t.js.map → input-area-DCaAN9nG.js.map} +1 -1
- package/dist/{input-group-C365-qBq.js → input-group-BbaVpJnA.js} +2 -2
- package/dist/{input-group-C365-qBq.js.map → input-group-BbaVpJnA.js.map} +1 -1
- package/dist/{label-zjtV7oXa.js → label-Cd6nCDWj.js} +2 -2
- package/dist/{label-zjtV7oXa.js.map → label-Cd6nCDWj.js.map} +1 -1
- package/dist/{link-C8pUZ4Q-.js → link-DJq9RWpK.js} +11 -11
- package/dist/{link-C8pUZ4Q-.js.map → link-DJq9RWpK.js.map} +1 -1
- package/dist/{menubar-D7WvAf6x.js → menubar-Chchzst0.js} +2 -2
- package/dist/{menubar-D7WvAf6x.js.map → menubar-Chchzst0.js.map} +1 -1
- package/dist/{meter-jQGKS1z4.js → meter-Wk7_EhaO.js} +4 -4
- package/dist/{meter-jQGKS1z4.js.map → meter-Wk7_EhaO.js.map} +1 -1
- package/dist/pagination-DFHoZwPJ.js +208 -0
- package/dist/pagination-DFHoZwPJ.js.map +1 -0
- package/dist/{popover-syU1104E.js → popover-D20xpmdk.js} +22 -20
- package/dist/{popover-syU1104E.js.map → popover-D20xpmdk.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 +6 -0
- package/dist/primitives/csp-provider.js.map +1 -0
- package/dist/primitives/dialog.js +1 -1
- package/dist/primitives/direction-provider.js +1 -1
- package/dist/primitives/drawer.js +6 -0
- package/dist/primitives/drawer.js.map +1 -0
- package/dist/primitives/field.js +1 -1
- package/dist/primitives/fieldset.js +2 -2
- 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 +2 -2
- package/dist/primitives/number-field.js +1 -1
- package/dist/primitives/popover.js +1 -1
- package/dist/primitives/preview-card.js +2 -2
- package/dist/primitives/progress.js +2 -2
- package/dist/primitives/radio-group.js +1 -1
- package/dist/primitives/radio.js +2 -2
- 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 +31 -29
- package/dist/{radio-CWMtSx65.js → radio-ibVa4Y8a.js} +18 -18
- package/dist/{radio-CWMtSx65.js.map → radio-ibVa4Y8a.js.map} +1 -1
- package/dist/{schemas-DbIwo0ET.js → schemas-CdpAeJKO.js} +278 -275
- package/dist/{schemas-DbIwo0ET.js.map → schemas-CdpAeJKO.js.map} +1 -1
- package/dist/{select-G6JqBVkg.js → select-DtcT1zGm.js} +21 -21
- package/dist/{select-G6JqBVkg.js.map → select-DtcT1zGm.js.map} +1 -1
- package/dist/{sensitive-input-DNFpycoy.js → sensitive-input-DHDRZRC7.js} +4 -4
- package/dist/{sensitive-input-DNFpycoy.js.map → sensitive-input-DHDRZRC7.js.map} +1 -1
- package/dist/src/components/banner/banner.d.ts +28 -11
- package/dist/src/components/banner/banner.d.ts.map +1 -1
- package/dist/src/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/src/components/combobox/combobox.d.ts +4 -1
- package/dist/src/components/combobox/combobox.d.ts.map +1 -1
- package/dist/src/components/dropdown/dropdown.d.ts +26 -16
- package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
- package/dist/src/components/flow/connectors.d.ts +3 -1
- package/dist/src/components/flow/connectors.d.ts.map +1 -1
- package/dist/src/components/flow/diagram.d.ts +1 -0
- package/dist/src/components/flow/diagram.d.ts.map +1 -1
- package/dist/src/components/flow/node.d.ts +5 -1
- package/dist/src/components/flow/node.d.ts.map +1 -1
- package/dist/src/components/flow/parallel.d.ts +10 -2
- package/dist/src/components/flow/parallel.d.ts.map +1 -1
- package/dist/src/components/pagination/pagination.d.ts +134 -13
- package/dist/src/components/pagination/pagination.d.ts.map +1 -1
- package/dist/src/components/popover/popover.d.ts +7 -1
- package/dist/src/components/popover/popover.d.ts.map +1 -1
- package/dist/src/components/toast/toast.d.ts +4 -4
- package/dist/src/components/toast/toast.d.ts.map +1 -1
- package/dist/src/components/tooltip/tooltip.d.ts +1 -1
- package/dist/src/components/tooltip/tooltip.d.ts.map +1 -1
- package/dist/src/primitives/csp-provider.d.ts +13 -0
- package/dist/src/primitives/csp-provider.d.ts.map +1 -0
- package/dist/src/primitives/drawer.d.ts +13 -0
- package/dist/src/primitives/drawer.d.ts.map +1 -0
- package/dist/src/primitives/index.d.ts +2 -0
- package/dist/src/primitives/index.d.ts.map +1 -1
- package/dist/styles/kumo-standalone.css +1 -1
- package/dist/{switch-CmsZ4z-g.js → switch-DrbaX2iC.js} +15 -15
- package/dist/{switch-CmsZ4z-g.js.map → switch-DrbaX2iC.js.map} +1 -1
- package/dist/{table-Dc0AGcLV.js → table-CH9KC36S.js} +2 -2
- package/dist/{table-Dc0AGcLV.js.map → table-CH9KC36S.js.map} +1 -1
- package/dist/{tabs-BpD1iUiz.js → tabs-B-Fxc6Zo.js} +2 -2
- package/dist/{tabs-BpD1iUiz.js.map → tabs-B-Fxc6Zo.js.map} +1 -1
- package/dist/{toast-BrR0pjLE.js → toast-DUYp3EtH.js} +6 -6
- package/dist/{toast-BrR0pjLE.js.map → toast-DUYp3EtH.js.map} +1 -1
- package/dist/{tooltip-daVJYtXY.js → tooltip-D-KwZQDV.js} +2 -2
- package/dist/{tooltip-daVJYtXY.js.map → tooltip-D-KwZQDV.js.map} +1 -1
- package/dist/vendor-base-ui-Bsg5ebHI.js +22806 -0
- package/dist/vendor-base-ui-Bsg5ebHI.js.map +1 -0
- package/dist/{vendor-utils-DD8jNJwD.js → vendor-utils-DKXfkDYu.js} +100 -101
- package/dist/vendor-utils-DKXfkDYu.js.map +1 -0
- package/package.json +10 -2
- package/dist/banner-4fkH6Sbt.js +0 -51
- package/dist/banner-4fkH6Sbt.js.map +0 -1
- package/dist/checkbox-Dt8iSNOg.js.map +0 -1
- package/dist/combobox-BIC-YZ2L.js.map +0 -1
- package/dist/dropdown-BquiYKKC.js +0 -263
- package/dist/dropdown-BquiYKKC.js.map +0 -1
- package/dist/pagination-BN80iKY6.js +0 -100
- package/dist/pagination-BN80iKY6.js.map +0 -1
- package/dist/vendor-base-ui-9w7J6BvW.js +0 -20448
- package/dist/vendor-base-ui-9w7J6BvW.js.map +0 -1
- package/dist/vendor-utils-DD8jNJwD.js.map +0 -1
|
@@ -1,263 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsx as n, jsxs as u, Fragment as j } from "react/jsx-runtime";
|
|
3
|
-
import * as i from "react";
|
|
4
|
-
import { c as s } from "./cn-Bhsu1vx2.js";
|
|
5
|
-
import { u as z } from "./link-provider-DPBGo-0n.js";
|
|
6
|
-
import { C as F } from "./checkbox-Dt8iSNOg.js";
|
|
7
|
-
import { CheckIcon as b, CaretRightIcon as U } from "@phosphor-icons/react";
|
|
8
|
-
import { au as K, av as W, aw as B, ax as H, ay as x, S as w, az as N, aA as q, aB as J, aC as M, aD as y, aE as Q, aF as X, aG as R, aH as Y } from "./vendor-base-ui-9w7J6BvW.js";
|
|
9
|
-
const Z = {
|
|
10
|
-
variant: {
|
|
11
|
-
default: {
|
|
12
|
-
classes: "",
|
|
13
|
-
description: "Default dropdown item appearance"
|
|
14
|
-
},
|
|
15
|
-
danger: {
|
|
16
|
-
classes: "text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger",
|
|
17
|
-
description: "Destructive action item"
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
}, $ = {
|
|
21
|
-
variant: "default"
|
|
22
|
-
};
|
|
23
|
-
function ee({
|
|
24
|
-
variant: e = $.variant
|
|
25
|
-
} = {}) {
|
|
26
|
-
return s(Z.variant[e].classes);
|
|
27
|
-
}
|
|
28
|
-
const k = i.forwardRef(({ className: e, inset: t, children: a, icon: o, ...r }, d) => /* @__PURE__ */ u(
|
|
29
|
-
R,
|
|
30
|
-
{
|
|
31
|
-
ref: d,
|
|
32
|
-
className: s(
|
|
33
|
-
"flex cursor-default items-center rounded-sm text-base outline-hidden select-none",
|
|
34
|
-
// base styles
|
|
35
|
-
"px-2 py-1.5",
|
|
36
|
-
// spacing
|
|
37
|
-
"focus:bg-kumo-tint",
|
|
38
|
-
// focus state
|
|
39
|
-
"data-[state=open]:bg-kumo-tint",
|
|
40
|
-
// open state
|
|
41
|
-
t && "pl-8",
|
|
42
|
-
// conditional inset
|
|
43
|
-
e
|
|
44
|
-
),
|
|
45
|
-
...r,
|
|
46
|
-
children: [
|
|
47
|
-
o && /* @__PURE__ */ n(o, { className: "mr-2 h-4 w-4" }),
|
|
48
|
-
a,
|
|
49
|
-
/* @__PURE__ */ n(U, { className: "ml-auto h-4 w-4" })
|
|
50
|
-
]
|
|
51
|
-
}
|
|
52
|
-
));
|
|
53
|
-
k.displayName = R.displayName;
|
|
54
|
-
const h = i.forwardRef(({ className: e, sideOffset: t = 8, children: a, ...o }, r) => /* @__PURE__ */ n(x, { children: /* @__PURE__ */ n(
|
|
55
|
-
Q,
|
|
56
|
-
{
|
|
57
|
-
ref: r,
|
|
58
|
-
sideOffset: t,
|
|
59
|
-
...o,
|
|
60
|
-
children: /* @__PURE__ */ n(
|
|
61
|
-
X,
|
|
62
|
-
{
|
|
63
|
-
className: s(
|
|
64
|
-
"overflow-hidden bg-kumo-control text-kumo-default",
|
|
65
|
-
// background
|
|
66
|
-
"rounded-lg shadow-lg ring ring-kumo-line",
|
|
67
|
-
// border part
|
|
68
|
-
"min-w-36 p-1.5",
|
|
69
|
-
// spacing
|
|
70
|
-
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
71
|
-
// open animation
|
|
72
|
-
"data-[side=bottom]:slide-in-from-top-2",
|
|
73
|
-
// bottom side animation
|
|
74
|
-
"data-[side=left]:slide-in-from-right-2",
|
|
75
|
-
// left side animation
|
|
76
|
-
"data-[side=right]:slide-in-from-left-2",
|
|
77
|
-
// right side animation
|
|
78
|
-
"data-[side=top]:slide-in-from-bottom-2",
|
|
79
|
-
// top side animation
|
|
80
|
-
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
|
81
|
-
// close animation
|
|
82
|
-
e
|
|
83
|
-
),
|
|
84
|
-
children: a
|
|
85
|
-
}
|
|
86
|
-
)
|
|
87
|
-
}
|
|
88
|
-
) })), D = (e) => e ? i.isValidElement(e) ? e : /* @__PURE__ */ n(e, { className: "mr-2 h-4 w-4" }) : null, I = i.forwardRef(
|
|
89
|
-
({
|
|
90
|
-
className: e,
|
|
91
|
-
inset: t,
|
|
92
|
-
icon: a,
|
|
93
|
-
children: o,
|
|
94
|
-
selected: r,
|
|
95
|
-
render: d,
|
|
96
|
-
href: l,
|
|
97
|
-
variant: m = "default",
|
|
98
|
-
...E
|
|
99
|
-
}, G) => {
|
|
100
|
-
const f = z(), L = i.useMemo(() => {
|
|
101
|
-
const c = /* @__PURE__ */ u(j, { children: [
|
|
102
|
-
a && D(a),
|
|
103
|
-
o,
|
|
104
|
-
r && /* @__PURE__ */ n("span", { className: "inline-flex", children: /* @__PURE__ */ n(b, {}) })
|
|
105
|
-
] });
|
|
106
|
-
if (!l) return c;
|
|
107
|
-
const V = /^(https?:)?\/\//.test(l), g = s(
|
|
108
|
-
"flex items-center",
|
|
109
|
-
m === "danger" && "text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger"
|
|
110
|
-
);
|
|
111
|
-
return V ? /* @__PURE__ */ n(
|
|
112
|
-
"a",
|
|
113
|
-
{
|
|
114
|
-
className: s(g, "w-full text-inherit! no-underline!"),
|
|
115
|
-
href: l,
|
|
116
|
-
target: "_blank",
|
|
117
|
-
rel: "noreferrer",
|
|
118
|
-
onClick: (p) => p.stopPropagation(),
|
|
119
|
-
children: c
|
|
120
|
-
}
|
|
121
|
-
) : /* @__PURE__ */ n(
|
|
122
|
-
f,
|
|
123
|
-
{
|
|
124
|
-
className: s(g, "w-full text-inherit! no-underline!"),
|
|
125
|
-
href: l,
|
|
126
|
-
to: l,
|
|
127
|
-
onClick: (p) => p.stopPropagation(),
|
|
128
|
-
children: c
|
|
129
|
-
}
|
|
130
|
-
);
|
|
131
|
-
}, [l, a, o, r, m, f]), _ = l || d;
|
|
132
|
-
return /* @__PURE__ */ n(
|
|
133
|
-
y,
|
|
134
|
-
{
|
|
135
|
-
ref: G,
|
|
136
|
-
className: s(
|
|
137
|
-
"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",
|
|
138
|
-
t && "pl-8",
|
|
139
|
-
ee({ variant: m }),
|
|
140
|
-
e
|
|
141
|
-
),
|
|
142
|
-
render: l ? L : d,
|
|
143
|
-
...E,
|
|
144
|
-
children: _ ? void 0 : o
|
|
145
|
-
}
|
|
146
|
-
);
|
|
147
|
-
}
|
|
148
|
-
);
|
|
149
|
-
I.displayName = y.displayName;
|
|
150
|
-
const v = i.forwardRef(({ className: e, children: t, checked: a, ...o }, r) => /* @__PURE__ */ u(
|
|
151
|
-
M,
|
|
152
|
-
{
|
|
153
|
-
ref: r,
|
|
154
|
-
className: s(
|
|
155
|
-
"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",
|
|
156
|
-
e
|
|
157
|
-
),
|
|
158
|
-
checked: a,
|
|
159
|
-
...o,
|
|
160
|
-
children: [
|
|
161
|
-
/* @__PURE__ */ n("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit", children: /* @__PURE__ */ n(F, { checked: a }) }),
|
|
162
|
-
t
|
|
163
|
-
]
|
|
164
|
-
}
|
|
165
|
-
));
|
|
166
|
-
v.displayName = M.displayName;
|
|
167
|
-
const S = i.forwardRef(({ className: e, inset: t, ...a }, o) => /* @__PURE__ */ n(
|
|
168
|
-
N,
|
|
169
|
-
{
|
|
170
|
-
ref: o,
|
|
171
|
-
className: s(
|
|
172
|
-
"px-2 py-1.5 text-base font-semibold",
|
|
173
|
-
t && "pl-8",
|
|
174
|
-
e
|
|
175
|
-
),
|
|
176
|
-
...a
|
|
177
|
-
}
|
|
178
|
-
));
|
|
179
|
-
S.displayName = N.displayName;
|
|
180
|
-
const C = i.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ n(
|
|
181
|
-
w,
|
|
182
|
-
{
|
|
183
|
-
ref: a,
|
|
184
|
-
className: s("-mx-1 my-1 h-px bg-kumo-line", e),
|
|
185
|
-
...t
|
|
186
|
-
}
|
|
187
|
-
));
|
|
188
|
-
C.displayName = w.displayName;
|
|
189
|
-
const T = ({
|
|
190
|
-
className: e,
|
|
191
|
-
...t
|
|
192
|
-
}) => /* @__PURE__ */ n(
|
|
193
|
-
"span",
|
|
194
|
-
{
|
|
195
|
-
className: s("ml-auto text-xs tracking-widest opacity-60", e),
|
|
196
|
-
...t
|
|
197
|
-
}
|
|
198
|
-
);
|
|
199
|
-
T.displayName = "DropdownMenuShortcut";
|
|
200
|
-
const P = i.forwardRef(({ className: e, children: t, inset: a, icon: o, ...r }, d) => /* @__PURE__ */ u(
|
|
201
|
-
J,
|
|
202
|
-
{
|
|
203
|
-
ref: d,
|
|
204
|
-
className: s(
|
|
205
|
-
"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none",
|
|
206
|
-
"data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-tint",
|
|
207
|
-
a && "pl-8",
|
|
208
|
-
e
|
|
209
|
-
),
|
|
210
|
-
...r,
|
|
211
|
-
children: [
|
|
212
|
-
o && D(o),
|
|
213
|
-
t
|
|
214
|
-
]
|
|
215
|
-
}
|
|
216
|
-
));
|
|
217
|
-
P.displayName = "DropdownMenuRadioItem";
|
|
218
|
-
const O = i.forwardRef(({ className: e, children: t, ...a }, o) => /* @__PURE__ */ n(
|
|
219
|
-
q,
|
|
220
|
-
{
|
|
221
|
-
ref: o,
|
|
222
|
-
className: s("ml-auto", e),
|
|
223
|
-
...a,
|
|
224
|
-
children: t ?? /* @__PURE__ */ n(b, { className: "h-4 w-4" })
|
|
225
|
-
}
|
|
226
|
-
));
|
|
227
|
-
O.displayName = "DropdownMenuRadioItemIndicator";
|
|
228
|
-
const A = i.forwardRef(({ children: e, render: t, ...a }, o) => {
|
|
229
|
-
const r = i.isValidElement(e) ? e : null, d = t ?? r;
|
|
230
|
-
return /* @__PURE__ */ n(
|
|
231
|
-
Y,
|
|
232
|
-
{
|
|
233
|
-
ref: o,
|
|
234
|
-
...a,
|
|
235
|
-
...d && {
|
|
236
|
-
render: d
|
|
237
|
-
},
|
|
238
|
-
children: r ? void 0 : e
|
|
239
|
-
}
|
|
240
|
-
);
|
|
241
|
-
});
|
|
242
|
-
A.displayName = "DropdownMenuTrigger";
|
|
243
|
-
const ie = Object.assign(K, {
|
|
244
|
-
Trigger: A,
|
|
245
|
-
Portal: x,
|
|
246
|
-
Sub: H,
|
|
247
|
-
SubTrigger: k,
|
|
248
|
-
SubContent: h,
|
|
249
|
-
Content: h,
|
|
250
|
-
Item: I,
|
|
251
|
-
CheckboxItem: v,
|
|
252
|
-
RadioGroup: B,
|
|
253
|
-
RadioItem: P,
|
|
254
|
-
RadioItemIndicator: O,
|
|
255
|
-
Label: S,
|
|
256
|
-
Separator: C,
|
|
257
|
-
Shortcut: T,
|
|
258
|
-
Group: W
|
|
259
|
-
});
|
|
260
|
-
export {
|
|
261
|
-
ie as D
|
|
262
|
-
};
|
|
263
|
-
//# sourceMappingURL=dropdown-BquiYKKC.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-BquiYKKC.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 { Checkbox } from \"../checkbox\";\nimport {\n CaretRightIcon as CaretRight,\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>(({ className, sideOffset = 8, children, ...props }, ref) => (\n <DropdownMenuPrimitive.Portal>\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\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\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 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 const content = React.useMemo(() => {\n const innerContent = (\n <>\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n {selected && (\n <span className=\"inline-flex\">\n <Check />\n </span>\n )}\n </>\n );\n\n if (!href) return innerContent;\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 /**\n * For some reason we need this here to prevent the outer link\n * from being clicked (thereby going to the worker details\n * instead of visiting the link)\n */\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 /**\n * For some reason we need this here to prevent the outer link\n * from being clicked (thereby going to the worker details\n * instead of visiting the link)\n */\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </LinkComponent>\n );\n }, [href, IconComponent, children, selected, variant, LinkComponent]);\n\n // When href is provided, content already contains children via innerContent\n // When render prop is provided, caller controls children rendering\n // Only pass children directly when neither href nor render is used\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 ? content : render}\n {...props}\n >\n {useRenderProp ? undefined : children}\n </DropdownMenuPrimitive.Item>\n );\n },\n);\n\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\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 <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit\">\n <Checkbox checked={checked} />\n </span>\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 React.ElementRef<typeof DropdownMenuPrimitive.Trigger>,\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 * `.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.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 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","DropdownMenuPrimitive.Portal","DropdownMenuPrimitive.Positioner","DropdownMenuPrimitive.Popup","renderIconNode","DropdownMenuItem","selected","render","href","LinkComponent","useLinkComponent","content","innerContent","Fragment","Check","isExternal","styles","e","useRenderProp","DropdownMenuPrimitive.Item","DropdownMenuCheckboxItem","checked","DropdownMenuPrimitive.CheckboxItem","Checkbox","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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"}
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs as h, jsx as n } from "react/jsx-runtime";
|
|
3
|
-
import { useState as N, useEffect as x, useMemo as b } from "react";
|
|
4
|
-
import { I as s } from "./input-group-C365-qBq.js";
|
|
5
|
-
import { CaretDoubleLeftIcon as v, CaretLeftIcon as I, CaretRightIcon as M, CaretDoubleRightIcon as g } from "@phosphor-icons/react";
|
|
6
|
-
const w = {
|
|
7
|
-
controls: "full"
|
|
8
|
-
};
|
|
9
|
-
function z({
|
|
10
|
-
page: i = 1,
|
|
11
|
-
perPage: t,
|
|
12
|
-
totalCount: r,
|
|
13
|
-
setPage: o,
|
|
14
|
-
text: d,
|
|
15
|
-
controls: c = w.controls
|
|
16
|
-
}) {
|
|
17
|
-
const [m, a] = N(1);
|
|
18
|
-
x(() => {
|
|
19
|
-
a(i);
|
|
20
|
-
}, [i]);
|
|
21
|
-
const f = b(() => {
|
|
22
|
-
let e = i * (t ?? 1) - (t ?? 0) + 1, u = Math.min(i * (t ?? 0), r ?? 0);
|
|
23
|
-
return Number.isNaN(e) && (e = 0), Number.isNaN(u) && (u = 0), `${e}-${u}`;
|
|
24
|
-
}, [i, t, r]), l = b(() => Math.ceil((r ?? 1) / (t ?? 1)), [r, t]);
|
|
25
|
-
return /* @__PURE__ */ h("div", { className: "flex items-center justify-between gap-2", children: [
|
|
26
|
-
/* @__PURE__ */ n("div", { className: "grow text-sm text-kumo-strong", children: d ? d({ page: i, perPage: t, totalCount: r, pageShowingRange: f }) : r && r > 0 ? `Showing ${f} of ${r}` : null }),
|
|
27
|
-
/* @__PURE__ */ n("div", { children: /* @__PURE__ */ h(s, { focusMode: "individual", children: [
|
|
28
|
-
c === "full" && /* @__PURE__ */ n(
|
|
29
|
-
s.Button,
|
|
30
|
-
{
|
|
31
|
-
variant: "secondary",
|
|
32
|
-
"aria-label": "First page",
|
|
33
|
-
disabled: i <= 1,
|
|
34
|
-
onClick: () => {
|
|
35
|
-
o(1), a(1);
|
|
36
|
-
},
|
|
37
|
-
children: /* @__PURE__ */ n(v, { size: 16 })
|
|
38
|
-
}
|
|
39
|
-
),
|
|
40
|
-
/* @__PURE__ */ n(
|
|
41
|
-
s.Button,
|
|
42
|
-
{
|
|
43
|
-
variant: "secondary",
|
|
44
|
-
"aria-label": "Previous page",
|
|
45
|
-
disabled: i <= 1,
|
|
46
|
-
onClick: () => {
|
|
47
|
-
const e = Math.max(i - 1, 1);
|
|
48
|
-
o(e), a(e);
|
|
49
|
-
},
|
|
50
|
-
children: /* @__PURE__ */ n(I, { size: 16 })
|
|
51
|
-
}
|
|
52
|
-
),
|
|
53
|
-
c === "full" && /* @__PURE__ */ n(
|
|
54
|
-
s.Input,
|
|
55
|
-
{
|
|
56
|
-
style: { width: 50 },
|
|
57
|
-
className: "text-center",
|
|
58
|
-
"aria-label": "Page number",
|
|
59
|
-
value: m,
|
|
60
|
-
onValueChange: (e) => {
|
|
61
|
-
a(Number(e));
|
|
62
|
-
},
|
|
63
|
-
onBlur: () => {
|
|
64
|
-
let e = Math.max(m, 1);
|
|
65
|
-
e = Math.min(e, l), o(e), a(e);
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
),
|
|
69
|
-
/* @__PURE__ */ n(
|
|
70
|
-
s.Button,
|
|
71
|
-
{
|
|
72
|
-
variant: "secondary",
|
|
73
|
-
"aria-label": "Next page",
|
|
74
|
-
disabled: i === l,
|
|
75
|
-
onClick: () => {
|
|
76
|
-
const e = Math.min(i + 1, l);
|
|
77
|
-
o(e), a(e);
|
|
78
|
-
},
|
|
79
|
-
children: /* @__PURE__ */ n(M, { size: 16 })
|
|
80
|
-
}
|
|
81
|
-
),
|
|
82
|
-
c === "full" && /* @__PURE__ */ n(
|
|
83
|
-
s.Button,
|
|
84
|
-
{
|
|
85
|
-
variant: "secondary",
|
|
86
|
-
"aria-label": "Last page",
|
|
87
|
-
disabled: i === l,
|
|
88
|
-
onClick: () => {
|
|
89
|
-
o(l), a(l);
|
|
90
|
-
},
|
|
91
|
-
children: /* @__PURE__ */ n(g, { size: 16 })
|
|
92
|
-
}
|
|
93
|
-
)
|
|
94
|
-
] }) })
|
|
95
|
-
] });
|
|
96
|
-
}
|
|
97
|
-
export {
|
|
98
|
-
z as P
|
|
99
|
-
};
|
|
100
|
-
//# sourceMappingURL=pagination-BN80iKY6.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"pagination-BN80iKY6.js","sources":["../src/components/pagination/pagination.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { InputGroup } from \"../input\";\nimport {\n CaretDoubleLeftIcon,\n CaretDoubleRightIcon,\n CaretLeftIcon,\n CaretRightIcon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Pagination controls variant definitions. */\nexport const KUMO_PAGINATION_VARIANTS = {\n controls: {\n full: {\n classes: \"\",\n description:\n \"Full pagination controls with first, previous, page input, next, and last buttons\",\n },\n simple: {\n classes: \"\",\n description:\n \"Simple pagination controls with only previous and next buttons\",\n },\n },\n} as const;\n\nexport type KumoPaginationControls =\n keyof typeof KUMO_PAGINATION_VARIANTS.controls;\n\nexport const KUMO_PAGINATION_DEFAULT_VARIANTS = {\n controls: \"full\",\n} as const;\n\nexport interface KumoPaginationVariantsProps {\n controls?: KumoPaginationControls;\n}\n\nexport function paginationVariants({\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n}: KumoPaginationVariantsProps = {}) {\n return cn(\n \"flex items-center justify-between gap-2\",\n KUMO_PAGINATION_VARIANTS.controls[controls].classes,\n );\n}\n\n/**\n * Pagination component props.\n *\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} controls=\"simple\" />\n * ```\n */\nexport interface PaginationProps extends KumoPaginationVariantsProps {\n /** Callback fired when the current page changes. */\n setPage: (page: number) => void;\n /**\n * Current page number (1-indexed).\n * @default 1\n */\n page?: number;\n /** Number of items displayed per page. */\n perPage?: number;\n /** Total number of items across all pages. */\n totalCount?: number;\n /** Method to provide custom pagination text */\n text?: (props: {\n page?: number;\n perPage?: number;\n totalCount?: number;\n pageShowingRange: string;\n }) => React.ReactNode;\n}\n\n/**\n * Page navigation controls with page count display.\n *\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nexport function Pagination({\n page = 1,\n perPage,\n totalCount,\n setPage,\n text,\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n}: PaginationProps) {\n const [editingPage, setEditingPage] = useState<number>(1);\n\n // Value of the input as its being modified to display in the input, eventually syncs with `pagination.page`\n useEffect(() => {\n setEditingPage(page);\n }, [page]);\n\n const pageShowingRange = useMemo(() => {\n let lower = page * (perPage ?? 1) - (perPage ?? 0) + 1;\n let upper = Math.min(page * (perPage ?? 0), totalCount ?? 0);\n\n if (Number.isNaN(lower)) lower = 0;\n if (Number.isNaN(upper)) upper = 0;\n\n return `${lower}-${upper}`;\n }, [page, perPage, totalCount]);\n\n const maxPage = useMemo(() => {\n return Math.ceil((totalCount ?? 1) / (perPage ?? 1));\n }, [totalCount, perPage]);\n\n const getPaginationText = () => {\n if (text) {\n return text({ page, perPage, totalCount, pageShowingRange });\n } else if (totalCount && totalCount > 0) {\n return `Showing ${pageShowingRange} of ${totalCount}`;\n }\n return null;\n };\n\n return (\n <div className=\"flex items-center justify-between gap-2\">\n <div className=\"grow text-sm text-kumo-strong\">{getPaginationText()}</div>\n <div>\n <InputGroup focusMode=\"individual\">\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label=\"First page\"\n disabled={page <= 1}\n onClick={() => {\n setPage(1);\n setEditingPage(1);\n }}\n >\n <CaretDoubleLeftIcon size={16} />\n </InputGroup.Button>\n )}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label=\"Previous page\"\n disabled={page <= 1}\n onClick={() => {\n const previousPage = Math.max(page - 1, 1);\n setPage(previousPage);\n setEditingPage(previousPage);\n }}\n >\n <CaretLeftIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" && (\n <InputGroup.Input\n style={{ width: 50 }}\n className=\"text-center\"\n aria-label=\"Page number\"\n value={editingPage}\n onValueChange={(value: string) => {\n setEditingPage(Number(value));\n }}\n onBlur={() => {\n let number = Math.max(editingPage, 1);\n number = Math.min(number, maxPage);\n setPage(number);\n setEditingPage(number);\n }}\n />\n )}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label=\"Next page\"\n disabled={page === maxPage}\n onClick={() => {\n const nextPage = Math.min(page + 1, maxPage);\n setPage(nextPage);\n setEditingPage(nextPage);\n }}\n >\n <CaretRightIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label=\"Last page\"\n disabled={page === maxPage}\n onClick={() => {\n setPage(maxPage);\n setEditingPage(maxPage);\n }}\n >\n <CaretDoubleRightIcon size={16} />\n </InputGroup.Button>\n )}\n </InputGroup>\n </div>\n </div>\n );\n}\n"],"names":["KUMO_PAGINATION_DEFAULT_VARIANTS","Pagination","page","perPage","totalCount","setPage","text","controls","editingPage","setEditingPage","useState","useEffect","pageShowingRange","useMemo","lower","upper","maxPage","jsxs","jsx","InputGroup","CaretDoubleLeftIcon","previousPage","CaretLeftIcon","value","number","nextPage","CaretRightIcon","CaretDoubleRightIcon"],"mappings":"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"}
|