@reportportal/ui-kit 0.0.1-alpha.2 → 0.0.1-alpha.200

package/dist/table-0ec68481.js

@@ -0,0 +1,1116 @@
+import { jsx as d, jsxs as U, Fragment as Pt } from "react/jsx-runtime";
+import { useMemo as Z, useState as q, useCallback as $, useEffect as B, useRef as P, useLayoutEffect as st, forwardRef as Bt } from "react";
+import { Resizable as St } from "react-resizable";
+import { c as Te } from "./bind-06a7ff84.js";
+import { b as Gt, a as Ce, S as Ft } from "./resizeColumn-46b5b30f.js";
+import { S as Oe } from "./chevronDownDropdown-0260bb66.js";
+import { C as ke } from "./checkbox-76aa8f97.js";
+import { Tooltip as Ke } from "./tooltip.js";
+import { createPortal as qt } from "react-dom";
+import { i as Dt } from "./isEmpty-ccacb5ff.js";
+const ot = (t) => typeof t == "string", Ut = "_table_1gbhh_1", jt = "_resizable_1gbhh_67", Xt = "_selectable_1gbhh_84", Vt = "_expanded_1gbhh_80", It = "_label_1gbhh_349", Rt = {
+  table: Ut,
+  "fixed-header": "_fixed-header_1gbhh_10",
+  "external-scroll-container": "_external-scroll-container_1gbhh_14",
+  "horizontally-scrollable-container": "_horizontally-scrollable-container_1gbhh_21",
+  "table-header": "_table-header_1gbhh_26",
+  "sticky-header": "_sticky-header_1gbhh_34",
+  "pinned-header": "_pinned-header_1gbhh_44",
+  "horizontally-scrollable": "_horizontally-scrollable_1gbhh_21",
+  resizable: jt,
+  "resizable-column": "_resizable-column_1gbhh_67",
+  "table-row": "_table-row_1gbhh_75",
+  "expanded-cell": "_expanded-cell_1gbhh_80",
+  selectable: Xt,
+  "row-content-wrapper": "_row-content-wrapper_1gbhh_88",
+  "pinned-column": "_pinned-column_1gbhh_96",
+  "has-scroll": "_has-scroll_1gbhh_96",
+  "table-row-content": "_table-row-content_1gbhh_99",
+  "expand-cell": "_expand-cell_1gbhh_116",
+  "left-border-accent": "_left-border-accent_1gbhh_119",
+  "size-small": "_size-small_1gbhh_129",
+  "size-large": "_size-large_1gbhh_140",
+  "table-body": "_table-body_1gbhh_152",
+  "scrollable-body": "_scrollable-body_1gbhh_158",
+  "table-header-cell": "_table-header-cell_1gbhh_222",
+  "table-cell": "_table-cell_1gbhh_223",
+  "action-menu-cell": "_action-menu-cell_1gbhh_229",
+  "checkbox-cell": "_checkbox-cell_1gbhh_257",
+  "expand-all-tooltip-wrapper": "_expand-all-tooltip-wrapper_1gbhh_298",
+  "expand-all-tooltip-content": "_expand-all-tooltip-content_1gbhh_307",
+  "expand-icon": "_expand-icon_1gbhh_316",
+  expanded: Vt,
+  "primary-cell": "_primary-cell_1gbhh_325",
+  label: It,
+  "sortable-cell": "_sortable-cell_1gbhh_363",
+  "align-right": "_align-right_1gbhh_366",
+  "align-center": "_align-center_1gbhh_372",
+  "table-wrapper": "_table-wrapper_1gbhh_426",
+  "checkbox-column": "_checkbox-column_1gbhh_438",
+  "checkbox-header": "_checkbox-header_1gbhh_447",
+  "checkbox-body": "_checkbox-body_1gbhh_468",
+  "checkbox-row": "_checkbox-row_1gbhh_475",
+  "checkbox-tooltip-wrapper": "_checkbox-tooltip-wrapper_1gbhh_486"
+}, ct = "asc", C = 32, it = 100, Yt = 48, Le = 48, Jt = (t) => t.toLowerCase() === ct, Qt = (t) => t.map((c) => c.key), Y = (t) => "primary" in t && t.primary === !0, et = (t) => {
+  var o;
+  return `size-${((o = t.rowConfigs) == null ? void 0 : o.size) ?? "default"}`;
+}, Ee = (t) => ot(t) ? t : `${t}px`, Zt = (t, c, o, i, p, g = !1) => {
+  let h = 0;
+  i && (h += C), p && !g && (h += C);
+  for (let b = 0; b < t; b++) {
+    const a = c[b];
+    if (Y(a)) {
+      const s = o.current.get(a.key) || it;
+      h += s;
+    } else {
+      const s = a, l = ot(s.width) ? parseInt(s.width, 10) || 0 : s.width;
+      h += l;
+    }
+  }
+  return h;
+}, ae = (t, c, o, i, p, g, h, b = !1) => {
+  const a = {};
+  if (!Y(t)) {
+    const s = t;
+    a.textAlign = s.align;
+  }
+  if (c && o !== void 0) {
+    const s = Zt(
+      o,
+      i,
+      p,
+      g,
+      h,
+      b
+    );
+    a.left = `${s}px`;
+  }
+  return a;
+}, tt = (t, c, o, i, p, g = !1, h, b = !1, a = !1) => {
+  const s = [];
+  o && s.push(`${C}px`), g && i && !a && s.push(`${C}px`);
+  const l = (v) => {
+    if ((h == null ? void 0 : h[v.key]) !== void 0) {
+      s.push(`${h[v.key]}px`);
+      return;
+    }
+    if (Y(v)) {
+      const y = v;
+      if (b && y.width) {
+        s.push(Ee(y.width));
+        return;
+      }
+      const T = y.width ? Ee(y.width) : `${it}px`;
+      s.push(`minmax(${T}, 1fr)`);
+    } else {
+      const T = Ee(v.width);
+      s.push(T);
+    }
+  };
+  return t.forEach(l), c.forEach(l), p && s.push(`${Yt}px`), s.join(" ");
+}, Ct = ({
+  primaryColumns: t,
+  fixedColumns: c,
+  pinnedColumnKeys: o
+}) => Z(() => {
+  const i = [], p = [];
+  return t.forEach((g) => {
+    const h = { ...g, primary: !0 };
+    o.includes(g.key) ? i.push(h) : p.push(h);
+  }), c.forEach((g) => {
+    o.includes(g.key) ? i.push(g) : p.push(g);
+  }), {
+    pinnedColumns: i,
+    scrollableColumns: p
+  };
+}, [t, c, o]), Ot = () => {
+  const [t, c] = q(null), [o, i] = q(null), p = $((a) => {
+    c(a);
+  }, []), g = $(() => {
+    c(null);
+  }, []), h = $((a) => {
+    i(a);
+  }, []), b = $(() => {
+    i(null);
+  }, []);
+  return {
+    hoveredColumn: t,
+    hoveredRow: o,
+    handleColumnMouseEnter: p,
+    handleColumnMouseLeave: g,
+    handleRowMouseEnter: h,
+    handleRowMouseLeave: b
+  };
+}, Kt = ({
+  primaryColumns: t,
+  fixedColumns: c,
+  expandedRowIds: o,
+  onToggleRowExpansion: i
+}) => {
+  const [p, g] = q(/* @__PURE__ */ new Set());
+  B(() => {
+    const a = [
+      ...t.map((l) => l.key),
+      ...c.map((l) => l.key)
+    ], s = /* @__PURE__ */ new Set();
+    o.forEach((l) => {
+      a.forEach((v) => {
+        s.add(`${l}-${v}`);
+      });
+    }), g((l) => {
+      if (l.size === s.size) {
+        let v = !0;
+        if (l.forEach((y) => {
+          s.has(y) || (v = !1);
+        }), v)
+          return l;
+      }
+      return s;
+    });
+  }, [o, t, c]);
+  const h = $(
+    (a) => {
+      const s = new Set(p), l = o.includes(a), v = [
+        ...t.map((y) => y.key),
+        ...c.map((y) => y.key)
+      ];
+      l ? v.forEach((y) => {
+        const T = `${a}-${y}`;
+        s.delete(T);
+      }) : v.forEach((y) => {
+        const T = `${a}-${y}`;
+        s.add(T);
+      }), g(s), i(a);
+    },
+    [p, o, t, c, i]
+  ), b = $(
+    (a, s) => {
+      const l = `${a}-${s}`;
+      return p.has(l);
+    },
+    [p]
+  );
+  return {
+    expandedCells: p,
+    handleToggleRowExpansion: h,
+    isCellExpanded: b
+  };
+}, en = () => {
+  const t = P(/* @__PURE__ */ new Map()), c = $(
+    (o) => (i) => {
+      if (!i)
+        return;
+      const p = i.getBoundingClientRect().width;
+      p > 0 && t.current.set(o, p);
+    },
+    []
+  );
+  return {
+    columnWidthsRef: t,
+    setCellRef: c
+  };
+}, tn = ({
+  enabled: t = !1,
+  minWidth: c = 50,
+  maxWidth: o = 500,
+  columns: i = [],
+  columnWidthsRef: p,
+  onColumnResize: g,
+  initialColumnWidths: h
+}) => {
+  const [b, a] = q({}), s = P(i), l = P(void 0);
+  B(() => {
+    s.current = i;
+  }, [i]);
+  const v = $(
+    (_) => {
+      const L = i.find((k) => k.key === _);
+      return {
+        minWidth: (L == null ? void 0 : L.minWidth) ?? c,
+        maxWidth: (L == null ? void 0 : L.maxWidth) ?? o
+      };
+    },
+    [i, c, o]
+  );
+  B(() => {
+    if (h && l.current !== h) {
+      const L = {};
+      Object.entries(h).forEach(([k, M]) => {
+        const z = s.current.find((V) => V.key === k), S = (z == null ? void 0 : z.minWidth) ?? c, A = (z == null ? void 0 : z.maxWidth) ?? o;
+        L[k] = Math.min(A, Math.max(S, M));
+      }), a(L), l.current = h;
+    }
+  }, [h, c, o]);
+  const y = $(() => {
+    if (!t || Object.keys(b).length > 0 || !p)
+      return;
+    const _ = {};
+    p.current.forEach((L, k) => {
+      _[k] = L;
+    }), a(_);
+  }, [t, b, p]), T = $(
+    (_) => (L, { size: k }) => {
+      if (!t)
+        return;
+      const { minWidth: M, maxWidth: z } = v(_), S = Math.min(z, Math.max(M, k.width));
+      a((A) => ({ ...A, [_]: S }));
+    },
+    [t, v]
+  ), W = $(
+    (_) => () => {
+      !t || !b[_] || g == null || g(_, b[_]);
+    },
+    [t, b, g]
+  );
+  return {
+    columnWidths: b,
+    handleResize: T,
+    handleResizeStop: W,
+    handleResizeStart: y
+  };
+}, nn = (t, c, o, i, p, g, h, b) => Z(() => {
+  if (!t)
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  if (!(p + t.clientWidth < h))
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  const s = t.getBoundingClientRect(), l = (c == null ? void 0 : c.offsetHeight) || 0, v = o == null ? void 0 : o.getBoundingClientRect(), y = Math.min(
+    s.bottom,
+    (v == null ? void 0 : v.bottom) || Number.MAX_SAFE_INTEGER
+  );
+  let T;
+  i && o && v ? T = v.top - s.top + l : T = l;
+  const W = s.top + T, L = t.scrollWidth > t.clientWidth ? t.offsetHeight - t.clientHeight : 0, k = y - W - L, z = t.scrollHeight > t.clientHeight ? t.offsetWidth - t.clientWidth : 0, S = s.right - Le - z;
+  return {
+    visible: !0,
+    position: {
+      top: W,
+      left: S
+    },
+    size: {
+      width: Le,
+      height: k
+    }
+  };
+}, [
+  t,
+  c,
+  o,
+  i,
+  p,
+  g,
+  h,
+  b
+]), rn = (t, c, o, i, p, g, h, b) => Z(() => {
+  if (!t)
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  if (!(c > 0))
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  const s = t.querySelector('[data-row-index="0"]');
+  if (!s)
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  const l = Array.from(s.querySelectorAll("[data-pinned-index]"));
+  if (l.length === 0)
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  const v = Math.max(
+    ...l.map(
+      (O) => parseInt(O.getAttribute("data-pinned-index") || "-1", 10)
+    )
+  );
+  if (v < 0)
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  const y = l.find(
+    (O) => parseInt(O.getAttribute("data-pinned-index") || "-1", 10) === v
+  );
+  if (!y)
+    return {
+      visible: !1,
+      position: { top: 0, left: 0 },
+      size: { width: 0, height: 0 }
+    };
+  const T = y.getBoundingClientRect(), W = t.getBoundingClientRect(), _ = (o == null ? void 0 : o.offsetHeight) || 0, L = i == null ? void 0 : i.getBoundingClientRect(), k = T.right, M = Math.min(
+    W.bottom,
+    (L == null ? void 0 : L.bottom) || Number.MAX_SAFE_INTEGER
+  );
+  let z;
+  p && i && L ? z = L.top - W.top + _ : z = _;
+  const S = W.top + z, V = t.scrollWidth > t.clientWidth ? t.offsetHeight - t.clientHeight : 0, ne = M - S - V;
+  return {
+    visible: !0,
+    position: {
+      top: S,
+      left: k
+    },
+    size: {
+      width: Le,
+      height: ne
+    }
+  };
+}, [
+  t,
+  c,
+  o,
+  i,
+  p,
+  g,
+  h,
+  b
+]), sn = ({ enabled: t, rowCount: c }) => {
+  const o = P(/* @__PURE__ */ new Map()), i = P(/* @__PURE__ */ new Map()), p = $(
+    (a) => (s) => {
+      const l = String(a);
+      s ? o.current.set(l, s) : o.current.delete(l);
+    },
+    []
+  ), g = $(
+    (a) => (s) => {
+      const l = String(a);
+      s ? i.current.set(l, s) : i.current.delete(l);
+    },
+    []
+  ), h = $((a, s) => {
+    const l = `${a.offsetHeight}px`;
+    s.style.height !== l && (s.style.height = l);
+  }, []), b = $(() => {
+    o.current.forEach((a, s) => {
+      const l = i.current.get(s);
+      l && h(a, l);
+    });
+  }, [h]);
+  return B(() => {
+    if (!t)
+      return;
+    const a = new ResizeObserver((s) => {
+      requestAnimationFrame(() => {
+        s.forEach((l) => {
+          const v = l.target, y = v.dataset.rowId, T = y ? i.current.get(y) : void 0;
+          T && h(v, T);
+        });
+      });
+    });
+    return o.current.forEach((s) => a.observe(s)), () => a.disconnect();
+  }, [t, c, h]), st(() => {
+    t && b();
+  }, [t, c, b]), { setTableRowRef: p, setCheckboxRowRef: g, syncAllHeights: b };
+}, on = {
+  "resize-handle": "_resize-handle_15uk3_1"
+}, cn = Te.bind(on), ln = Bt(
+  (t, c) => /* @__PURE__ */ d("div", { ref: c, className: cn("resize-handle"), ...t, children: /* @__PURE__ */ d(Gt, {}) })
+), an = {
+  "gradient-overlay": "_gradient-overlay_hx7m8_1",
+  "direction-right": "_direction-right_hx7m8_5",
+  "direction-left": "_direction-left_hx7m8_13"
+}, hn = Te.bind(an), nt = ({
+  portalContainer: t,
+  visible: c,
+  position: o,
+  size: i,
+  direction: p,
+  className: g,
+  dataTestId: h
+}) => {
+  if (!c || !t)
+    return null;
+  const b = {
+    position: "fixed",
+    top: `${o.top}px`,
+    width: `${i.width}px`,
+    height: `${i.height}px`
+  };
+  return o.left !== void 0 && (b.left = `${o.left}px`), o.right !== void 0 && (b.right = `${o.right}px`), qt(
+    /* @__PURE__ */ d(
+      "div",
+      {
+        className: hn("gradient-overlay", `direction-${p}`, g),
+        style: b,
+        "data-gradient-type": h
+      }
+    ),
+    t
+  );
+}, u = Te.bind(Rt), rt = ({ column: t }) => {
+  const c = P(null), [o, i] = q(!1);
+  return B(() => {
+    if (c.current) {
+      const p = c.current.offsetWidth, g = c.current.scrollWidth;
+      i(g > p);
+    }
+  }, [t.header]), /* @__PURE__ */ d("span", { ref: c, title: o ? t.header : void 0, children: t.header });
+}, kn = ({
+  data: t,
+  primaryColumn: c,
+  fixedColumns: o,
+  renderRowActions: i,
+  className: p = "",
+  wrapperClassName: g = "",
+  rowClassName: h = "",
+  headerClassName: b = "",
+  bodyClassName: a = "",
+  selectable: s = !1,
+  selectedRowIds: l = [],
+  sortingDirection: v = ct,
+  sortingColumn: y,
+  sortableColumns: T,
+  isHeaderFixed: W = !1,
+  isHorizontallyScrollable: _ = !1,
+  pinnedColumnKeys: L = [],
+  isRowsExpandable: k = !1,
+  expandedRowIds: M = [],
+  isAllExpandedByDefault: z,
+  expandAllTooltip: S,
+  isResizable: A = !1,
+  minColumnWidth: V = 50,
+  maxColumnWidth: ne = 500,
+  isSelectAllCheckboxAlwaysVisible: O = !1,
+  isCheckboxOutside: N = !1,
+  disabledRowIds: he,
+  onChangeSorting: lt = () => {
+  },
+  onToggleRowSelection: at = () => {
+  },
+  onToggleAllRowsSelection: ht = () => {
+  },
+  onToggleRowExpansion: dt = () => {
+  },
+  onToggleAllRowsExpansion: pt = () => {
+  },
+  onColumnResize: ft = () => {
+  },
+  getRowCheckboxTooltip: de = () => {
+  },
+  externalScrollContainerRef: w,
+  portalContainer: pe = typeof document < "u" ? document.body : null,
+  rightGradientClassName: ut,
+  pinnedGradientClassName: gt
+}) => {
+  const J = Z(
+    () => Array.isArray(c) ? c : [c],
+    [c]
+  ), D = y ?? J[0], re = T ?? Qt([...J, ...o]), { pinnedColumns: F, scrollableColumns: Q } = Ct({
+    primaryColumns: J,
+    fixedColumns: o,
+    pinnedColumnKeys: L
+  }), {
+    hoveredColumn: xe,
+    hoveredRow: Ne,
+    handleColumnMouseEnter: ze,
+    handleColumnMouseLeave: Ae,
+    handleRowMouseEnter: Me,
+    handleRowMouseLeave: $e
+  } = Ot(), { columnWidthsRef: K, setCellRef: We } = en(), bt = Z(() => {
+    const e = {};
+    return J.forEach((r) => {
+      "width" in r && typeof r.width == "number" && (e[r.key] = r.width);
+    }), o.forEach((r) => {
+      "width" in r && typeof r.width == "number" && (e[r.key] = r.width);
+    }), Object.keys(e).length > 0 ? e : void 0;
+  }, [J, o]), { handleToggleRowExpansion: _t, isCellExpanded: He } = Kt({
+    primaryColumns: J,
+    fixedColumns: o,
+    expandedRowIds: M,
+    onToggleRowExpansion: dt
+  }), vt = Z(
+    () => [...F, ...Q],
+    [F, Q]
+  ), { columnWidths: se, handleResize: yt, handleResizeStop: wt, handleResizeStart: mt } = tn({
+    enabled: A,
+    minWidth: V,
+    maxWidth: ne,
+    columns: vt,
+    columnWidthsRef: K,
+    onColumnResize: ft,
+    initialColumnWidths: bt
+  }), { setTableRowRef: kt, setCheckboxRowRef: Et } = sn({
+    enabled: s && N,
+    rowCount: t.length
+  }), Pe = (e, r) => {
+    const n = e.minWidth ?? V, f = e.maxWidth ?? ne;
+    return /* @__PURE__ */ d(
+      St,
+      {
+        width: se[e.key] ?? (typeof e.width == "number" ? e.width : V),
+        height: 0,
+        axis: "x",
+        handle: /* @__PURE__ */ d(ln, {}),
+        onResizeStart: mt,
+        onResize: yt(e.key),
+        onResizeStop: wt(e.key),
+        minConstraints: [n, 0],
+        maxConstraints: [f, 0],
+        className: u("resizable-column"),
+        children: r
+      },
+      e.key
+    );
+  }, x = P(null), j = P(null), Lt = P(null), ee = P(null), fe = P(null), [I, Tt] = q(!1), oe = $((e) => {
+    const r = j.current;
+    if (r && r.contains(e))
+      return;
+    const n = e.parentElement;
+    if (!n)
+      return;
+    const f = window.getComputedStyle(n), m = parseFloat(f.paddingTop) || 0, E = parseFloat(f.paddingBottom) || 0, G = e.offsetHeight + m + E;
+    e.style.setProperty("--expand-cell-top", `${m}px`), e.style.setProperty("--expand-cell-height", `${G}px`);
+  }, []), [Be, ue] = q(0), [Se, ge] = q(0), [Ge, be] = q(0), [Fe, qe] = q(0), ce = P(!1), _e = P(/* @__PURE__ */ new Set()), te = P(null), ve = nn(
+    x.current,
+    j.current,
+    (w == null ? void 0 : w.current) instanceof HTMLElement ? w.current : null,
+    I,
+    Be,
+    Se,
+    Ge,
+    Fe
+  ), ye = rn(
+    x.current,
+    Be,
+    j.current,
+    (w == null ? void 0 : w.current) instanceof HTMLElement ? w.current : null,
+    I,
+    Se,
+    Ge,
+    Fe
+  ), De = (e) => {
+    re.includes(e) && lt({ key: e, direction: v });
+  }, xt = (e) => {
+    at(e);
+  }, Ue = () => {
+    ht();
+  }, Nt = () => {
+    pt();
+  }, je = (e) => re.includes(e) ? (D == null ? void 0 : D.key) === e ? Jt(v) ? /* @__PURE__ */ d(Ce, {}) : /* @__PURE__ */ d(Ft, {}) : /* @__PURE__ */ d(Ce, {}) : null, we = (e) => (he == null ? void 0 : he.includes(e)) ?? !1, Xe = t.every(
+    (e) => we(e.id) || l.includes(e.id)
+  ), Ve = t.some(
+    (e) => !we(e.id) && l.includes(e.id)
+  ), me = (l == null ? void 0 : l.length) > 0, zt = !Dt(t), Ie = O && zt || me, At = t.every((e) => M.includes(e.id)), Mt = z !== void 0 ? z : At, $t = tt(
+    F,
+    Q,
+    k,
+    s,
+    !!i,
+    !1,
+    A ? se : void 0,
+    A,
+    N
+  ), Wt = tt(
+    F,
+    Q,
+    k,
+    s,
+    !!i,
+    !0,
+    A ? se : void 0,
+    A,
+    N
+  ), Re = /* @__PURE__ */ d("button", { onClick: Nt, "aria-label": "Toggle all rows expansion", children: /* @__PURE__ */ d("span", { className: u("expand-icon", { expanded: Mt }), children: /* @__PURE__ */ d(Oe, {}) }) });
+  B(() => {
+    if (!(w != null && w.current) || !x.current || !j.current)
+      return;
+    const e = w.current, r = x.current, n = j.current, f = fe.current, m = () => {
+      const H = r.getBoundingClientRect(), G = e.getBoundingClientRect(), R = n.offsetHeight, X = H.top - G.top, ie = H.bottom - G.top, Qe = e.scrollTop > 0 && X <= 0 && ie > R;
+      if (Tt(Qe), Qe) {
+        const le = H.left, Ze = G.top;
+        n.classList.add(u("pinned-header")), _ && (n.style.overflow = "hidden", n.style.overflowX = "hidden"), n.style.left = `${le}px`, n.style.top = `${Ze}px`, n.style.width = `${H.width}px`, f && N && (f.style.top = `${Ze}px`);
+      } else {
+        const le = r.scrollLeft;
+        ce.current = !0, n.classList.remove(u("pinned-header")), _ && (n.scrollLeft = 0), n.style.left = "", n.style.top = "", n.style.width = "", _ && (n.style.overflow = "", n.style.overflowX = ""), f && N && (f.style.top = "", f.classList.remove(u("pinned-header"))), _ && le > 0 ? requestAnimationFrame(() => {
+          r.scrollLeft = le, setTimeout(() => {
+            ce.current = !1;
+          }, 0);
+        }) : ce.current = !1;
+      }
+    }, E = requestAnimationFrame(() => {
+      m();
+    });
+    return e.addEventListener("scroll", m), window.addEventListener("resize", m), () => {
+      cancelAnimationFrame(E), e.removeEventListener("scroll", m), window.removeEventListener("resize", m);
+    };
+  }, [w, _, N]), B(() => {
+    if (!(w != null && w.current) || !x.current || !j.current || !I)
+      return;
+    const e = w.current, r = x.current, n = j.current, f = fe.current, m = () => {
+      const X = r.getBoundingClientRect(), ie = e.getBoundingClientRect();
+      n.style.left = `${X.left}px`, n.style.top = `${ie.top}px`, n.style.width = `${X.width}px`, f && N && (f.style.top = `${ie.top}px`);
+    }, E = (X) => {
+      ce.current || (X === n ? r.scrollLeft = n.scrollLeft : n.scrollLeft = r.scrollLeft, te.current && te.current());
+    }, H = () => {
+      E(r), m();
+    }, G = () => {
+      E(n);
+    }, R = () => {
+      m();
+    };
+    return r.addEventListener("scroll", H), _ && n.addEventListener("scroll", G), e.addEventListener("scroll", R), window.addEventListener("resize", m), E(r), m(), () => {
+      r.removeEventListener("scroll", H), _ && n.removeEventListener("scroll", G), e.removeEventListener("scroll", R), window.removeEventListener("resize", m);
+    };
+  }, [I, w, _, N]), B(() => {
+    if (!x.current || !_)
+      return;
+    const e = x.current, r = w == null ? void 0 : w.current;
+    ue(e.scrollLeft), ge((r == null ? void 0 : r.scrollTop) || e.scrollTop || 0), be(e.scrollWidth);
+    const n = () => {
+      e && (ue(e.scrollLeft), ge((r == null ? void 0 : r.scrollTop) || e.scrollTop || 0), be(e.scrollWidth));
+    };
+    let f = null;
+    const m = () => {
+      f === null && (f = requestAnimationFrame(() => {
+        n(), f = null;
+      }));
+    }, E = () => {
+      m();
+    }, H = () => {
+      m();
+    };
+    e.addEventListener("scroll", E, { passive: !0 }), r && r.addEventListener("scroll", H, {
+      passive: !0
+    });
+    const G = () => {
+      n(), qe((X) => X + 1);
+    };
+    window.addEventListener("resize", G), te.current = n, n();
+    const R = new ResizeObserver(() => {
+      n();
+    });
+    return e && R.observe(e), () => {
+      e.removeEventListener("scroll", E), r && r.removeEventListener("scroll", H), window.removeEventListener("resize", G), R.disconnect(), f !== null && (cancelAnimationFrame(f), f = null);
+    };
+  }, [_, w, I, M]), B(() => {
+    if (!x.current || !_)
+      return;
+    const e = x.current, r = w == null ? void 0 : w.current;
+    requestAnimationFrame(() => {
+      e && (ue(e.scrollLeft), ge((r == null ? void 0 : r.scrollTop) || e.scrollTop || 0), be(e.scrollWidth), te.current && te.current());
+    });
+  }, [se, _, w]), B(() => {
+    if (!x.current)
+      return;
+    const e = x.current, r = () => {
+      Array.from(e.querySelectorAll('[data-base-left="0"]')).forEach(oe);
+    };
+    requestAnimationFrame(() => {
+      r();
+    });
+  }, [k, t, oe]), B(() => {
+    if (!x.current)
+      return;
+    const e = x.current, r = new Set(M), n = _e.current, f = /* @__PURE__ */ new Set();
+    if (M.forEach((E) => {
+      n.has(E) || f.add(E);
+    }), n.forEach((E) => {
+      r.has(E) || f.add(E);
+    }), f.size === 0) {
+      _e.current = r;
+      return;
+    }
+    const m = setTimeout(() => {
+      f.forEach((E) => {
+        const H = e.querySelector(
+          `[data-base-left="0"][data-row-id="${E}"]`
+        );
+        H && oe(H);
+      }), qe((E) => E + 1);
+    }, 0);
+    return _e.current = r, () => clearTimeout(m);
+  }, [k, M, oe]), B(() => {
+    if (!ee.current || !x.current || !N)
+      return;
+    const e = ee.current, r = x.current, n = () => {
+      requestAnimationFrame(() => {
+        e.scrollTop = r.scrollTop;
+      });
+    };
+    return r.addEventListener("scroll", n), () => {
+      r.removeEventListener("scroll", n);
+    };
+  }, [t, N]), st(() => {
+    if (!x.current || !ee.current)
+      return;
+    const e = x.current, r = ee.current, n = () => {
+      const m = `${e.clientHeight}px`;
+      r.style.height !== m && (r.style.height = m);
+    };
+    n();
+    const f = new ResizeObserver(() => {
+      requestAnimationFrame(n);
+    });
+    return f.observe(e), () => f.disconnect();
+  }, []);
+  const Ye = (e) => {
+    const r = we(e.id), n = de == null ? void 0 : de(e.id), f = /* @__PURE__ */ d(
+      ke,
+      {
+        value: l.includes(e.id),
+        disabled: r,
+        onChange: () => xt(e.id),
+        className: u("checkbox-cell")
+      }
+    );
+    return n ? /* @__PURE__ */ d(
+      Ke,
+      {
+        content: n,
+        placement: "top",
+        wrapperClassName: u("checkbox-tooltip-wrapper"),
+        portalRoot: pe ?? void 0,
+        children: f
+      }
+    ) : f;
+  }, Ht = () => /* @__PURE__ */ U("div", { className: u("checkbox-column"), ref: ee, children: [
+    /* @__PURE__ */ d(
+      "div",
+      {
+        ref: fe,
+        className: u(
+          "table-header",
+          "checkbox-header",
+          { "pinned-header": I },
+          b
+        ),
+        children: Ie && /* @__PURE__ */ d(
+          ke,
+          {
+            value: Xe,
+            partiallyChecked: Ve,
+            onChange: Ue,
+            className: u("checkbox-cell")
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ d("div", { className: u("checkbox-body", a), children: t.map((e, r) => /* @__PURE__ */ d(
+      "div",
+      {
+        ref: Et(e.id),
+        className: u("checkbox-row", "table-row", et(e), h),
+        onMouseEnter: () => Me(r),
+        onMouseLeave: $e,
+        children: (me || Ne === r) && Ye(e)
+      },
+      e.id
+    )) })
+  ] }), Je = () => /* @__PURE__ */ U(
+    "div",
+    {
+      ref: x,
+      className: u(
+        "table",
+        {
+          "fixed-header": W,
+          "horizontally-scrollable-container": W && (_ || A),
+          "external-scroll-container": W && !!w
+        },
+        p
+      ),
+      children: [
+        /* @__PURE__ */ U(
+          "div",
+          {
+            ref: j,
+            className: u(
+              "table-header",
+              {
+                "sticky-header": W && !I,
+                "horizontally-scrollable": _,
+                resizable: A
+              },
+              b
+            ),
+            style: { gridTemplateColumns: Wt },
+            children: [
+              s && !N && /* @__PURE__ */ d(
+                "div",
+                {
+                  className: u("table-header-cell", "checkbox-cell"),
+                  "data-base-left": k ? C : 0,
+                  children: Ie && /* @__PURE__ */ d(
+                    ke,
+                    {
+                      value: Xe,
+                      partiallyChecked: Ve,
+                      onChange: Ue,
+                      className: u("checkbox-cell")
+                    }
+                  )
+                }
+              ),
+              k && /* @__PURE__ */ d(
+                "div",
+                {
+                  className: u("table-header-cell", "expand-cell", "left-border-accent"),
+                  "data-base-left": "0",
+                  children: S ? /* @__PURE__ */ d(
+                    Ke,
+                    {
+                      content: S,
+                      placement: "top",
+                      wrapperClassName: u("expand-all-tooltip-wrapper"),
+                      contentClassName: u("expand-all-tooltip-content"),
+                      children: Re
+                    }
+                  ) : Re
+                }
+              ),
+              F.map((e, r) => {
+                const n = /* @__PURE__ */ d(
+                  "button",
+                  {
+                    "data-column-key": e.key,
+                    "data-pinned-index": r,
+                    className: u("table-header-cell", "pinned-column", {
+                      [`align-${e.align}`]: "align" in e,
+                      "primary-cell": Y(e),
+                      "sortable-cell": re.includes(e.key),
+                      resizable: A
+                    }),
+                    style: ae(
+                      e,
+                      !0,
+                      r,
+                      F,
+                      K,
+                      k,
+                      s,
+                      N
+                    ),
+                    children: /* @__PURE__ */ U(
+                      "div",
+                      {
+                        className: u("label"),
+                        onClick: () => De(e.key),
+                        onMouseEnter: () => ze(e.key),
+                        onMouseLeave: Ae,
+                        children: [
+                          /* @__PURE__ */ d(rt, { column: e }),
+                          (xe === e.key || (D == null ? void 0 : D.key) === e.key) && je(e.key)
+                        ]
+                      }
+                    )
+                  },
+                  e.key
+                );
+                return A ? Pe(e, n) : n;
+              }),
+              Q.map((e) => {
+                const r = /* @__PURE__ */ d(
+                  "button",
+                  {
+                    className: u("table-header-cell", {
+                      [`align-${e.align}`]: "align" in e,
+                      "primary-cell": Y(e),
+                      "sortable-cell": re.includes(e.key),
+                      resizable: A
+                    }),
+                    style: ae(
+                      e,
+                      !1,
+                      void 0,
+                      F,
+                      K,
+                      k,
+                      s,
+                      N
+                    ),
+                    children: /* @__PURE__ */ U(
+                      "div",
+                      {
+                        className: u("label"),
+                        onClick: () => De(e.key),
+                        onMouseEnter: () => ze(e.key),
+                        onMouseLeave: Ae,
+                        children: [
+                          /* @__PURE__ */ d(rt, { column: e }),
+                          (xe === e.key || (D == null ? void 0 : D.key) === e.key) && je(e.key)
+                        ]
+                      }
+                    )
+                  },
+                  e.key
+                );
+                return A ? Pe(e, r) : r;
+              }),
+              i && /* @__PURE__ */ d("div", { className: u("table-header-cell", "action-menu-cell") })
+            ]
+          }
+        ),
+        /* @__PURE__ */ d(
+          "div",
+          {
+            ref: Lt,
+            className: u(
+              "table-body",
+              {
+                "scrollable-body": W,
+                "horizontally-scrollable": _,
+                resizable: A
+              },
+              a
+            ),
+            children: t.map((e, r) => /* @__PURE__ */ U(
+              "div",
+              {
+                "data-row-index": r,
+                "data-row-id": e.id,
+                ref: kt(e.id),
+                className: u("table-row", et(e), h, {
+                  selectable: s && !N
+                }),
+                onMouseEnter: () => Me(r),
+                onMouseLeave: $e,
+                children: [
+                  s && !N && /* @__PURE__ */ d(
+                    "div",
+                    {
+                      className: u("table-cell", "checkbox-cell"),
+                      "data-base-left": k ? C : 0,
+                      children: (me || Ne === r) && Ye(e)
+                    }
+                  ),
+                  /* @__PURE__ */ d("div", { className: u("row-content-wrapper"), children: /* @__PURE__ */ U("div", { className: u("table-row-content"), style: { gridTemplateColumns: $t }, children: [
+                    k && /* @__PURE__ */ d(
+                      "div",
+                      {
+                        className: u("table-cell", "expand-cell", "left-border-accent"),
+                        "data-base-left": "0",
+                        "data-row-id": e.id,
+                        children: /* @__PURE__ */ d(
+                          "button",
+                          {
+                            onClick: () => _t(e.id),
+                            "aria-label": M.includes(e.id) ? "Collapse row" : "Expand row",
+                            "aria-expanded": M.includes(e.id),
+                            children: /* @__PURE__ */ d(
+                              "span",
+                              {
+                                className: u("expand-icon", {
+                                  expanded: M.includes(e.id)
+                                }),
+                                children: /* @__PURE__ */ d(Oe, {})
+                              }
+                            )
+                          }
+                        )
+                      }
+                    ),
+                    F.map((n, f) => {
+                      const m = He(e.id, n.key), E = Y(n);
+                      return /* @__PURE__ */ d(
+                        "div",
+                        {
+                          "data-column-key": n.key,
+                          "data-pinned-index": f,
+                          ref: E ? We(n.key) : void 0,
+                          className: u("table-cell", "pinned-column", {
+                            "primary-cell": E,
+                            "expanded-cell": m
+                          }),
+                          style: ae(
+                            n,
+                            !0,
+                            f,
+                            F,
+                            K,
+                            k,
+                            s,
+                            N
+                          ),
+                          children: e[n.key].component || e[n.key].content || e[n.key]
+                        },
+                        n.key
+                      );
+                    }),
+                    Q.map((n) => {
+                      const f = He(e.id, n.key), m = Y(n);
+                      return /* @__PURE__ */ d(
+                        "div",
+                        {
+                          ref: m ? We(n.key) : void 0,
+                          className: u("table-cell", {
+                            "primary-cell": m,
+                            "expanded-cell": f
+                          }),
+                          style: ae(
+                            n,
+                            !1,
+                            void 0,
+                            F,
+                            K,
+                            k,
+                            s,
+                            N
+                          ),
+                          children: e[n.key].component || e[n.key].content || e[n.key]
+                        },
+                        n.key
+                      );
+                    }),
+                    i && /* @__PURE__ */ d("div", { className: u("table-cell", "action-menu-cell"), children: i(e.metaData) })
+                  ] }) })
+                ]
+              },
+              e.id
+            ))
+          }
+        ),
+        _ && /* @__PURE__ */ U(Pt, { children: [
+          /* @__PURE__ */ d(
+            nt,
+            {
+              portalContainer: pe,
+              visible: ve.visible,
+              position: ve.position,
+              size: ve.size,
+              direction: "right",
+              className: ut,
+              dataTestId: "right-gradient"
+            }
+          ),
+          /* @__PURE__ */ d(
+            nt,
+            {
+              portalContainer: pe,
+              visible: ye.visible,
+              position: ye.position,
+              size: ye.size,
+              direction: "left",
+              className: gt,
+              dataTestId: "pinned-gradient"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+  return N ? /* @__PURE__ */ U("div", { className: u("table-wrapper", { "fixed-header": W }, g), children: [
+    Ht(),
+    Je()
+  ] }) : Je();
+};
+export {
+  kn as T
+};