@stanfordspezi/spezi-web-design-system
Version:
Stanford Biodesign Digital Health Spezi Web Design System
285 lines (284 loc) • 7.39 kB
JavaScript
import { jsx as a, jsxs as K } from "react/jsx-runtime";
import d, { useContext as w, useState as M, useRef as Q, useEffect as A, useCallback as R, useMemo as Z } from "react";
import { c as C } from "./index-2NvaPZWc.mjs";
import { B as E } from "./Button-C6E7PEI7.mjs";
import { C as W } from "./chevron-left-Dx_hGDAI.mjs";
import { C as F } from "./chevron-right-BLuy6fjX.mjs";
import { E as U } from "./ellipsis-BIueXPpb.mjs";
const Y = /* @__PURE__ */ new Set([
"Arab",
"Syrc",
"Samr",
"Mand",
"Thaa",
"Mend",
"Nkoo",
"Adlm",
"Rohg",
"Hebr"
]), O = /* @__PURE__ */ new Set([
"ae",
"ar",
"arc",
"bcc",
"bqi",
"ckb",
"dv",
"fa",
"glk",
"he",
"ku",
"mzn",
"nqo",
"pnb",
"ps",
"sd",
"ug",
"ur",
"yi"
]);
function _(e) {
if (Intl.Locale) {
let n = new Intl.Locale(e).maximize(), o = typeof n.getTextInfo == "function" ? n.getTextInfo() : n.textInfo;
if (o) return o.direction === "rtl";
if (n.script) return Y.has(n.script);
}
let t = e.split("-")[0];
return O.has(t);
}
const S = {
prefix: String(Math.round(Math.random() * 1e10)),
current: 0
}, D = /* @__PURE__ */ d.createContext(S), ee = /* @__PURE__ */ d.createContext(!1);
let te = !!(typeof window < "u" && window.document && window.document.createElement), P = /* @__PURE__ */ new WeakMap();
function ne(e = !1) {
let t = w(D), n = Q(null);
if (n.current === null && !e) {
var o, i;
let s = (i = d.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED) === null || i === void 0 || (o = i.ReactCurrentOwner) === null || o === void 0 ? void 0 : o.current;
if (s) {
let l = P.get(s);
l == null ? P.set(s, {
id: t.current,
state: s.memoizedState
}) : s.memoizedState !== l.state && (t.current = l.id, P.delete(s));
}
n.current = ++t.current;
}
return n.current;
}
function ae(e) {
let t = w(D);
t === S && !te && console.warn("When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are generated between the client and server.");
let n = ne(!!e), o = t === S && process.env.NODE_ENV === "test" ? "react-aria" : `react-aria${t.prefix}`;
return e || `${o}-${n}`;
}
function re(e) {
let t = d.useId(), [n] = M(G()), o = n || process.env.NODE_ENV === "test" ? "react-aria" : `react-aria${S.prefix}`;
return e || `${o}-${t}`;
}
d.useId;
function oe() {
return !1;
}
function ie() {
return !0;
}
function ce(e) {
return () => {
};
}
function G() {
return typeof d.useSyncExternalStore == "function" ? d.useSyncExternalStore(ce, oe, ie) : w(ee);
}
const se = Symbol.for("react-aria.i18n.locale");
function q() {
let e = typeof window < "u" && window[se] || typeof navigator < "u" && (navigator.language || navigator.userLanguage) || "en-US";
try {
Intl.DateTimeFormat.supportedLocalesOf([
e
]);
} catch {
e = "en-US";
}
return {
locale: e,
direction: _(e) ? "rtl" : "ltr"
};
}
let I = q(), v = /* @__PURE__ */ new Set();
function j() {
I = q();
for (let e of v) e(I);
}
function le() {
let e = G(), [t, n] = M(I);
return A(() => (v.size === 0 && window.addEventListener("languagechange", j), v.add(n), () => {
v.delete(n), v.size === 0 && window.removeEventListener("languagechange", j);
}), []), e ? {
locale: "en-US",
direction: "ltr"
} : t;
}
const ue = /* @__PURE__ */ d.createContext(null);
function fe() {
let e = le();
return w(ue) || e;
}
function f(e, t) {
const n = t - e + 1;
return Array.from({ length: n }, (o, i) => i + e);
}
var g = /* @__PURE__ */ ((e) => (e.DOTS = "dots", e.PREV = "prev", e.NEXT = "next", e))(g || {});
function de(e) {
const {
page: t,
total: n,
siblings: o = 1,
boundaries: i = 1,
initialPage: s = 1,
showControls: l = !1,
onChange: m
} = e, [r, x] = M(t || s), { direction: B } = fe(), $ = B === "rtl", b = (c) => {
x(c), m && m(c);
};
A(() => {
t && t !== r && x(t);
}, [t]);
const u = R(
(c) => {
c <= 0 ? b(1) : c > n ? b(n) : b(c);
},
[n, r, b]
), X = () => u($ ? r - 1 : r + 1), H = () => u($ ? r + 1 : r - 1), T = () => u($ ? n : 1), J = () => u($ ? 1 : n), p = R(
(c) => l ? $ ? [
"next",
...c,
"prev"
/* PREV */
] : [
"prev",
...c,
"next"
/* NEXT */
] : c,
[$, l]
);
return {
range: Z(() => {
if (o * 2 + 3 + i * 2 >= n)
return p(f(1, n));
const k = Math.max(r - o, i), L = Math.min(r + o, n - i), N = k > i + 2, V = L < n - (i + 1);
if (!N && V) {
const y = o * 2 + i + 2;
return p([
...f(1, y),
"dots",
...f(n - (i - 1), n)
]);
}
if (N && !V) {
const y = i + 1 + 2 * o;
return p([
...f(1, i),
"dots",
...f(n - y, n)
]);
}
return p([
...f(1, i),
"dots",
...f(k, L),
"dots",
...f(n - i + 1, n)
]);
}, [n, r, o, i, p]),
activePage: r,
setPage: u,
next: X,
previous: H,
first: T,
last: J
};
}
const $e = ({ className: e, ...t }) => /* @__PURE__ */ a(
"nav",
{
role: "navigation",
"aria-label": "pagination",
className: C("flex justify-center", e),
...t
}
), pe = ({
className: e,
...t
}) => /* @__PURE__ */ a("ul", { className: C("flex items-center gap-1", e), ...t }), h = ({
className: e,
...t
}) => /* @__PURE__ */ a("li", { className: C("", e), ...t }), z = ({
isActive: e,
size: t = "sm",
...n
}) => /* @__PURE__ */ a(
E,
{
"aria-current": e ? "page" : void 0,
variant: e ? "outline" : "ghost",
size: t,
...n
}
), ve = () => /* @__PURE__ */ a(W, { className: "size-4" }), me = ({
children: e,
...t
}) => /* @__PURE__ */ a(z, { "aria-label": "Go to previous page", ...t, children: e ?? /* @__PURE__ */ a(ve, {}) }), xe = () => /* @__PURE__ */ a(F, { className: "size-4" }), be = ({
children: e,
...t
}) => /* @__PURE__ */ a(z, { "aria-label": "Go to next page", ...t, children: e ?? /* @__PURE__ */ a(xe, {}) }), he = ({
className: e,
...t
}) => /* @__PURE__ */ K("span", { "aria-hidden": !0, className: C("flex-center size-9", e), ...t, children: [
/* @__PURE__ */ a(U, { className: "size-4" }),
/* @__PURE__ */ a("span", { className: "sr-only", children: "More pages" })
] }), ze = ({
total: e,
page: t,
onPageChange: n,
siblings: o = 1,
showControls: i = !0,
...s
}) => {
const { activePage: l, range: m } = de({
total: e,
page: t,
siblings: o,
showControls: i,
...s
});
return /* @__PURE__ */ a($e, { children: /* @__PURE__ */ a(pe, { children: m.map((r, x) => r === g.PREV ? t === 1 ? null : /* @__PURE__ */ a(h, { children: /* @__PURE__ */ a(
me,
{
onClick: () => n(l - 1)
}
) }, r) : r === g.NEXT ? t === e ? null : /* @__PURE__ */ a(h, { children: /* @__PURE__ */ a(be, { onClick: () => n(l + 1) }) }, r) : r === g.DOTS ? /* @__PURE__ */ a(h, { children: /* @__PURE__ */ a(he, {}) }, `${r}-${x}`) : /* @__PURE__ */ a(h, { children: /* @__PURE__ */ a(
z,
{
onClick: () => n(r),
isActive: r === t,
children: r
}
) }, r)) }) });
};
export {
ze as B,
$e as P,
pe as a,
h as b,
z as c,
ve as d,
me as e,
xe as f,
be as g,
he as h,
g as i,
de as u
};