react-gridix 0.1.1 → 0.2.0

package/dist/react-gridix.js

@@ -1,9 +1,9 @@
-import { jsxs as $, jsx as d, Fragment as gt } from "react/jsx-runtime";
-import { useState as V, useRef as W, useCallback as kt, useEffect as ae, createElement as se, useLayoutEffect as bt, useMemo as qe } from "react";
-import { createPortal as _t } from "react-dom";
-const le = (...o) => o.filter(Boolean).join(" ");
-function mt() {
-  return /* @__PURE__ */ d("svg", { viewBox: "0 0 16 16", width: "100%", height: "100%", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ d(
+import { jsxs as x, jsx as f, Fragment as lt } from "react/jsx-runtime";
+import { useState as $, useCallback as Te, useLayoutEffect as Dn, useEffect as j, useRef as F, createElement as ge, useMemo as Z } from "react";
+import { createPortal as In } from "react-dom";
+const Se = (...r) => r.filter(Boolean).join(" ");
+function Tn() {
+  return /* @__PURE__ */ f("svg", { viewBox: "0 0 16 16", width: "100%", height: "100%", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ f(
     "path",
     {
       d: "M3.5 8.5l3 3 6-7",
@@ -15,654 +15,1339 @@ function mt() {
     }
   ) });
 }
-function vt() {
-  return /* @__PURE__ */ d("svg", { viewBox: "0 0 16 16", width: "100%", height: "100%", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ d("path", { d: "M4 8h8", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round" }) });
+function Ln() {
+  return /* @__PURE__ */ f("svg", { viewBox: "0 0 16 16", width: "100%", height: "100%", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ f("path", { d: "M4 8h8", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round" }) });
 }
-function Ge({
-  checked: o,
+function me({
+  checked: r,
   onChange: s,
-  indeterminate: c = !1,
-  variant: h = "native",
-  disabled: I = !1,
-  label: b,
+  indeterminate: a = !1,
+  variant: d = "native",
+  disabled: p = !1,
+  label: c,
   "aria-label": m,
-  id: O,
-  name: H,
-  indicator: B,
-  className: G,
-  style: w,
-  classNames: k = {},
-  styles: E = {}
+  id: _,
+  name: N,
+  indicator: O,
+  className: P,
+  style: b,
+  classNames: D = {},
+  styles: S = {}
 }) {
-  const F = c ? "indeterminate" : o ? "checked" : "unchecked";
-  return /* @__PURE__ */ $(
+  const T = a ? "indeterminate" : r ? "checked" : "unchecked";
+  return /* @__PURE__ */ x(
     "label",
     {
-      className: le(
+      className: Se(
         "rk-checkbox",
-        `rk-checkbox--${h}`,
-        F === "checked" && "rk-checkbox--checked",
-        c && "rk-checkbox--indeterminate",
-        I && "rk-checkbox--disabled",
-        k.root,
-        G
+        `rk-checkbox--${d}`,
+        T === "checked" && "rk-checkbox--checked",
+        a && "rk-checkbox--indeterminate",
+        p && "rk-checkbox--disabled",
+        D.root,
+        P
       ),
-      style: { ...E.root, ...w },
-      "data-state": F,
+      style: { ...S.root, ...b },
+      "data-state": T,
       children: [
-        h === "native" ? /* @__PURE__ */ d(
+        d === "native" ? /* @__PURE__ */ f(
           "input",
           {
             type: "checkbox",
-            id: O,
-            name: H,
-            ref: (y) => {
-              y && (y.indeterminate = c);
+            id: _,
+            name: N,
+            ref: (M) => {
+              M && (M.indeterminate = a);
             },
-            className: le("rk-checkbox__control", k.control),
-            style: E.control,
-            checked: o,
-            disabled: I,
+            className: Se("rk-checkbox__control", D.control),
+            style: S.control,
+            checked: r,
+            disabled: p,
             "aria-label": m,
-            "data-state": F,
-            onChange: (y) => s(y.target.checked)
+            "data-state": T,
+            onChange: (M) => s(M.target.checked)
           }
-        ) : /* @__PURE__ */ d(
+        ) : /* @__PURE__ */ f(
           "button",
           {
             type: "button",
             role: "checkbox",
-            id: O,
-            className: le("rk-checkbox__control", k.control),
-            style: E.control,
-            "aria-checked": c ? "mixed" : o,
+            id: _,
+            className: Se("rk-checkbox__control", D.control),
+            style: S.control,
+            "aria-checked": a ? "mixed" : r,
             "aria-label": m,
-            disabled: I,
-            "data-state": F,
-            onClick: () => s(!o),
-            children: /* @__PURE__ */ d(
+            disabled: p,
+            "data-state": T,
+            onClick: () => s(!r),
+            children: /* @__PURE__ */ f(
               "span",
               {
-                className: le(
+                className: Se(
                   "rk-checkbox__indicator",
-                  B !== void 0 && !c && "rk-checkbox__indicator--custom",
-                  k.indicator
+                  O !== void 0 && !a && "rk-checkbox__indicator--custom",
+                  D.indicator
                 ),
-                style: E.indicator,
-                "data-state": F,
+                style: S.indicator,
+                "data-state": T,
                 "aria-hidden": "true",
-                children: c ? h === "tick" ? /* @__PURE__ */ d(vt, {}) : null : B !== void 0 ? B : h === "tick" ? /* @__PURE__ */ d(mt, {}) : null
+                children: a ? d === "tick" ? /* @__PURE__ */ f(Ln, {}) : null : O !== void 0 ? O : d === "tick" ? /* @__PURE__ */ f(Tn, {}) : null
               }
             )
           }
         ),
-        b != null && b !== !1 && b !== "" && /* @__PURE__ */ d("span", { className: le("rk-checkbox__label", k.label), style: E.label, children: b })
+        c != null && c !== !1 && c !== "" && /* @__PURE__ */ f("span", { className: Se("rk-checkbox__label", D.label), style: S.label, children: c })
       ]
     }
   );
 }
-const Ne = (...o) => o.filter(Boolean).join(" "), yt = typeof window < "u" ? bt : ae;
-function xt({
-  column: o,
+const Mn = /^(\d{4})-(\d{2})-(\d{2})$/, kr = (r) => String(r).padStart(2, "0");
+function Ie(r) {
+  const s = Mn.exec(r);
+  if (!s) return null;
+  const [a, d, p] = [Number(s[1]), Number(s[2]), Number(s[3])], c = new Date(a, d - 1, p);
+  return c.getFullYear() === a && c.getMonth() === d - 1 && c.getDate() === p ? c : null;
+}
+function H(r) {
+  var s;
+  if (r instanceof Date)
+    return Number.isNaN(r.getTime()) ? null : `${r.getFullYear()}-${kr(r.getMonth() + 1)}-${kr(r.getDate())}`;
+  if (typeof r == "number") return Number.isFinite(r) ? H(new Date(r)) : null;
+  if (typeof r == "string") {
+    const a = r.trim();
+    if (a === "") return null;
+    const d = (s = /^\d{4}-\d{2}-\d{2}/.exec(a)) == null ? void 0 : s[0];
+    if (d) return Ie(d) ? d : null;
+    const p = Date.parse(a);
+    return Number.isNaN(p) ? null : H(new Date(p));
+  }
+  return null;
+}
+function Fn(r, s, a) {
+  const d = H(r);
+  return d ? Ie(d).toLocaleDateString(s, a ?? { year: "numeric", month: "short", day: "numeric" }) : r == null ? "" : String(r);
+}
+function $n(r, s) {
+  var a;
+  return r === "" ? null : s instanceof Date ? Ie(r) : typeof s == "number" ? ((a = Ie(r)) == null ? void 0 : a.getTime()) ?? null : r;
+}
+function _r(r) {
+  return r.filterType ? r.filterType : r.type === "number" ? "number" : r.type === "date" ? "date" : r.type === "boolean" ? "select" : "text";
+}
+const On = (r) => typeof r == "object" && r !== null && !Array.isArray(r);
+function wr(r) {
+  if (r == null) return !1;
+  if (typeof r == "string") return r.trim() !== "";
+  if (Array.isArray(r)) return r.length > 0;
+  if (On(r)) {
+    const s = r;
+    return typeof s.min == "number" || typeof s.max == "number" || !!s.from || !!s.to;
+  }
+  return !1;
+}
+function Pn(r, s, a, d) {
+  switch (r) {
+    case "text":
+      return a.toLowerCase().includes(String(s).trim().toLowerCase());
+    case "exact":
+      return a.toLowerCase() === String(s).trim().toLowerCase();
+    case "number": {
+      const { min: p, max: c } = s, m = typeof d == "number" ? d : d == null || d === "" ? NaN : Number(d);
+      return Number.isNaN(m) ? !1 : (typeof p != "number" || m >= p) && (typeof c != "number" || m <= c);
+    }
+    case "date": {
+      const { from: p, to: c } = s, m = H(d);
+      return m ? (!p || m >= p) && (!c || m <= c) : !1;
+    }
+    case "select":
+      return s.includes(String(d ?? ""));
+  }
+}
+function An(r, s, a, d) {
+  if (r.filterOptions) return r.filterOptions.map((c) => typeof c == "string" ? { value: c, label: c } : c);
+  if (r.type === "boolean")
+    return [
+      { value: "true", label: "Yes" },
+      { value: "false", label: "No" }
+    ];
+  const p = /* @__PURE__ */ new Map();
+  for (const c of s) {
+    const m = a(c);
+    if (m == null || m === "") continue;
+    const _ = String(m);
+    p.has(_) || p.set(_, d(c));
+  }
+  return [...p].map(([c, m]) => ({ value: c, label: m })).sort((c, m) => c.label.localeCompare(m.label, void 0, { numeric: !0 }));
+}
+const Ft = typeof window < "u" ? Dn : j;
+function Ce(r, s, a) {
+  const [d, p] = $(s), c = r !== void 0, m = c ? r : d, _ = Te(
+    (N) => {
+      c || p(N), a == null || a(N);
+    },
+    [c, a]
+  );
+  return [m, _];
+}
+const C = (...r) => r.filter(Boolean).join(" "), ot = (r) => r.headerName ?? (r.type === "boolean" ? "" : r.field), pe = (r) => ot(r) || r.field;
+function Nr({ anchorRef: r, open: s, onClose: a, label: d, theme: p, className: c, style: m, children: _ }) {
+  const N = F(null), [O, P] = $({ top: 0, left: 0 }), b = Te(() => {
+    var B;
+    const D = r.current;
+    if (!D) return;
+    const S = D.getBoundingClientRect(), T = ((B = N.current) == null ? void 0 : B.offsetWidth) ?? 260, M = Math.max(8, Math.min(S.left, window.innerWidth - T - 8));
+    P({ top: S.bottom + 6, left: M });
+  }, [r]);
+  return Ft(() => {
+    s && b();
+  }, [s, b]), j(() => {
+    if (!s) return;
+    const D = (T) => {
+      var B, ie;
+      const M = T.target;
+      (B = N.current) != null && B.contains(M) || (ie = r.current) != null && ie.contains(M) || a();
+    }, S = (T) => {
+      var M;
+      T.key === "Escape" && (a(), (M = r.current) == null || M.focus());
+    };
+    return document.addEventListener("mousedown", D), document.addEventListener("keydown", S), window.addEventListener("resize", b), window.addEventListener("scroll", b, !0), () => {
+      document.removeEventListener("mousedown", D), document.removeEventListener("keydown", S), window.removeEventListener("resize", b), window.removeEventListener("scroll", b, !0);
+    };
+  }, [s, a, b, r]), !s || typeof document > "u" ? null : In(
+    /* @__PURE__ */ f(
+      "div",
+      {
+        ref: N,
+        role: "dialog",
+        "aria-label": d,
+        "data-rk-theme": p || void 0,
+        className: C("rk-grid-popup", c),
+        style: { position: "fixed", top: O.top, left: O.left, ...m },
+        children: _
+      }
+    ),
+    document.body
+  );
+}
+const it = (r) => {
+  if (r.trim() === "") return;
+  const s = Number(r);
+  return Number.isFinite(s) ? s : void 0;
+}, Er = (r) => typeof r == "object" && r !== null && !Array.isArray(r);
+function Kn({
+  value: r,
+  onChange: s,
+  label: a,
+  inputClassName: d,
+  inputStyle: p
+}) {
+  const c = Er(r) ? r : {}, [m, _] = $(c.min === void 0 ? "" : String(c.min)), [N, O] = $(c.max === void 0 ? "" : String(c.max));
+  j(() => {
+    it(m) !== c.min && _(c.min === void 0 ? "" : String(c.min)), it(N) !== c.max && O(c.max === void 0 ? "" : String(c.max));
+  }, [c.min, c.max]);
+  const P = (b, D) => {
+    const S = it(b), T = it(D);
+    s(S === void 0 && T === void 0 ? void 0 : { min: S, max: T });
+  };
+  return /* @__PURE__ */ x("div", { className: "rk-grid__filter-fields", children: [
+    /* @__PURE__ */ x("label", { className: "rk-grid__filter-field", children: [
+      /* @__PURE__ */ f("span", { children: "Min" }),
+      /* @__PURE__ */ f(
+        "input",
+        {
+          autoFocus: !0,
+          type: "number",
+          className: C("rk-grid__filter-input", d),
+          style: p,
+          value: m,
+          "aria-label": `Minimum ${a}`,
+          onChange: (b) => {
+            _(b.target.value), P(b.target.value, N);
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ x("label", { className: "rk-grid__filter-field", children: [
+      /* @__PURE__ */ f("span", { children: "Max" }),
+      /* @__PURE__ */ f(
+        "input",
+        {
+          type: "number",
+          className: C("rk-grid__filter-input", d),
+          style: p,
+          value: N,
+          "aria-label": `Maximum ${a}`,
+          onChange: (b) => {
+            O(b.target.value), P(m, b.target.value);
+          }
+        }
+      )
+    ] })
+  ] });
+}
+function Bn({
+  value: r,
+  onChange: s,
+  label: a,
+  inputClassName: d,
+  inputStyle: p
+}) {
+  const c = Er(r) ? r : {}, m = (_, N) => s(!_ && !N ? void 0 : { from: _ || void 0, to: N || void 0 });
+  return /* @__PURE__ */ x("div", { className: "rk-grid__filter-fields", children: [
+    /* @__PURE__ */ x("label", { className: "rk-grid__filter-field", children: [
+      /* @__PURE__ */ f("span", { children: "From" }),
+      /* @__PURE__ */ f(
+        "input",
+        {
+          autoFocus: !0,
+          type: "date",
+          className: C("rk-grid__filter-input", d),
+          style: p,
+          value: c.from ?? "",
+          "aria-label": `${a} from`,
+          onChange: (_) => m(_.target.value, c.to)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ x("label", { className: "rk-grid__filter-field", children: [
+      /* @__PURE__ */ f("span", { children: "To" }),
+      /* @__PURE__ */ f(
+        "input",
+        {
+          type: "date",
+          className: C("rk-grid__filter-input", d),
+          style: p,
+          value: c.to ?? "",
+          "aria-label": `${a} to`,
+          onChange: (_) => m(c.from, _.target.value)
+        }
+      )
+    ] })
+  ] });
+}
+function Rn({
+  value: r,
+  onChange: s,
+  options: a
+}) {
+  const d = Array.isArray(r) ? r : [], p = (c, m) => {
+    const _ = m ? [...d, c] : d.filter((N) => N !== c);
+    s(_.length ? _ : void 0);
+  };
+  return /* @__PURE__ */ x("div", { className: "rk-grid__filter-fields rk-grid__filter-options", role: "group", children: [
+    a.length === 0 && /* @__PURE__ */ f("span", { className: "rk-grid__filter-empty", children: "No values" }),
+    a.map((c) => /* @__PURE__ */ f(
+      me,
+      {
+        checked: d.includes(c.value),
+        onChange: (m) => p(c.value, m),
+        label: c.label ?? c.value
+      },
+      c.value
+    ))
+  ] });
+}
+function Wn({
+  column: r,
   label: s,
-  value: c,
-  onChange: h,
-  theme: I,
-  indicatorClassName: b,
-  indicatorStyle: m,
+  kind: a,
+  value: d,
+  onChange: p,
+  options: c,
+  theme: m,
+  indicatorClassName: _,
+  indicatorStyle: N,
   popupClassName: O,
-  popupStyle: H,
-  inputClassName: B,
-  inputStyle: G
+  popupStyle: P,
+  inputClassName: b,
+  inputStyle: D
 }) {
-  const [w, k] = V(!1), [E, F] = V({ top: 0, left: 0 }), y = W(null), R = W(null), q = c.trim() !== "", L = kt(() => {
-    var j;
-    const g = y.current;
-    if (!g) return;
-    const K = g.getBoundingClientRect(), A = ((j = R.current) == null ? void 0 : j.offsetWidth) ?? 260, T = Math.max(8, Math.min(K.left, window.innerWidth - A - 8));
-    F({ top: K.bottom + 6, left: T });
-  }, []);
-  yt(() => {
-    w && L();
-  }, [w, L]), ae(() => {
-    if (!w) return;
-    const g = (A) => {
-      var j, de;
-      const T = A.target;
-      (j = R.current) != null && j.contains(T) || (de = y.current) != null && de.contains(T) || k(!1);
-    }, K = (A) => {
-      var T;
-      A.key === "Escape" && (k(!1), (T = y.current) == null || T.focus());
-    };
-    return document.addEventListener("mousedown", g), document.addEventListener("keydown", K), window.addEventListener("resize", L), window.addEventListener("scroll", L, !0), () => {
-      document.removeEventListener("mousedown", g), document.removeEventListener("keydown", K), window.removeEventListener("resize", L), window.removeEventListener("scroll", L, !0);
-    };
-  }, [w, L]);
-  const _e = () => {
-    var g;
-    k(!1), (g = y.current) == null || g.focus();
+  const [S, T] = $(!1), M = F(null), B = wr(d), ie = Te(() => T(!1), []), Le = typeof d == "string" ? d : "", st = () => {
+    if (r.filterRenderer)
+      return ge(r.filterRenderer, { column: r, value: Le, onChange: (z) => p(z || void 0) });
+    switch (a) {
+      case "number":
+        return /* @__PURE__ */ f(Kn, { value: d, onChange: p, label: s, inputClassName: b, inputStyle: D });
+      case "date":
+        return /* @__PURE__ */ f(Bn, { value: d, onChange: p, label: s, inputClassName: b, inputStyle: D });
+      case "select":
+        return /* @__PURE__ */ f(Rn, { value: d, onChange: p, options: c });
+      default:
+        return /* @__PURE__ */ f(
+          "input",
+          {
+            autoFocus: !0,
+            type: "text",
+            className: C("rk-grid__filter-input", b),
+            style: D,
+            value: Le,
+            placeholder: r.filterPlaceholder ?? (a === "exact" ? "Exactly…" : `Filter ${s}…`),
+            "aria-label": `Filter text for ${s}`,
+            onChange: (z) => p(z.target.value || void 0),
+            onKeyDown: (z) => {
+              var oe;
+              z.key === "Enter" && (T(!1), (oe = M.current) == null || oe.focus());
+            }
+          }
+        );
+    }
   };
-  return /* @__PURE__ */ $(gt, { children: [
-    /* @__PURE__ */ d(
+  return /* @__PURE__ */ x(lt, { children: [
+    /* @__PURE__ */ f(
       "button",
       {
-        ref: y,
+        ref: M,
         type: "button",
-        className: Ne(
+        className: C(
           "rk-grid__filter-btn",
-          q && "rk-grid__filter-btn--active",
-          w && "rk-grid__filter-btn--open",
-          b
+          B && "rk-grid__filter-btn--active",
+          S && "rk-grid__filter-btn--open",
+          _
         ),
-        style: m,
+        style: N,
         "aria-label": `Filter ${s}`,
         "aria-haspopup": "dialog",
-        "aria-expanded": w,
-        "data-active": q || void 0,
-        onClick: (g) => {
-          g.stopPropagation(), w || L(), k((K) => !K);
+        "aria-expanded": S,
+        "data-active": B || void 0,
+        onClick: (z) => {
+          z.stopPropagation(), T((oe) => !oe);
         },
-        children: o.filterIndicator ? se(o.filterIndicator, { column: o, active: q, open: w }) : /* @__PURE__ */ d("span", { className: "rk-grid__filter-dot", "aria-hidden": "true" })
+        onKeyDown: (z) => z.stopPropagation(),
+        children: r.filterIndicator ? ge(r.filterIndicator, { column: r, active: B, open: S }) : /* @__PURE__ */ f("span", { className: "rk-grid__filter-dot", "aria-hidden": "true" })
       }
     ),
-    w && typeof document < "u" && _t(
-      /* @__PURE__ */ $(
-        "div",
-        {
-          ref: R,
-          role: "dialog",
-          "aria-label": `Filter ${s}`,
-          "data-rk-theme": I || void 0,
-          className: Ne("rk-grid-popup", O),
-          style: { position: "fixed", top: E.top, left: E.left, ...H },
-          children: [
-            o.filterRenderer ? se(o.filterRenderer, { column: o, value: c, onChange: h }) : /* @__PURE__ */ d(
-              "input",
-              {
-                autoFocus: !0,
-                type: "text",
-                className: Ne("rk-grid__filter-input", B),
-                style: G,
-                value: c,
-                placeholder: o.filterPlaceholder ?? `Filter ${s}…`,
-                "aria-label": `Filter text for ${s}`,
-                onChange: (g) => h(g.target.value),
-                onKeyDown: (g) => {
-                  g.key === "Enter" && _e();
-                }
-              }
-            ),
-            q && /* @__PURE__ */ d("button", { type: "button", className: "rk-grid__filter-clear", onClick: () => h(""), children: "Clear" })
-          ]
-        }
-      ),
-      document.body
+    /* @__PURE__ */ x(
+      Nr,
+      {
+        anchorRef: M,
+        open: S,
+        onClose: ie,
+        label: `Filter ${s}`,
+        theme: m,
+        className: O,
+        style: P,
+        children: [
+          st(),
+          B && /* @__PURE__ */ f("button", { type: "button", className: "rk-grid__filter-clear", onClick: () => p(void 0), children: "Clear" })
+        ]
+      }
     )
   ] });
 }
-const Se = /* @__PURE__ */ new Set(["__proto__", "prototype", "constructor"]), Ye = (o, s) => Object.prototype.hasOwnProperty.call(o, s);
-function z(o, s) {
-  if (o === null || typeof o != "object") return;
-  if (Ye(o, s)) return o[s];
-  let c = o;
-  for (const h of s.split(".")) {
-    if (c == null || typeof c != "object" || Se.has(h)) return;
-    c = c[h];
+function jn({ columns: r, hidden: s, onToggle: a, theme: d, className: p, style: c }) {
+  const [m, _] = $(!1), N = F(null), O = Te(() => _(!1), []), P = r.filter((b) => !s.has(b.field)).length;
+  return /* @__PURE__ */ x(lt, { children: [
+    /* @__PURE__ */ f(
+      "button",
+      {
+        ref: N,
+        type: "button",
+        className: C("rk-grid__tool-btn", p),
+        style: c,
+        "aria-haspopup": "dialog",
+        "aria-expanded": m,
+        onClick: () => _((b) => !b),
+        children: "Columns"
+      }
+    ),
+    /* @__PURE__ */ f(Nr, { anchorRef: N, open: m, onClose: O, label: "Show or hide columns", theme: d, children: /* @__PURE__ */ f("div", { className: "rk-grid__filter-fields rk-grid__filter-options", role: "group", "aria-label": "Columns", children: r.filter((b) => b.hideable !== !1).map((b) => {
+      const D = !s.has(b.field);
+      return /* @__PURE__ */ f(
+        me,
+        {
+          checked: D,
+          disabled: D && P <= 1,
+          onChange: (S) => a(b.field, !S),
+          label: pe(b)
+        },
+        b.field
+      );
+    }) }) })
+  ] });
+}
+const Vn = /^[=+\-@\t\r]/;
+function Un(r, s, a) {
+  if (r == null) return "";
+  let d = String(r);
+  return a && typeof r == "string" && Vn.test(d) && !Number.isFinite(Number(d)) && (d = `'${d}`), d.includes(s) || /["\r\n]/.test(d) ? `"${d.replace(/"/g, '""')}"` : d;
+}
+function zn(r, s, a = {}) {
+  const { delimiter: d = ",", sanitize: p = !0 } = a, c = (m) => m.map((_) => Un(_, d, p)).join(d);
+  return [c(r), ...s.map(c)].join(`\r
+`);
+}
+function qn(r, s) {
+  if (typeof document > "u") return;
+  const a = new Blob(["\uFEFF", r], { type: "text/csv;charset=utf-8" }), d = URL.createObjectURL(a), p = document.createElement("a");
+  p.href = d, p.download = s, p.style.display = "none", document.body.appendChild(p), p.click(), p.remove(), setTimeout(() => URL.revokeObjectURL(d), 1e3);
+}
+const $t = /* @__PURE__ */ new Set(["__proto__", "prototype", "constructor"]), Sr = (r, s) => Object.prototype.hasOwnProperty.call(r, s);
+function U(r, s) {
+  if (r === null || typeof r != "object") return;
+  if (Sr(r, s)) return r[s];
+  let a = r;
+  for (const d of s.split(".")) {
+    if (a == null || typeof a != "object" || $t.has(d)) return;
+    a = a[d];
   }
-  return c;
+  return a;
 }
-function Je(o, s, c) {
-  if (Array.isArray(o)) {
-    const h = [...o];
-    return h[s] = c, h;
+function yr(r, s, a) {
+  if (Array.isArray(r)) {
+    const d = [...r];
+    return d[s] = a, d;
   }
-  return { ...o, [s]: c };
+  return { ...r, [s]: a };
 }
-function De(o, s, c) {
-  const h = o ?? {};
-  if (Ye(h, s) || !s.includes("."))
-    return Se.has(s) ? o : Je(h, s, c);
-  const [I, ...b] = s.split(".");
-  if (Se.has(I)) return o;
-  const m = h[I];
-  return Je(h, I, De(m !== null && typeof m == "object" ? m : {}, b.join("."), c));
+function Ot(r, s, a) {
+  const d = r ?? {};
+  if (Sr(d, s) || !s.includes("."))
+    return $t.has(s) ? r : yr(d, s, a);
+  const [p, ...c] = s.split(".");
+  if ($t.has(p)) return r;
+  const m = d[p];
+  return yr(d, p, Ot(m !== null && typeof m == "object" ? m : {}, c.join("."), a));
 }
-const D = (...o) => o.filter(Boolean).join(" "), Ue = (o, s) => `${typeof o}:${o}\0${s}`, Ie = (o) => o.headerName ?? (o.type === "boolean" ? "" : o.field), be = (o) => Ie(o) || o.field;
-function Ce(o, s) {
-  const c = z(s, o.field);
-  return o.valueFormatter ? o.valueFormatter(c, s) : o.type === "boolean" && typeof c == "boolean" ? c ? "Yes" : "No" : c == null ? "" : c instanceof Date ? c.toLocaleDateString() : String(c);
+const ee = 44, Hn = 150, xr = 10, Mt = (r, s) => `${typeof r}:${r}\0${s}`;
+function De(r, s) {
+  const a = U(s, r.field);
+  return r.valueFormatter ? r.valueFormatter(a, s) : r.type === "boolean" && typeof a == "boolean" ? a ? "Yes" : "No" : r.type === "date" ? Fn(a, r.dateLocale, r.dateFormat) : a == null ? "" : a instanceof Date ? a.toLocaleDateString() : String(a);
 }
-function wt(o, s) {
-  return typeof o == "number" && typeof s == "number" ? o - s : o instanceof Date && s instanceof Date ? o.getTime() - s.getTime() : typeof o == "boolean" && typeof s == "boolean" ? Number(o) - Number(s) : String(o).localeCompare(String(s), void 0, { numeric: !0, sensitivity: "base" });
+function Jn(r, s, a) {
+  if (a.type === "date") {
+    const d = H(r) ?? "", p = H(s) ?? "";
+    return d < p ? -1 : d > p ? 1 : 0;
+  }
+  return typeof r == "number" && typeof s == "number" ? r - s : r instanceof Date && s instanceof Date ? r.getTime() - s.getTime() : typeof r == "boolean" && typeof s == "boolean" ? Number(r) - Number(s) : String(r).localeCompare(String(s), void 0, { numeric: !0, sensitivity: "base" });
 }
-function St({
-  columns: o,
+const Yn = (r) => r ? Array.isArray(r) ? r : [r] : [], vr = (r) => r.type === "date" && r.validity.badInput;
+function ei({
+  columns: r,
   rows: s,
-  getRowId: c,
-  editable: h = !1,
-  enterMovesDown: I = !0,
-  onCellEdit: b,
+  getRowId: a,
+  editable: d = !1,
+  enterMovesDown: p = !0,
+  onCellEdit: c,
   onRowsChange: m,
-  sortable: O = !0,
-  defaultSort: H = null,
-  onSortChange: B,
-  searchable: G = !0,
-  searchPlaceholder: w = "Search…",
-  pagination: k = !0,
-  paginationPosition: E = "bottom",
-  pageSize: F = 10,
-  pageSizeOptions: y = [5, 10, 25, 50],
-  onRowClick: R,
-  toolbar: q,
-  emptyMessage: L = "No rows to show",
-  striped: _e = !1,
-  stripeColors: g,
-  checkboxVariant: K = "native",
-  animateRows: A = !0,
-  theme: T,
-  maxHeight: j,
-  className: de,
-  style: He,
-  classNames: N = {},
-  styles: x = {},
-  rowClassName: me,
-  rowStyle: ve
+  rowSelection: _ = !1,
+  selectedRowIds: N,
+  defaultSelectedRowIds: O,
+  onSelectionChange: P,
+  isRowSelectable: b,
+  sort: D,
+  defaultSort: S = null,
+  onSortChange: T,
+  multiSort: M = !1,
+  searchable: B = !1,
+  searchPlaceholder: ie = "Search…",
+  search: Le,
+  onSearchChange: st,
+  filters: z,
+  onFiltersChange: oe,
+  pagination: Y = !1,
+  paginationPosition: Me = "bottom",
+  pageSize: Cr = 10,
+  pageSizeOptions: at = [5, 10, 25, 50],
+  page: Dr,
+  onPageChange: Ir,
+  onPageSizeChange: dt,
+  serverSide: V = !1,
+  rowCount: Tr,
+  onQueryChange: Pt,
+  queryDebounce: At = 250,
+  loading: Lr,
+  loadingRows: Mr,
+  skeletonRow: Kt,
+  errorMessage: Fr = "Could not load the data.",
+  columnMenu: Bt = !1,
+  onColumnVisibilityChange: ct,
+  keyboardNavigation: ft = !1,
+  virtualize: q = !1,
+  rowHeight: X = 40,
+  overscan: Rt = 6,
+  exportable: Fe = !1,
+  apiRef: be,
+  onRowClick: ut,
+  toolbar: Wt,
+  emptyMessage: $r = "No rows to show",
+  striped: Or = !1,
+  stripeColors: $e,
+  checkboxVariant: ht = "native",
+  animateRows: jt = !0,
+  theme: pt,
+  maxHeight: Oe,
+  className: Pr,
+  style: Ar,
+  classNames: I = {},
+  styles: v = {},
+  rowClassName: gt,
+  rowStyle: mt
 }) {
-  const _ = (e, t) => ({
-    className: D(t, N[e]),
-    style: x[e]
-  }), [Pe, $e] = V(s), Q = W(s);
-  ae(() => {
-    Q.current = s, $e(s);
+  const L = (e, t) => ({
+    className: C(t, I[e]),
+    style: v[e]
+  }), [Pe, Vt] = $(s), le = F(s);
+  j(() => {
+    le.current = s, Vt(s);
   }, [s]);
-  const Le = (e) => {
-    Q.current = e, $e(e);
-  }, [X, Qe] = V(""), [Z, Xe] = V({}), [v, Ze] = V(H), [et, ee] = V(0), [P, tt] = V(F), [te, re] = V(null), J = W(0), ce = W(null), ye = W(/* @__PURE__ */ new Map()), Te = qe(
-    () => Pe.map((e, t) => ({ row: e, index: t, id: c ? c(e, t) : t })),
-    [Pe, c]
-  ), ne = qe(() => {
-    const e = X.trim().toLowerCase(), t = Object.entries(Z).filter(
-      ([n, i]) => i.trim() !== "" && o.some((l) => l.field === n && l.filterable)
-    );
-    let r = Te.filter(({ row: n }) => e && !o.some((l) => Ce(l, n).toLowerCase().includes(e)) ? !1 : t.every(([i, l]) => {
-      const f = o.find((a) => a.field === i);
-      return f ? Ce(f, n).toLowerCase().includes(l.trim().toLowerCase()) : !0;
+  const Ut = (e) => {
+    le.current = e, Vt(e);
+  }, [ke, Kr] = Ce(Le, "", st), [se, Br] = Ce(z, {}, oe), [R, Rr] = Ce(D, Yn(S), T), [bt, ae] = Ce(Dr, 0, Ir), [A, Wr] = $(Cr), jr = (e) => {
+    Wr(e), dt == null || dt(e);
+  }, [Ae, Vr] = $(() => new Set(r.filter((e) => e.hidden).map((e) => e.field))), Ur = (e, t) => {
+    const n = new Set(Ae);
+    t ? n.add(e) : n.delete(e), Vr(n), ct == null || ct([...n]);
+  }, [kt, zt] = $({}), [Ke, zr] = $({}), [Xn, qr] = $(0), _e = F(/* @__PURE__ */ new Map()), [ye, de] = $(null), ce = F(0), Be = F(null), Re = F(/* @__PURE__ */ new Map()), [_t, qt] = $(null), yt = F(null), xe = F(null), [xt, Ht] = $({ top: 0, height: 0 }), y = Z(() => {
+    const e = r.filter((t) => !Ae.has(t.field));
+    return [
+      ...e.filter((t) => t.pinned === "left"),
+      ...e.filter((t) => t.pinned !== "left" && t.pinned !== "right"),
+      ...e.filter((t) => t.pinned === "right")
+    ];
+  }, [r, Ae]), vt = (e) => e.sortable === !0, W = _ === "single" ? "single" : _ ? "multiple" : null, ve = y.length + (W ? 1 : 0), fe = Z(
+    () => Pe.map((e, t) => ({ row: e, index: t, id: a ? a(e, t) : t })),
+    [Pe, a]
+  ), Jt = F(/* @__PURE__ */ new Map());
+  fe.forEach((e) => Jt.current.set(e.id, e.row));
+  const We = Z(
+    () => Object.entries(se).filter(([e, t]) => {
+      const n = y.find((l) => l.field === e);
+      return !!n && !!n.filterable && wr(t);
+    }),
+    [se, y]
+  ), [Hr, Jr] = $(ke);
+  j(() => {
+    if (!V) return;
+    const e = setTimeout(() => Jr(ke), At);
+    return () => clearTimeout(e);
+  }, [ke, V, At]);
+  const ue = V ? Hr : ke, Yt = (e) => e.filterRenderer ? "text" : _r(e), G = Z(() => {
+    if (V) return fe;
+    const e = ue.trim().toLowerCase();
+    let t = fe.filter(({ row: l }) => e && !y.some((i) => De(i, l).toLowerCase().includes(e)) ? !1 : We.every(([i, o]) => {
+      const g = y.find((h) => h.field === i);
+      return Pn(Yt(g), o, De(g, l), U(l, i));
     }));
-    if (v) {
-      const n = o.find((i) => i.field === v.field);
-      if (n) {
-        const i = v.direction === "asc" ? 1 : -1;
-        r = [...r].sort((l, f) => {
-          const a = z(l.row, n.field), u = z(f.row, n.field), p = a == null || a === "", C = u == null || u === "";
-          return p || C ? p === C ? 0 : p ? 1 : -1 : (n.comparator ? n.comparator(a, u, l.row, f.row) : wt(a, u)) * i;
-        });
+    const n = R.map((l) => ({ col: y.find((i) => i.field === l.field), dir: l.direction === "asc" ? 1 : -1 })).filter((l) => !!l.col);
+    return n.length && (t = [...t].sort((l, i) => {
+      for (const { col: o, dir: g } of n) {
+        const h = U(l.row, o.field), u = U(i.row, o.field), k = h == null || h === "", E = u == null || u === "";
+        if (k || E) {
+          if (k !== E) return k ? 1 : -1;
+          continue;
+        }
+        const nt = o.comparator ? o.comparator(h, u, l.row, i.row) : Jn(h, u, o);
+        if (nt !== 0) return nt * g;
       }
-    }
-    return r;
-  }, [Te, o, X, Z, v]);
-  ae(() => ee(0), [X, Z, v, P]);
-  const Be = W(null), U = ne.length, oe = k ? Math.max(1, Math.ceil(U / P)) : 1, S = Math.min(et, oe - 1), M = k ? ne.slice(S * P, S * P + P) : ne, rt = U === 0 ? 0 : k ? S * P + 1 : 1, nt = k ? Math.min(U, (S + 1) * P) : U, Fe = (e) => e.sortable ?? O, Ke = `${S}|${P}|${v ? `${v.field}:${v.direction}` : ""}|${X}|${JSON.stringify(Z)}`, Me = W(!0);
-  ae(() => {
-    if (Me.current) {
-      Me.current = !1;
+      return 0;
+    })), t;
+  }, [fe, y, ue, We, R, V]), je = JSON.stringify([ue, se, R, A]), Xt = F(je);
+  j(() => {
+    Xt.current !== je && (Xt.current = je, ae(0));
+  }, [je]);
+  const he = V ? Tr ?? fe.length : G.length, Q = Y ? Math.max(1, Math.ceil(he / A)) : 1, K = Math.min(bt, Q - 1), w = Y && !V ? G.slice(K * A, K * A + A) : G, Yr = he === 0 ? 0 : Y ? K * A + 1 : 1, Xr = Y ? Math.min(he, (K + 1) * A) : he, wt = Z(
+    () => ({
+      sort: R.filter((e) => {
+        const t = r.find((n) => n.field === e.field);
+        return !!t && vt(t);
+      }),
+      filters: Object.fromEntries(We),
+      search: ue.trim(),
+      page: K,
+      pageSize: A
+    }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [R, r, We, ue, K, A]
+  ), Gr = JSON.stringify(wt), Ve = F(wt);
+  Ve.current = wt;
+  const Ue = F(Pt);
+  Ue.current = Pt;
+  const [Qr, ze] = $(!1), [Zr, Nt] = $(!1), Et = F(0), qe = Te((e) => {
+    var l;
+    const t = ++Et.current, n = (l = Ue.current) == null ? void 0 : l.call(Ue, e);
+    n && typeof n.then == "function" ? (ze(!0), Nt(!1), n.then(
+      () => {
+        t === Et.current && ze(!1);
+      },
+      () => {
+        t === Et.current && (ze(!1), Nt(!0));
+      }
+    )) : (ze(!1), Nt(!1));
+  }, []);
+  j(() => {
+    V && qe(Ve.current);
+  }, [V, Gr, qe]), j(() => {
+    V && Y && bt > Q - 1 && ae(Q - 1);
+  }, [V, Y, bt, Q]);
+  const St = Lr ?? Qr, Gt = (e) => e.map((t) => Jt.current.get(t)).filter((t) => t !== void 0), [J, He] = Ce(
+    N,
+    O ?? [],
+    (e) => P == null ? void 0 : P({ ids: e, rows: Gt(e) })
+  ), Ct = Z(() => new Set(J), [J]), Je = (e) => b ? b(e) : !0, Ye = F(null), Qt = F(!1), en = (e, t) => {
+    if (!W || !Je(e.row)) return;
+    if (W === "single") {
+      He(t ? [e.id] : []), Ye.current = e.id;
       return;
     }
-    const e = Be.current;
-    e && typeof e.scrollTo == "function" && e.scrollTop > 0 && e.scrollTo({ top: 0, behavior: "smooth" });
-  }, [Ke]);
-  const ue = (e, t, r) => ({
-    value: z(t, e.field),
-    formattedValue: Ce(e, t),
+    const n = new Set(J), l = Qt.current && Ye.current !== null ? w.findIndex((o) => o.id === Ye.current) : -1, i = w.findIndex((o) => o.id === e.id);
+    if (l >= 0 && i >= 0)
+      for (let o = Math.min(l, i); o <= Math.max(l, i); o++)
+        Je(w[o].row) && (t ? n.add(w[o].id) : n.delete(w[o].id));
+    else t ? n.add(e.id) : n.delete(e.id);
+    Ye.current = e.id, He([...n]);
+  }, we = Z(() => G.filter((e) => Je(e.row)), [G, b]), Zt = we.filter((e) => Ct.has(e.id)).length, er = we.length > 0 && Zt === we.length, tr = (e) => {
+    const t = new Set(J);
+    we.forEach((n) => e ? t.add(n.id) : t.delete(n.id)), He([...t]);
+  }, Xe = (e, t, n) => ({
+    value: U(t, e.field),
+    formattedValue: De(e, t),
     row: t,
-    rowIndex: r,
+    rowIndex: n,
     field: e.field,
     column: e
-  }), xe = (e, t) => {
-    const r = e.editable ?? h;
-    return typeof r == "function" ? r(t) : !!r;
-  }, fe = (e, t) => xe(e, t) && !(e.type === "boolean" && !e.cellEditor), ot = (e, t) => {
-    const r = ue(e, t.row, t.index), n = xe(e, r);
+  }), Dt = (e, t) => {
+    const n = e.editable ?? d;
+    return typeof n == "function" ? n(t) : !!n;
+  }, Ge = (e, t) => Dt(e, t) && !(e.type === "boolean" && !e.cellEditor), tn = (e, t) => {
+    const n = Xe(e, t.row, t.index), l = Dt(e, n);
     return {
-      ...r,
-      editable: n,
-      updateValue: (i) => n && Ae(t, e, { value: i })
+      ...n,
+      editable: l,
+      updateValue: (i) => l && nr(t, e, { value: i })
     };
-  }, Ve = (e) => {
-    if (!Fe(e)) return;
-    let t;
-    !v || v.field !== e.field ? t = { field: e.field, direction: "asc" } : v.direction === "asc" ? t = { field: e.field, direction: "desc" } : t = null, Ze(t), B == null || B(t);
-  }, pe = (e, t) => {
-    var r;
-    return (r = ye.current.get(Ue(e, t))) == null ? void 0 : r.focus();
-  }, Y = () => {
-    J.current += 1, re(null);
-  }, he = (e, t, r = {}) => {
-    if (!fe(t, ue(t, e.row, e.index))) return !1;
-    const n = z(e.row, t.field), i = t.cellEditor ? n : r.text ?? (n == null ? "" : String(n));
-    return ce.current = i, J.current += 1, re({
+  }, rr = (e, t) => {
+    if (!vt(e)) return;
+    const n = R.find((o) => o.field === e.field), l = n ? n.direction === "asc" ? "desc" : null : "asc";
+    let i;
+    t && M ? l ? n ? i = R.map((o) => o.field === e.field ? { ...o, direction: l } : o) : i = [...R, { field: e.field, direction: l }] : i = R.filter((o) => o.field !== e.field) : i = l ? [{ field: e.field, direction: l }] : [], Rr(i);
+  }, Qe = (e, t) => {
+    var n;
+    return (n = Re.current.get(Mt(e, t))) == null ? void 0 : n.focus();
+  }, te = () => {
+    ce.current += 1, de(null);
+  }, rn = (e) => {
+    for (const t of le.current) {
+      const n = U(t, e.field);
+      if (n != null && n !== "") return n;
+    }
+  }, Ze = (e, t, n = {}) => {
+    if (!Ge(t, Xe(t, e.row, e.index))) return !1;
+    const l = U(e.row, t.field);
+    let i;
+    return t.cellEditor ? i = l : t.type === "date" ? i = H(l) ?? "" : i = n.text ?? (l == null ? "" : String(l)), Be.current = i, ce.current += 1, de({
       id: e.id,
       field: t.field,
       draft: i,
-      session: J.current,
-      select: r.select ?? "end",
+      session: ce.current,
+      select: n.select ?? "end",
       invalid: !1
     }), !0;
-  }, Ae = (e, t, r) => {
-    const n = Q.current[e.index] ?? e.row, i = z(n, t.field);
-    let l;
-    if ("value" in r)
-      l = r.value;
+  }, nr = (e, t, n) => {
+    const l = le.current[e.index] ?? e.row, i = U(l, t.field);
+    let o;
+    if ("value" in n)
+      o = n.value;
     else if (t.valueParser)
-      l = t.valueParser(r.text, n);
-    else if (t.type === "number")
-      if (r.text.trim() === "") l = null;
+      o = t.valueParser(n.text, l);
+    else if (t.type === "date") {
+      if (n.text !== "" && !Ie(n.text)) return !1;
+      o = $n(n.text, i ?? rn(t));
+    } else if (t.type === "number")
+      if (n.text.trim() === "") o = null;
       else {
-        const u = Number(r.text);
+        const u = Number(n.text);
         if (!Number.isFinite(u)) return !1;
-        l = u;
+        o = u;
       }
     else
-      l = r.text;
-    if (Object.is(l, i)) return !0;
-    if (t.validate && !t.validate(l, n)) return !1;
-    const f = De(n, t.field, l), a = Q.current.map((u, p) => p === e.index ? f : u);
-    return Le(a), b == null || b({ rowId: e.id, rowIndex: e.index, field: t.field, oldValue: i, newValue: l, row: f }), m == null || m(a), !0;
-  }, je = (e, t, r) => {
-    const n = M.findIndex((p) => p.id === e.id), i = o.findIndex((p) => p.field === t);
-    if (n < 0 || i < 0) return null;
-    const l = (p, C) => fe(C, ue(C, p.row, p.index));
-    if (r === "down" || r === "up") {
-      const p = r === "down" ? 1 : -1;
-      for (let C = n + p; C >= 0 && C < M.length; C += p)
-        if (l(M[C], o[i])) return { entry: M[C], col: o[i] };
+      o = n.text;
+    if (t.type === "date") {
+      if (H(o) === H(i)) return !0;
+      const u = H(o);
+      if (u && (t.dateMin && u < t.dateMin || t.dateMax && u > t.dateMax)) return !1;
+    } else if (Object.is(o, i))
+      return !0;
+    if (t.validate && !t.validate(o, l)) return !1;
+    const g = Ot(l, t.field, o), h = le.current.map((u, k) => k === e.index ? g : u);
+    return Ut(h), c == null || c({ rowId: e.id, rowIndex: e.index, field: t.field, oldValue: i, newValue: o, row: g }), m == null || m(h), !0;
+  }, ir = (e, t, n) => {
+    const l = w.findIndex((k) => k.id === e.id), i = y.findIndex((k) => k.field === t);
+    if (l < 0 || i < 0) return null;
+    const o = (k, E) => Ge(E, Xe(E, k.row, k.index));
+    if (n === "down" || n === "up") {
+      const k = n === "down" ? 1 : -1;
+      for (let E = l + k; E >= 0 && E < w.length; E += k)
+        if (o(w[E], y[i])) return { entry: w[E], col: y[i] };
       return null;
     }
-    const f = r === "right" ? 1 : -1;
-    let a = n, u = i + f;
-    for (; a >= 0 && a < M.length; ) {
-      for (; u >= 0 && u < o.length; ) {
-        if (l(M[a], o[u])) return { entry: M[a], col: o[u] };
-        u += f;
+    const g = n === "right" ? 1 : -1;
+    let h = l, u = i + g;
+    for (; h >= 0 && h < w.length; ) {
+      for (; u >= 0 && u < y.length; ) {
+        if (o(w[h], y[u])) return { entry: w[h], col: y[u] };
+        u += g;
       }
-      a += f, u = f > 0 ? 0 : o.length - 1;
+      h += g, u = g > 0 ? 0 : y.length - 1;
     }
     return null;
-  }, ie = (e, t, r, n = {}) => {
-    const { move: i = "none", focus: l = !0 } = n;
-    if (!Ae(e, t, r))
-      return re((a) => a && { ...a, invalid: !0 }), !1;
-    const f = i === "none" ? null : je(e, t.field, i);
-    return f ? he(f.entry, f.col, { select: "all" }) : (Y(), l && pe(e.id, t.field)), !0;
-  }, it = (e, t, r) => {
+  }, Ne = (e, t, n, l = {}) => {
+    const { move: i = "none", focus: o = !0 } = l;
+    if (!nr(e, t, n))
+      return de((h) => h && { ...h, invalid: !0 }), !1;
+    const g = i === "none" ? null : ir(e, t.field, i);
+    return g ? Ze(g.entry, g.col, { select: "all" }) : (te(), o && Qe(e.id, t.field)), !0;
+  }, nn = (e, t, n) => {
     if (e.nativeEvent.isComposing) return;
-    const n = e.currentTarget.value;
+    const l = e.currentTarget.value, i = vr(e.currentTarget);
     if (e.key === "Enter") {
-      e.preventDefault();
-      const i = I ? e.shiftKey ? "up" : "down" : "none";
-      ie(t, r, { text: n }, { move: i });
+      if (e.preventDefault(), i) return de((g) => g && { ...g, invalid: !0 });
+      const o = p ? e.shiftKey ? "up" : "down" : "none";
+      Ne(t, n, { text: l }, { move: o });
     } else if (e.key === "Escape")
-      e.preventDefault(), Y(), pe(t.id, r.field);
-    else if (e.key === "Tab") {
-      const i = e.shiftKey ? "left" : "right";
-      je(t, r.field, i) && (e.preventDefault(), ie(t, r, { text: n }, { move: i }));
+      e.preventDefault(), te(), Qe(t.id, n.field);
+    else if (e.key === "Tab" && !i) {
+      const o = e.shiftKey ? "left" : "right";
+      ir(t, n.field, o) && (e.preventDefault(), Ne(t, n, { text: l }, { move: o }));
     }
-  }, lt = (e, t, r, n) => {
-    e.target !== e.currentTarget || !fe(r, n) || (e.key === "Enter" || e.key === "F2" ? (e.preventDefault(), he(t, r)) : !r.cellEditor && e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && (e.preventDefault(), he(t, r, { text: e.key })));
-  }, at = (e, t, r) => t.cellEditor ? /* @__PURE__ */ d(
-    "div",
-    {
-      className: "rk-grid__custom-editor",
-      onBlur: (n) => {
-        n.currentTarget.contains(n.relatedTarget) || r.session === J.current && (ie(e, t, { value: ce.current }, { focus: !1 }) || Y());
-      },
-      onKeyDown: (n) => {
-        n.key === "Escape" && (n.preventDefault(), n.stopPropagation(), Y(), pe(e.id, t.field));
-      },
-      children: se(t.cellEditor, {
-        value: r.draft,
-        row: e.row,
-        rowIndex: e.index,
-        field: t.field,
-        column: t,
-        onChange: (n) => {
-          ce.current = n, re((i) => i && i.session === r.session ? { ...i, draft: n, invalid: !1 } : i);
-        },
-        onCommit: (n, i = "none") => {
-          r.session === J.current && ie(e, t, { value: n === void 0 ? ce.current : n }, { move: i });
-        },
-        onCancel: () => {
-          Y(), pe(e.id, t.field);
-        }
-      })
+  }, on = (e, t) => {
+    var o;
+    const n = w[e], l = y[t];
+    if (!n || !l) return;
+    qt({ id: n.id, field: l.field }), yt.current = Mt(n.id, l.field);
+    const i = xe.current;
+    if (q && i) {
+      const g = ((o = i.querySelector("thead")) == null ? void 0 : o.clientHeight) ?? 0, h = e * X;
+      h < i.scrollTop ? i.scrollTo({ top: h, behavior: "auto" }) : h + X > i.scrollTop + i.clientHeight - g && i.scrollTo({ top: h + X - i.clientHeight + g, behavior: "auto" });
     }
-  ) : /* @__PURE__ */ d(
-    "input",
-    {
-      autoFocus: !0,
-      className: D("rk-grid__editor", r.invalid && "rk-grid__editor--invalid", N.editor),
-      style: { textAlign: t.align, ...x.editor },
-      value: r.draft === null || r.draft === void 0 ? "" : String(r.draft),
-      inputMode: t.type === "number" ? "decimal" : void 0,
-      "aria-label": `Edit ${be(t)}`,
-      "aria-invalid": r.invalid || void 0,
-      onChange: (n) => {
-        const i = n.target.value;
-        re((l) => l && { ...l, draft: i, invalid: !1 });
-      },
-      onFocus: (n) => {
-        const i = n.currentTarget;
-        r.select === "all" ? i.select() : i.setSelectionRange(i.value.length, i.value.length);
-      },
-      onBlur: (n) => {
-        r.session === J.current && (ie(e, t, { text: n.currentTarget.value }, { focus: !1 }) || Y());
-      },
-      onKeyDown: (n) => it(n, e, t)
+  };
+  j(() => {
+    const e = yt.current;
+    if (!e) return;
+    const t = Re.current.get(e);
+    t && (yt.current = null, t.focus());
+  });
+  const ln = (e, t, n) => {
+    if (!ft) return !1;
+    let l = w.findIndex((o) => o.id === t.id), i = y.findIndex((o) => o.field === n.field);
+    if (l < 0 || i < 0) return !1;
+    switch (e.key) {
+      case "ArrowDown":
+        l += 1;
+        break;
+      case "ArrowUp":
+        l -= 1;
+        break;
+      case "ArrowRight":
+        i += 1;
+        break;
+      case "ArrowLeft":
+        i -= 1;
+        break;
+      case "PageDown":
+        l += xr;
+        break;
+      case "PageUp":
+        l -= xr;
+        break;
+      case "Home":
+        i = 0, (e.ctrlKey || e.metaKey) && (l = 0);
+        break;
+      case "End":
+        i = y.length - 1, (e.ctrlKey || e.metaKey) && (l = w.length - 1);
+        break;
+      default:
+        return !1;
+    }
+    return e.preventDefault(), on(Math.max(0, Math.min(w.length - 1, l)), Math.max(0, Math.min(y.length - 1, i))), !0;
+  }, sn = (e, t, n, l) => {
+    e.target === e.currentTarget && (ln(e, t, n) || Ge(n, l) && (e.key === "Enter" || e.key === "F2" ? (e.preventDefault(), Ze(t, n)) : !n.cellEditor && n.type !== "date" && e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && (e.preventDefault(), Ze(t, n, { text: e.key }))));
+  };
+  Ft(() => {
+    if (!q || !xe.current) return;
+    const e = xe.current, t = () => Ht((l) => l.height === e.clientHeight ? l : { ...l, height: e.clientHeight });
+    if (t(), typeof ResizeObserver > "u") return;
+    const n = new ResizeObserver(t);
+    return n.observe(e), () => n.disconnect();
+  }, [q]);
+  const Ee = q && !St && w.length > 0, an = xt.height || (typeof Oe == "number" ? Oe : 400), et = Ee ? Math.max(0, Math.floor(xt.top / X) - Rt) : 0, It = Ee ? Math.min(w.length, Math.ceil((xt.top + an) / X) + Rt) : w.length, dn = Ee ? w.slice(et, It) : w, or = `${K}|${A}|${JSON.stringify(R)}|${ue}|${JSON.stringify(se)}`, lr = F(!0);
+  j(() => {
+    if (lr.current) {
+      lr.current = !1;
+      return;
     }
-  ), ze = (e) => {
-    var r, n, i, l, f, a, u, p;
+    const e = xe.current;
+    e && typeof e.scrollTo == "function" && e.scrollTop > 0 && e.scrollTo({ top: 0, behavior: "smooth" });
+  }, [or]);
+  const Tt = Object.keys(kt).length > 0, tt = (e) => kt[e.field] ?? (typeof e.width == "number" ? e.width : Hn), cn = (e) => Math.max(40, typeof e.minWidth == "number" ? e.minWidth : 60), fn = (e, t) => {
+    e.preventDefault(), e.stopPropagation();
+    const n = { ...kt };
+    Tt || y.forEach((k) => {
+      var E;
+      return n[k.field] = ((E = _e.current.get(k.field)) == null ? void 0 : E.offsetWidth) ?? tt(k);
+    });
+    const l = e.clientX, i = n[t.field] ?? tt(t), o = e.currentTarget;
+    o.setPointerCapture(e.pointerId), zt(n);
+    const g = (k) => Math.min(t.maxWidth ?? 1 / 0, Math.max(cn(t), Math.round(k))), h = (k) => zt((E) => ({ ...E, [t.field]: g(i + k.clientX - l) })), u = () => {
+      o.removeEventListener("pointermove", h), o.removeEventListener("pointerup", u), o.removeEventListener("pointercancel", u);
+    };
+    o.addEventListener("pointermove", h), o.addEventListener("pointerup", u), o.addEventListener("pointercancel", u);
+  };
+  Ft(() => {
+    var i, o;
+    const e = {};
+    let t = W && y.some((g) => g.pinned === "left") ? ee : 0;
+    for (const g of y)
+      g.pinned === "left" && (e[g.field] = t, t += ((i = _e.current.get(g.field)) == null ? void 0 : i.offsetWidth) ?? 0);
+    let n = 0;
+    for (const g of [...y].reverse())
+      g.pinned === "right" && (e[g.field] = n, n += ((o = _e.current.get(g.field)) == null ? void 0 : o.offsetWidth) ?? 0);
+    const l = Object.keys(e);
+    (l.length !== Object.keys(Ke).length || l.some((g) => e[g] !== Ke[g])) && zr(e);
+  }), j(() => {
+    const e = () => qr((t) => t + 1);
+    return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
+  }, []);
+  const sr = y.map((e) => e.pinned).lastIndexOf("left"), un = y.findIndex((e) => e.pinned === "right"), rt = sr >= 0, ar = (e, t) => ({
+    className: e.pinned ? C("rk-grid__pinned", `rk-grid__pinned--${e.pinned}`, t === sr && "rk-grid__pinned--edge", t === un && "rk-grid__pinned--edge") : void 0,
+    style: e.pinned === "left" ? { left: Ke[e.field] ?? 0 } : e.pinned === "right" ? { right: Ke[e.field] ?? 0 } : void 0
+  }), dr = typeof Fe == "object" ? Fe : {}, cr = (e = {}) => {
+    const t = { ...dr, ...e }, n = t.scope ?? "filtered", l = n === "page" ? w : n === "selected" ? fe.filter((h) => Ct.has(h.id)) : G, i = t.includeHidden ? r : y, o = i.map((h) => ot(h) || h.field), g = l.map(
+      ({ row: h }) => i.map((u) => {
+        const k = U(h, u.field);
+        return u.exportValue ? u.exportValue(k, h) : u.type === "date" ? H(k) ?? "" : De(u, h);
+      })
+    );
+    return zn(o, g, { sanitize: t.sanitize });
+  }, fr = (e = {}) => {
+    const t = { ...dr, ...e };
+    qn(cr(e), `${t.filename ?? "export"}.csv`);
+  };
+  j(() => {
+    be && (be.current = {
+      getCsv: cr,
+      exportCsv: fr,
+      getSelectedRows: () => Gt(J),
+      getSelectedRowIds: () => J,
+      selectAll: () => tr(!0),
+      clearSelection: () => He([]),
+      refresh: () => {
+        V && qe(Ve.current);
+      }
+    });
+  }), j(
+    () => () => {
+      be && (be.current = null);
+    },
+    [be]
+  );
+  const ur = (e) => {
+    var n, l, i, o, g, h, u, k;
     const t = e.checkbox ?? {};
     return {
-      variant: t.variant ?? K,
+      variant: t.variant ?? ht,
       indicator: t.indicator,
       className: t.className,
       style: t.style,
       classNames: {
-        root: D(N.checkbox, (r = t.classNames) == null ? void 0 : r.root),
-        control: D(N.checkboxControl, (n = t.classNames) == null ? void 0 : n.control),
-        indicator: D(N.checkboxIndicator, (i = t.classNames) == null ? void 0 : i.indicator),
-        label: (l = t.classNames) == null ? void 0 : l.label
+        root: C(I.checkbox, (n = t.classNames) == null ? void 0 : n.root),
+        control: C(I.checkboxControl, (l = t.classNames) == null ? void 0 : l.control),
+        indicator: C(I.checkboxIndicator, (i = t.classNames) == null ? void 0 : i.indicator),
+        label: (o = t.classNames) == null ? void 0 : o.label
       },
       styles: {
-        root: { ...x.checkbox, ...(f = t.styles) == null ? void 0 : f.root },
-        control: { ...x.checkboxControl, ...(a = t.styles) == null ? void 0 : a.control },
-        indicator: { ...x.checkboxIndicator, ...(u = t.styles) == null ? void 0 : u.indicator },
-        label: (p = t.styles) == null ? void 0 : p.label
+        root: { ...v.checkbox, ...(g = t.styles) == null ? void 0 : g.root },
+        control: { ...v.checkboxControl, ...(h = t.styles) == null ? void 0 : h.control },
+        indicator: { ...v.checkboxIndicator, ...(u = t.styles) == null ? void 0 : u.indicator },
+        label: (k = t.styles) == null ? void 0 : k.label
       }
     };
-  }, ge = (e) => e.stopPropagation(), st = (e, t) => /* @__PURE__ */ d("span", { className: "rk-grid__checkbox-cell", onClick: ge, onDoubleClick: ge, children: /* @__PURE__ */ d(
-    Ge,
+  }, re = (e) => e.stopPropagation(), hn = (e, t) => /* @__PURE__ */ f("span", { className: "rk-grid__checkbox-cell", onClick: re, onDoubleClick: re, children: /* @__PURE__ */ f(
+    me,
     {
-      ...ze(e),
+      ...ur(e),
       checked: !!t.value,
       disabled: !t.editable,
-      "aria-label": `Toggle ${be(e)}`,
-      onChange: (r) => t.updateValue(r)
+      "aria-label": `Toggle ${pe(e)}`,
+      onChange: (n) => t.updateValue(n)
     }
-  ) }), We = (e) => ne.filter((t) => xe(e, ue(e, t.row, t.index))), dt = (e, t) => {
-    const r = new Map(We(e).map((l) => [l.index, l])), n = [], i = Q.current.map((l, f) => {
-      const a = r.get(f);
-      if (!a) return l;
-      const u = z(l, e.field);
-      if (!!u === t || e.validate && !e.validate(t, l)) return l;
-      const p = De(l, e.field, t);
-      return n.push({ rowId: a.id, rowIndex: f, field: e.field, oldValue: u, newValue: t, row: p }), p;
+  ) }), hr = (e) => G.filter((t) => Dt(e, Xe(e, t.row, t.index))), pn = (e, t) => {
+    const n = new Map(hr(e).map((o) => [o.index, o])), l = [], i = le.current.map((o, g) => {
+      const h = n.get(g);
+      if (!h) return o;
+      const u = U(o, e.field);
+      if (!!u === t || e.validate && !e.validate(t, o)) return o;
+      const k = Ot(o, e.field, t);
+      return l.push({ rowId: h.id, rowIndex: g, field: e.field, oldValue: u, newValue: t, row: k }), k;
     });
-    n.length !== 0 && (Le(i), n.forEach((l) => b == null ? void 0 : b(l)), m == null || m(i));
-  }, ct = (e) => {
-    const t = We(e), r = t.length > 0 ? t : ne, n = r.filter((l) => !!z(l.row, e.field)).length, i = r.length > 0 && n === r.length;
-    return /* @__PURE__ */ d("span", { className: "rk-grid__header-checkbox", onClick: ge, onDoubleClick: ge, children: /* @__PURE__ */ d(
-      Ge,
+    l.length !== 0 && (Ut(i), l.forEach((o) => c == null ? void 0 : c(o)), m == null || m(i));
+  }, gn = (e) => {
+    const t = hr(e), n = t.length > 0 ? t : G, l = n.filter((o) => !!U(o.row, e.field)).length, i = n.length > 0 && l === n.length;
+    return /* @__PURE__ */ f("span", { className: "rk-grid__header-checkbox", onClick: re, onDoubleClick: re, children: /* @__PURE__ */ f(
+      me,
       {
-        ...ze(e),
+        ...ur(e),
         checked: i,
-        indeterminate: n > 0 && !i,
+        indeterminate: l > 0 && !i,
         disabled: t.length === 0,
-        label: Ie(e) || void 0,
-        "aria-label": `Select all ${be(e)}`,
-        onChange: (l) => dt(e, l)
+        label: ot(e) || void 0,
+        "aria-label": `Select all ${pe(e)}`,
+        onChange: (o) => pn(e, o)
       }
     ) });
-  }, ut = _e || !!g, ft = g ? { "--rk-stripe-a": g[0], "--rk-stripe-b": g[1] } : void 0, pt = k && (E === "top" || E === "both"), ht = !k || E === "bottom" || E === "both", Oe = (e) => /* @__PURE__ */ $(
+  }, mn = (e, t, n) => {
+    if (t.cellEditor)
+      return /* @__PURE__ */ f(
+        "div",
+        {
+          className: "rk-grid__custom-editor",
+          onBlur: (i) => {
+            i.currentTarget.contains(i.relatedTarget) || n.session === ce.current && (Ne(e, t, { value: Be.current }, { focus: !1 }) || te());
+          },
+          onKeyDown: (i) => {
+            i.key === "Escape" && (i.preventDefault(), i.stopPropagation(), te(), Qe(e.id, t.field));
+          },
+          children: ge(t.cellEditor, {
+            value: n.draft,
+            row: e.row,
+            rowIndex: e.index,
+            field: t.field,
+            column: t,
+            onChange: (i) => {
+              Be.current = i, de((o) => o && o.session === n.session ? { ...o, draft: i, invalid: !1 } : o);
+            },
+            onCommit: (i, o = "none") => {
+              n.session === ce.current && Ne(e, t, { value: i === void 0 ? Be.current : i }, { move: o });
+            },
+            onCancel: () => {
+              te(), Qe(e.id, t.field);
+            }
+          })
+        }
+      );
+    const l = t.type === "date";
+    return /* @__PURE__ */ f(
+      "input",
+      {
+        autoFocus: !0,
+        type: l ? "date" : "text",
+        min: l ? t.dateMin : void 0,
+        max: l ? t.dateMax : void 0,
+        className: C("rk-grid__editor", n.invalid && "rk-grid__editor--invalid", I.editor),
+        style: { textAlign: t.align, ...v.editor },
+        value: n.draft === null || n.draft === void 0 ? "" : String(n.draft),
+        inputMode: t.type === "number" ? "decimal" : void 0,
+        "aria-label": `Edit ${pe(t)}`,
+        "aria-invalid": n.invalid || void 0,
+        onChange: (i) => {
+          const o = i.target.value;
+          de((g) => g && { ...g, draft: o, invalid: !1 });
+        },
+        onFocus: (i) => {
+          const o = i.currentTarget;
+          l || (n.select === "all" ? o.select() : o.setSelectionRange(o.value.length, o.value.length));
+        },
+        onBlur: (i) => {
+          if (n.session === ce.current) {
+            if (vr(i.currentTarget)) return te();
+            Ne(e, t, { text: i.currentTarget.value }, { focus: !1 }) || te();
+          }
+        },
+        onKeyDown: (i) => nn(i, e, t)
+      }
+    );
+  }, bn = Z(() => {
+    const e = /* @__PURE__ */ new Map();
+    for (const t of y)
+      t.filterable && !t.filterRenderer && _r(t) === "select" && e.set(t.field, An(t, Pe, (n) => U(n, t.field), (n) => De(t, n)));
+    return e;
+  }, [y, Pe]), kn = Or || !!$e, _n = $e ? { "--rk-stripe-a": $e[0], "--rk-stripe-b": $e[1] } : void 0, yn = Y && (Me === "top" || Me === "both"), xn = Y && (Me === "bottom" || Me === "both"), vn = B || !!Wt || Bt || !!Fe, pr = (e) => /* @__PURE__ */ x(
     "div",
     {
-      className: D("rk-grid__footer", e === "top" && "rk-grid__footer--top", N.footer),
-      style: x.footer,
+      className: C("rk-grid__footer", e === "top" && "rk-grid__footer--top", I.footer),
+      style: v.footer,
       "data-position": e,
       children: [
-        /* @__PURE__ */ d("span", { ..._("rowCount", "rk-grid__count"), children: U === 0 ? "0 rows" : `${rt}–${nt} of ${U}` }),
-        k && /* @__PURE__ */ $("div", { ..._("pagination", "rk-grid__pagination"), children: [
-          /* @__PURE__ */ $("label", { className: "rk-grid__page-size-label", children: [
+        /* @__PURE__ */ x("span", { ...L("rowCount", "rk-grid__count"), children: [
+          he === 0 ? "0 rows" : `${Yr}–${Xr} of ${he}`,
+          W && J.length > 0 ? ` · ${J.length} selected` : ""
+        ] }),
+        /* @__PURE__ */ x("div", { ...L("pagination", "rk-grid__pagination"), children: [
+          /* @__PURE__ */ x("label", { className: "rk-grid__page-size-label", children: [
             "Rows per page",
-            /* @__PURE__ */ d(
-              "select",
-              {
-                value: P,
-                onChange: (t) => tt(Number(t.target.value)),
-                ..._("pageSize", "rk-grid__page-size"),
-                children: (y.includes(P) ? y : [...y, P].sort((t, r) => t - r)).map(
-                  (t) => /* @__PURE__ */ d("option", { value: t, children: t }, t)
-                )
-              }
-            )
+            /* @__PURE__ */ f("select", { value: A, onChange: (t) => jr(Number(t.target.value)), ...L("pageSize", "rk-grid__page-size"), children: (at.includes(A) ? at : [...at, A].sort((t, n) => t - n)).map((t) => /* @__PURE__ */ f("option", { value: t, children: t }, t)) })
           ] }),
-          /* @__PURE__ */ d("button", { type: "button", "aria-label": "First page", disabled: S === 0, onClick: () => ee(0), ..._("pageButton", "rk-grid__page-btn"), children: "«" }),
-          /* @__PURE__ */ d("button", { type: "button", "aria-label": "Previous page", disabled: S === 0, onClick: () => ee(S - 1), ..._("pageButton", "rk-grid__page-btn"), children: "‹" }),
-          /* @__PURE__ */ $("span", { ..._("pageInfo", "rk-grid__page-info"), children: [
+          /* @__PURE__ */ f("button", { type: "button", "aria-label": "First page", disabled: K === 0, onClick: () => ae(0), ...L("pageButton", "rk-grid__page-btn"), children: "«" }),
+          /* @__PURE__ */ f("button", { type: "button", "aria-label": "Previous page", disabled: K === 0, onClick: () => ae(K - 1), ...L("pageButton", "rk-grid__page-btn"), children: "‹" }),
+          /* @__PURE__ */ x("span", { ...L("pageInfo", "rk-grid__page-info"), children: [
             "Page ",
-            S + 1,
+            K + 1,
             " of ",
-            oe
+            Q
           ] }),
-          /* @__PURE__ */ d("button", { type: "button", "aria-label": "Next page", disabled: S >= oe - 1, onClick: () => ee(S + 1), ..._("pageButton", "rk-grid__page-btn"), children: "›" }),
-          /* @__PURE__ */ d("button", { type: "button", "aria-label": "Last page", disabled: S >= oe - 1, onClick: () => ee(oe - 1), ..._("pageButton", "rk-grid__page-btn"), children: "»" })
+          /* @__PURE__ */ f("button", { type: "button", "aria-label": "Next page", disabled: K >= Q - 1, onClick: () => ae(K + 1), ...L("pageButton", "rk-grid__page-btn"), children: "›" }),
+          /* @__PURE__ */ f("button", { type: "button", "aria-label": "Last page", disabled: K >= Q - 1, onClick: () => ae(Q - 1), ...L("pageButton", "rk-grid__page-btn"), children: "»" })
         ] })
       ]
     }
-  );
-  return /* @__PURE__ */ $(
-    "div",
-    {
-      className: D("rk-grid", N.root, de),
-      style: { ...ft, ...x.root, ...He },
-      "data-rk-theme": T || void 0,
-      children: [
-        (G || q) && /* @__PURE__ */ $("div", { ..._("toolbar", "rk-grid__toolbar"), children: [
-          G ? /* @__PURE__ */ d(
-            "input",
+  ), wn = (e) => /* @__PURE__ */ f("tr", { className: "rk-grid__tr rk-grid__skeleton-row", "aria-hidden": "true", style: q ? { height: X } : void 0, children: Kt ? (
+    // A custom component draws the whole row content inside one wide cell
+    /* @__PURE__ */ f("td", { colSpan: ve, className: "rk-grid__td rk-grid__skeleton-cell", children: ge(Kt, { rowIndex: e, columns: y }) })
+  ) : /* @__PURE__ */ x(lt, { children: [
+    W && /* @__PURE__ */ f("td", { className: "rk-grid__td", children: /* @__PURE__ */ f("span", { ...L("skeleton", "rk-grid__skeleton"), style: { ...v.skeleton, width: 18 } }) }),
+    y.map((t, n) => /* @__PURE__ */ f("td", { className: "rk-grid__td", style: { textAlign: t.align }, children: /* @__PURE__ */ f("span", { ...L("skeleton", "rk-grid__skeleton"), style: { ...v.skeleton, width: `${55 + (e * 7 + n * 13) % 35}%` } }) }, t.field))
+  ] }) }, `sk${e}`), Nn = (e, t) => {
+    const { row: n, id: l, index: i } = e, o = typeof gt == "function" ? gt(n, i) : gt, g = typeof mt == "function" ? mt(n, i) : mt, h = Ct.has(l);
+    return /* @__PURE__ */ x(
+      "tr",
+      {
+        onClick: ut ? () => ut(n, i) : void 0,
+        "aria-selected": W ? h : void 0,
+        className: C(
+          "rk-grid__tr",
+          "rk-grid__row",
+          kn && (t % 2 === 0 ? "rk-grid__row--stripe-a" : "rk-grid__row--stripe-b"),
+          jt && !q && "rk-grid__row--enter",
+          h && "rk-grid__row--selected",
+          ut && "rk-grid__row--clickable",
+          I.row,
+          o
+        ),
+        style: {
+          ...jt && !q ? { "--rk-i": Math.min(t, 24) } : null,
+          ...q ? { height: X } : null,
+          ...v.row,
+          ...g
+        },
+        children: [
+          W && /* @__PURE__ */ f(
+            "td",
             {
-              type: "search",
-              value: X,
-              onChange: (e) => Qe(e.target.value),
-              placeholder: w,
-              "aria-label": "Search all columns",
-              ..._("search", "rk-grid__search")
+              className: C("rk-grid__td rk-grid__select-cell", rt && "rk-grid__pinned rk-grid__pinned--left"),
+              style: { width: ee, minWidth: ee, maxWidth: ee, ...rt ? { left: 0 } : null },
+              onClick: re,
+              children: /* @__PURE__ */ f("span", { className: "rk-grid__checkbox-cell", onClickCapture: (u) => Qt.current = u.shiftKey, children: /* @__PURE__ */ f(
+                me,
+                {
+                  variant: ht,
+                  checked: h,
+                  disabled: !Je(n),
+                  "aria-label": W === "single" ? "Select row" : `Select row ${i + 1}`,
+                  onChange: (u) => en(e, u),
+                  classNames: { root: I.checkbox, control: I.checkboxControl, indicator: I.checkboxIndicator },
+                  styles: { root: v.checkbox, control: v.checkboxControl, indicator: v.checkboxIndicator }
+                }
+              ) })
             }
-          ) : /* @__PURE__ */ d("span", {}),
-          q
-        ] }),
-        pt && Oe("top"),
-        /* @__PURE__ */ d("div", { ref: Be, ..._("scroll", "rk-grid__scroll"), style: { ...x.scroll, ...j !== void 0 ? { maxHeight: j } : null }, children: /* @__PURE__ */ $("table", { ..._("table", "rk-grid__table"), role: "grid", children: [
-          /* @__PURE__ */ d("thead", { ..._("thead", "rk-grid__thead"), children: /* @__PURE__ */ d("tr", { ..._("headerRow", "rk-grid__tr"), children: o.map((e) => {
-            const t = (v == null ? void 0 : v.field) === e.field ? v.direction : null, r = Fe(e);
-            return /* @__PURE__ */ d(
-              "th",
+          ),
+          y.map((u, k) => {
+            const E = tn(u, e), nt = typeof u.cellClassName == "function" ? u.cellClassName(E) : u.cellClassName, Sn = typeof u.cellStyle == "function" ? u.cellStyle(E) : u.cellStyle, gr = ye !== null && ye.id === l && ye.field === u.field, Lt = Ge(u, E), mr = ar(u, k), Cn = _t ? _t.id === l && _t.field === u.field : t === 0 && k === 0;
+            return /* @__PURE__ */ f(
+              "td",
               {
-                scope: "col",
-                "aria-sort": t ? t === "asc" ? "ascending" : "descending" : r ? "none" : void 0,
-                tabIndex: r ? 0 : void 0,
-                onClick: () => Ve(e),
-                onKeyDown: (n) => {
-                  r && n.target === n.currentTarget && (n.key === "Enter" || n.key === " ") && (n.preventDefault(), Ve(e));
+                ref: (ne) => {
+                  const br = Mt(l, u.field);
+                  ne ? Re.current.set(br, ne) : Re.current.delete(br);
                 },
-                className: D("rk-grid__th", r && "rk-grid__th--sortable", N.headerCell, e.className, e.headerClassName),
-                style: { width: e.width, minWidth: e.minWidth, textAlign: e.align, ...x.headerCell, ...e.style, ...e.headerStyle },
-                children: /* @__PURE__ */ $("span", { className: "rk-grid__th-content", children: [
-                  e.headerRenderer ? se(e.headerRenderer, { column: e, sortDirection: t }) : e.headerCheckbox && e.type === "boolean" ? ct(e) : Ie(e),
-                  e.filterable && /* @__PURE__ */ d(
-                    xt,
-                    {
-                      column: e,
-                      label: be(e),
-                      value: Z[e.field] ?? "",
-                      onChange: (n) => Xe((i) => ({ ...i, [e.field]: n })),
-                      theme: T,
-                      indicatorClassName: D(N.filterIndicator, e.filterIndicatorClassName),
-                      indicatorStyle: { ...x.filterIndicator, ...e.filterIndicatorStyle },
-                      popupClassName: D(N.filterPopup, e.filterPopupClassName),
-                      popupStyle: { ...x.filterPopup, ...e.filterPopupStyle },
-                      inputClassName: N.filterInput,
-                      inputStyle: x.filterInput
-                    }
-                  ),
-                  r && /* @__PURE__ */ d("span", { className: "rk-grid__sort", "aria-hidden": "true", children: t === "asc" ? "▲" : t === "desc" ? "▼" : "↕" })
-                ] })
-              },
-              e.field
-            );
-          }) }) }),
-          /* @__PURE__ */ d("tbody", { ..._("tbody", "rk-grid__tbody"), children: M.length === 0 ? /* @__PURE__ */ d("tr", { children: /* @__PURE__ */ d("td", { colSpan: o.length, ..._("empty", "rk-grid__empty"), children: L }) }) : M.map((e, t) => {
-            const { row: r, id: n, index: i } = e, l = typeof me == "function" ? me(r, i) : me, f = typeof ve == "function" ? ve(r, i) : ve;
-            return /* @__PURE__ */ d(
-              "tr",
-              {
-                onClick: R ? () => R(r, i) : void 0,
-                className: D(
-                  "rk-grid__tr",
-                  "rk-grid__row",
-                  ut && (t % 2 === 0 ? "rk-grid__row--stripe-a" : "rk-grid__row--stripe-b"),
-                  A && "rk-grid__row--enter",
-                  R && "rk-grid__row--clickable",
-                  N.row,
-                  l
+                tabIndex: ft ? Cn ? 0 : -1 : Lt ? 0 : void 0,
+                onFocus: ft ? (ne) => ne.target === ne.currentTarget && qt({ id: l, field: u.field }) : void 0,
+                onDoubleClick: Lt ? () => Ze(e, u) : void 0,
+                onKeyDown: (ne) => sn(ne, e, u, E),
+                className: C(
+                  "rk-grid__td",
+                  Lt && "rk-grid__td--editable",
+                  gr && "rk-grid__td--editing",
+                  mr.className,
+                  I.cell,
+                  u.className,
+                  nt
                 ),
-                style: { ...A ? { "--rk-i": Math.min(t, 24) } : null, ...x.row, ...f },
-                children: o.map((a) => {
-                  const u = ot(a, e), p = typeof a.cellClassName == "function" ? a.cellClassName(u) : a.cellClassName, C = typeof a.cellStyle == "function" ? a.cellStyle(u) : a.cellStyle, we = te !== null && te.id === n && te.field === a.field, Ee = fe(a, u);
-                  return /* @__PURE__ */ d(
-                    "td",
-                    {
-                      ref: (ke) => {
-                        const Re = Ue(n, a.field);
-                        ke ? ye.current.set(Re, ke) : ye.current.delete(Re);
-                      },
-                      tabIndex: Ee ? 0 : void 0,
-                      onDoubleClick: Ee ? () => he(e, a) : void 0,
-                      onKeyDown: (ke) => lt(ke, e, a, u),
-                      className: D(
-                        "rk-grid__td",
-                        Ee && "rk-grid__td--editable",
-                        we && "rk-grid__td--editing",
-                        N.cell,
-                        a.className,
-                        p
-                      ),
-                      style: { textAlign: a.align, ...x.cell, ...a.style, ...C },
-                      children: we && te ? at(e, a, te) : a.cellRenderer ? se(a.cellRenderer, u) : a.type === "boolean" && !a.cellEditor ? st(a, u) : u.formattedValue
-                    },
-                    a.field
-                  );
-                })
+                style: { textAlign: u.align, ...v.cell, ...u.style, ...Sn, ...mr.style },
+                children: gr && ye ? mn(e, u, ye) : u.cellRenderer ? ge(u.cellRenderer, E) : u.type === "boolean" && !u.cellEditor ? hn(u, E) : E.formattedValue
               },
-              n
+              u.field
             );
-          }) }, Ke)
-        ] }) }),
-        ht && Oe("bottom")
+          })
+        ]
+      },
+      l
+    );
+  }, En = Mr ?? (Y ? Math.min(A, 20) : 5);
+  return /* @__PURE__ */ x(
+    "div",
+    {
+      className: C("rk-grid", q && "rk-grid--virtual", I.root, Pr),
+      style: { ..._n, ...v.root, ...Ar },
+      "data-rk-theme": pt || void 0,
+      "aria-busy": St || void 0,
+      children: [
+        vn && /* @__PURE__ */ x("div", { ...L("toolbar", "rk-grid__toolbar"), children: [
+          /* @__PURE__ */ x("div", { className: "rk-grid__toolbar-left", children: [
+            B && /* @__PURE__ */ f(
+              "input",
+              {
+                type: "search",
+                value: ke,
+                onChange: (e) => Kr(e.target.value),
+                placeholder: ie,
+                "aria-label": "Search all columns",
+                ...L("search", "rk-grid__search")
+              }
+            ),
+            W && J.length > 0 && /* @__PURE__ */ x("span", { className: "rk-grid__selected-count", role: "status", children: [
+              J.length,
+              " selected"
+            ] })
+          ] }),
+          /* @__PURE__ */ x("div", { className: "rk-grid__toolbar-actions", children: [
+            Wt,
+            Bt && /* @__PURE__ */ f(
+              jn,
+              {
+                columns: r,
+                hidden: Ae,
+                onToggle: Ur,
+                theme: pt,
+                className: I.toolButton,
+                style: v.toolButton
+              }
+            ),
+            Fe && /* @__PURE__ */ f("button", { type: "button", onClick: () => fr(), ...L("toolButton", "rk-grid__tool-btn"), children: "Export CSV" })
+          ] })
+        ] }),
+        yn && pr("top"),
+        /* @__PURE__ */ f(
+          "div",
+          {
+            ref: xe,
+            ...L("scroll", "rk-grid__scroll"),
+            onScroll: q ? (e) => Ht({ top: e.currentTarget.scrollTop, height: e.currentTarget.clientHeight }) : void 0,
+            style: { ...v.scroll, ...Oe !== void 0 ? { maxHeight: Oe } : q ? { maxHeight: 400 } : null },
+            children: /* @__PURE__ */ x(
+              "table",
+              {
+                ...L("table", "rk-grid__table"),
+                role: "grid",
+                style: Tt ? {
+                  ...v.table,
+                  tableLayout: "fixed",
+                  width: y.reduce((e, t) => e + tt(t), W ? ee : 0),
+                  minWidth: "100%"
+                } : v.table,
+                children: [
+                  /* @__PURE__ */ f("thead", { ...L("thead", "rk-grid__thead"), children: /* @__PURE__ */ x("tr", { ...L("headerRow", "rk-grid__tr"), children: [
+                    W && /* @__PURE__ */ f(
+                      "th",
+                      {
+                        scope: "col",
+                        className: C("rk-grid__th rk-grid__select-cell", rt && "rk-grid__pinned rk-grid__pinned--left", I.headerCell),
+                        style: { width: ee, minWidth: ee, maxWidth: ee, ...rt ? { left: 0 } : null, ...v.headerCell },
+                        children: W === "multiple" && /* @__PURE__ */ f("span", { className: "rk-grid__checkbox-cell", children: /* @__PURE__ */ f(
+                          me,
+                          {
+                            variant: ht,
+                            checked: er,
+                            indeterminate: Zt > 0 && !er,
+                            disabled: we.length === 0,
+                            "aria-label": "Select all rows",
+                            onChange: tr,
+                            classNames: { root: I.checkbox, control: I.checkboxControl, indicator: I.checkboxIndicator },
+                            styles: { root: v.checkbox, control: v.checkboxControl, indicator: v.checkboxIndicator }
+                          }
+                        ) })
+                      }
+                    ),
+                    y.map((e, t) => {
+                      const n = R.findIndex((h) => h.field === e.field), l = n >= 0 ? R[n].direction : null, i = vt(e), o = Yt(e), g = ar(e, t);
+                      return /* @__PURE__ */ x(
+                        "th",
+                        {
+                          ref: (h) => {
+                            h ? _e.current.set(e.field, h) : _e.current.delete(e.field);
+                          },
+                          scope: "col",
+                          "aria-sort": l ? l === "asc" ? "ascending" : "descending" : i ? "none" : void 0,
+                          tabIndex: i ? 0 : void 0,
+                          onClick: (h) => rr(e, h.shiftKey),
+                          onKeyDown: (h) => {
+                            i && h.target === h.currentTarget && (h.key === "Enter" || h.key === " ") && (h.preventDefault(), rr(e, h.shiftKey));
+                          },
+                          className: C("rk-grid__th", i && "rk-grid__th--sortable", g.className, I.headerCell, e.className, e.headerClassName),
+                          style: {
+                            width: Tt ? tt(e) : e.width,
+                            minWidth: e.minWidth,
+                            textAlign: e.align,
+                            ...v.headerCell,
+                            ...e.style,
+                            ...e.headerStyle,
+                            ...g.style
+                          },
+                          children: [
+                            /* @__PURE__ */ x("span", { className: "rk-grid__th-content", children: [
+                              e.headerRenderer ? ge(e.headerRenderer, { column: e, sortDirection: l }) : e.headerCheckbox && e.type === "boolean" ? gn(e) : ot(e),
+                              e.filterable && /* @__PURE__ */ f(
+                                Wn,
+                                {
+                                  column: e,
+                                  label: pe(e),
+                                  kind: o,
+                                  value: se[e.field],
+                                  onChange: (h) => {
+                                    const u = { ...se };
+                                    h === void 0 ? delete u[e.field] : u[e.field] = h, Br(u);
+                                  },
+                                  options: bn.get(e.field) ?? [],
+                                  theme: pt,
+                                  indicatorClassName: C(I.filterIndicator, e.filterIndicatorClassName),
+                                  indicatorStyle: { ...v.filterIndicator, ...e.filterIndicatorStyle },
+                                  popupClassName: C(I.filterPopup, e.filterPopupClassName),
+                                  popupStyle: { ...v.filterPopup, ...e.filterPopupStyle },
+                                  inputClassName: I.filterInput,
+                                  inputStyle: v.filterInput
+                                }
+                              ),
+                              i && /* @__PURE__ */ x("span", { className: "rk-grid__sort", "aria-hidden": "true", children: [
+                                l === "asc" ? "▲" : l === "desc" ? "▼" : "↕",
+                                l && R.length > 1 && /* @__PURE__ */ f("sup", { className: "rk-grid__sort-order", children: n + 1 })
+                              ] })
+                            ] }),
+                            e.resizable && /* @__PURE__ */ f(
+                              "span",
+                              {
+                                className: "rk-grid__resizer",
+                                role: "separator",
+                                "aria-orientation": "vertical",
+                                "aria-label": `Resize ${pe(e)}`,
+                                onPointerDown: (h) => fn(h, e),
+                                onClick: re,
+                                onDoubleClick: re
+                              }
+                            )
+                          ]
+                        },
+                        e.field
+                      );
+                    })
+                  ] }) }),
+                  /* @__PURE__ */ f("tbody", { ...L("tbody", "rk-grid__tbody"), children: St ? Array.from({ length: En }, (e, t) => wn(t)) : Zr ? /* @__PURE__ */ f("tr", { children: /* @__PURE__ */ x("td", { colSpan: ve, ...L("empty", "rk-grid__empty rk-grid__error"), role: "alert", children: [
+                    Fr,
+                    " ",
+                    /* @__PURE__ */ f("button", { type: "button", className: "rk-grid__tool-btn", onClick: () => qe(Ve.current), children: "Retry" })
+                  ] }) }) : w.length === 0 ? /* @__PURE__ */ f("tr", { children: /* @__PURE__ */ f("td", { colSpan: ve, ...L("empty", "rk-grid__empty"), children: $r }) }) : /* @__PURE__ */ x(lt, { children: [
+                    Ee && et > 0 && /* @__PURE__ */ f("tr", { "aria-hidden": "true", className: "rk-grid__spacer", children: /* @__PURE__ */ f("td", { colSpan: ve, style: { height: et * X } }) }),
+                    dn.map((e, t) => Nn(e, et + t)),
+                    Ee && It < w.length && /* @__PURE__ */ f("tr", { "aria-hidden": "true", className: "rk-grid__spacer", children: /* @__PURE__ */ f("td", { colSpan: ve, style: { height: (w.length - It) * X } }) })
+                  ] }) }, or)
+                ]
+              }
+            )
+          }
+        ),
+        xn && pr("bottom")
       ]
     }
   );
 }
 export {
-  Ge as Checkbox,
-  St as DataGrid
+  me as Checkbox,
+  ei as DataGrid
 };