koval-ui
Version:
React components collection with minimalistic design. Supports theming, layout, and input validation.
122 lines (121 loc) • 3.94 kB
JavaScript
"use client";
import { jsx as o } from "react/jsx-runtime";
import { useMemo as S, useState as j, useEffect as B } from "react";
import { CellWrapper as f } from "../cells/CellWrapper.js";
import { ColumnHeaderCell as E } from "../cells/ColumnHeaderCell.js";
import { ColumnFooterCell as U } from "../cells/ColumnFooterCell.js";
import { ColumnTypes as e, CustomFilterFns as V, FilterModes as s, SortingModes as l } from "../types.js";
import { rowSelection as k } from "../columns/rowSelection.js";
import { ViewTextCell as q } from "../cells/ViewTextCell.js";
import { ViewDecimalCell as A } from "../cells/ViewDecimalCell.js";
import { ViewUnitCell as J } from "../cells/ViewUnitCell.js";
import { ViewDateCell as L } from "../cells/ViewDateCell.js";
import { ViewCurrencyCell as O } from "../cells/ViewCurrencyCell.js";
import { ViewPercentageCell as Q } from "../cells/ViewPercentageCell.js";
const T = (t) => typeof t == "string" || typeof t == "number" ? t : t == null ? void 0 : t.toString(), X = {
[e.text]: q,
[e.unit]: J,
[e.date]: L,
[e.decimal]: A,
[e.currency]: O,
[e.percentage]: Q,
[e.select]: void 0
}, Y = {
[e.text]: l.text,
[e.decimal]: l.basic,
[e.currency]: l.basic,
[e.percentage]: l.basic,
[e.unit]: l.basic,
[e.date]: l.basic,
[e.select]: void 0
}, Z = (t, n) => n !== void 0 ? n : Y[t], _ = {
[e.text]: s.includesString,
[e.decimal]: s.inNumberRange,
[e.currency]: s.inNumberRange,
[e.percentage]: V.isInPercentRange,
[e.unit]: s.inNumberRange,
[e.date]: V.isInDateRange,
[e.select]: void 0
}, $ = (t, n) => n !== void 0 ? n : _[t], K = (t, n) => t ? [k, ...n] : n, de = ({ columnsProp: t = [], selectable: n }) => {
const d = S(() => K(!!n, [
...t.map(
({
id: m,
size: r = 166,
name: c,
accessorKey: a,
accessorFn: g,
editable: M = !0,
filterable: R = !0,
sortable: y = !0,
pinnable: W = !0,
columnCell: C,
sortingFn: D,
cellProps: b = {},
columnType: u = e.text,
filterFn: H,
headerCell: x,
footerCell: F,
filterInput: N
}) => {
const v = C !== void 0 ? C : X[u], z = x !== void 0 ? x : E, G = F !== void 0 ? F : U;
return {
meta: {
type: u,
editable: M,
// TODO: replace with columnProp
accessorKey: a,
cellProps: b,
name: c,
filterInput: N
},
...a && { accessorKey: a },
...g && { accessorFn: g },
id: m,
sortingFn: Z(u, D),
filterFn: $(u, H),
size: r,
enableColumnFilter: R,
enableSorting: y,
enablePinning: W,
// disabled tanstack features.
enableMultiSort: !1,
enableGrouping: !1,
enableResizing: !1,
enableGlobalFilter: !1,
enableHiding: !1,
header: (i) => /* @__PURE__ */ o(f, { columnWidth: r, children: /* @__PURE__ */ o(z, { headerContext: i, title: c }) }),
cell: (i) => {
const I = T(i.getValue());
return /* @__PURE__ */ o(f, { columnWidth: r, children: /* @__PURE__ */ o(
v,
{
...b,
cellContext: i,
value: I
}
) });
},
footer: (i) => /* @__PURE__ */ o(f, { columnWidth: r, children: /* @__PURE__ */ o(G, { cellContext: i }) })
};
}
)
]), [t, n]), [h, p] = j(d);
B(() => {
p(d);
}, [d]);
const w = S(
() => t.map(({ id: m, name: r, columnType: c, editable: a = !0 }) => ({
id: m,
name: r,
type: c,
editable: a
})).filter(({ editable: m }) => m),
[t]
);
return { columns: h, setColumns: p, editableColumns: w };
};
export {
de as useTableColumns
};
//# sourceMappingURL=useTableColumns.js.map