@blakesteve/roster 5.6.0 → 5.8.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/README.md +190 -5
- package/dist/components/atoms/Avatar/Avatar.cjs +1 -1
- package/dist/components/atoms/Avatar/Avatar.d.ts +4 -0
- package/dist/components/atoms/Avatar/Avatar.js +1 -1
- package/dist/components/atoms/AvatarStrip/AvatarStrip.cjs +1 -1
- package/dist/components/atoms/AvatarStrip/AvatarStrip.d.ts +10 -1
- package/dist/components/atoms/AvatarStrip/AvatarStrip.js +34 -30
- package/dist/components/atoms/Button/button-variants.cjs +1 -1
- package/dist/components/atoms/Button/button-variants.js +5 -3
- package/dist/components/atoms/Eyebrow/eyebrow-variants.cjs +1 -1
- package/dist/components/atoms/Eyebrow/eyebrow-variants.js +8 -4
- package/dist/components/atoms/LoadingDots/LoadingDots.cjs +1 -0
- package/dist/components/atoms/LoadingDots/LoadingDots.d.ts +20 -0
- package/dist/components/atoms/LoadingDots/LoadingDots.js +43 -0
- package/dist/components/atoms/MultiSelect/MultiSelect.cjs +1 -1
- package/dist/components/atoms/MultiSelect/MultiSelect.d.ts +3 -1
- package/dist/components/atoms/MultiSelect/MultiSelect.js +87 -89
- package/dist/components/atoms/Progress/Progress.cjs +1 -0
- package/dist/components/atoms/Progress/Progress.d.ts +62 -0
- package/dist/components/atoms/Progress/Progress.js +107 -0
- package/dist/components/atoms/Progress/progress-values.cjs +1 -0
- package/dist/components/atoms/Progress/progress-values.d.ts +26 -0
- package/dist/components/atoms/Progress/progress-values.js +12 -0
- package/dist/components/atoms/Skeleton/Skeleton.cjs +1 -0
- package/dist/components/atoms/Skeleton/Skeleton.d.ts +79 -0
- package/dist/components/atoms/Skeleton/Skeleton.js +80 -0
- package/dist/components/atoms/Stat/Stat.cjs +1 -1
- package/dist/components/atoms/Stat/Stat.js +19 -19
- package/dist/components/atoms/Stat/stat-variants.cjs +1 -1
- package/dist/components/atoms/Stat/stat-variants.d.ts +1 -0
- package/dist/components/atoms/Stat/stat-variants.js +10 -7
- package/dist/components/molecules/Breadcrumbs/Breadcrumbs.cjs +1 -1
- package/dist/components/molecules/Breadcrumbs/Breadcrumbs.d.ts +10 -1
- package/dist/components/molecules/Breadcrumbs/Breadcrumbs.js +31 -29
- package/dist/components/molecules/CallToAction/CallToAction.cjs +1 -1
- package/dist/components/molecules/CallToAction/CallToAction.d.ts +8 -1
- package/dist/components/molecules/CallToAction/CallToAction.js +34 -29
- package/dist/components/molecules/Carousel/Carousel.cjs +1 -1
- package/dist/components/molecules/Carousel/Carousel.d.ts +7 -0
- package/dist/components/molecules/Carousel/Carousel.js +155 -155
- package/dist/components/molecules/ErrorState/ErrorState.cjs +1 -1
- package/dist/components/molecules/ErrorState/ErrorState.d.ts +8 -1
- package/dist/components/molecules/ErrorState/ErrorState.js +44 -39
- package/dist/components/molecules/FileUpload/FileUpload.cjs +1 -1
- package/dist/components/molecules/FileUpload/FileUpload.js +122 -142
- package/dist/components/molecules/MediaPreview/MediaPreview.cjs +1 -1
- package/dist/components/molecules/MediaPreview/MediaPreview.d.ts +3 -1
- package/dist/components/molecules/MediaPreview/MediaPreview.js +13 -12
- package/dist/components/molecules/Pagination/Pagination.cjs +1 -1
- package/dist/components/molecules/Pagination/Pagination.d.ts +1 -0
- package/dist/components/molecules/Pagination/Pagination.js +47 -46
- package/dist/components/molecules/ProgressField/ProgressField.cjs +1 -0
- package/dist/components/molecules/ProgressField/ProgressField.d.ts +24 -0
- package/dist/components/molecules/ProgressField/ProgressField.js +32 -0
- package/dist/components/molecules/SkeletonPresets/SkeletonPresets.cjs +1 -0
- package/dist/components/molecules/SkeletonPresets/SkeletonPresets.d.ts +55 -0
- package/dist/components/molecules/SkeletonPresets/SkeletonPresets.js +45 -0
- package/dist/components/molecules/StepProgress/StepProgress.cjs +1 -0
- package/dist/components/molecules/StepProgress/StepProgress.d.ts +37 -0
- package/dist/components/molecules/StepProgress/StepProgress.js +90 -0
- package/dist/components/organisms/Countdown/Countdown.cjs +1 -1
- package/dist/components/organisms/Countdown/Countdown.d.ts +13 -0
- package/dist/components/organisms/Countdown/Countdown.js +54 -47
- package/dist/components/organisms/DataTable/DataTable.cjs +1 -1
- package/dist/components/organisms/DataTable/DataTable.d.ts +5 -3
- package/dist/components/organisms/DataTable/DataTable.js +27 -26
- package/dist/components/organisms/Dialog/Dialog.cjs +1 -1
- package/dist/components/organisms/Dialog/Dialog.d.ts +9 -2
- package/dist/components/organisms/Dialog/Dialog.js +25 -23
- package/dist/components/organisms/Footer/Footer.cjs +1 -1
- package/dist/components/organisms/Footer/Footer.d.ts +9 -0
- package/dist/components/organisms/Footer/Footer.js +21 -23
- package/dist/components/organisms/ModerationQueue/ModerationQueue.cjs +1 -1
- package/dist/components/organisms/ModerationQueue/ModerationQueue.d.ts +40 -1
- package/dist/components/organisms/ModerationQueue/ModerationQueue.js +262 -237
- package/dist/components/organisms/ModerationQueue/QueueEditDialog.cjs +1 -1
- package/dist/components/organisms/ModerationQueue/QueueEditDialog.d.ts +1 -1
- package/dist/components/organisms/ModerationQueue/QueueEditDialog.js +23 -21
- package/dist/components/organisms/ModerationQueue/QueueEditSheet.cjs +1 -1
- package/dist/components/organisms/ModerationQueue/QueueEditSheet.d.ts +1 -1
- package/dist/components/organisms/ModerationQueue/QueueEditSheet.js +22 -20
- package/dist/components/organisms/ModerationQueue/queue-actions.d.ts +29 -10
- package/dist/components/organisms/Navbar/Navbar.cjs +1 -1
- package/dist/components/organisms/Navbar/Navbar.d.ts +38 -3
- package/dist/components/organisms/Navbar/Navbar.js +210 -187
- package/dist/components/organisms/Navbar/navbar-variants.cjs +1 -1
- package/dist/components/organisms/Navbar/navbar-variants.js +4 -2
- package/dist/components/organisms/Sheet/Sheet.cjs +1 -1
- package/dist/components/organisms/Sheet/Sheet.d.ts +8 -1
- package/dist/components/organisms/Sheet/Sheet.js +65 -63
- package/dist/index.d.ts +6 -0
- package/dist/lib/labels.cjs +1 -0
- package/dist/lib/labels.d.ts +7 -0
- package/dist/lib/labels.js +12 -0
- package/dist/meta.json +3 -3
- package/dist/roster.cjs +1 -1
- package/dist/roster.css +1 -1
- package/dist/roster.js +174 -157
- package/package.json +1 -1
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as
|
|
3
|
-
import { useId as vr, useState as
|
|
4
|
-
import { cn as
|
|
2
|
+
import { jsxs as p, jsx as n } from "react/jsx-runtime";
|
|
3
|
+
import { useId as vr, useState as M, useRef as f, useCallback as U, useLayoutEffect as Y, useEffect as xr } from "react";
|
|
4
|
+
import { cn as g } from "../../../lib/utils.js";
|
|
5
|
+
import { withLabels as yr } from "../../../lib/labels.js";
|
|
5
6
|
import { Button as G } from "../../atoms/Button/Button.js";
|
|
6
|
-
import {
|
|
7
|
-
|
|
7
|
+
import { Progress as br } from "../../atoms/Progress/Progress.js";
|
|
8
|
+
import { acceptList as kr, formatBytes as Z, sameFile as Nr, matchesType as wr } from "./file-rules.js";
|
|
9
|
+
const $r = {
|
|
8
10
|
choose: "Choose photos",
|
|
9
11
|
dropHint: "or drag them here",
|
|
10
12
|
dropHere: "Drop to add them",
|
|
@@ -28,8 +30,8 @@ const Nr = {
|
|
|
28
30
|
rejectedNotice: (s, d) => `${s} wasn't added. ${d}`,
|
|
29
31
|
removed: (s) => `${s} removed.`
|
|
30
32
|
};
|
|
31
|
-
function
|
|
32
|
-
const [T, D] =
|
|
33
|
+
function jr({ file: s, status: d }) {
|
|
34
|
+
const [T, D] = M(!1), B = !T && (s.type.startsWith("image/") || /\.(jpe?g|png|gif|webp|avif|heic|heif)$/i.test(s.name)), $ = U(
|
|
33
35
|
(q) => {
|
|
34
36
|
if (!q) return;
|
|
35
37
|
const j = URL.createObjectURL(s);
|
|
@@ -43,16 +45,16 @@ function wr({ file: s, status: d }) {
|
|
|
43
45
|
ref: $,
|
|
44
46
|
alt: "",
|
|
45
47
|
onError: () => D(!0),
|
|
46
|
-
className:
|
|
48
|
+
className: g(v, "rst:object-cover", d === "rejected" && "rst:opacity-50"),
|
|
47
49
|
"data-file-thumb": "image"
|
|
48
50
|
}
|
|
49
51
|
) : /* @__PURE__ */ n(
|
|
50
52
|
"span",
|
|
51
53
|
{
|
|
52
54
|
"aria-hidden": "true",
|
|
53
|
-
className:
|
|
55
|
+
className: g(v, "rst:flex rst:items-center rst:justify-center rst:text-gray-500 rst:dark:text-gray-400"),
|
|
54
56
|
"data-file-thumb": "placeholder",
|
|
55
|
-
children: /* @__PURE__ */
|
|
57
|
+
children: /* @__PURE__ */ p("svg", { viewBox: "0 0 24 24", width: "24", height: "24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
56
58
|
/* @__PURE__ */ n("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
|
|
57
59
|
/* @__PURE__ */ n("circle", { cx: "9", cy: "10", r: "1.6" }),
|
|
58
60
|
/* @__PURE__ */ n("path", { d: "m21 15-4.2-4.2a1.6 1.6 0 0 0-2.3 0L7 18" })
|
|
@@ -61,7 +63,7 @@ function wr({ file: s, status: d }) {
|
|
|
61
63
|
);
|
|
62
64
|
}
|
|
63
65
|
const V = "rst:cursor-not-allowed rst:opacity-50", I = { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" };
|
|
64
|
-
function
|
|
66
|
+
function Er({
|
|
65
67
|
label: s,
|
|
66
68
|
upload: d,
|
|
67
69
|
onChange: T,
|
|
@@ -73,72 +75,72 @@ function Dr({
|
|
|
73
75
|
concurrency: j = 3,
|
|
74
76
|
helperText: S,
|
|
75
77
|
errorMessage: R,
|
|
76
|
-
disabled:
|
|
78
|
+
disabled: i = !1,
|
|
77
79
|
strings: rr,
|
|
78
80
|
className: tr
|
|
79
81
|
}) {
|
|
80
|
-
const
|
|
81
|
-
} }), [A, nr] =
|
|
82
|
+
const a = yr($r, rr), C = vr(), z = `${C}-label`, _ = `${C}-help`, J = `${C}-error`, [F, er] = M([]), u = f(F), sr = f(0), x = f(/* @__PURE__ */ new Map()), O = f(null), K = f(null), h = f({ upload: d, onChange: T, concurrency: j, t: a, pump: () => {
|
|
83
|
+
} }), [A, nr] = M({ text: "", n: 0 }), y = f([]), b = f(null), L = U((r, e = !1) => {
|
|
82
84
|
e && (y.current = y.current.filter((t) => !t.count)), y.current.push({ text: r, count: e }), !b.current && (b.current = setTimeout(() => {
|
|
83
85
|
b.current = null;
|
|
84
|
-
const t = y.current.map((
|
|
85
|
-
y.current = [], nr((
|
|
86
|
+
const t = y.current.map((c) => c.text).join(" ");
|
|
87
|
+
y.current = [], nr((c) => ({ text: t, n: c.n + 1 }));
|
|
86
88
|
}, 0));
|
|
87
|
-
}, []), H =
|
|
88
|
-
H.current = r,
|
|
89
|
+
}, []), H = f(null), [or, ar] = M(0), Q = (r) => {
|
|
90
|
+
H.current = r, ar((e) => e + 1);
|
|
89
91
|
};
|
|
90
92
|
Y(() => {
|
|
91
93
|
const r = H.current;
|
|
92
94
|
if (!r) return;
|
|
93
95
|
H.current = null, (O.current?.querySelector(r) ?? O.current?.querySelector("[data-file-choose]"))?.focus();
|
|
94
|
-
}, [
|
|
96
|
+
}, [or]);
|
|
95
97
|
const k = U((r) => {
|
|
96
|
-
|
|
98
|
+
u.current = r, er(r), h.current.onChange?.(r);
|
|
97
99
|
}, []), N = U(
|
|
98
100
|
(r, e) => {
|
|
99
|
-
|
|
101
|
+
u.current.some((t) => t.id === r) && k(u.current.map((t) => t.id === r ? { ...t, ...e } : t));
|
|
100
102
|
},
|
|
101
103
|
[k]
|
|
102
104
|
);
|
|
103
105
|
function w() {
|
|
104
|
-
const { concurrency: r } = h.current, e =
|
|
105
|
-
for (const
|
|
106
|
+
const { concurrency: r } = h.current, e = u.current.filter((c) => c.status === "uploading" || c.status === "processing").length, t = u.current.filter((c) => c.status === "queued").slice(0, Math.max(0, Math.max(1, r) - e));
|
|
107
|
+
for (const c of t) cr(c);
|
|
106
108
|
}
|
|
107
|
-
function
|
|
109
|
+
function cr(r) {
|
|
108
110
|
const e = new AbortController();
|
|
109
111
|
x.current.set(r.id, e), N(r.id, { status: "uploading", progress: null, reason: void 0 });
|
|
110
|
-
const t = () => !e.signal.aborted && x.current.get(r.id) === e,
|
|
111
|
-
onProgress: (
|
|
112
|
+
const t = () => !e.signal.aborted && x.current.get(r.id) === e, c = {
|
|
113
|
+
onProgress: (o) => {
|
|
112
114
|
if (!t()) return;
|
|
113
|
-
const
|
|
114
|
-
m?.status === "uploading" && m.progress !==
|
|
115
|
+
const l = Math.round(Math.min(1, Math.max(0, Number.isFinite(o) ? o : 0)) * 100) / 100, m = u.current.find((mr) => mr.id === r.id);
|
|
116
|
+
m?.status === "uploading" && m.progress !== l && N(r.id, { progress: l });
|
|
115
117
|
},
|
|
116
118
|
onProcessing: () => {
|
|
117
119
|
t() && N(r.id, { status: "processing" });
|
|
118
120
|
},
|
|
119
121
|
signal: e.signal
|
|
120
122
|
};
|
|
121
|
-
new Promise((
|
|
122
|
-
(
|
|
123
|
+
new Promise((o) => o(h.current.upload(r.file, c))).then(
|
|
124
|
+
(o) => {
|
|
123
125
|
if (!t()) return;
|
|
124
|
-
x.current.delete(r.id), N(r.id, { status: "done", progress: 1, result:
|
|
125
|
-
const
|
|
126
|
-
|
|
126
|
+
x.current.delete(r.id), N(r.id, { status: "done", progress: 1, result: o });
|
|
127
|
+
const l = u.current.filter((m) => m.status !== "rejected");
|
|
128
|
+
L(h.current.t.progress(l.filter((m) => m.status === "done").length, l.length), !0), w();
|
|
127
129
|
},
|
|
128
|
-
(
|
|
130
|
+
(o) => {
|
|
129
131
|
if (!t()) return;
|
|
130
132
|
x.current.delete(r.id);
|
|
131
|
-
const
|
|
132
|
-
N(r.id, { status: "failed", reason:
|
|
133
|
+
const l = h.current.t.uploadError(o);
|
|
134
|
+
N(r.id, { status: "failed", reason: l }), L(h.current.t.failedNotice(r.file.name, l)), w();
|
|
133
135
|
}
|
|
134
136
|
);
|
|
135
137
|
}
|
|
136
138
|
Y(() => {
|
|
137
|
-
h.current = { upload: d, onChange: T, concurrency: j, t:
|
|
139
|
+
h.current = { upload: d, onChange: T, concurrency: j, t: a, pump: w };
|
|
138
140
|
}), xr(() => {
|
|
139
141
|
const r = x.current;
|
|
140
|
-
return
|
|
141
|
-
|
|
142
|
+
return u.current.some((t) => (t.status === "uploading" || t.status === "processing") && !r.has(t.id)) && (k(
|
|
143
|
+
u.current.map(
|
|
142
144
|
(t) => (t.status === "uploading" || t.status === "processing") && !r.has(t.id) ? { ...t, status: "queued", progress: null } : t
|
|
143
145
|
)
|
|
144
146
|
), h.current.pump()), () => {
|
|
@@ -146,92 +148,92 @@ function Dr({
|
|
|
146
148
|
r.clear(), b.current && clearTimeout(b.current), b.current = null, y.current = [];
|
|
147
149
|
};
|
|
148
150
|
}, [k]);
|
|
149
|
-
const
|
|
150
|
-
if (e.some((
|
|
151
|
+
const ir = B ?? kr(D), dr = (r, e) => {
|
|
152
|
+
if (e.some((c) => Nr(c.file, r))) return a.duplicate(r);
|
|
151
153
|
const t = q?.(r);
|
|
152
154
|
if (t) return t;
|
|
153
|
-
if (!
|
|
154
|
-
if ($ !== void 0 && r.size > $) return
|
|
155
|
-
if (v !== void 0 && e.length >= v) return
|
|
156
|
-
},
|
|
157
|
-
if (
|
|
158
|
-
const e =
|
|
159
|
-
for (const
|
|
160
|
-
const
|
|
161
|
-
t.push({ id: `${C}-file-${sr.current++}`, file:
|
|
155
|
+
if (!wr(r, ir)) return a.wrongType(r);
|
|
156
|
+
if ($ !== void 0 && r.size > $) return a.tooLarge(r, $);
|
|
157
|
+
if (v !== void 0 && e.length >= v) return a.tooMany(v);
|
|
158
|
+
}, X = (r) => {
|
|
159
|
+
if (i || r.length === 0) return;
|
|
160
|
+
const e = u.current.filter((o) => o.status !== "rejected"), t = [];
|
|
161
|
+
for (const o of r) {
|
|
162
|
+
const l = dr(o, [...e, ...t.filter((m) => m.status !== "rejected")]);
|
|
163
|
+
t.push({ id: `${C}-file-${sr.current++}`, file: o, status: l ? "rejected" : "queued", progress: null, reason: l });
|
|
162
164
|
}
|
|
163
|
-
k([...
|
|
164
|
-
const
|
|
165
|
-
|
|
166
|
-
for (const
|
|
165
|
+
k([...u.current, ...t]);
|
|
166
|
+
const c = t.filter((o) => o.status === "queued").length;
|
|
167
|
+
c && L(a.added(c));
|
|
168
|
+
for (const o of t) o.reason && L(a.rejectedNotice(o.file.name, o.reason));
|
|
167
169
|
w();
|
|
168
|
-
},
|
|
169
|
-
if (
|
|
170
|
-
const e =
|
|
170
|
+
}, ur = (r) => {
|
|
171
|
+
if (i) return;
|
|
172
|
+
const e = u.current, t = e.findIndex((o) => o.id === r);
|
|
171
173
|
if (t < 0) return;
|
|
172
174
|
x.current.get(r)?.abort(), x.current.delete(r);
|
|
173
|
-
const
|
|
174
|
-
k(e.filter((
|
|
175
|
-
},
|
|
176
|
-
|
|
177
|
-
}, [fr,
|
|
175
|
+
const c = e[t + 1] ?? e[t - 1];
|
|
176
|
+
k(e.filter((o) => o.id !== r)), L(a.removed(e[t].file.name)), Q(c ? `[data-file-remove="${c.id}"]` : "[data-file-choose]"), w();
|
|
177
|
+
}, lr = (r) => {
|
|
178
|
+
i || (N(r, { status: "queued", progress: null, reason: void 0 }), Q(`[data-file-remove="${r}"]`), w());
|
|
179
|
+
}, [fr, P] = M(0), E = (r) => Array.from(r.dataTransfer?.types ?? []).includes("Files"), pr = {
|
|
178
180
|
onDragEnter: (r) => {
|
|
179
|
-
E(r) && (r.preventDefault(),
|
|
181
|
+
E(r) && (r.preventDefault(), P((e) => e + 1));
|
|
180
182
|
},
|
|
181
183
|
onDragOver: (r) => {
|
|
182
|
-
E(r) && (r.preventDefault(), r.dataTransfer.dropEffect =
|
|
184
|
+
E(r) && (r.preventDefault(), r.dataTransfer.dropEffect = i ? "none" : "copy");
|
|
183
185
|
},
|
|
184
186
|
onDragLeave: (r) => {
|
|
185
|
-
E(r) &&
|
|
187
|
+
E(r) && P((e) => Math.max(0, e - 1));
|
|
186
188
|
},
|
|
187
189
|
onDrop: (r) => {
|
|
188
|
-
E(r) && (r.preventDefault(),
|
|
190
|
+
E(r) && (r.preventDefault(), P(0), X(Array.from(r.dataTransfer.files)));
|
|
189
191
|
}
|
|
190
|
-
},
|
|
192
|
+
}, W = fr > 0 && !i, gr = (r) => {
|
|
191
193
|
switch (r.status) {
|
|
192
194
|
case "queued":
|
|
193
|
-
return
|
|
195
|
+
return a.queued;
|
|
194
196
|
case "uploading":
|
|
195
|
-
return
|
|
197
|
+
return a.uploading(r.progress === null ? null : Math.round(r.progress * 100));
|
|
196
198
|
case "processing":
|
|
197
|
-
return
|
|
199
|
+
return a.processing;
|
|
198
200
|
case "done":
|
|
199
|
-
return
|
|
201
|
+
return a.done;
|
|
200
202
|
case "failed":
|
|
201
|
-
return `${
|
|
203
|
+
return `${a.failed} ${r.reason ?? ""}`.trim();
|
|
202
204
|
case "rejected":
|
|
203
|
-
return `${
|
|
205
|
+
return `${a.rejected} ${r.reason ?? ""}`.trim();
|
|
204
206
|
}
|
|
205
|
-
}, hr = [S ?
|
|
206
|
-
return /* @__PURE__ */
|
|
207
|
+
}, hr = [S ? _ : null, R ? J : null].filter(Boolean).join(" ") || void 0;
|
|
208
|
+
return /* @__PURE__ */ p(
|
|
207
209
|
"div",
|
|
208
210
|
{
|
|
209
211
|
ref: O,
|
|
210
212
|
role: "group",
|
|
211
|
-
"aria-labelledby":
|
|
212
|
-
className:
|
|
213
|
+
"aria-labelledby": z,
|
|
214
|
+
className: g("rst:font-ui rst:w-full", tr),
|
|
213
215
|
"data-file-upload": "",
|
|
214
216
|
children: [
|
|
215
217
|
/* @__PURE__ */ n(
|
|
216
218
|
"p",
|
|
217
219
|
{
|
|
218
|
-
id:
|
|
219
|
-
className:
|
|
220
|
+
id: z,
|
|
221
|
+
className: g(
|
|
220
222
|
"rst:mb-1.5 rst:text-left rst:text-sm rst:font-medium rst:leading-none rst:text-[var(--roster-control-text)]",
|
|
221
|
-
|
|
223
|
+
i && "rst:opacity-70"
|
|
222
224
|
),
|
|
223
225
|
children: s
|
|
224
226
|
}
|
|
225
227
|
),
|
|
226
|
-
/* @__PURE__ */
|
|
228
|
+
/* @__PURE__ */ p(
|
|
227
229
|
"div",
|
|
228
230
|
{
|
|
229
231
|
...pr,
|
|
230
232
|
"data-file-drop": "",
|
|
231
|
-
"data-dragging":
|
|
232
|
-
className:
|
|
233
|
+
"data-dragging": W ? "" : void 0,
|
|
234
|
+
className: g(
|
|
233
235
|
"rst:flex rst:flex-col rst:items-center rst:justify-center rst:gap-2 rst:rounded-lg rst:border-2 rst:border-dashed rst:px-4 rst:py-6 rst:text-center rst:transition-colors rst:motion-reduce:transition-none",
|
|
234
|
-
|
|
236
|
+
W ? "rst:border-primary-500 rst:bg-primary-500/10" : R ? "rst:border-error-500 rst:dark:border-error-400" : "rst:border-gray-300 rst:dark:border-gray-600"
|
|
235
237
|
),
|
|
236
238
|
children: [
|
|
237
239
|
/* @__PURE__ */ n(
|
|
@@ -241,13 +243,13 @@ function Dr({
|
|
|
241
243
|
variant: "outline",
|
|
242
244
|
colorScheme: "neutral",
|
|
243
245
|
size: "lg",
|
|
244
|
-
className:
|
|
245
|
-
"aria-disabled":
|
|
246
|
+
className: g("rst:px-5", i && V),
|
|
247
|
+
"aria-disabled": i || void 0,
|
|
246
248
|
"aria-describedby": hr,
|
|
247
|
-
onClick: () =>
|
|
249
|
+
onClick: () => K.current?.click(),
|
|
248
250
|
"data-file-choose": "",
|
|
249
251
|
startIcon: /* @__PURE__ */ n("svg", { ...I, "aria-hidden": "true", children: /* @__PURE__ */ n("path", { d: "M12 16V4M7 9l5-5 5 5M5 20h14" }) }),
|
|
250
|
-
children:
|
|
252
|
+
children: a.choose
|
|
251
253
|
}
|
|
252
254
|
),
|
|
253
255
|
/* @__PURE__ */ n(
|
|
@@ -255,21 +257,21 @@ function Dr({
|
|
|
255
257
|
{
|
|
256
258
|
className: "rst:hidden rst:text-xs rst:text-gray-600 rst:pointer-fine:block rst:dark:text-gray-400",
|
|
257
259
|
"data-file-drop-hint": "",
|
|
258
|
-
children:
|
|
260
|
+
children: W ? a.dropHere : a.dropHint
|
|
259
261
|
}
|
|
260
262
|
),
|
|
261
263
|
/* @__PURE__ */ n(
|
|
262
264
|
"input",
|
|
263
265
|
{
|
|
264
|
-
ref:
|
|
266
|
+
ref: K,
|
|
265
267
|
type: "file",
|
|
266
268
|
hidden: !0,
|
|
267
269
|
tabIndex: -1,
|
|
268
270
|
accept: D,
|
|
269
271
|
multiple: v !== 1,
|
|
270
|
-
disabled:
|
|
272
|
+
disabled: i,
|
|
271
273
|
onChange: (r) => {
|
|
272
|
-
|
|
274
|
+
X(Array.from(r.currentTarget.files ?? [])), r.currentTarget.value = "";
|
|
273
275
|
},
|
|
274
276
|
"data-file-input": ""
|
|
275
277
|
}
|
|
@@ -277,69 +279,47 @@ function Dr({
|
|
|
277
279
|
]
|
|
278
280
|
}
|
|
279
281
|
),
|
|
280
|
-
S && /* @__PURE__ */ n("p", { id:
|
|
281
|
-
R && /* @__PURE__ */ n("p", { id:
|
|
282
|
-
|
|
282
|
+
S && /* @__PURE__ */ n("p", { id: _, className: "rst:mt-1.5 rst:text-left rst:text-xs rst:text-gray-500 rst:dark:text-gray-400", children: S }),
|
|
283
|
+
R && /* @__PURE__ */ n("p", { id: J, className: "rst:mt-1.5 rst:text-left rst:text-xs rst:font-medium rst:text-error-600 rst:dark:text-error-400", children: R }),
|
|
284
|
+
F.length > 0 && /* @__PURE__ */ n("ul", { className: "rst:mt-3 rst:flex rst:flex-col rst:gap-2", "aria-labelledby": z, children: F.map((r) => {
|
|
283
285
|
const e = r.status === "failed" || r.status === "rejected", t = r.status === "uploading" || r.status === "processing" || r.status === "queued";
|
|
284
|
-
return /* @__PURE__ */
|
|
286
|
+
return /* @__PURE__ */ p(
|
|
285
287
|
"li",
|
|
286
288
|
{
|
|
287
289
|
"data-file-item": r.id,
|
|
288
290
|
"data-status": r.status,
|
|
289
291
|
className: "rst:flex rst:items-center rst:gap-3 rst:rounded-md rst:border rst:border-[var(--roster-card-border)] rst:p-2",
|
|
290
292
|
children: [
|
|
291
|
-
/* @__PURE__ */ n(
|
|
292
|
-
/* @__PURE__ */
|
|
293
|
+
/* @__PURE__ */ n(jr, { file: r.file, status: r.status }),
|
|
294
|
+
/* @__PURE__ */ p("div", { className: "rst:min-w-0 rst:flex-1 rst:text-left", children: [
|
|
293
295
|
/* @__PURE__ */ n("p", { className: "rst:truncate rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)]", title: r.file.name, children: r.file.name }),
|
|
294
|
-
/* @__PURE__ */
|
|
296
|
+
/* @__PURE__ */ p(
|
|
295
297
|
"p",
|
|
296
298
|
{
|
|
297
|
-
className:
|
|
299
|
+
className: g(
|
|
298
300
|
"rst:mt-0.5 rst:flex rst:items-start rst:gap-1 rst:text-xs",
|
|
299
301
|
e ? "rst:text-error-600 rst:dark:text-error-400" : "rst:text-gray-600 rst:dark:text-gray-400"
|
|
300
302
|
),
|
|
301
303
|
"data-file-status": "",
|
|
302
304
|
children: [
|
|
303
305
|
r.status === "done" && /* @__PURE__ */ n("svg", { ...I, width: 14, height: 14, "aria-hidden": "true", className: "rst:mt-px rst:shrink-0 rst:text-success-600 rst:dark:text-success-400", children: /* @__PURE__ */ n("path", { d: "M20 6 9 17l-5-5" }) }),
|
|
304
|
-
/* @__PURE__ */
|
|
305
|
-
/* @__PURE__ */ n("span", { className: "rst:tabular-nums", children:
|
|
306
|
+
/* @__PURE__ */ p("span", { children: [
|
|
307
|
+
/* @__PURE__ */ n("span", { className: "rst:tabular-nums", children: a.size(r.file.size) }),
|
|
306
308
|
/* @__PURE__ */ n("span", { "aria-hidden": "true", children: " · " }),
|
|
307
309
|
gr(r)
|
|
308
310
|
] })
|
|
309
311
|
]
|
|
310
312
|
}
|
|
311
313
|
),
|
|
312
|
-
t && /* @__PURE__ */ n(
|
|
313
|
-
|
|
314
|
+
t && /* @__PURE__ */ n("div", { className: "rst:mt-1.5", "data-file-progress": "", children: /* @__PURE__ */ n(
|
|
315
|
+
br,
|
|
314
316
|
{
|
|
315
|
-
|
|
316
|
-
"
|
|
317
|
-
"
|
|
318
|
-
|
|
319
|
-
"aria-valuenow": r.status === "uploading" && r.progress !== null ? Math.round(r.progress * 100) : void 0,
|
|
320
|
-
className: f(
|
|
321
|
-
"rst:mt-1.5 rst:h-1.5 rst:overflow-hidden rst:rounded-full rst:bg-gray-200 rst:dark:bg-gray-700",
|
|
322
|
-
/* Under way with no figure yet: the track pulses and the
|
|
323
|
-
fill waits at zero, so the first figure grows it
|
|
324
|
-
rather than shrinking a full bar. */
|
|
325
|
-
r.status === "uploading" && r.progress === null && "rst:animate-pulse rst:motion-reduce:animate-none"
|
|
326
|
-
),
|
|
327
|
-
"data-file-progress": "",
|
|
328
|
-
children: /* @__PURE__ */ n(
|
|
329
|
-
"div",
|
|
330
|
-
{
|
|
331
|
-
className: f(
|
|
332
|
-
"rst:h-full rst:origin-left rst:rounded-full rst:bg-primary-600 rst:transition-transform rst:motion-reduce:transition-none rst:dark:bg-primary-400",
|
|
333
|
-
/* On the server: full, and pulsing, since there's no figure to give. */
|
|
334
|
-
r.status === "processing" && "rst:animate-pulse rst:motion-reduce:animate-none"
|
|
335
|
-
),
|
|
336
|
-
style: {
|
|
337
|
-
transform: `scaleX(${r.status === "processing" ? 1 : r.status === "uploading" ? r.progress ?? 0 : 0})`
|
|
338
|
-
}
|
|
339
|
-
}
|
|
340
|
-
)
|
|
317
|
+
size: "sm",
|
|
318
|
+
value: r.status === "processing" ? 100 : r.status === "uploading" ? (r.progress ?? 0) * 100 : 0,
|
|
319
|
+
busy: r.status === "processing" || r.status === "uploading" && r.progress === null,
|
|
320
|
+
announce: !1
|
|
341
321
|
}
|
|
342
|
-
)
|
|
322
|
+
) })
|
|
343
323
|
] }),
|
|
344
324
|
r.status === "failed" && /* @__PURE__ */ n(
|
|
345
325
|
G,
|
|
@@ -348,12 +328,12 @@ function Dr({
|
|
|
348
328
|
variant: "ghost",
|
|
349
329
|
colorScheme: "neutral",
|
|
350
330
|
size: "icon",
|
|
351
|
-
className:
|
|
352
|
-
"aria-disabled":
|
|
353
|
-
"aria-label":
|
|
354
|
-
onClick: () =>
|
|
331
|
+
className: g("rst:h-11 rst:w-11", i && V),
|
|
332
|
+
"aria-disabled": i || void 0,
|
|
333
|
+
"aria-label": a.retry(r.file.name),
|
|
334
|
+
onClick: () => lr(r.id),
|
|
355
335
|
"data-file-retry": r.id,
|
|
356
|
-
children: /* @__PURE__ */
|
|
336
|
+
children: /* @__PURE__ */ p("svg", { ...I, "aria-hidden": "true", children: [
|
|
357
337
|
/* @__PURE__ */ n("path", { d: "M3 12a9 9 0 1 0 3-6.7L3 8" }),
|
|
358
338
|
/* @__PURE__ */ n("path", { d: "M3 3v5h5" })
|
|
359
339
|
] })
|
|
@@ -366,10 +346,10 @@ function Dr({
|
|
|
366
346
|
variant: "ghost",
|
|
367
347
|
colorScheme: "neutral",
|
|
368
348
|
size: "icon",
|
|
369
|
-
className:
|
|
370
|
-
"aria-disabled":
|
|
371
|
-
"aria-label":
|
|
372
|
-
onClick: () =>
|
|
349
|
+
className: g("rst:h-11 rst:w-11", i && V),
|
|
350
|
+
"aria-disabled": i || void 0,
|
|
351
|
+
"aria-label": a.remove(r.file.name),
|
|
352
|
+
onClick: () => ur(r.id),
|
|
373
353
|
"data-file-remove": r.id,
|
|
374
354
|
children: /* @__PURE__ */ n("svg", { ...I, "aria-hidden": "true", children: /* @__PURE__ */ n("path", { d: "M18 6 6 18M6 6l12 12" }) })
|
|
375
355
|
}
|
|
@@ -379,7 +359,7 @@ function Dr({
|
|
|
379
359
|
r.id
|
|
380
360
|
);
|
|
381
361
|
}) }),
|
|
382
|
-
/* @__PURE__ */
|
|
362
|
+
/* @__PURE__ */ p(
|
|
383
363
|
"div",
|
|
384
364
|
{
|
|
385
365
|
role: "status",
|
|
@@ -399,5 +379,5 @@ function Dr({
|
|
|
399
379
|
);
|
|
400
380
|
}
|
|
401
381
|
export {
|
|
402
|
-
|
|
382
|
+
Er as FileUpload
|
|
403
383
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),h=require("react"),i=require("../../../lib/utils.cjs");function j({src:e,href:t,alt:s,unavailableLabel:n="Preview unavailable",openLabel:a="Open original",newTabLabel:u="in a new tab",onUnavailable:g,className:o,...x}){const[b,f]=h.useState(null),m=!e||b===e,c="rst:font-ui rst:h-28 rst:w-36 rst:shrink-0 rst:rounded-md rst:border rst:border-[var(--roster-card-border)]";if(m){const d=r.jsxs(r.Fragment,{children:[r.jsx("span",{children:n}),t?r.jsxs("span",{className:"rst:font-semibold rst:underline",children:[a,r.jsx("span",{"aria-hidden":"true",children:" ↗"})]}):null]}),l=i.cn(c,"rst:flex rst:flex-col rst:items-center rst:justify-center rst:gap-1 rst:border-dashed rst:px-2 rst:text-center rst:text-xs rst:text-gray-600 rst:dark:text-gray-300",o);return t?r.jsx("a",{href:t,target:"_blank",rel:"noreferrer",className:i.cn(l,"rst:hover:bg-gray-50 rst:dark:hover:bg-gray-800 rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring"),"aria-label":`${n}. ${a}, ${u}: ${s}`,children:d}):r.jsx("span",{role:"img","aria-label":`${n}: ${s}`,className:l,children:d})}return r.jsx("img",{...x,src:e,alt:s,className:i.cn(c,"rst:object-cover",o),onError:()=>{f(e),g?.()}})}exports.MediaPreview=j;
|
|
@@ -10,6 +10,8 @@ export interface MediaPreviewProps extends Omit<ImgHTMLAttributes<HTMLImageEleme
|
|
|
10
10
|
unavailableLabel?: string;
|
|
11
11
|
/** The link's own words. */
|
|
12
12
|
openLabel?: string;
|
|
13
|
+
/** Said with the link's name, since its arrow shows it only to the eye: "in a new tab". */
|
|
14
|
+
newTabLabel?: string;
|
|
13
15
|
/** Called once when the thumbnail fails, for an app that keeps a count. */
|
|
14
16
|
onUnavailable?: () => void;
|
|
15
17
|
}
|
|
@@ -23,5 +25,5 @@ export interface MediaPreviewProps extends Omit<ImgHTMLAttributes<HTMLImageEleme
|
|
|
23
25
|
* for a card that says the preview is unavailable and links to the original,
|
|
24
26
|
* in the same footprint, so a row of previews doesn't jump.
|
|
25
27
|
*/
|
|
26
|
-
declare function MediaPreview({ src, href, alt, unavailableLabel, openLabel, onUnavailable, className, ...props }: MediaPreviewProps): import("react/jsx-runtime").JSX.Element;
|
|
28
|
+
declare function MediaPreview({ src, href, alt, unavailableLabel, openLabel, newTabLabel, onUnavailable, className, ...props }: MediaPreviewProps): import("react/jsx-runtime").JSX.Element;
|
|
27
29
|
export { MediaPreview };
|
|
@@ -1,20 +1,21 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as r, jsxs as m, Fragment as
|
|
3
|
-
import { useState as
|
|
2
|
+
import { jsx as r, jsxs as m, Fragment as p } from "react/jsx-runtime";
|
|
3
|
+
import { useState as v } from "react";
|
|
4
4
|
import { cn as i } from "../../../lib/utils.js";
|
|
5
|
-
function
|
|
5
|
+
function j({
|
|
6
6
|
src: e,
|
|
7
7
|
href: t,
|
|
8
8
|
alt: s,
|
|
9
9
|
unavailableLabel: n = "Preview unavailable",
|
|
10
10
|
openLabel: o = "Open original",
|
|
11
|
-
|
|
11
|
+
newTabLabel: g = "in a new tab",
|
|
12
|
+
onUnavailable: u,
|
|
12
13
|
className: a,
|
|
13
|
-
...
|
|
14
|
+
...f
|
|
14
15
|
}) {
|
|
15
|
-
const [
|
|
16
|
-
if (
|
|
17
|
-
const l = /* @__PURE__ */ m(
|
|
16
|
+
const [b, h] = v(null), x = !e || b === e, d = "rst:font-ui rst:h-28 rst:w-36 rst:shrink-0 rst:rounded-md rst:border rst:border-[var(--roster-card-border)]";
|
|
17
|
+
if (x) {
|
|
18
|
+
const l = /* @__PURE__ */ m(p, { children: [
|
|
18
19
|
/* @__PURE__ */ r("span", { children: n }),
|
|
19
20
|
t ? /* @__PURE__ */ m("span", { className: "rst:font-semibold rst:underline", children: [
|
|
20
21
|
o,
|
|
@@ -32,7 +33,7 @@ function $({
|
|
|
32
33
|
target: "_blank",
|
|
33
34
|
rel: "noreferrer",
|
|
34
35
|
className: i(c, "rst:hover:bg-gray-50 rst:dark:hover:bg-gray-800 rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring"),
|
|
35
|
-
"aria-label": `${n}. ${o},
|
|
36
|
+
"aria-label": `${n}. ${o}, ${g}: ${s}`,
|
|
36
37
|
children: l
|
|
37
38
|
}
|
|
38
39
|
) : /* @__PURE__ */ r("span", { role: "img", "aria-label": `${n}: ${s}`, className: c, children: l });
|
|
@@ -40,16 +41,16 @@ function $({
|
|
|
40
41
|
return /* @__PURE__ */ r(
|
|
41
42
|
"img",
|
|
42
43
|
{
|
|
43
|
-
...
|
|
44
|
+
...f,
|
|
44
45
|
src: e,
|
|
45
46
|
alt: s,
|
|
46
47
|
className: i(d, "rst:object-cover", a),
|
|
47
48
|
onError: () => {
|
|
48
|
-
|
|
49
|
+
h(e), u?.();
|
|
49
50
|
}
|
|
50
51
|
}
|
|
51
52
|
);
|
|
52
53
|
}
|
|
53
54
|
export {
|
|
54
|
-
|
|
55
|
+
j as MediaPreview
|
|
55
56
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),w=require("react"),
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),w=require("react"),b=require("../../../lib/utils.cjs"),ee=require("../../../lib/labels.cjs"),te=require("../../atoms/Button/Button.cjs"),se=require("../../atoms/Button/button-variants.cjs"),re=require("../../atoms/Select/select-variants.cjs"),Q=require("./page-items.cjs"),ae={nav:"Pagination",page:t=>`Page ${t}`,number:t=>String(t),previous:"Previous",next:"Next",previousPage:t=>t===null?"Previous page":`Previous page (${t})`,nextPage:t=>t===null?"Next page":`Next page (${t})`,firstPage:t=>t===null?"First page":`First page (${t})`,lastPage:t=>t===null?"Last page":`Last page (${t})`,gap:"…",picker:"Page",of:t=>`of ${t}`,status:(t,i)=>`Page ${t} of ${i}`};function ne({href:t,className:i,children:c,onClick:o,...d}){return e.jsx("a",{href:t,className:i,onClick:o,"aria-label":d["aria-label"],"aria-current":d["aria-current"],"aria-disabled":d["aria-disabled"],children:c})}const ie="rst:h-11 rst:min-w-11 rst:px-2",le="rst:cursor-not-allowed rst:opacity-50",oe="rst:forced-colors:border-2 rst:forced-colors:underline rst:forced-colors:decoration-2 rst:forced-colors:underline-offset-4",X={width:18,height:18,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":!0},L=({dir:t,double:i=!1})=>e.jsx("svg",{...X,className:"rst:shrink-0",children:t==="left"?i?e.jsx("path",{d:"m11 17-5-5 5-5M18 17l-5-5 5-5"}):e.jsx("path",{d:"m15 18-6-6 6-6"}):i?e.jsx("path",{d:"m13 17 5-5-5-5M6 17l5-5-5-5"}):e.jsx("path",{d:"m9 18 6-6-6-6"})});function ce({id:t,describedBy:i,page:c,pageCount:o,number:d,onCommit:k}){const[u,j]=w.useState(null),p=w.useRef(!1),x=u&&u.page===c?u.value:null,v=l=>{j(null),l!==c&&k(l)},P=w.useMemo(()=>Array.from({length:o},(l,f)=>e.jsx("option",{value:f+1,children:d(f+1)},f+1)),[o,d]);return e.jsx("select",{id:t,value:x??c,"aria-describedby":i,disabled:o<1,onKeyDown:l=>{if(l.key==="Enter"){x!==null&&(l.preventDefault(),v(x));return}if(l.key==="Escape"){j(null);return}p.current=!0,setTimeout(()=>{p.current=!1},0)},onChange:l=>{const f=Number(l.currentTarget.value);p.current?j({page:c,value:f}):v(f)},onBlur:()=>{x!==null&&v(x)},className:b.cn(re.selectTriggerVariants({variant:"outline"}),"rst:h-11 rst:w-auto rst:min-w-16 rst:appearance-none rst:pl-3 rst:pr-8 rst:text-base rst:tabular-nums"),"data-pagination-picker":"",children:P})}function ue({page:t,pageCount:i,onPageChange:c,getPageHref:o,linkComponent:d,navigate:k,layout:u="auto",siblings:j=1,edges:p=!0,align:x="center",variant:v="ghost",announce:P=!0,labels:l,className:f}){const a=ee.withLabels(ae,l),m=Number.isFinite(i)?Math.max(0,Math.floor(i)):0,n=Q.clampPage(t,m),C=w.useId(),Y=d??ne,[E,Z]=w.useState({page:n,text:""});E.page!==n&&Z({page:n,text:P?a.status(n,m):""});const F=s=>{s!==Math.floor(t)&&c?.(s)},y=(s,r,N,A)=>{const h=s==="page"&&r===n,$=r===null,U=b.cn(ie,$&&le,h&&oe,A.className),W=s==="page"?`page-${r}`:s;if(o){const J=o(r??n);return e.jsx(Y,{href:J,to:J,className:b.cn(se.buttonVariants({variant:h?"solid":v,colorScheme:h?"primary":"neutral"}),U),"aria-label":A.label,"aria-current":h?"page":void 0,"aria-disabled":$?!0:void 0,onClick:g=>{if($){g.preventDefault();return}!g.defaultPrevented&&g.button===0&&!g.metaKey&&!g.ctrlKey&&!g.shiftKey&&!g.altKey&&r!==null&&F(r)},children:N},W)}return e.jsx(te.Button,{type:"button",variant:h?"solid":v,colorScheme:h?"primary":"neutral",className:U,"aria-label":A.label,"aria-current":h?"page":void 0,"aria-disabled":$||void 0,onClick:()=>{r!==null&&F(r)},children:N},W)},I=n>1?n-1:null,R=n<m?n+1:null,T=n>1?1:null,B=n<m?m:null,M=s=>y("previous",I,e.jsxs(e.Fragment,{children:[e.jsx(L,{dir:"left"}),s&&e.jsx("span",{className:"rst:hidden rst:pr-1 rst:@[36rem]:inline",children:a.previous})]}),{label:a.previousPage(I)}),S=s=>y("next",R,e.jsxs(e.Fragment,{children:[s&&e.jsx("span",{className:"rst:hidden rst:pl-1 rst:@[36rem]:inline",children:a.next}),e.jsx(L,{dir:"right"})]}),{label:a.nextPage(R)}),K=s=>y("first",T,e.jsx(L,{dir:"left",double:!0}),{label:a.firstPage(T),className:s?"rst:hidden rst:@[24rem]:inline-flex":void 0}),V=s=>y("last",B,e.jsx(L,{dir:"right",double:!0}),{label:a.lastPage(B),className:s?"rst:hidden rst:@[24rem]:inline-flex":void 0}),q="rst:flex rst:flex-wrap rst:items-center rst:gap-1",D={start:"rst:justify-start",center:"rst:justify-center",end:"rst:justify-end"}[x],O=s=>e.jsxs("div",{className:b.cn(q,D,s),"data-pagination-layout":"pages",children:[M(!0),Q.pageItems(n,m,j).map(r=>typeof r=="number"?y("page",r,a.number(r),{label:a.page(r)}):e.jsx("span",{"aria-hidden":"true",className:"rst:inline-flex rst:h-11 rst:w-11 rst:items-center rst:justify-center rst:text-sm rst:text-gray-500 rst:dark:text-gray-400",children:a.gap},r)),S(!0)]}),_=`${C}-picker`,z=`${C}-of`,G=s=>e.jsxs("div",{className:b.cn(q,D,s),"data-pagination-layout":"compact",children:[p&&K(!0),M(!1),e.jsxs("div",{className:"rst:flex rst:items-center rst:gap-2 rst:px-1 rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)]",children:[e.jsx("label",{htmlFor:_,children:a.picker}),e.jsxs("span",{className:"rst:relative rst:inline-flex",children:[e.jsx(ce,{id:_,describedBy:z,page:n,pageCount:m,number:a.number,onCommit:r=>{if(o){c?.(r);const N=o(r);k?k(N):window.location.assign(N)}else F(r)}}),e.jsx("svg",{...X,width:16,height:16,className:"rst:pointer-events-none rst:absolute rst:right-2.5 rst:top-1/2 rst:-translate-y-1/2 rst:text-gray-500 rst:dark:text-gray-400",children:e.jsx("path",{d:"m6 9 6 6 6-6"})})]}),e.jsx("span",{id:z,className:"rst:tabular-nums",children:a.of(m)})]}),S(!1),p&&V(!0)]}),H=e.jsxs("div",{className:b.cn(q,D),"data-pagination-layout":"arrows",children:[p&&K(!1),M(!1),S(!1),p&&V(!1)]});return e.jsxs("nav",{"aria-label":a.nav,className:b.cn("rst:font-ui",u==="arrows"?"rst:w-fit":"rst:@container rst:w-full rst:[contain-intrinsic-inline-size:18rem]",f),"data-pagination":"",children:[u==="pages"&&O(),u==="compact"&&G(),u==="arrows"&&H,u==="auto"&&e.jsxs(e.Fragment,{children:[O("rst:hidden rst:@[28rem]:flex"),G("rst:@[28rem]:hidden")]}),P&&e.jsx("div",{role:"status","aria-live":"polite","aria-atomic":"true",className:"rst:sr-only","data-pagination-live":"",children:E.text})]})}exports.Pagination=ue;
|
|
@@ -96,6 +96,7 @@ export interface PaginationProps {
|
|
|
96
96
|
variant?: "ghost" | "outline";
|
|
97
97
|
/** Say the new page in a polite live region when it changes. */
|
|
98
98
|
announce?: boolean;
|
|
99
|
+
/** The component's own words, replaced; any left out stay English. */
|
|
99
100
|
labels?: Partial<PaginationLabels>;
|
|
100
101
|
className?: string;
|
|
101
102
|
}
|