hightable
Version:
A dynamic windowed scrolling table component for react
1,572 lines • 62.5 kB
JavaScript
import { jsx as g, jsxs as B, Fragment as De } from "react/jsx-runtime";
import { createContext as W, useContext as P, useState as M, useCallback as y, useReducer as ke, useMemo as S, useEffect as K, useRef as z, useEffectEvent as Me, useId as We } from "react";
import { toggleColumnExclusive as vt, toggleColumn as pt, serializeOrderBy as He, checkSignal as wt, stringify as gt } from "./dataframe.js";
import { arrayDataFrame as nr, createEventTarget as rr, createGetRowNumber as or, sortableDataFrame as ir, validateColumn as sr, validateFetchParams as cr, validateGetCellParams as ar, validateGetRowNumberParams as lr, validateOrderBy as ur, validateRow as dr } from "./dataframe.js";
import { createPortal as mt, flushSync as bt } from "react-dom";
const ve = 33, yt = 20, Ct = 20, St = 20, xt = "2", Rt = `:${xt}:column:widths`, ne = 2, Et = 8e6, Ee = 500 * ve, Tt = "_hightable_yr0cj_1", Ot = "_table-scroll_yr0cj_19", Lt = "_mock-row-label_yr0cj_223", It = "_styled_yr0cj_237", Pt = "_top-border_yr0cj_332", Q = {
hightable: Tt,
tableScroll: Ot,
mockRowLabel: Lt,
styled: It,
topBorder: Pt
}, _t = {
cellPosition: { colIndex: 1, rowIndex: 1 },
colCount: 1,
rowCount: 1,
focusState: { status: "idle", counter: 0 }
}, X = W(_t), At = {
numberOfVisibleColumns: 0
}, Z = W(At), Dt = W(0), Ve = W(0), Ne = W(0), Fe = W([]), Ke = W(0), $e = W(!1), Be = W(void 0);
function kt() {
return P(Ve);
}
function J() {
return P(Ne);
}
function Mt() {
return P(Fe);
}
function Wt() {
return P(Ke);
}
function Ht() {
return P($e);
}
function pe() {
const e = P(Be);
if (e === void 0)
throw new Error("useData must be used within a DataContext.Provider with a valid DataFrameMethods value");
return e;
}
function oe({ controlledValue: e, onChange: t, initialUncontrolledValue: n, notifyChange: c }) {
const [s] = M(e), [o, r] = M(() => e ?? n), l = y((a) => {
t?.(a), r(a), c?.(a);
}, [t, r, c]);
if (s !== void 0 && e !== o && (e !== void 0 || o !== s)) {
const a = e ?? s;
r(a), c?.(a);
}
return s !== void 0 ? (e === void 0 && console.warn("The value is controlled (it has no local state) because the property was initially defined. It cannot be set to undefined now (it is set back to the initial value)."), [
e ?? s,
// read-only if onChange is undefined
t
]) : (e !== void 0 && console.warn("The value is uncontrolled (it only has a local state) because the property was initially undefined. It cannot be set to a value now and is ignored."), [o, l]);
}
function Ue(e, t) {
switch (t.type) {
case "START":
return { status: "should_scroll_into_view", counter: 0 };
case "CANNOT_SCROLL_YET":
case "LOCAL_SCROLLING_STARTED":
return e.counter >= 3 ? { status: "should_focus", counter: 0 } : { ...e, counter: e.counter + 1 };
case "GLOBAL_SCROLLING_STARTED":
return { status: "scrolling_into_view", counter: 0 };
case "SCROLLED_EVENT_RECEIVED":
return e.status === "scrolling_into_view" ? { status: "should_scroll_into_view", counter: 0 } : e;
case "NO_NEED_TO_SCROLL":
return { status: "should_focus", counter: 0 };
case "FOCUSED":
return { status: "idle", counter: 0 };
}
}
function Vt(e) {
const t = { counter: 0, status: "idle" };
return e ? Ue(t, { type: "START" }) : t;
}
function Nt({
cellPosition: e,
focus: t = !0,
numRowsPerPage: n = St,
onCellPositionChange: c,
children: s
}) {
const [o, r] = ke(Ue, t, Vt), l = J(), a = y(() => {
r({ type: "START" });
}, []), [i, d] = oe({
controlledValue: e,
onChange: c,
initialUncontrolledValue: { colIndex: 1, rowIndex: 1 },
notifyChange: a
}), u = S(() => l + 1, [l]), { numberOfVisibleColumns: h } = P(Z), p = S(() => h + 1, [h]), b = y(() => {
d?.({ ...i });
}, [d, i]), x = S(() => {
if (d)
return () => {
d({ colIndex: 1, rowIndex: 1 });
};
}, [d]);
K(() => {
(i.rowIndex < 1 || i.rowIndex > u || i.colIndex < 1 || i.colIndex > p) && d?.({
colIndex: Math.min(Math.max(i.colIndex, 1), p),
rowIndex: Math.min(Math.max(i.rowIndex, 1), u)
});
}, [i, u, p, d]);
const m = S(() => {
if (o.status === "should_focus")
return (f) => {
f.scrollIntoView({ behavior: "auto", block: "nearest", inline: "nearest" }), f.focus({ preventScroll: !0 }), r({ type: "FOCUSED" });
};
}, [o]), w = S(() => {
if (d) {
const { rowIndex: f, colIndex: R } = i;
return (_) => {
switch (_.type) {
case "LAST_COLUMN": {
d({ colIndex: p, rowIndex: f });
break;
}
case "NEXT_COLUMN": {
const T = R < p ? R + 1 : p;
d({ colIndex: T, rowIndex: f });
break;
}
case "FIRST_COLUMN": {
d({ colIndex: 1, rowIndex: f });
break;
}
case "PREVIOUS_COLUMN": {
const T = R > 1 ? R - 1 : 1;
d({ colIndex: T, rowIndex: f });
break;
}
case "LAST_ROW": {
d({ colIndex: R, rowIndex: u });
break;
}
case "NEXT_ROW": {
const T = f < u ? f + 1 : u;
d({ colIndex: R, rowIndex: T });
break;
}
case "FIRST_ROW": {
d({ colIndex: R, rowIndex: 1 });
break;
}
case "PREVIOUS_ROW": {
const T = f > 1 ? f - 1 : 1;
d({ colIndex: R, rowIndex: T });
break;
}
case "FIRST_CELL": {
d({ colIndex: 1, rowIndex: 1 });
break;
}
case "LAST_CELL": {
d({ colIndex: p, rowIndex: u });
break;
}
case "NEXT_ROWS_PAGE": {
const T = Math.min(f + n, u);
d({ colIndex: R, rowIndex: T });
break;
}
case "PREVIOUS_ROWS_PAGE": {
const T = Math.max(f - n, 1);
d({ colIndex: R, rowIndex: T });
break;
}
case "CELL": {
d({ colIndex: _.colIndex, rowIndex: _.rowIndex });
break;
}
}
};
}
}, [i, d, p, u, n]), E = S(() => ({
cellPosition: i,
colCount: p,
rowCount: u,
focusCurrentCell: m,
moveCell: w,
goToFirstCell: x,
goToCurrentCell: b,
focusState: o,
focusDispatch: r
}), [i, p, u, m, w, x, b, o, r]);
return /* @__PURE__ */ g(X.Provider, { value: E, children: s });
}
const Ft = [], we = W(Ft);
function Kt({ columnConfiguration: e, children: t }) {
const n = Mt(), c = S(() => {
const s = new Set(n.map((r) => r.name)), o = n.map(({ name: r, sortable: l }, a) => ({
name: r,
index: a,
sortable: l ?? !1,
// Default to false if not specified
...e?.[r] ?? {}
}));
if (e)
for (const r of Object.keys(e))
s.has(r) || console.warn(
`[HighTable] columnConfiguration has unknown key “${r}”. It will be ignored.`
);
return o;
}, [n, e]);
return /* @__PURE__ */ g(we.Provider, { value: c, children: t });
}
function $t({ children: e, columnsVisibility: t, onColumnsVisibilityChange: n }) {
const c = P(we), s = S(() => new Set(c.map((w) => w.name)), [c]), o = S(() => Object.fromEntries(
c.filter(({ initiallyHidden: w }) => w).map(({ name: w }) => [w, { hidden: !0 }])
), [c]), [r, l] = oe({
controlledValue: t,
initialUncontrolledValue: o,
onChange: n
}), a = l === void 0, i = y((w) => r[w]?.hidden === !0, [r]), { numberOfHiddenColumns: d, numberOfVisibleColumns: u } = S(() => {
let w = 0;
for (const E of s)
i(E) && w++;
return { numberOfHiddenColumns: w, numberOfVisibleColumns: s.size - w };
}, [s, i]), h = y((w) => s.has(w) && !i(w) && u > 1, [s, i, u]), p = y((w) => {
if (!(!h(w) || a))
return () => {
l({ ...r, [w]: { hidden: !0 } });
};
}, [h, l, r, a]), b = S(() => {
if (!(d === 0 || a))
return () => {
l({});
};
}, [d, l, a]), x = S(() => c.filter((w) => !i(w.name)), [c, i]), m = S(() => ({
getHideColumn: p,
showAllColumns: b,
isHiddenColumn: i,
numberOfVisibleColumns: u,
visibleColumnsParameters: x
}), [p, b, i, u, x]);
return /* @__PURE__ */ g(Z.Provider, { value: m, children: e });
}
const Bt = {}, ge = W(Bt), Ge = W(void 0), ze = W(void 0), je = W(void 0);
function Ut() {
return P(ze);
}
function Xe() {
return P(Ge) ?? ve;
}
function Gt() {
return P(je);
}
const Je = W(void 0), Ye = W(void 0), qe = W(void 0);
function zt() {
return P(Ye);
}
function jt() {
return P(Je);
}
function Xt() {
return P(qe);
}
function Jt(e) {
if (e === void 0)
return {};
const t = `${e}px`;
return { minWidth: t, maxWidth: t };
}
function Yt(e) {
return e.offsetWidth;
}
function qt({ key: e, parse: t }) {
const n = localStorage.getItem(e);
return n ? (t ?? JSON.parse)(n) : void 0;
}
function Qt({ key: e, value: t, stringify: n }) {
e !== void 0 && (t === void 0 ? localStorage.removeItem(e) : localStorage.setItem(e, (n ?? JSON.stringify)(t)));
}
function Zt({ key: e, parse: t, stringify: n } = {}) {
const [c, s] = M(void 0), [o, r] = M(void 0);
return e !== o && (e !== void 0 && s(qt({ key: e, parse: t })), r(e)), K(() => {
Qt({ key: e, value: c, stringify: n });
}, [c, e, n]), [c, s];
}
const en = 50, tn = 3, nn = 150, rn = 3;
function on({ children: e, localStorageKey: t, minWidth: n }) {
const c = zt(), s = Ut(), o = Wt();
if (!Number.isInteger(o) || o < 0)
throw new Error(`Invalid numColumns: ${o}. It must be a positive integer.`);
const r = y((v) => v !== void 0 && Number.isInteger(v) && v >= 0 && v < o, [o]);
if (n ??= en, !q(n))
throw new Error(`Invalid minWidth: ${n}. It must be a positive number.`);
const l = P(we), a = S(() => l.map((v) => v.minWidth), [l]), i = y((v) => (r(v) ? a[v] : void 0) ?? n, [r, a, n]), d = y((v) => {
if (!v)
return v;
function A(k, H) {
return k !== void 0 && (!q(k) || k < i(H));
}
return v.some((k, H) => A(k, H)) ? v.map((k, H) => {
if (!A(k, H))
return k;
}) : v;
}, [i]), u = S(() => {
if (s === void 0 || c === void 0)
return;
const v = c - s;
if (q(v))
return v;
}, [c, s]), [h, p] = Zt({ key: t, parse: b, stringify: JSON.stringify });
function b(v) {
const A = JSON.parse(v);
return Array.isArray(A) ? A.map((I) => typeof I == "number" ? I : void 0) : [];
}
const x = z(h), m = y((v) => {
p((A) => {
const I = v(A);
return x.current = I ?? [], I;
});
}, [p]), w = y((v, A) => {
if (!q(A) || !r(v))
return;
const I = Math.max(A, i(v));
m((k) => {
const H = [...k ?? []];
return H[v] = I, H;
});
}, [r, i, m]), E = y(() => {
m((v) => d(v));
}, [m, d]), f = y((v) => {
if (r(v) && h?.[v] !== void 0)
return !0;
}, [h, r]), [R, _] = M(), T = y((v, A) => {
if (!q(A) || !r(v))
return;
const I = Math.max(A + 1, i(v));
_((k) => {
const H = [...k ?? []];
return H[v] = I, H;
});
}, [r, i, _]), N = y(() => {
_((v) => d(v));
}, [_, d]), $ = y((v) => {
r(v) && (m((A) => {
const I = [...A ?? []];
return I[v] = void 0, I;
}), _((A) => {
const I = [...A ?? []];
return I[v] = void 0, I;
}));
}, [r, m, _]), [C, O] = M();
K(() => {
E(), N(), O(sn({ fixedWidths: x.current, measuredWidths: R, maxTotalWidth: u, numColumns: o, getMinWidth: i }));
}, [o, R, u, i, E, N]);
const D = y((v) => {
if (r(v))
return h?.[v] ?? C?.[v] ?? R?.[v];
}, [r, h, R, C]), V = y((v) => Jt(D(v)), [D]), L = S(() => ({
getWidth: D,
getStyle: V,
getDataFixedWidth: f,
releaseWidth: $,
setFixedWidth: w,
setMeasuredWidth: T
}), [D, V, f, $, w, T]);
return /* @__PURE__ */ g(ge.Provider, { value: L, children: e });
}
function sn({
fixedWidths: e,
measuredWidths: t,
maxTotalWidth: n,
getMinWidth: c,
numColumns: s
}) {
if (n === void 0)
return [];
if (!t || t.every((u) => u === void 0))
return [];
const o = new Array(s).fill(void 0);
let r = 0;
for (const u of o.keys()) {
const h = e?.[u] ?? t[u] ?? c(u);
r += h;
}
let l = r - Math.max(0, n - rn);
if (l <= 0)
return [];
const a = /* @__PURE__ */ new Map();
for (const [u, h] of t.entries())
if (h !== void 0) {
const p = Math.max(
c(u),
Math.floor(h / tn),
nn
);
if (h < p)
continue;
const b = a.get(h);
b ? b.push({ index: u, minWidth: p }) : a.set(h, [{ index: u, minWidth: p }]);
}
const i = [...a.entries()].map(
([u, h]) => ({ width: u, columns: h })
).sort((u, h) => u.width - h.width);
let d = 0;
for (; i.length > 0 && d < 100 && l > 0; ) {
d++;
const u = i.pop();
if (u === void 0)
break;
const { width: h, columns: p } = u;
if (p.length === 0)
throw new Error(`Incoherent width group with no columns: ${h}`);
const b = i.pop(), x = Math.max(...p.map((f) => f.minWidth)), m = b === void 0 ? x : Math.max(x, b.width), w = Math.ceil(h - l / p.length);
if (w >= m) {
for (const f of p)
o[f.index] = w;
l -= (h - w) * p.length;
break;
}
for (const f of p)
o[f.index] = m;
l -= (h - m) * p.length;
const E = p.filter((f) => f.minWidth < m);
b?.width === m ? i.push({ width: m, columns: [...b.columns, ...E] }) : (b !== void 0 && i.push(b), E.length > 0 && i.push({ width: m, columns: E }));
}
if (l < 0 && l > -10) {
const u = o.map((p, b) => {
const x = e?.[b], m = t[b];
return {
index: b,
fixed: x !== void 0,
width: p ?? m
};
}).filter(
// tell typescript that width is defined
(p) => !p.fixed && p.width !== void 0
), h = u.length;
if (h > 0) {
const p = Math.floor(-l / h), b = -l % h;
for (const { index: x, width: m } of u.slice(0, b))
o[x] = m + p + 1;
for (const { index: x, width: m } of u.slice(b))
o[x] = m + p;
}
}
return o;
}
function q(e) {
return typeof e == "number" && Number.isFinite(e) && !isNaN(e) && e >= 0;
}
const Te = /* @__PURE__ */ new WeakMap();
let cn = 0;
function an(e) {
let t = Te.get(e);
return t === void 0 && (t = cn++, Te.set(e, t)), t;
}
function ln({ children: e, data: t }) {
const n = an(t);
return (
// The data key context is only used in tests
/* @__PURE__ */ g(Dt.Provider, { value: n, children: /* @__PURE__ */ g(Be.Provider, { value: t, children: /* @__PURE__ */ g(un, { data: t, children: e }, n) }) })
);
}
function un({ children: e, data: t }) {
const [n, c] = M(0), [s, o] = M(t.numRows), [r] = M(() => t.columnDescriptors.map(({ name: i, sortable: d }) => ({ name: i, sortable: d }))), l = r.length, [a] = M(() => t.exclusiveSort === !0);
return K(() => {
function i() {
c((u) => u + 1);
}
function d() {
o(t.numRows);
}
return t.eventTarget?.addEventListener("numrowschange", d), t.eventTarget?.addEventListener("resolve", i), t.eventTarget?.addEventListener("update", i), () => {
t.eventTarget?.removeEventListener("numrowschange", d), t.eventTarget?.removeEventListener("resolve", i), t.eventTarget?.removeEventListener("update", i);
};
}, [t]), /* @__PURE__ */ g(Ve.Provider, { value: n, children: /* @__PURE__ */ g(Fe.Provider, { value: r, children: /* @__PURE__ */ g(Ke.Provider, { value: l, children: /* @__PURE__ */ g($e.Provider, { value: a, children: /* @__PURE__ */ g(Ne.Provider, { value: s, children: e }) }) }) }) });
}
const Qe = W([]), Ze = W(void 0);
function ie() {
return P(Qe);
}
function dn(e) {
const t = ie();
for (const [n, { column: c, direction: s }] of t.entries())
if (c === e)
return { direction: s, orderByIndex: n };
return { direction: void 0, orderByIndex: void 0 };
}
function fn() {
return P(Ze);
}
function hn({ children: e, orderBy: t, onOrderByChange: n }) {
const c = Ht(), [s, o] = oe({
controlledValue: t,
onChange: n,
initialUncontrolledValue: []
}), r = S(() => {
if (o)
return c ? (l) => {
o(vt(l, s));
} : (l) => {
o(pt(l, s));
};
}, [c, s, o]);
return /* @__PURE__ */ g(Ze.Provider, { value: r, children: /* @__PURE__ */ g(Qe.Provider, { value: s, children: e }) });
}
const vn = {}, se = W(vn);
function pn() {
return {
scale: void 0,
scrollTop: void 0,
scrollTopAnchor: void 0,
localOffset: 0
};
}
function et({ delta: e, scale: t, localOffset: n }) {
return (
// there is virtual scroll
t.factor !== 1 && Math.abs(e) <= Ee && Math.abs(n + e) <= Ee
);
}
function wn(e, t) {
return t ? Math.max(0, Math.min(e, t.canvasHeight - t.parameters.clientHeight)) : e;
}
function de(e, t) {
switch (t.type) {
case "SET_SCALE": {
const { scale: n } = t;
return {
...e,
scale: n
};
}
case "SCROLL_TO":
return de(e, { type: "GLOBAL_SCROLL", scrollTop: t.scrollTop });
case "ON_SCROLL": {
const { scrollTop: n } = t, { localOffset: c, scrollTopAnchor: s, scrollTop: o, scale: r } = e, l = {
...e,
scrollTop: n
}, a = o === void 0 ? void 0 : n - o, i = (
// scrollTopAnchor is defined
s !== void 0 && a !== void 0 && r !== void 0 && et({ delta: a, scale: r, localOffset: c }) && n > 0 && n < r.canvasHeight - r.parameters.clientHeight ? { type: "LOCAL_SCROLL", delta: a } : { type: "GLOBAL_SCROLL", scrollTop: n }
);
return de(l, i);
}
case "LOCAL_SCROLL":
return {
...e,
localOffset: e.localOffset + t.delta
};
case "GLOBAL_SCROLL":
return {
...e,
scrollTop: t.scrollTop,
scrollTopAnchor: wn(t.scrollTop, e.scale),
localOffset: 0
};
}
}
function gn({ scale: e, scrollTop: t, scrollTopAnchor: n, localOffset: c, padding: s }) {
if (n === void 0 || e === void 0)
return {};
const o = e.toVirtual(n) + c, { clientHeight: r, headerHeight: l, rowHeight: a, numRows: i } = e.parameters, d = i === 0 || o < l, u = d ? 0 : Math.max(
0,
Math.min(
i - 1,
Math.floor((o - l) / a)
)
);
if (isNaN(u)) throw new Error(`invalid start row ${u}`);
const h = Math.max(0, u - s), p = d ? o : o - l - u * a, b = Math.max(
u,
Math.min(
i - 1,
Math.floor((o + r - l) / a)
)
) + 1;
if (isNaN(b)) throw new Error(`invalid end row ${b}`);
const x = Math.min(i, b + s);
if (x - h > 1e3) throw new Error(`attempted to render too many rows ${x - h}`);
if (t === void 0)
return {
visibleRowsStart: u,
visibleRowsEnd: b,
renderedRowsStart: h,
renderedRowsEnd: x
};
const m = t - p, w = u - h;
return {
sliceTop: m - (d ? 0 : 1) * l - w * a,
visibleRowsStart: u,
visibleRowsEnd: b,
renderedRowsStart: h,
renderedRowsEnd: x
};
}
function mn(e) {
const { clientHeight: t, headerHeight: n, maxElementHeight: c, numRows: s, rowHeight: o } = e;
if (n <= 0)
throw new Error(`Invalid headerHeight: ${n}. It should be a positive number.`);
if (o <= 0)
throw new Error(`Invalid rowHeight: ${o}. It should be a positive number.`);
if (s < 0 || !Number.isInteger(s))
throw new Error(`Invalid numRows: ${s}. It should be a non-negative integer.`);
if (c <= 0)
throw new Error(`Invalid maxElementHeight: ${c}. It should be a positive number.`);
if (c <= t)
throw new Error(`Invalid maxElementHeight: ${c} when clientHeight is ${t}. maxElementHeight should be greater than clientHeight.`);
const r = n + s * o;
if (r <= c)
return {
toVirtual: (i) => i,
fromVirtual: (i) => i,
factor: 1,
canvasHeight: r,
virtualCanvasHeight: r,
parameters: e
};
const l = c, a = (r - t) / (l - t);
return {
toVirtual: (i) => i * a,
fromVirtual: (i) => i / a,
factor: a,
canvasHeight: l,
virtualCanvasHeight: r,
parameters: e
};
}
function bn({
rowIndex: e,
scale: t,
scrollTopAnchor: n,
localOffset: c
}) {
const { headerHeight: s, rowHeight: o, numRows: r } = t.parameters;
if (e < 1 || e > r + 1 || !Number.isInteger(e)) {
console.warn(`Invalid row index: ${e}. It should be an integer between 1 and ${r + 1}.`);
return;
}
if (e === 1)
return;
const l = e - ne, a = t.toVirtual(n) + c, i = a + s - (s + l * o), d = s + l * o + o - a - t.parameters.clientHeight;
if (i <= 0 && d <= 0)
return;
const u = i > 0 ? -i : d;
if (et({ delta: u, scale: t, localOffset: c }))
return { type: "LOCAL_SCROLL", delta: u };
{
const h = a + u;
return { type: "SCROLL_TO", scrollTop: t.fromVirtual(h) };
}
}
function yn({ children: e, padding: t = yt }) {
const [{ scale: n, scrollTop: c, scrollTopAnchor: s, localOffset: o }, r] = ke(de, void 0, pn), { cellPosition: l, focusState: a, focusDispatch: i } = P(X), d = jt(), u = Xe(), h = J(), [p, b] = M(void 0), x = y((E) => {
r({ type: "ON_SCROLL", scrollTop: E }), i?.({ type: "SCROLLED_EVENT_RECEIVED" });
}, [i]), m = S(() => {
if (d !== void 0)
return mn({ clientHeight: d, headerHeight: u, rowHeight: ve, numRows: h, maxElementHeight: Et });
}, [d, u, h]);
m && m !== n && r({ type: "SET_SCALE", scale: m }), K(() => {
const { rowIndex: E } = l;
if (!i || a.status !== "should_scroll_into_view")
return;
if (!n || s === void 0) {
i({ type: "CANNOT_SCROLL_YET" });
return;
}
const f = bn({ rowIndex: E, scale: n, scrollTopAnchor: s, localOffset: o });
if (!f) {
i({ type: "NO_NEED_TO_SCROLL" });
return;
}
if (f.type === "SCROLL_TO") {
if (!p) {
i({ type: "CANNOT_SCROLL_YET" });
return;
}
p({ top: f.scrollTop, behavior: "instant" }), i({ type: "GLOBAL_SCROLLING_STARTED" }), r(f);
} else
i({ type: "LOCAL_SCROLLING_STARTED" }), r(f);
}, [l, p, s, o, n, i, a]);
const w = S(() => ({
scrollMode: "virtual",
canvasHeight: n ? n.canvasHeight : void 0,
setScrollTop: x,
setScrollTo: b,
...gn({
scale: n,
scrollTop: c,
scrollTopAnchor: s,
localOffset: o,
padding: t
})
}), [n, c, s, o, t, x]);
return /* @__PURE__ */ g(se.Provider, { value: w, children: e });
}
const Cn = {}, tt = W(Cn);
function Oe() {
return { ranges: [], anchor: void 0 };
}
function re(e) {
return Number.isInteger(e) && e >= 0;
}
function me(e) {
return re(e.start) && re(e.end) && e.end > e.start;
}
function be(e) {
if (e.length === 0)
return !0;
if (e.some((t) => !me(t)))
return !1;
for (let t = 0; t < e.length - 1; t++) {
const n = e[t], c = e[t + 1];
if (!n || !c || n.end >= c.start)
return !1;
}
return !0;
}
function ce({ ranges: e, index: t }) {
if (!re(t))
throw new Error("Invalid index");
if (!be(e))
throw new Error("Invalid ranges");
return e.some((n) => n.start <= t && t < n.end);
}
function nt({ ranges: e, range: t }) {
if (!be(e))
throw new Error("Invalid ranges");
if (!me(t))
throw new Error("Invalid range");
const n = [], { start: c, end: s } = t;
let o = 0;
for (; o < e.length; ) {
const r = e[o];
if (!r)
throw new Error("Invalid range");
if (r.end >= c)
break;
n.push({ ...r }), o++;
}
for (; o < e.length; ) {
const r = e[o];
if (!r)
throw new Error("Invalid range");
if (r.start > s)
break;
t.start = Math.min(t.start, r.start), t.end = Math.max(t.end, r.end), o++;
}
for (n.push(t); o < e.length; ) {
const r = e[o];
if (!r)
throw new Error("Invalid range");
n.push({ ...r }), o++;
}
return n;
}
function rt({ ranges: e, index: t }) {
return nt({ ranges: e, range: { start: t, end: t + 1 } });
}
function ot({ ranges: e, index: t }) {
return it({ ranges: e, range: { start: t, end: t + 1 } });
}
function it({ ranges: e, range: t }) {
if (!be(e))
throw new Error("Invalid ranges");
if (!me(t))
throw new Error("Invalid range");
const n = [], { start: c, end: s } = t;
let o = 0;
for (; o < e.length; ) {
const r = e[o];
if (!r)
throw new Error("Invalid range");
if (r.end >= c)
break;
n.push({ ...r }), o++;
}
for (; o < e.length; ) {
const r = e[o];
if (!r)
throw new Error("Invalid range");
if (r.start >= s)
break;
r.start < c && n.push({ start: r.start, end: c }), r.end > s && n.push({ start: s, end: r.end }), o++;
}
for (; o < e.length; ) {
const r = e[o];
if (!r)
throw new Error("Invalid range");
n.push({ ...r }), o++;
}
return n;
}
function st({ ranges: e, index: t }) {
if (!re(t))
throw new Error("Invalid index");
const n = { start: t, end: t + 1 };
return ce({ ranges: e, index: t }) ? it({ ranges: e, range: n }) : nt({ ranges: e, range: n });
}
function fe({ selection: e, index: t }) {
return { ranges: st({ ranges: e.ranges, index: t }), anchor: t };
}
function Sn({ selection: e }) {
return e.ranges.reduce((t, n) => t + (n.end - n.start), 0);
}
function xn({ children: e, selection: t, onError: n, onSelectionChange: c }) {
const s = J(), o = pe(), [r] = M(() => t !== void 0 || c !== void 0), l = oe({
controlledValue: t,
onChange: c,
initialUncontrolledValue: Oe()
}), [a, i] = r ? l : [void 0, void 0], [d] = M(() => /* @__PURE__ */ new Map()), [u, h] = M(he({ numRows: s, selection: a })), p = ie(), b = Me((C) => {
h(he({ numRows: C, selection: a })), d.clear();
});
K(() => {
b(s);
}, [s]);
const [x, m] = M(void 0), w = y(({ gesture: C }) => {
C.controller.abort(), m((O) => {
if (O !== C)
return O;
});
}, [m]), E = y(() => {
const C = { controller: new AbortController() };
return m((O) => (O && O.controller.abort(), C)), C;
}, []), f = S(() => a !== void 0, [a]), R = S(() => {
if (a)
return ({ rowNumber: C }) => {
if (C !== void 0)
return ce({ ranges: a.ranges, index: C });
};
}, [a]), _ = S(() => {
if (!(!a || !i))
return ({ rowNumber: C }) => {
const O = E();
try {
i(fe({ selection: a, index: C }));
} finally {
w({ gesture: O });
}
};
}, [i, a, E, w]), T = S(() => {
if (!(!a || !i))
return ({ row: C, rowNumber: O }) => {
const D = E(), { signal: V } = D.controller;
En({ data: o, numRows: s, row: C, rowNumber: O, selection: a, orderBy: p, signal: V, rowByRowNumberAndOrderBy: d }).finally(() => {
w({ gesture: D });
}).then((L) => {
i(L);
}).catch((L) => {
L instanceof Error && L.name === "AbortError" || n?.(L);
});
};
}, [i, a, d, o, s, p, E, w, n]), N = S(() => {
if (!(!a || !i))
return () => {
const C = E(), { signal: O } = C.controller;
Le({ data: o, numRows: s, selection: a, signal: O }).finally(() => {
w({ gesture: C });
}).then((D) => {
i(D);
}).catch((D) => {
D instanceof Error && D.name === "AbortError" || n?.(D);
});
};
}, [i, o, s, a, E, w, n]), $ = y((C) => {
const { key: O, shiftKey: D } = C;
if (O === "Escape") {
const V = E();
try {
i?.(Oe());
} finally {
w({ gesture: V });
}
} else if (O === "a" && (C.ctrlKey || C.metaKey)) {
const V = E(), { signal: L } = V.controller;
C.preventDefault(), a && i && Le({ data: o, numRows: s, selection: a, signal: L }).finally(() => {
w({ gesture: V });
}).then((v) => {
i(v);
}).catch((v) => {
v instanceof Error && v.name === "AbortError" || n?.(v);
});
} else if (O === " " && D) {
const { target: V } = C;
if (!a || !i || !(V instanceof HTMLTableCellElement))
return;
const L = Number(V.getAttribute("data-rownumber"));
if (!(V.getAttribute("role") === "cell") || isNaN(L) || !Number.isInteger(L) || L < 0 || L >= s)
return;
C.preventDefault();
const A = E();
try {
i({ ranges: st({ ranges: a.ranges, index: L }), anchor: L });
} finally {
w({ gesture: A });
}
}
}, [a, i, E, w, o, s, n]);
return K(() => {
if (!a) return;
const C = E(), { signal: O } = C.controller;
ct({ data: o, numRows: s, selection: a, signal: O }).finally(() => {
w({ gesture: C });
}).then((D) => {
h(D);
}).catch((D) => {
D instanceof Error && D.name === "AbortError" || n?.(D);
});
}, [a, o, s, E, w, n]), /* @__PURE__ */ g(
tt.Provider,
{
value: {
selectable: f,
pendingSelectionGesture: x !== void 0,
isRowSelected: R,
toggleRowNumber: _,
toggleRangeToRowNumber: T,
onTableKeyDown: $,
toggleAllRows: N,
allRowsSelected: u
},
children: e
}
);
}
async function ye({ data: e, rowStart: t, rowEnd: n, orderBy: c, signal: s }) {
return await e.fetch?.({ rowStart: t, rowEnd: n, orderBy: c, signal: s }), Array.from({ length: n - t }, (r, l) => {
const a = l + t, i = e.getRowNumber({ row: a, orderBy: c })?.value;
if (i === void 0)
throw new Error(`Row number is undefined for row ${a} with orderBy ${JSON.stringify(c ?? [])}`);
return i;
});
}
async function Rn({ data: e, numRows: t, rowNumber: n, orderBy: c, signal: s, rowByRowNumberAndOrderBy: o }) {
wt(s);
const r = He(c ?? []), l = o?.get(r);
if (l)
return l.get(n);
const a = /* @__PURE__ */ new Map();
await e.fetch?.({ rowStart: 0, rowEnd: t, orderBy: c, signal: s });
for (let i = 0; i < t; i++) {
const d = e.getRowNumber({ row: i, orderBy: c })?.value;
if (d === void 0)
throw new Error(`Row number is undefined for row ${i} with orderBy ${r}`);
a.set(d, i);
}
return o?.set(r, a), a.get(n);
}
async function En({ data: e, numRows: t, row: n, rowNumber: c, selection: s, orderBy: o, signal: r, rowByRowNumberAndOrderBy: l }) {
const { anchor: a } = s;
if (a === void 0 || a === c)
return fe({ selection: s, index: c });
const i = await Rn({ data: e, numRows: t, rowNumber: a, orderBy: o, signal: r, rowByRowNumberAndOrderBy: l });
if (i === void 0 || i === n)
return fe({ selection: s, index: c });
const [d, u] = i < n ? [i + 1, n + 1] : [n, i], h = await ye({ data: e, rowStart: d, rowEnd: u, orderBy: o, signal: r });
let { ranges: p } = s;
const b = e.getRowNumber({ row: n, orderBy: o })?.value;
if (b === void 0)
throw new Error(`Row number for row ${n} not found in orderBy ${He(o ?? [])}`);
const x = ce({ ranges: p, index: a });
for (const m of h)
p = x ? rt({ ranges: p, index: m }) : ot({ ranges: p, index: m });
return { ranges: p, anchor: b };
}
async function Le({ data: e, numRows: t, selection: n, signal: c }) {
const s = await ct({ data: e, numRows: t, selection: n, signal: c }), o = await ye({ data: e, rowStart: 0, rowEnd: t, signal: c });
let { ranges: r } = n;
for (const l of o)
r = s ? ot({ ranges: r, index: l }) : rt({ ranges: r, index: l });
return { ranges: r };
}
function he({ numRows: e, selection: t }) {
if (!t || e === 0 || Sn({ selection: t }) < e)
return !1;
}
async function ct({ data: e, numRows: t, selection: n, signal: c }) {
const s = he({ numRows: t, selection: n });
if (s !== void 0)
return s;
const o = await ye({ data: e, rowStart: 0, rowEnd: t, signal: c });
return o.length > 0 && o.every((r) => ce({ ranges: n.ranges, index: r }));
}
function Tn({ children: e }) {
const [t, n] = M(void 0), [c, s] = M(void 0), o = y((r) => {
n(r.offsetWidth), s(r.offsetHeight);
}, []);
return /* @__PURE__ */ g(je.Provider, { value: o, children: /* @__PURE__ */ g(Ge.Provider, { value: c, children: /* @__PURE__ */ g(ze.Provider, { value: t, children: e }) }) });
}
function On({ children: e }) {
const [t, n] = M(void 0), [c, s] = M(void 0), o = y((r) => {
n(r.clientWidth), s(r.clientHeight === 0 ? 100 : r.clientHeight);
}, []);
return /* @__PURE__ */ g(qe.Provider, { value: o, children: /* @__PURE__ */ g(Je.Provider, { value: c, children: /* @__PURE__ */ g(Ye.Provider, { value: t, children: e }) }) });
}
function Ln({ children: e }) {
const t = Xt(), { goToCurrentCell: n } = P(X), { canvasHeight: c, sliceTop: s, setScrollTop: o, setScrollTo: r } = P(se), l = y((u) => {
if (u.target !== u.currentTarget)
return;
const { key: h } = u;
(h === "Tab" && !u.shiftKey || h === "Enter" || h === " ") && (u.stopPropagation(), u.preventDefault(), n?.());
}, [n]), a = y((u) => {
if (!u)
return;
const h = () => {
o?.(u.scrollTop);
};
t?.(u), h(), "scrollTo" in u ? r?.(() => u.scrollTo.bind(u)) : r?.(void 0);
const p = "ResizeObserver" in window ? new window.ResizeObserver(([b]) => {
if (!b) {
console.warn("ResizeObserver entry is not available.");
return;
}
t?.(u);
}) : void 0;
return p?.observe(u), u.addEventListener("scroll", h), () => {
p?.unobserve(u), p?.disconnect(), u.removeEventListener("scroll", h);
};
}, [r, t, o]), i = S(() => c !== void 0 ? { height: `${c}px` } : {}, [c]), d = S(() => s !== void 0 ? { top: `${s}px` } : {}, [s]);
return /* @__PURE__ */ g("div", { className: Q.tableScroll, ref: a, role: "group", "aria-labelledby": "caption", onKeyDown: l, tabIndex: 0, children: /* @__PURE__ */ g("div", { style: i, children: /* @__PURE__ */ g("div", { style: d, children: e }) }) });
}
function In({ overscan: e = Ct, onError: t }) {
const { visibleRowsStart: n, visibleRowsEnd: c } = P(se), { visibleColumnsParameters: s } = P(Z), o = ie(), r = pe(), l = J(), a = S(() => {
if (n !== void 0)
return Math.max(0, n - e);
}, [n, e]), i = S(() => {
if (c !== void 0)
return Math.min(l, c + e);
}, [c, l, e]), d = S(() => (s ?? []).map(({ name: h }) => h), [s]), u = Me((h) => {
t?.(h);
});
K(() => {
if (r.fetch === void 0 || a === void 0 || i === void 0) return;
const h = new AbortController();
return r.fetch({
rowStart: a,
rowEnd: i,
columns: d,
orderBy: o,
signal: h.signal
}).catch((p) => {
p instanceof DOMException && p.name === "AbortError" || u(p);
}), () => {
h.abort();
};
}, [r, a, i, d, o]);
}
function ae({ ariaColIndex: e, ariaRowIndex: t }) {
const { cellPosition: n, moveCell: c, focusCurrentCell: s } = P(X), o = e === n.colIndex && t === n.rowIndex, r = S(() => {
if (o && s)
return (i) => {
i && s(i);
};
}, [o, s]), l = o ? 0 : -1, a = S(() => {
if (c)
return () => {
c({ type: "CELL", colIndex: e, rowIndex: t });
};
}, [c, e, t]);
return {
tabIndex: l,
focusIfNeeded: r,
navigateToCell: a
};
}
function Ce(e) {
return y((t) => {
e === void 0 || !document.getSelection()?.isCollapsed || (t.preventDefault(), navigator.clipboard.writeText(e).catch((n) => {
console.debug("Failed to write to clipboard: ", n);
}));
}, [e]);
}
function Pn({ cellValue: e, hasResolved: t, onDoubleClickCell: n, onMouseDownCell: c, onKeyDownCell: s, stringify: o, columnIndex: r, visibleColumnIndex: l, className: a, ariaColIndex: i, ariaRowIndex: d, rowNumber: u, renderCellContent: h }) {
const { tabIndex: p, navigateToCell: b, focusIfNeeded: x } = ae({ ariaColIndex: i, ariaRowIndex: d }), m = S(() => {
if (t)
return { value: e };
}, [t, e]), w = z(null);
K(() => {
x?.(w.current);
}, [x]);
const E = P(ge).getStyle?.(l), f = S(() => o(m?.value), [o, m]), R = S(() => {
if (f !== void 0) {
if (f.length > 400)
return `${f.slice(0, 397)}…`;
if (f.length > 100)
return f;
}
}, [f]), _ = S(() => h?.({ cell: m, stringify: o, col: r, row: u }) ?? f, [m, o, r, u, h, f]), T = y((O) => {
b?.(), c && u !== void 0 && c(O, r, u);
}, [b, c, u, r]), N = y((O) => {
b?.(), n && u !== void 0 && n(O, r, u);
}, [b, n, u, r]), $ = y((O) => {
s && u !== void 0 && s(O, r, u);
}, [s, u, r]), C = Ce(f);
return /* @__PURE__ */ g(
"td",
{
ref: w,
role: "cell",
"aria-busy": m === void 0,
"aria-rowindex": d,
"aria-colindex": i,
"data-rownumber": u,
tabIndex: p,
onCopy: C,
onDoubleClick: N,
onMouseDown: T,
onKeyDown: $,
style: E,
className: a,
title: R,
children: _
}
);
}
function Ie({
children: e,
ariaRowIndex: t,
selected: n,
rowNumber: c,
title: s
}) {
return /* @__PURE__ */ g(
"tr",
{
role: "row",
"aria-rowindex": t,
title: s,
"aria-selected": n,
"data-rownumber": c,
children: e
}
);
}
function _n(e) {
return e === void 0 ? "" : (e + 1).toLocaleString("en-US");
}
function An({ onCheckboxPress: e, pendingSelectionGesture: t, style: n, ariaColIndex: c, ariaRowIndex: s, selected: o, rowNumber: r }) {
const { tabIndex: l, navigateToCell: a, focusIfNeeded: i } = ae({ ariaColIndex: c, ariaRowIndex: s }), d = z(null);
K(() => {
i?.(d.current);
}, [i]);
const u = y((w) => {
a?.(), e?.({ shiftKey: w.shiftKey });
}, [e, a]), h = y((w) => {
(w.key === "Enter" || w.key === " ") && (w.preventDefault(), w.stopPropagation(), e?.({ shiftKey: w.shiftKey }));
}, [e]), p = e === void 0, b = y((w) => {
w.preventDefault();
}, []), x = S(() => _n(r), [r]), m = Ce(x);
return /* @__PURE__ */ B(
"th",
{
ref: d,
scope: "row",
role: "rowheader",
style: n,
onClick: u,
onCopy: m,
onKeyDown: h,
"aria-busy": r === void 0,
"aria-checked": o,
"aria-rowindex": s,
"aria-colindex": c,
"aria-disabled": p,
tabIndex: l,
"data-rownumber": r,
children: [
/* @__PURE__ */ g("span", { children: x }),
o !== void 0 && /* @__PURE__ */ g(
"input",
{
type: "checkbox",
onChange: b,
readOnly: p,
disabled: p,
"aria-busy": t,
checked: o,
role: "presentation",
tabIndex: -1
}
)
]
}
);
}
function Dn({ children: e, checked: t, onCheckboxPress: n, pendingSelectionGesture: c, style: s, ariaColIndex: o, ariaRowIndex: r }) {
const { tabIndex: l, navigateToCell: a, focusIfNeeded: i } = ae({ ariaColIndex: o, ariaRowIndex: r }), d = Gt(), u = z(null);
K(() => {
i?.(u.current);
}, [i]);
const h = y(() => {
a?.(), n?.();
}, [n, a]), p = y((f) => {
(f.key === "Enter" || f.key === " ") && (f.preventDefault(), f.stopPropagation(), n?.());
}, [n]), b = t !== void 0, x = n === void 0, m = y((f) => {
f.preventDefault();
}, []), w = y((f) => {
if (!d || !f || !window.ResizeObserver)
return;
const R = () => {
d(f);
};
R();
const _ = new window.ResizeObserver(([T]) => {
if (!T) {
console.warn("ResizeObserver entry is not available.");
return;
}
R();
});
return _.observe(f), () => {
_.unobserve(f), _.disconnect();
};
}, [d]), E = y((f) => (u.current = f, w(f)), [w]);
return /* @__PURE__ */ g(
"td",
{
ref: E,
style: s,
onClick: h,
onKeyDown: p,
"aria-checked": t,
"aria-rowindex": r,
"aria-colindex": o,
"aria-disabled": x,
tabIndex: l,
children: b ? /* @__PURE__ */ g(
"input",
{
type: "checkbox",
onChange: m,
readOnly: x,
disabled: x,
"aria-busy": c,
checked: t,
role: "presentation",
tabIndex: -1
}
) : /* @__PURE__ */ g("span", { children: e })
}
);
}
function kn(e, t) {
const [n, c] = M({ left: 0, top: 0 }), [s, o] = M(!1), r = We(), l = y(() => {
o(!1);
}, []), a = y(
(i) => {
i.stopPropagation();
const d = e.current?.getBoundingClientRect(), u = i.currentTarget.getBoundingClientRect();
c({
left: u.left,
top: d?.bottom ?? 0
}), t?.(), o((h) => !h);
},
[e, t]
);
return {
isOpen: s,
position: n,
menuId: r,
close: l,
handleMenuClick: a
};
}
const Mn = null, at = W(Mn), Wn = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
function Hn(e, t) {
const n = z(null), c = y(() => [...t.current?.querySelectorAll(Wn) ?? []].filter((o) => o instanceof HTMLElement), [t]);
K(() => {
if (e) {
const { activeElement: o } = document;
o instanceof HTMLElement && (n.current = document.activeElement);
const r = c().at(0);
r && requestAnimationFrame(() => {
r.focus();
});
} else n.current && (n.current.focus(), n.current = null);
}, [e, c]);
const s = y((o) => {
const r = c();
if (!r.length)
return;
const { activeElement: l } = document;
if (!l || !(l instanceof HTMLElement))
return;
const a = Array.from(r).indexOf(l);
let i;
switch (o) {
case "first":
i = 0;
break;
case "last":
i = r.length - 1;
break;
case "next":
i = a >= r.length - 1 ? 0 : a + 1;
break;
case "previous":
i = a <= 0 ? r.length - 1 : a - 1;
break;
}
r[i]?.focus();
}, [c]);
return { getFocusableElements: c, navigateFocus: s };
}
function Vn(e) {
switch (e) {
case "ascending":
return "Ascending";
case "descending":
return "Descending";
case void 0:
return "No sort";
}
}
function ue({ title: e, children: t }) {
return /* @__PURE__ */ B(De, { children: [
/* @__PURE__ */ g("div", { role: "separator", children: e }),
t
] });
}
function te({ onClick: e, label: t }) {
const n = S(() => {
if (e)
return (s) => {
s.preventDefault(), s.stopPropagation(), e();
};
}, [e]), c = S(() => {
if (e)
return (s) => {
(s.key === "Enter" || s.key === " ") && (s.stopPropagation(), s.preventDefault(), e());
};
}, [e]);
return /* @__PURE__ */ g(
"button",
{
role: "menuitem",
onClick: n,
onKeyDown: c,
tabIndex: 0,
type: "button",
"aria-disabled": e === void 0,
children: t
}
);
}
function Nn({ onClick: e }) {
return /* @__PURE__ */ g("div", { role: "presentation", onClick: e });
}
function Fn({
columnName: e,
isOpen: t,
position: n,
direction: c,
sortable: s,
toggleOrderBy: o,
hideColumn: r,
showAllColumns: l,
close: a,
id: i,
menuGroups: d
}) {
const u = P(at), { top: h, left: p } = n, b = z(null), x = We(), { navigateFocus: m } = Hn(t, b), { goToFirstCell: w } = P(X), E = y((C) => {
switch (C.preventDefault(), C.stopPropagation(), C.key) {
case "Escape":
a();
break;
case "Enter":
case " ":
break;
case "ArrowUp":
case "ArrowLeft":
m("previous");
break;
case "ArrowDown":
case "ArrowRight":
m("next");
break;
case "Home":
m("first");
break;
case "End":
m("last");
break;
case "Tab":
m(C.shiftKey ? "previous" : "next");
break;
}
}, [m, a]), f = y(
(C) => {
C.preventDefault(), C.stopPropagation(), a();
},
[a]
), R = y((C) => {
C.preventDefault(), C.stopPropagation();
}, []), _ = S(() => {
if (r)
return () => {
r(), w?.(), a();
};
}, [r, a, w]), T = S(() => {
if (l)
return () => {
l(), a();
};
}, [l, a]);
if (!t)
return null;
const N = Vn(c), $ = !(!_ && !T);
return u ? mt(
/* @__PURE__ */ B(De, { children: [
/* @__PURE__ */ g(Nn, { onClick: f }),
/* @__PURE__ */ B(
"div",
{
id: i,
role: "menu",
style: { top: h, left: p },
ref: b,
tabIndex: -1,
"aria-labelledby": x,
"aria-orientation": "vertical",
onKeyDown: E,
onClick: R,
children: [
/* @__PURE__ */ g("div", { role: "presentation", id: x, "aria-hidden": "true", children: e }),
s && /* @__PURE__ */ g(ue, { title: "Sort order", children: /* @__PURE__ */ g(
te,
{
onClick: o,
label: N
}
) }),
$ && /* @__PURE__ */ B(ue, { title: "Visibility", children: [
_ && /* @__PURE__ */ g(
te,
{
onClick: _,
label: "Hide column"
}
),
T && /* @__PURE__ */ g(
te,
{
onClick: T,
label: "Show all columns"
}
)
] }),
d?.map((C) => /* @__PURE__ */ g(ue, { title: C.title, children: C.items.map((O) => /* @__PURE__ */ g(
te,
{
onClick: () => {
O.onClick(e), a();
},
label: O.label
},
O.label
)) }, C.title))
]
}
)
] }),
u
) : null;
}
function Pe({
onClick: e,
onEscape: t,
tabIndex: n = 0,
isExpanded: c = !1,
menuId: s,
disabled: o = !1,
"aria-label": r = "Column menu",
icon: l = /* @__PURE__ */ g("span", { "aria-hidden": "true", children: "⋮" })
}) {
const a = y((d) => {
d.key === "Enter" || d.key === " " ? (d.preventDefault(), d.stopPropagation(), e?.(d)) : d.key === "Escape" && (d.preventDefault(), d.stopPropagation(), t?.(d));
}, [e, t]), i = y((d) => {
e?.(d);
}, [e]);
return /* @__PURE__ */ g(
"button",
{
type: "button",
onClick: o ? void 0 : i,
onKeyDown: o ? void 0 : a,
"aria-label": r,
"aria-haspopup": "menu",
"aria-expanded": c,
"aria-controls": s,
disabled: o,
tabIndex: o ? -1 : n,
children: l
}
);
}
const _e = 10, Ae = 100;
function Kn({ autoResize: e, resizeTo: t, width: n, tabIndex: c, navigateToCell: s }) {
const [o, r] = M(void 0), [l, a] = M(!1), i = y(() => {
o || e?.(), s?.();
}, [e, s, o]), d = y((f) => {
f.stopPropagation();
}, []), u = y((f) => {
if (f.button !== 0 || f.ctrlKey || f.metaKey || (s?.(), f.stopPropagation(), n === void 0))
return;
const { clientX: R, currentTarget: _, pointerId: T } = f;
r({ clientX: R, pointerId: T, width: n }), "setPointerCapture" in _ && _.setPointerCapture(T);
}, [s, n]), h = y((f) => {
f.pointerId === o?.pointerId && t?.(o.width - o.clientX + f.clientX);
}, [t, o]), p = y((f) => {
f.stopPropagation(), r((R) => {
if (f.pointerId !== R?.pointerId)
return R;
});
}, []), b = y(() => {
a(!0);
}, []), x = y(() => {
a(!1);
}, []), m = y((f) => {
if (l && ([" ", "ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown", "PageUp", "PageDown", "Home", "End"].includes(f.key) && f.preventDefault(), f.stopPropagation(), !o)) {
if (f.key === "Escape") {
a(!1), s?.();
return;
}
if (f.key === "Enter" || f.key === " ") {
i();
return;
}
n !== void 0 && (f.key === "ArrowRight" || f.key === "ArrowUp" ? t?.(n + _e) : f.key === "ArrowLeft" || f.key === "ArrowDown" ? t?.(n - _e) : f.key === "PageUp" ? t?.(n + Ae) : f.key === "PageDown" ? t?.(n - Ae) : f.key === "Home" && t?.(0));
}
}, [i, o, t, n, l, s]), w = o !== void 0 || l, E = S(() => n === void 0 ? "No width set." : `Width set to ${n} pixels.`, [n]);
return /* @__PURE__ */ g(
"span",
{
role: "spinbutton",
"aria-orientation": "vertical",
"aria-busy": w,
"aria-valuemin": 0,
"aria-valuenow": n,
"aria-valuetext": E,
"aria-label": "Resize column",
"aria-description": 'Press "Enter" or "Space" to autoresize the column (press again to unset the width). Press "Escape" to cancel resizing. Press "ArrowRight/ArrowUp" or "ArrowLeft/ArrowDown" to resize the column by 10 pixels. Press PageUp/PageDown to resize the column by 100 pixels.',
onDoubleClick: i,
onPointerDown: u,
onPointerMove: h,
onPointerUp: p,
onClick: d,
onFocus: b,
onBlur: x,
onKeyDown: m,
tabIndex: c
}
);
}
function $n({ columnIndex: e, columnName: t, columnConfig: n, canMeasureWidth: c, ariaColIndex: s, ariaRowIndex: o, className: r, children: l }) {
const a = z(null), { tabIndex: i, navigateToCell: d, focusIfNeeded: u } = ae({ ariaColIndex: s, ariaRowIndex: o }), { isOpen: h, position: p, menuId: b, close: x, handleMenuClick: m } = kn(a, d), { getHideColumn: w, showAllColumns: E } = P(Z), f = fn(), { sortable: R } = n, _ = f === void 0, { direction: T, orderByIndex: N } = dn(t);
K(() => {
!R && T !== void 0 && console.warn(`Column "${t}" has an order in orderBy but is not sortable. Fix the orderBy state or set the column as sortable. The column is not shown as ordered.`);
}, [R, T, t]);
const $ = R ? T ?? "none" : void 0, C = R === !0 && f !== void 0, O = S(() => {
if (!(!f || !R))
return () => {
f(t);
};
}, [f, R, t]);
K(() => {
u?.(a.current);
}, [u]);
const D = y(() => {
d?.(), O?.();
}, [O, d]), V = S(() => w?.(t), [w, t]), L = S(() => {
const F = n.menuGroups && n.menuGroups.length > 0;
return !(!R && !V && !E && !F);
}, [R, V, E, n.menuGroups]), { getStyle: v, getDataFixedWidth: A, getWidth: I, setMeasuredWidth: k, setFixedWidth: H, releaseWidth: U } = P(ge), j = v?.(e), Y = A?.(e), G = I?.(e), lt = y((F) => {
H?.(e, F);
}, [H, e]), ee = y(() => {
const F = a.current;
if (c && F