@tedi-design-system/react 18.0.0-rc.1 → 18.0.0-rc.11

package/src/tedi/components/content/table/table.es.js

@@ -0,0 +1,856 @@
+import { jsx as i, jsxs as re } from "react/jsx-runtime";
+import { useReactTable as mn, flexRender as xe } from "../../../../../external/@tanstack/react-table/build/lib/index.es.js";
+import k from "../../../../../external/classnames/index.es.js";
+import { useRef as H, useId as fn, useMemo as w, useCallback as N, useState as K, useEffect as ft, Fragment as bn } from "react";
+import { Icon as ht } from "../../base/icon/icon.es.js";
+import { Collapse as hn } from "../../buttons/collapse/collapse.es.js";
+import { Checkbox as bt } from "../../form/checkbox/checkbox.es.js";
+import { Radio as wn } from "../../form/radio/radio.es.js";
+import { TextField as _n } from "../../form/textfield/textfield.es.js";
+import l from "./table.module.scss.es.js";
+import { TableColumnsMenu as Cn } from "./table-columns-menu/table-columns-menu.es.js";
+import { TableContext as vn } from "./table-context.es.js";
+import { TableHeaderButton as xn } from "./table-header-button/table-header-button.es.js";
+import { TableToolbar as Sn } from "./table-toolbar/table-toolbar.es.js";
+import { useTablePersistence as Dn } from "./use-table-persistence.es.js";
+import { Pagination as Rn } from "../../navigation/pagination/pagination.es.js";
+import { useLabels as yn } from "../../../providers/label-provider/use-labels.es.js";
+import { getCoreRowModel as In, getFilteredRowModel as kn, getSortedRowModel as En, getExpandedRowModel as Tn, getPaginationRowModel as Nn } from "../../../../../external/@tanstack/table-core/build/lib/index.es.js";
+const eo = (R, E) => (V) => {
+  const x = V.index;
+  if (x < 0 || x >= R.length) return 1;
+  const O = E(R[x]);
+  if (x > 0 && E(R[x - 1]) === O) return 0;
+  let T = 1;
+  for (let A = x + 1; A < R.length && E(R[A]) === O; A++)
+    T++;
+  return T;
+}, wt = "data-tedi-drag-handle", On = ({
+  label: R,
+  onHandlePointerDown: E,
+  id: V,
+  pickedUp: x,
+  onKeyDown: O
+}) => /* @__PURE__ */ i(
+  "button",
+  {
+    type: "button",
+    id: V,
+    className: k(l["tedi-table__drag-handle"], {
+      [l["tedi-table__drag-handle--picked-up"]]: x
+    }),
+    "aria-label": R,
+    "aria-pressed": x,
+    onClick: (T) => T.stopPropagation(),
+    onMouseDown: E,
+    onTouchStart: E,
+    onKeyDown: O,
+    [wt]: "",
+    children: /* @__PURE__ */ i(ht, { name: "drag_indicator", size: 18, color: "inherit" })
+  }
+), $n = (R) => {
+  const {
+    row: E,
+    rowClassName: V,
+    rowStyle: x,
+    isActiveRow: O,
+    clickable: T,
+    onClick: A,
+    onKeyDownHandler: De,
+    ariaRowIndex: Re,
+    columnProps: ne,
+    draggable: se,
+    dragHandleLabel: ce,
+    dragHandlers: u,
+    dragHandleId: ye,
+    dragHandlePickedUp: Ie,
+    dragOverColumnId: ue
+  } = R;
+  return /* @__PURE__ */ i(
+    "tr",
+    {
+      className: V,
+      style: x,
+      draggable: se || void 0,
+      onDragStart: u == null ? void 0 : u.onDragStart,
+      onDragOver: u == null ? void 0 : u.onDragOver,
+      onDragLeave: u == null ? void 0 : u.onDragLeave,
+      onDragEnd: u == null ? void 0 : u.onDragEnd,
+      onDrop: u == null ? void 0 : u.onDrop,
+      onClick: T && A ? () => A(E) : void 0,
+      onKeyDown: T ? De : void 0,
+      tabIndex: T ? 0 : void 0,
+      role: T ? "button" : void 0,
+      "aria-rowindex": Re,
+      "aria-current": O ? "true" : void 0,
+      children: E.getVisibleCells().map(($) => {
+        var ge;
+        const g = $.column.columnDef.meta, F = ne == null ? void 0 : ne($.column.id), oe = se && $.column.id === Se, z = !!ue && $.column.id === ue, G = (ge = g == null ? void 0 : g.rowSpan) == null ? void 0 : ge.call(g, $.row);
+        return G === 0 ? null : /* @__PURE__ */ i(
+          "td",
+          {
+            rowSpan: G && G > 1 ? G : void 0,
+            className: k(
+              l["tedi-table__cell"],
+              {
+                [l[`tedi-table__cell--align-${g == null ? void 0 : g.align}`]]: g == null ? void 0 : g.align,
+                [l[`tedi-table__cell--valign-${g == null ? void 0 : g.vAlign}`]]: g == null ? void 0 : g.vAlign,
+                [l["tedi-table__cell--drag-handle"]]: oe,
+                [l["tedi-table__cell--drag-over"]]: z
+              },
+              F == null ? void 0 : F.className
+            ),
+            style: F == null ? void 0 : F.style,
+            children: oe ? /* @__PURE__ */ i(
+              On,
+              {
+                label: ce,
+                onHandlePointerDown: (u == null ? void 0 : u.onHandlePointerDown) ?? (() => {
+                }),
+                onKeyDown: u == null ? void 0 : u.onKeyDown,
+                id: ye,
+                pickedUp: Ie
+              }
+            ) : xe($.column.columnDef.cell, $.getContext())
+          },
+          $.id
+        );
+      })
+    }
+  );
+}, Ve = "__select__", Ge = "__expand__", Se = "__drag__", de = () => !0, Ln = {
+  text: de,
+  select: de,
+  "multi-select": de,
+  "date-range": de,
+  "date-range-period": de
+};
+function Pn(R) {
+  return Array.isArray(R.columns);
+}
+function _t(R) {
+  const {
+    id: E,
+    data: V,
+    columns: x,
+    size: O = "medium",
+    caption: T,
+    state: A,
+    defaultState: De,
+    onStateChange: Re,
+    persist: ne,
+    emptyState: se,
+    emptyStateRole: ce,
+    className: u,
+    children: ye,
+    striped: Ie = !1,
+    verticalBorders: ue = !1,
+    borderless: $ = !1,
+    stickyFirstColumn: g = !1,
+    stickyHeader: F = !1,
+    maxHeight: oe,
+    onRowClick: z,
+    activeRowId: G,
+    rowHover: ge,
+    enableRowSelection: Me,
+    selectionMode: ke = "multiple",
+    highlightSelectedRows: Ct = !0,
+    enableColumnFilters: Ee = !1,
+    renderSubComponent: pe,
+    getRowCanExpand: je,
+    getSubRows: We,
+    getRowId: vt,
+    expandTrigger: Te = "button",
+    paginateExpandedRows: xt = !1,
+    pagination: M,
+    autoResetPageIndex: St = !0,
+    manualPagination: W = !1,
+    manualSorting: Ne = !1,
+    manualFiltering: Oe = !1,
+    pageCount: Xe,
+    rowCount: me,
+    checkboxProps: $e,
+    radioProps: Ye,
+    collapseProps: qe,
+    rowProps: Le,
+    columnProps: j,
+    reorderableRows: S = !1,
+    onRowDrop: L,
+    reorderableColumns: X = !1
+  } = R, { getLabel: b } = yn(), Je = se ?? b("table.no-data"), Y = H(b);
+  Y.current = b;
+  const Dt = fn(), p = E ?? Dt, h = w(() => M ? M === !0 ? { pageSize: 10, pageSizeOptions: [10, 25, 50], paginationProps: void 0 } : {
+    pageSize: M.pageSize ?? 10,
+    pageSizeOptions: M.pageSizeOptions === void 0 ? [10, 25, 50] : M.pageSizeOptions,
+    paginationProps: M.paginationProps
+  } : null, [M]), y = h !== null, Rt = w(() => {
+    const e = h == null ? void 0 : h.pageSizeOptions;
+    return Array.isArray(e) && e.length > 0 ? e : void 0;
+  }, [h]), [P, D] = Dn({
+    persist: ne,
+    controlled: A,
+    defaultState: De,
+    onStateChange: Re
+  }), yt = N(
+    (e) => {
+      D((n) => {
+        const t = n.columnVisibility ?? {};
+        return { columnVisibility: typeof e == "function" ? e(t) : e };
+      });
+    },
+    [D]
+  ), It = N(
+    (e) => {
+      D((n) => {
+        const t = n.rowSelection ?? {};
+        return { rowSelection: typeof e == "function" ? e(t) : e };
+      });
+    },
+    [D]
+  ), kt = N(
+    (e) => {
+      D((n) => {
+        const t = n.expanded ?? {};
+        return { expanded: typeof e == "function" ? e(t) : e };
+      });
+    },
+    [D]
+  ), Et = N(
+    (e) => {
+      D((n) => {
+        const t = n.columnFilters ?? [];
+        return { columnFilters: typeof e == "function" ? e(t) : e };
+      });
+    },
+    [D]
+  ), Tt = N(
+    (e) => {
+      D((n) => {
+        const t = n.columnOrder ?? [];
+        return { columnOrder: typeof e == "function" ? e(t) : e };
+      });
+    },
+    [D]
+  ), Nt = N(
+    (e) => {
+      D((n) => {
+        const t = n.sorting ?? [];
+        return { sorting: typeof e == "function" ? e(t) : e };
+      });
+    },
+    [D]
+  ), Ot = N(
+    (e) => {
+      D((n) => {
+        const t = n.pagination ?? {
+          pageIndex: 0,
+          pageSize: (h == null ? void 0 : h.pageSize) ?? 10
+        };
+        return { pagination: typeof e == "function" ? e(t) : e };
+      });
+    },
+    [D, h]
+  ), le = !!(pe || We), Qe = !!Me, $t = w(() => In(), []), Lt = w(() => Oe ? void 0 : kn(), [Oe]), Pt = w(() => Ne ? void 0 : En(), [Ne]), At = w(() => le ? Tn() : void 0, [le]), Ft = w(
+    () => y && !W ? Nn() : void 0,
+    [y, W]
+  ), zt = w(() => {
+    const e = [];
+    if (S && e.push({
+      id: Se,
+      enableSorting: !1,
+      enableHiding: !1,
+      enableColumnFilter: !1,
+      size: 40,
+      header: "",
+      cell: () => null
+    }), Qe) {
+      const n = ke === "single", t = `${p}-select`;
+      e.push({
+        id: Ve,
+        enableSorting: !1,
+        enableHiding: !1,
+        enableColumnFilter: !1,
+        size: 40,
+        header: n ? "" : ({ table: o }) => /* @__PURE__ */ i(
+          bt,
+          {
+            ...$e,
+            id: `${p}-select-all`,
+            name: `${p}-select-all`,
+            label: Y.current("table.select-all", o.getIsAllPageRowsSelected()),
+            hideLabel: !0,
+            value: "all",
+            checked: o.getIsAllPageRowsSelected(),
+            indeterminate: o.getIsSomePageRowsSelected() && !o.getIsAllPageRowsSelected(),
+            onChange: (a, r) => o.toggleAllPageRowsSelected(r)
+          }
+        ),
+        cell: ({ row: o }) => n ? /* @__PURE__ */ i(
+          wn,
+          {
+            ...Ye,
+            id: `${p}-select-${o.id}`,
+            name: t,
+            label: Y.current("table.select-row", o.getIsSelected()),
+            hideLabel: !0,
+            value: o.id,
+            checked: o.getIsSelected(),
+            disabled: !o.getCanSelect(),
+            onChange: (a, r) => {
+              r && o.toggleSelected(!0);
+            }
+          }
+        ) : /* @__PURE__ */ i(
+          bt,
+          {
+            ...$e,
+            id: `${p}-select-${o.id}`,
+            name: `${p}-select-${o.id}`,
+            label: Y.current("table.select-row", o.getIsSelected()),
+            hideLabel: !0,
+            value: o.id,
+            checked: o.getIsSelected(),
+            disabled: !o.getCanSelect(),
+            indeterminate: o.getIsSomeSelected(),
+            onChange: (a, r) => o.toggleSelected(r)
+          }
+        )
+      });
+    }
+    return le && e.push({
+      id: Ge,
+      enableSorting: !1,
+      enableHiding: !1,
+      enableColumnFilter: !1,
+      size: 40,
+      header: "",
+      cell: ({ row: n }) => {
+        if (!n.getCanExpand()) return null;
+        const t = `${p}-sub-${n.id}`;
+        return /* @__PURE__ */ i(
+          "span",
+          {
+            onClick: (o) => o.stopPropagation(),
+            onKeyDown: (o) => {
+              (o.key === "Enter" || o.key === " ") && o.stopPropagation();
+            },
+            children: /* @__PURE__ */ i(
+              hn,
+              {
+                iconOnly: !0,
+                arrowType: Te === "row" ? "default" : "secondary",
+                hideCollapseText: !0,
+                ...qe,
+                id: `${p}-expand-${n.id}`,
+                controlsId: t,
+                openText: Y.current("table.expand-row"),
+                closeText: Y.current("table.collapse-row"),
+                open: n.getIsExpanded(),
+                onToggle: () => n.toggleExpanded(),
+                children: null
+              }
+            )
+          }
+        );
+      }
+    }), [...e, ...x];
+  }, [
+    x,
+    Qe,
+    ke,
+    le,
+    Te,
+    S,
+    p,
+    $e,
+    Ye,
+    qe
+  ]), Bt = w(() => ({}), []), Ut = w(() => ({}), []), Ht = w(() => [], []), Kt = w(() => [], []), Vt = w(() => [], []), Gt = w(
+    () => ({ pageIndex: 0, pageSize: (h == null ? void 0 : h.pageSize) ?? 10 }),
+    [h]
+  ), s = mn({
+    data: V,
+    columns: zt,
+    state: {
+      columnVisibility: P.columnVisibility,
+      columnOrder: P.columnOrder ?? Kt,
+      rowSelection: P.rowSelection ?? Bt,
+      expanded: P.expanded ?? Ut,
+      columnFilters: P.columnFilters ?? Ht,
+      sorting: P.sorting ?? Vt,
+      pagination: y ? P.pagination ?? Gt : void 0
+    },
+    enableRowSelection: Me,
+    enableMultiRowSelection: ke !== "single",
+    enableColumnFilters: Ee,
+    autoResetPageIndex: St,
+    paginateExpandedRows: y && !W ? xt : !0,
+    manualPagination: W,
+    manualSorting: Ne,
+    manualFiltering: Oe,
+    // `pageCount` only matters in manual mode; TanStack ignores it otherwise.
+    pageCount: W && Xe !== void 0 ? Xe : void 0,
+    rowCount: W && me !== void 0 ? me : void 0,
+    getRowCanExpand: pe ? je ?? (() => !0) : je,
+    getSubRows: We,
+    getRowId: vt,
+    onColumnVisibilityChange: yt,
+    onColumnOrderChange: Tt,
+    onRowSelectionChange: It,
+    onExpandedChange: kt,
+    onColumnFiltersChange: Et,
+    onSortingChange: Nt,
+    onPaginationChange: y ? Ot : void 0,
+    filterFns: Ln,
+    getCoreRowModel: $t,
+    getFilteredRowModel: Lt,
+    getExpandedRowModel: At,
+    getSortedRowModel: Pt,
+    getPaginationRowModel: Ft
+  }), Mt = w(
+    () => ({ table: s, size: O, id: p, state: P }),
+    [s, O, p, P]
+  ), jt = N((e) => s.setPageIndex(e - 1), [s]), Wt = N((e) => s.setPageSize(e), [s]), Xt = s.getHeaderGroups().length > 1, fe = Te === "row" && le, Yt = ge ?? (!!z || fe), qt = k(
+    l["tedi-table"],
+    l[`tedi-table--${O}`],
+    {
+      [l["tedi-table--striped"]]: Ie,
+      [l["tedi-table--vertical-borders"]]: ue,
+      [l["tedi-table--borderless"]]: $,
+      [l["tedi-table--sticky-first-column"]]: g,
+      [l["tedi-table--sticky-header"]]: F,
+      [l["tedi-table--clickable-rows"]]: !!z || fe,
+      [l["tedi-table--row-hover"]]: Yt,
+      [l["tedi-table--has-pagination"]]: y,
+      [l["tedi-table--grouped-headers"]]: Xt
+    },
+    u
+  ), _ = s.getRowModel().rows, be = s.getHeaderGroups(), Ze = s.getFooterGroups(), et = s.getVisibleLeafColumns(), he = et.length, Jt = Ze.some(
+    (e) => e.headers.some((n) => n.column.columnDef.footer !== void 0)
+  ), tt = (e) => !!z || fe && e.getCanExpand(), nt = (e) => {
+    fe && e.getCanExpand() && e.toggleExpanded(), z == null || z(e);
+  }, Qt = (e) => (n) => {
+    tt(e) && n.target === n.currentTarget && (n.key === "Enter" || n.key === " ") && (n.preventDefault(), nt(e));
+  }, ot = be.length + (Ee ? 1 : 0), lt = s.getState().pagination, Zt = y ? lt.pageIndex * lt.pageSize : 0, en = y ? me ?? s.getFilteredRowModel().rows.length : _.length, tn = y ? ot + en : void 0, [at, Pe] = K(null), [nn, we] = K(null), q = H(null), J = H(null), [it, Ae] = K(null), [rt, _e] = K(null), Q = H(null), Z = H(null), [dt, Fe] = K(null), Ce = H([]), [st, ze] = K(null), ae = H(-1), [on, B] = K(""), ve = H(null), [ln, ct] = K(0), Be = w(
+    () => S ? new Map(_.map((e) => [e.id, e.index])) : /* @__PURE__ */ new Map(),
+    [S, _]
+  );
+  ft(() => {
+    if (!S && !X) return;
+    const e = () => {
+      J.current = null, Z.current = null;
+    };
+    return window.addEventListener("mouseup", e), window.addEventListener("touchend", e), () => {
+      window.removeEventListener("mouseup", e), window.removeEventListener("touchend", e);
+    };
+  }, [S, X]);
+  const an = N(
+    (e) => ({
+      onHandlePointerDown: () => {
+        J.current = e;
+      },
+      onDragStart: (n) => {
+        if (J.current !== e) {
+          n.preventDefault();
+          return;
+        }
+        J.current = null, n.dataTransfer.effectAllowed = "move";
+        try {
+          n.dataTransfer.setData("text/plain", e);
+        } catch {
+        }
+        const t = n.currentTarget, o = t.closest("table");
+        if (o) {
+          const a = t.getBoundingClientRect(), r = Array.from(t.children), c = document.createElement("div");
+          c.style.cssText = `position:fixed;top:-10000px;left:0;width:${a.width}px;pointer-events:none;`;
+          const f = document.createElement("table");
+          f.className = o.className, f.style.cssText = `width:${a.width}px;table-layout:fixed;border-collapse:collapse;`;
+          const C = document.createElement("tbody"), v = t.cloneNode(!0);
+          v.classList.add(l["tedi-table__row--drag-preview"]);
+          const d = Array.from(v.children);
+          r.forEach((ee, I) => {
+            const U = d[I];
+            if (!U) return;
+            const ie = ee.getBoundingClientRect();
+            U.style.width = `${ie.width}px`, U.style.minWidth = `${ie.width}px`, U.style.maxWidth = `${ie.width}px`;
+          }), C.appendChild(v), f.appendChild(C), c.appendChild(f), document.body.appendChild(c), n.dataTransfer.setDragImage(c, 24, a.height / 2), window.setTimeout(() => c.remove(), 0);
+        }
+        q.current = e, Pe(e);
+      },
+      onDragOver: (n) => {
+        !q.current || q.current === e || (n.preventDefault(), n.dataTransfer.dropEffect = "move", we(e));
+      },
+      onDragLeave: () => {
+        we((n) => n === e ? null : n);
+      },
+      onDragEnd: () => {
+        q.current = null, J.current = null, Pe(null), we(null);
+      },
+      onDrop: (n) => {
+        n.preventDefault();
+        const t = q.current, o = e;
+        if (q.current = null, J.current = null, Pe(null), we(null), !t || t === o) return;
+        const a = Be.get(t), r = Be.get(o);
+        a === void 0 || r === void 0 || L == null || L({ fromId: t, toId: o, fromIndex: a, toIndex: r });
+      }
+    }),
+    [Be, L]
+  ), ut = (e, n, t) => {
+    const o = e.slice(), [a] = o.splice(n, 1);
+    return o.splice(t, 0, a), o;
+  }, rn = N(
+    (e) => ({
+      onHandlePointerDown: () => {
+        Z.current = e;
+      },
+      onDragStart: (n) => {
+        if (Z.current !== e) {
+          n.preventDefault();
+          return;
+        }
+        Z.current = null, n.dataTransfer.effectAllowed = "move";
+        try {
+          n.dataTransfer.setData("text/plain", e);
+        } catch {
+        }
+        const t = n.currentTarget, o = t.getBoundingClientRect(), a = document.createElement("div");
+        a.style.cssText = `position:fixed;top:-10000px;left:0;width:${o.width}px;pointer-events:none;`;
+        const r = document.createElement("table"), c = t.closest("table");
+        r.className = (c == null ? void 0 : c.className) ?? "", r.style.cssText = `width:${o.width}px;table-layout:fixed;border-collapse:collapse;`;
+        const f = document.createElement("thead"), C = document.createElement("tr");
+        C.className = l["tedi-table__row"];
+        const v = t.cloneNode(!0);
+        v.classList.add(l["tedi-table__header-cell--drag-preview"]), v.style.width = `${o.width}px`, C.appendChild(v), f.appendChild(C), r.appendChild(f), a.appendChild(r), document.body.appendChild(a), n.dataTransfer.setDragImage(a, o.width / 2, o.height / 2), window.setTimeout(() => a.remove(), 0), Q.current = e, Ae(e);
+      },
+      onDragOver: (n) => {
+        !Q.current || Q.current === e || (n.preventDefault(), n.dataTransfer.dropEffect = "move", _e(e));
+      },
+      onDragLeave: () => {
+        _e((n) => n === e ? null : n);
+      },
+      onDragEnd: () => {
+        Q.current = null, Z.current = null, Ae(null), _e(null);
+      },
+      onDrop: (n) => {
+        n.preventDefault();
+        const t = Q.current, o = e;
+        if (Q.current = null, Z.current = null, Ae(null), _e(null), !t || t === o) return;
+        const a = s.getState().columnOrder, r = a.length > 0 ? a : s.getAllLeafColumns().map((C) => C.id), c = r.indexOf(t), f = r.indexOf(o);
+        c < 0 || f < 0 || s.setColumnOrder(ut(r, c, f));
+      }
+    }),
+    [s]
+  ), dn = (e) => `${p}-col-reorder-${e}`, sn = (e) => `${p}-row-reorder-${e}`, gt = () => s.getVisibleLeafColumns().filter((e) => !e.parent && e.id !== Se && e.id !== Ve && e.id !== Ge).map((e) => e.id), Ue = (e) => {
+    const n = s.getColumn(e), t = n == null ? void 0 : n.columnDef.meta;
+    return (t == null ? void 0 : t.label) ?? (typeof (n == null ? void 0 : n.columnDef.header) == "string" ? n.columnDef.header : e);
+  }, pt = (e, n) => {
+    const t = gt(), o = t.indexOf(n);
+    if (o < 0) return;
+    const a = o + e;
+    if (a < 0 || a >= t.length) return;
+    const r = ut(t, o, a), c = s.getState().columnOrder.length > 0 ? [...s.getState().columnOrder] : s.getAllLeafColumns().map((d) => d.id), f = new Set(t);
+    let C = 0;
+    const v = c.map((d) => f.has(d) ? r[C++] : d);
+    for (const d of r) v.includes(d) || v.push(d);
+    s.setColumnOrder(v), B(b("table.reorder.move", Ue(n), a + 1)), ve.current = { kind: "column", id: n }, ct((d) => d + 1);
+  }, cn = (e, n) => {
+    if (!X) return;
+    const t = dt;
+    switch (e.key) {
+      case " ":
+      case "Enter":
+        if (e.preventDefault(), t === null)
+          Ce.current = [...s.getState().columnOrder ?? []], Fe(n), B(b("table.reorder.pickup", Ue(n)));
+        else {
+          const o = gt().indexOf(t) + 1;
+          Fe(null), Ce.current = [], B(b("table.reorder.drop", Ue(t), o));
+        }
+        break;
+      case "Escape":
+        t !== null && (e.preventDefault(), s.setColumnOrder(Ce.current), Fe(null), Ce.current = [], B(b("table.reorder.cancel")));
+        break;
+      case "ArrowLeft":
+        t !== null && (e.preventDefault(), pt(-1, t));
+        break;
+      case "ArrowRight":
+        t !== null && (e.preventDefault(), pt(1, t));
+        break;
+    }
+  }, mt = (e, n) => {
+    const t = _.findIndex((c) => c.original === n);
+    if (t < 0) return;
+    const o = t + e;
+    if (o < 0 || o >= _.length) return;
+    const a = _[t], r = _[o];
+    L == null || L({
+      fromId: a.id,
+      toId: r.id,
+      fromIndex: a.index,
+      toIndex: r.index
+    }), B(b("table.row-reorder.move", o + 1)), ve.current = { kind: "row", original: n }, ct((c) => c + 1);
+  }, un = (e, n) => {
+    if (!S) return;
+    const t = st;
+    switch (e.key) {
+      case " ":
+      case "Enter":
+        if (e.preventDefault(), t === null)
+          ze(n.original), ae.current = n.index, B(b("table.row-reorder.pickup", _.indexOf(n) + 1));
+        else {
+          const o = _.findIndex((a) => a.original === t) + 1;
+          ze(null), ae.current = -1, B(b("table.row-reorder.drop", o));
+        }
+        break;
+      case "Escape":
+        if (t !== null) {
+          e.preventDefault();
+          const o = _.findIndex((a) => a.original === t);
+          if (o >= 0 && ae.current >= 0) {
+            const a = _[o];
+            L == null || L({
+              fromId: a.id,
+              toId: a.id,
+              fromIndex: a.index,
+              toIndex: ae.current
+            });
+          }
+          ze(null), ae.current = -1, B(b("table.row-reorder.cancel"));
+        }
+        break;
+      case "ArrowUp":
+        t !== null && (e.preventDefault(), mt(-1, t));
+        break;
+      case "ArrowDown":
+        t !== null && (e.preventDefault(), mt(1, t));
+        break;
+    }
+  };
+  return ft(() => {
+    var t;
+    const e = ve.current;
+    if (!e) return;
+    ve.current = null;
+    let n;
+    if (e.kind === "column")
+      n = `${p}-col-reorder-${e.id}`;
+    else {
+      const o = _.find((a) => a.original === e.original);
+      n = o ? `${p}-row-reorder-${o.id}` : null;
+    }
+    n && ((t = document.getElementById(n)) == null || t.focus());
+  }, [ln, _, p]), /* @__PURE__ */ i(vn.Provider, { value: Mt, children: /* @__PURE__ */ re("div", { className: qt, "data-name": "tedi-table", children: [
+    ye,
+    (S || X) && /* @__PURE__ */ i("div", { className: l["tedi-table__sr-only"], "aria-live": "polite", "aria-atomic": "true", children: on }),
+    /* @__PURE__ */ i(
+      "div",
+      {
+        className: l["tedi-table__scroll"],
+        style: oe !== void 0 ? { maxHeight: oe, overflowY: "auto" } : void 0,
+        children: /* @__PURE__ */ re(
+          "table",
+          {
+            id: E,
+            className: l["tedi-table__table"],
+            "aria-rowcount": tn,
+            "aria-colcount": he > 0 ? he : void 0,
+            children: [
+              T && /* @__PURE__ */ i("caption", { className: l["tedi-table__caption"], children: T }),
+              /* @__PURE__ */ re("thead", { className: l["tedi-table__head"], children: [
+                be.map((e, n) => /* @__PURE__ */ i(
+                  "tr",
+                  {
+                    className: l["tedi-table__row"],
+                    "aria-rowindex": y ? n + 1 : void 0,
+                    children: e.headers.map((t) => {
+                      const o = t.subHeaders.length > 0, a = !!t.column.parent, r = Pn(t.column.columnDef), c = !r && !a;
+                      if (t.isPlaceholder && !c || !t.isPlaceholder && c && n > 0)
+                        return null;
+                      const f = c ? be.length - n : 1, C = t.column.getIsSorted(), v = t.column.getCanSort() ? C === "asc" ? "ascending" : C === "desc" ? "descending" : "none" : void 0, d = t.column.columnDef.meta, ee = (d == null ? void 0 : d.label) ?? (typeof t.column.columnDef.header == "string" ? t.column.columnDef.header : void 0), I = j == null ? void 0 : j(t.column.id), U = t.column.getSize(), ie = t.column.id === Se || t.column.id === Ve || t.column.id === Ge, te = X && c && !ie, m = te ? rn(t.column.id) : void 0, gn = te && it === t.column.id, pn = te && rt === t.column.id && it !== t.column.id, He = te && dt === t.column.id;
+                      return /* @__PURE__ */ i(
+                        "th",
+                        {
+                          colSpan: t.colSpan,
+                          rowSpan: f > 1 ? f : void 0,
+                          draggable: te || void 0,
+                          onDragStart: m == null ? void 0 : m.onDragStart,
+                          onDragOver: m == null ? void 0 : m.onDragOver,
+                          onDragLeave: m == null ? void 0 : m.onDragLeave,
+                          onDragEnd: m == null ? void 0 : m.onDragEnd,
+                          onDrop: m == null ? void 0 : m.onDrop,
+                          className: k(
+                            l["tedi-table__header-cell"],
+                            {
+                              [l["tedi-table__header-cell--group"]]: o,
+                              [l["tedi-table__header-cell--dragging"]]: gn,
+                              [l["tedi-table__header-cell--drag-over"]]: pn,
+                              [l["tedi-table__header-cell--picked-up"]]: He,
+                              [l[`tedi-table__cell--align-${d == null ? void 0 : d.align}`]]: d == null ? void 0 : d.align,
+                              [l[`tedi-table__cell--valign-${d == null ? void 0 : d.vAlign}`]]: d == null ? void 0 : d.vAlign
+                            },
+                            I == null ? void 0 : I.className
+                          ),
+                          scope: "col",
+                          "aria-sort": v,
+                          "aria-label": ee ?? (r ? void 0 : t.column.id),
+                          style: U || I != null && I.style ? { ...U ? { width: U } : null, ...I == null ? void 0 : I.style } : void 0,
+                          children: te && m ? /* @__PURE__ */ re("span", { className: l["tedi-table__header-cell-inner"], children: [
+                            /* @__PURE__ */ i(
+                              "button",
+                              {
+                                type: "button",
+                                id: dn(t.column.id),
+                                className: k(l["tedi-table__drag-handle"], {
+                                  [l["tedi-table__drag-handle--picked-up"]]: He
+                                }),
+                                "aria-label": b("table.drag-column", ee ?? t.column.id),
+                                "aria-pressed": He,
+                                onClick: (Ke) => Ke.stopPropagation(),
+                                onMouseDown: m.onHandlePointerDown,
+                                onTouchStart: m.onHandlePointerDown,
+                                onKeyDown: (Ke) => cn(Ke, t.column.id),
+                                [wt]: "",
+                                children: /* @__PURE__ */ i(ht, { name: "drag_indicator", size: 18, color: "inherit" })
+                              }
+                            ),
+                            xe(t.column.columnDef.header, t.getContext())
+                          ] }) : xe(t.column.columnDef.header, t.getContext())
+                        },
+                        t.id
+                      );
+                    })
+                  },
+                  e.id
+                )),
+                Ee && /* @__PURE__ */ i(
+                  "tr",
+                  {
+                    className: k(l["tedi-table__row"], l["tedi-table__row--filter"]),
+                    "aria-rowindex": y ? be.length + 1 : void 0,
+                    children: et.map((e) => {
+                      const n = e.columnDef.meta, t = (n == null ? void 0 : n.label) ?? (typeof e.columnDef.header == "string" ? e.columnDef.header : e.id), o = `${p}-filter-${e.id}`, a = j == null ? void 0 : j(e.id);
+                      return /* @__PURE__ */ i(
+                        "th",
+                        {
+                          className: k(l["tedi-table__header-cell"], a == null ? void 0 : a.className),
+                          style: a == null ? void 0 : a.style,
+                          scope: "col",
+                          children: e.getCanFilter() && /* @__PURE__ */ i(
+                            _n,
+                            {
+                              size: "small",
+                              placeholder: b("table.filter-placeholder"),
+                              ...n == null ? void 0 : n.filterProps,
+                              id: o,
+                              name: o,
+                              label: b("table.filter-input", t),
+                              hideLabel: !0,
+                              value: e.getFilterValue() ?? "",
+                              onChange: (r) => e.setFilterValue(r || void 0)
+                            }
+                          )
+                        },
+                        e.id
+                      );
+                    })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ i("tbody", { className: l["tedi-table__body"], children: _.length === 0 ? /* @__PURE__ */ i("tr", { className: l["tedi-table__row"], children: /* @__PURE__ */ i(
+                "td",
+                {
+                  colSpan: Math.max(1, he),
+                  className: k(l["tedi-table__cell"], l["tedi-table__cell--placeholder"]),
+                  children: ce ? /* @__PURE__ */ i("div", { role: ce, children: Je }) : Je
+                }
+              ) }) : _.map((e, n) => {
+                const t = tt(e), o = G !== void 0 && e.id === G, a = Le == null ? void 0 : Le(e), r = k(
+                  l["tedi-table__row"],
+                  {
+                    [l["tedi-table__row--selected"]]: Ct && e.getIsSelected(),
+                    [l["tedi-table__row--active"]]: o,
+                    [l["tedi-table__row--clickable"]]: t,
+                    [l["tedi-table__row--sub-row"]]: e.depth > 0
+                  },
+                  a == null ? void 0 : a.className
+                ), c = y ? ot + Zt + n + 1 : void 0, f = `${p}-sub-${e.id}`, C = S && at === e.id, v = S && nn === e.id && at !== e.id, d = S && st === e.original, ee = {
+                  row: e,
+                  rowClassName: k(r, {
+                    [l["tedi-table__row--dragging"]]: C,
+                    [l["tedi-table__row--drag-over"]]: v,
+                    [l["tedi-table__row--picked-up"]]: d
+                  }),
+                  rowStyle: a == null ? void 0 : a.style,
+                  isActiveRow: o,
+                  clickable: t,
+                  onClick: nt,
+                  onKeyDownHandler: Qt(e),
+                  ariaRowIndex: c,
+                  columnProps: j,
+                  draggable: S,
+                  dragHandleLabel: b("table.drag-row"),
+                  dragHandlers: S ? { ...an(e.id), onKeyDown: (I) => un(I, e) } : void 0,
+                  dragHandleId: S ? sn(e.id) : void 0,
+                  dragHandlePickedUp: d,
+                  dragOverColumnId: X ? rt : null
+                };
+                return /* @__PURE__ */ re(bn, { children: [
+                  /* @__PURE__ */ i($n, { ...ee }),
+                  pe && e.getIsExpanded() && /* @__PURE__ */ i("tr", { className: k(l["tedi-table__row"], l["tedi-table__row--sub-component"]), children: /* @__PURE__ */ i(
+                    "td",
+                    {
+                      id: f,
+                      role: "region",
+                      "aria-label": b("table.row-details"),
+                      colSpan: Math.max(1, he),
+                      className: k(l["tedi-table__cell"], l["tedi-table__cell--sub-component"]),
+                      children: pe(e)
+                    }
+                  ) })
+                ] }, e.id);
+              }) }),
+              Jt && /* @__PURE__ */ i("tfoot", { className: l["tedi-table__foot"], children: Ze.map((e) => /* @__PURE__ */ i("tr", { className: l["tedi-table__row"], children: e.headers.map((n) => {
+                const t = n.column.columnDef.meta;
+                return /* @__PURE__ */ i(
+                  "td",
+                  {
+                    colSpan: n.colSpan,
+                    className: k(l["tedi-table__cell"], l["tedi-table__cell--footer"], {
+                      [l[`tedi-table__cell--align-${t == null ? void 0 : t.align}`]]: t == null ? void 0 : t.align,
+                      [l[`tedi-table__cell--valign-${t == null ? void 0 : t.vAlign}`]]: t == null ? void 0 : t.vAlign
+                    }),
+                    children: n.isPlaceholder ? null : xe(n.column.columnDef.footer, n.getContext())
+                  },
+                  n.id
+                );
+              }) }, e.id)) })
+            ]
+          }
+        )
+      }
+    ),
+    y && /* @__PURE__ */ i("div", { className: l["tedi-table__pagination"], children: /* @__PURE__ */ i(
+      Rn,
+      {
+        ...h == null ? void 0 : h.paginationProps,
+        pageCount: Math.max(1, s.getPageCount()),
+        page: s.getState().pagination.pageIndex + 1,
+        onPageChange: jt,
+        totalItems: me ?? s.getFilteredRowModel().rows.length,
+        pageSize: s.getState().pagination.pageSize,
+        pageSizeOptions: Rt,
+        onPageSizeChange: Wt
+      }
+    ) })
+  ] }) });
+}
+_t.displayName = "Table";
+const to = Object.assign(_t, {
+  Toolbar: Sn,
+  ColumnsMenu: Cn,
+  HeaderButton: xn
+});
+export {
+  to as Table,
+  to as default,
+  eo as groupRowSpan
+};