@stanfordspezi/spezi-web-design-system
Version:
Stanford Biodesign Digital Health Spezi Web Design System
310 lines (309 loc) • 7.68 kB
JavaScript
import { jsx as a, jsxs as J } from "react/jsx-runtime";
import d, { useContext as w, useState as M, useRef as K, useEffect as j, useCallback as D, useMemo as Q } from "react";
import { c as C } from "./index-2NvaPZWc.mjs";
import { B as Z } from "./Button-nH76KtOO.mjs";
import W from "./ellipsis-CsddV5yM.mjs";
import F from "./chevron-right-DwA2ExUr.mjs";
import U from "./chevron-left-DE2jAC6y.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
}, A = /* @__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(A), n = K(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(A);
t === S && !te && process.env.NODE_ENV !== "production" && 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 = /* @__PURE__ */ 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 R() {
I = q();
for (let e of v) e(I);
}
function le() {
let e = G(), [t, n] = M(I);
return j(() => (v.size === 0 && window.addEventListener("languagechange", R), v.add(n), () => {
v.delete(n), v.size === 0 && window.removeEventListener("languagechange", R);
}), []), 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 h = /* @__PURE__ */ ((e) => (e.DOTS = "dots", e.PREV = "prev", e.NEXT = "next", e))(h || {});
function de(e) {
const {
page: t,
total: n,
siblings: o = 1,
boundaries: i = 1,
initialPage: s = 1,
showControls: l = !1,
onChange: m
} = e, [r, g] = M(t || s), { direction: B } = fe(), $ = B === "rtl", x = (c) => {
g(c), m && m(c);
};
j(() => {
t && t !== r && g(t);
}, [t]);
const u = D(
(c) => {
c <= 0 ? x(1) : c > n ? x(n) : x(c);
},
[n, r, x]
), X = () => u($ ? r - 1 : r + 1), H = () => u($ ? r + 1 : r - 1), T = () => u($ ? n : 1), E = () => u($ ? 1 : n), p = D(
(c) => l ? $ ? [
"next",
...c,
"prev"
/* PREV */
] : [
"prev",
...c,
"next"
/* NEXT */
] : c,
[$, l]
);
return {
range: Q(() => {
if (o * 2 + 3 + i * 2 >= n)
return p(f(1, n));
const z = Math.max(r - o, i), k = Math.min(r + o, n - i), L = z > i + 2, V = k < n - (i + 1);
if (!L && V) {
const y = o * 2 + i + 2;
return p([
...f(1, y),
"dots",
...f(n - (i - 1), n)
]);
}
if (L && !V) {
const y = i + 1 + 2 * o;
return p([
...f(1, i),
"dots",
...f(n - y, n)
]);
}
return p([
...f(1, i),
"dots",
...f(z, k),
"dots",
...f(n - i + 1, n)
]);
}, [n, r, o, i, p]),
activePage: r,
setPage: u,
next: X,
previous: H,
first: T,
last: E
};
}
const $e = ({ className: e, ...t }) => /* @__PURE__ */ a(
"nav",
{
"data-slot": "pagination",
role: "navigation",
"aria-label": "pagination",
className: C("flex justify-center", e),
...t
}
), pe = ({
className: e,
...t
}) => /* @__PURE__ */ a(
"ul",
{
"data-slot": "pagination-content",
className: C("flex items-center gap-1", e),
...t
}
), b = ({
className: e,
...t
}) => /* @__PURE__ */ a(
"li",
{
"data-slot": "pagination-item-container",
className: C("", e),
...t
}
), N = ({
isActive: e,
size: t = "sm",
...n
}) => /* @__PURE__ */ a(
Z,
{
"data-slot": "pagination-item",
"aria-current": e ? "page" : void 0,
variant: e ? "outline" : "ghost",
size: t,
...n
}
), ve = () => /* @__PURE__ */ a(U, { className: "size-4" }), me = ({
children: e,
...t
}) => /* @__PURE__ */ a(N, { "aria-label": "Go to previous page", ...t, children: e ?? /* @__PURE__ */ a(ve, {}) }), ge = () => /* @__PURE__ */ a(F, { className: "size-4" }), xe = ({
children: e,
...t
}) => /* @__PURE__ */ a(N, { "aria-label": "Go to next page", ...t, children: e ?? /* @__PURE__ */ a(ge, {}) }), be = ({
className: e,
...t
}) => /* @__PURE__ */ J(
"span",
{
"data-slot": "pagination-ellipsis",
"aria-hidden": !0,
className: C("flex-center size-9", e),
...t,
children: [
/* @__PURE__ */ a(W, { className: "size-4" }),
/* @__PURE__ */ a("span", { className: "sr-only", children: "More pages" })
]
}
), Ne = ({
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, g) => r === h.PREV ? t === 1 ? null : /* @__PURE__ */ a(b, { children: /* @__PURE__ */ a(
me,
{
onClick: () => n(l - 1)
}
) }, r) : r === h.NEXT ? t === e ? null : /* @__PURE__ */ a(b, { children: /* @__PURE__ */ a(xe, { onClick: () => n(l + 1) }) }, r) : r === h.DOTS ? /* @__PURE__ */ a(b, { children: /* @__PURE__ */ a(be, {}) }, `${r}-${g}`) : /* @__PURE__ */ a(b, { children: /* @__PURE__ */ a(
N,
{
onClick: () => n(r),
isActive: r === t,
children: r
}
) }, r)) }) });
};
export {
Ne as B,
$e as P,
pe as a,
be as b,
N as c,
b as d,
xe as e,
ge as f,
me as g,
ve as h,
h as i,
de as u
};