@preboot.io/preboot-ui-community
Version:
A community-driven React component library to accelerate building modern SaaS applications, designed to work with PreBoot.io backend.
846 lines (845 loc) • 30.2 kB
JavaScript
import { jsxs as p, jsx as l } from "react/jsx-runtime";
import j, { useState as U, useEffect as se, useCallback as Y } from "react";
import { Group as T, Box as Fe, ScrollArea as oe, Table as k, Tooltip as Ie, Text as O, Pagination as Ne, ActionIcon as ce, Menu as _, Button as R, Loader as de, TextInput as pe, SegmentedControl as ze, MultiSelect as ge, Select as ve, Badge as V, Stack as z, Checkbox as Le, PasswordInput as Me } from "@mantine/core";
import { useDebouncedValue as De } from "@mantine/hooks";
import { DatePickerInput as Re } from "@mantine/dates";
import { parseISO as Be, format as Pe } from "date-fns";
function be(e) {
var r, n, i = "";
if (typeof e == "string" || typeof e == "number") i += e;
else if (typeof e == "object") if (Array.isArray(e)) {
var o = e.length;
for (r = 0; r < o; r++) e[r] && (n = be(e[r])) && (i && (i += " "), i += n);
} else for (n in e) e[n] && (i && (i += " "), i += n);
return i;
}
function Q() {
for (var e, r, n = 0, i = "", o = arguments.length; n < o; n++) (e = arguments[n]) && (r = be(e)) && (i && (i += " "), i += r);
return i;
}
var ye = {
color: void 0,
size: void 0,
className: void 0,
style: void 0,
attr: void 0
}, ue = j.createContext && /* @__PURE__ */ j.createContext(ye), Ue = ["attr", "size", "title"];
function $e(e, r) {
if (e == null) return {};
var n = Ve(e, r), i, o;
if (Object.getOwnPropertySymbols) {
var f = Object.getOwnPropertySymbols(e);
for (o = 0; o < f.length; o++)
i = f[o], !(r.indexOf(i) >= 0) && Object.prototype.propertyIsEnumerable.call(e, i) && (n[i] = e[i]);
}
return n;
}
function Ve(e, r) {
if (e == null) return {};
var n = {};
for (var i in e)
if (Object.prototype.hasOwnProperty.call(e, i)) {
if (r.indexOf(i) >= 0) continue;
n[i] = e[i];
}
return n;
}
function A() {
return A = Object.assign ? Object.assign.bind() : function(e) {
for (var r = 1; r < arguments.length; r++) {
var n = arguments[r];
for (var i in n)
Object.prototype.hasOwnProperty.call(n, i) && (e[i] = n[i]);
}
return e;
}, A.apply(this, arguments);
}
function fe(e, r) {
var n = Object.keys(e);
if (Object.getOwnPropertySymbols) {
var i = Object.getOwnPropertySymbols(e);
r && (i = i.filter(function(o) {
return Object.getOwnPropertyDescriptor(e, o).enumerable;
})), n.push.apply(n, i);
}
return n;
}
function G(e) {
for (var r = 1; r < arguments.length; r++) {
var n = arguments[r] != null ? arguments[r] : {};
r % 2 ? fe(Object(n), !0).forEach(function(i) {
We(e, i, n[i]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : fe(Object(n)).forEach(function(i) {
Object.defineProperty(e, i, Object.getOwnPropertyDescriptor(n, i));
});
}
return e;
}
function We(e, r, n) {
return r = Ae(r), r in e ? Object.defineProperty(e, r, { value: n, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = n, e;
}
function Ae(e) {
var r = Ge(e, "string");
return typeof r == "symbol" ? r : r + "";
}
function Ge(e, r) {
if (typeof e != "object" || !e) return e;
var n = e[Symbol.toPrimitive];
if (n !== void 0) {
var i = n.call(e, r);
if (typeof i != "object") return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (r === "string" ? String : Number)(e);
}
function me(e) {
return e && e.map((r, n) => /* @__PURE__ */ j.createElement(r.tag, G({
key: n
}, r.attr), me(r.child)));
}
function B(e) {
return (r) => /* @__PURE__ */ j.createElement(qe, A({
attr: G({}, e.attr)
}, r), me(e.child));
}
function qe(e) {
var r = (n) => {
var {
attr: i,
size: o,
title: f
} = e, g = $e(e, Ue), S = o || n.size || "1em", y;
return n.className && (y = n.className), e.className && (y = (y ? y + " " : "") + e.className), /* @__PURE__ */ j.createElement("svg", A({
stroke: "currentColor",
fill: "currentColor",
strokeWidth: "0"
}, n.attr, i, g, {
className: y,
style: G(G({
color: e.color || n.color
}, n.style), e.style),
height: S,
width: S,
xmlns: "http://www.w3.org/2000/svg"
}), f && /* @__PURE__ */ j.createElement("title", null, f), e.children);
};
return ue !== void 0 ? /* @__PURE__ */ j.createElement(ue.Consumer, null, (n) => r(n)) : r(ye);
}
function He(e) {
return B({ attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M5 12l5 5l10 -10" }, child: [] }] })(e);
}
function Je(e) {
return B({ attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M5 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, child: [] }, { tag: "path", attr: { d: "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, child: [] }, { tag: "path", attr: { d: "M19 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, child: [] }] })(e);
}
function Z(e) {
return B({ attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M14 3v4a1 1 0 0 0 1 1h4" }, child: [] }, { tag: "path", attr: { d: "M11.5 21h-4.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v5m-5 6h7m-3 -3l3 3l-3 3" }, child: [] }] })(e);
}
function Xe(e) {
return B({ attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M12 5l0 14" }, child: [] }, { tag: "path", attr: { d: "M5 12l14 0" }, child: [] }] })(e);
}
const Ye = "data-table-module__sortable__ktOMp", Qe = "data-table-module__skeleton__7HM-5", Ze = "data-table-module__table__Mv5vN", Ke = "data-table-module__container__Yyfhi", et = "data-table-module__filtersGrid__JjSBm", tt = "data-table-module__filterLabel__p9nIW", rt = "data-table-module__filterInput__OsWPp", nt = "data-table-module__filterDelete__B-FGM", lt = "data-table-module__filterRow__NKt-V", m = {
sortable: Ye,
skeleton: Qe,
table: Ze,
container: Ke,
filtersGrid: et,
filterLabel: tt,
filterInput: rt,
filterDelete: nt,
filterRow: lt
};
function it(e) {
return B({ attr: { viewBox: "0 0 448 512" }, child: [{ tag: "path", attr: { d: "M170.5 51.6L151.5 80l145 0-19-28.4c-1.5-2.2-4-3.6-6.7-3.6l-93.7 0c-2.7 0-5.2 1.3-6.7 3.6zm147-26.6L354.2 80 368 80l48 0 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-8 0 0 304c0 44.2-35.8 80-80 80l-224 0c-44.2 0-80-35.8-80-80l0-304-8 0c-13.3 0-24-10.7-24-24S10.7 80 24 80l8 0 48 0 13.8 0 36.7-55.1C140.9 9.4 158.4 0 177.1 0l93.7 0c18.7 0 36.2 9.4 46.6 24.9zM80 128l0 304c0 17.7 14.3 32 32 32l224 0c17.7 0 32-14.3 32-32l0-304L80 128zm80 64l0 208c0 8.8-7.2 16-16 16s-16-7.2-16-16l0-208c0-8.8 7.2-16 16-16s16 7.2 16 16zm80 0l0 208c0 8.8-7.2 16-16 16s-16-7.2-16-16l0-208c0-8.8 7.2-16 16-16s16 7.2 16 16zm80 0l0 208c0 8.8-7.2 16-16 16s-16-7.2-16-16l0-208c0-8.8 7.2-16 16-16s16 7.2 16 16z" }, child: [] }] })(e);
}
var $ = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, W = { exports: {} }, at = W.exports, he;
function st() {
return he || (he = 1, function(e, r) {
(function(n, i) {
i();
})(at, function() {
function n(d, c) {
return typeof c > "u" ? c = { autoBom: !1 } : typeof c != "object" && (console.warn("Deprecated: Expected third argument to be a object"), c = { autoBom: !c }), c.autoBom && /^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(d.type) ? new Blob(["\uFEFF", d], { type: d.type }) : d;
}
function i(d, c, v) {
var h = new XMLHttpRequest();
h.open("GET", d), h.responseType = "blob", h.onload = function() {
y(h.response, c, v);
}, h.onerror = function() {
console.error("could not download file");
}, h.send();
}
function o(d) {
var c = new XMLHttpRequest();
c.open("HEAD", d, !1);
try {
c.send();
} catch {
}
return 200 <= c.status && 299 >= c.status;
}
function f(d) {
try {
d.dispatchEvent(new MouseEvent("click"));
} catch {
var c = document.createEvent("MouseEvents");
c.initMouseEvent("click", !0, !0, window, 0, 0, 0, 80, 20, !1, !1, !1, !1, 0, null), d.dispatchEvent(c);
}
}
var g = typeof window == "object" && window.window === window ? window : typeof self == "object" && self.self === self ? self : typeof $ == "object" && $.global === $ ? $ : void 0, S = g.navigator && /Macintosh/.test(navigator.userAgent) && /AppleWebKit/.test(navigator.userAgent) && !/Safari/.test(navigator.userAgent), y = g.saveAs || (typeof window != "object" || window !== g ? function() {
} : "download" in HTMLAnchorElement.prototype && !S ? function(d, c, v) {
var h = g.URL || g.webkitURL, w = document.createElement("a");
c = c || d.name || "download", w.download = c, w.rel = "noopener", typeof d == "string" ? (w.href = d, w.origin === location.origin ? f(w) : o(w.href) ? i(d, c, v) : f(w, w.target = "_blank")) : (w.href = h.createObjectURL(d), setTimeout(function() {
h.revokeObjectURL(w.href);
}, 4e4), setTimeout(function() {
f(w);
}, 0));
} : "msSaveOrOpenBlob" in navigator ? function(d, c, v) {
if (c = c || d.name || "download", typeof d != "string") navigator.msSaveOrOpenBlob(n(d, v), c);
else if (o(d)) i(d, c, v);
else {
var h = document.createElement("a");
h.href = d, h.target = "_blank", setTimeout(function() {
f(h);
});
}
} : function(d, c, v, h) {
if (h = h || open("", "_blank"), h && (h.document.title = h.document.body.innerText = "downloading..."), typeof d == "string") return i(d, c, v);
var w = d.type === "application/octet-stream", L = /constructor/i.test(g.HTMLElement) || g.safari, E = /CriOS\/[\d]+/.test(navigator.userAgent);
if ((E || w && L || S) && typeof FileReader < "u") {
var C = new FileReader();
C.onloadend = function() {
var x = C.result;
x = E ? x : x.replace(/^data:[^;]*;/, "data:attachment/file;"), h ? h.location.href = x : location = x, h = null;
}, C.readAsDataURL(d);
} else {
var P = g.URL || g.webkitURL, F = P.createObjectURL(d);
h ? h.location = F : location.href = F, h = null, setTimeout(function() {
P.revokeObjectURL(F);
}, 4e4);
}
});
g.saveAs = y.saveAs = y, e.exports = y;
});
}(W)), W.exports;
}
var ot = st();
function gt({
data: e,
columns: r,
loading: n,
onParamsChange: i,
currentParams: o,
rowActions: f,
noRecordsText: g,
containerClassName: S,
tableClassName: y,
filtersRenderMode: d = "all",
enableExport: c = !1,
exportFormats: v = ["xlsx"],
exportFunction: h,
exportMode: w = "download",
defaultExportFileName: L = "export",
enableStickyColumn: E = !1,
enableStickyHeader: C = !1,
scrollAreaHeight: P,
enableStickyActionColumn: F = !1,
translations: x = {}
}) {
var ie, ae;
const [K, I] = U({}), [M, ee] = U({
xlsx: !1,
csv: !1,
pdf: !1
}), [te] = De(K, 300), [re, q] = U([]), [H, J] = U([]);
se(() => {
const t = {};
o.filters.forEach((u) => {
const D = r.find((N) => String(N.key) === u.field);
(D == null ? void 0 : D.filterType) === "boolean" && typeof u.value == "string" ? t[u.field] = u.value === "true" : t[u.field] = u.value;
}), I(t);
const s = o.filters.map((u) => u.field);
q(s);
const b = r.filter((u) => u.filterable).map((u) => String(u.key)).filter((u) => !s.includes(u));
J(b);
}, []), se(() => {
const t = [];
Object.entries(te).forEach(([a, b]) => {
const u = r.find((N) => String(N.key) === a), D = (u == null ? void 0 : u.filterType) === "boolean";
if (b !== void 0 && (b !== "" || D))
if (u != null && u.filterOperator)
t.push({
field: a,
operator: u.filterOperator,
value: b
});
else if ((u == null ? void 0 : u.filterType) === "enum")
t.push({
field: a,
operator: "eq",
value: b
});
else if ((u == null ? void 0 : u.filterType) === "date")
t.push({
field: a,
operator: "gte",
value: b
});
else if ((u == null ? void 0 : u.filterType) === "array-enum") {
const N = Array.isArray(b) ? b : [b];
N.length > 0 && t.push({
field: a,
operator: "ao",
value: N
});
} else (u == null ? void 0 : u.filterType) === "boolean" ? t.push({
field: a,
operator: "eq",
value: String(b)
// Convert boolean to string for consistency
}) : t.push({
field: a,
operator: "like",
value: b
});
}), JSON.stringify(t) !== JSON.stringify(o.filters) && i({
...o,
page: 0,
filters: t
});
}, [te, o, i, r]);
const Se = (t) => {
i({
...o,
page: t - 1
// Convert from 1-based to 0-based
});
}, xe = (t) => {
if (!t.sortable) return;
const a = o.sortField === t.key && o.sortDirection === "ASC" ? "DESC" : "ASC";
i({
...o,
sortField: t.key,
sortDirection: a
});
}, ne = (t) => {
if (!t.filterable) return null;
const s = K[t.key];
switch (t.filterType) {
case "enum":
return /* @__PURE__ */ l(
ve,
{
data: t.filterOptions || [],
clearable: !0,
className: m.filterInput,
value: s,
onChange: (a) => X(t, a || "")
},
String(t.key)
);
case "array-enum":
return /* @__PURE__ */ l(
ge,
{
data: t.filterOptions || [],
clearable: !0,
className: m.filterInput,
value: Array.isArray(s) ? s : [],
onChange: (a) => we(t, a)
},
String(t.key)
);
case "date":
return /* @__PURE__ */ l(
Re,
{
value: s ? new Date(s) : null,
className: m.filterInput,
onChange: (a) => {
X(t, a);
}
},
String(t.key)
);
case "boolean":
return /* @__PURE__ */ l(
ze,
{
className: m.filterInput,
value: String(s),
onChange: (a) => ke(t, a === "true"),
data: [
{ label: x.booleanTrue || "True", value: "true" },
{ label: x.booleanFalse || "False", value: "false" }
],
size: "xs"
},
String(t.key)
);
case "text":
default:
return /* @__PURE__ */ l(
pe,
{
className: m.filterInput,
value: String(s || ""),
onChange: (a) => X(t, a.currentTarget.value)
},
String(t.key)
);
}
}, X = Y((t, s) => {
I((a) => ({
...a,
[t.key]: s
}));
}, []), we = Y((t, s) => {
I((a) => ({
...a,
[t.key]: s
}));
}, []), ke = Y((t, s) => {
I((a) => ({
...a,
[t.key]: s
}));
}, []), Oe = (t) => {
q((a) => [...a, t]), J((a) => a.filter((b) => b !== t));
const s = r.find((a) => String(a.key) === t);
(s == null ? void 0 : s.filterType) === "boolean" && I((a) => ({
...a,
[t]: !1
}));
}, _e = (t) => {
q((s) => s.filter((a) => a !== t)), J((s) => [...s, t]), I((s) => {
const a = { ...s };
return delete a[t], a;
});
}, le = async (t) => {
if (!h) {
console.error("Export function is not provided");
return;
}
if (w === "async") {
h(t, L, o);
return;
}
try {
ee((a) => ({ ...a, [t]: !0 }));
const s = await h(t, L, o);
s && ot.saveAs(s, `${L}.${t}`);
} catch (s) {
console.error("Export failed:", s);
} finally {
ee((s) => ({ ...s, [t]: !1 }));
}
}, Ce = () => {
if (!c || !h) return null;
if (v.length === 1) {
const t = v[0];
return /* @__PURE__ */ p(
R,
{
leftSection: M[t] ? /* @__PURE__ */ l(de, { size: "xs" }) : /* @__PURE__ */ l(Z, { size: 16 }),
onClick: () => le(t),
disabled: M[t],
children: [
x.export || "Export",
" ",
t.toUpperCase()
]
}
);
}
return /* @__PURE__ */ p(_, { position: "bottom-end", children: [
/* @__PURE__ */ l(_.Target, { children: /* @__PURE__ */ l(R, { leftSection: /* @__PURE__ */ l(Z, { size: 16 }), children: x.export || "Export" }) }),
/* @__PURE__ */ l(_.Dropdown, { children: v.map((t) => /* @__PURE__ */ l(
_.Item,
{
leftSection: M[t] ? /* @__PURE__ */ l(de, { size: "xs" }) : /* @__PURE__ */ l(Z, { size: 16 }),
rightSection: M[t] ? null : /* @__PURE__ */ l(He, { size: 16 }),
onClick: () => le(t),
disabled: M[t],
children: x.exportAs ? `${x.exportAs} ${t.toUpperCase()}` : `Export as ${t.toUpperCase()}`
},
t
)) })
] });
}, Te = () => /* @__PURE__ */ p("div", { className: m.filtersContainer, children: [
re.length > 0 && /* @__PURE__ */ l("div", { className: m.filtersGrid, style: { gap: "12px" }, children: re.map((t) => {
const s = r.find((a) => String(a.key) === t);
return s ? /* @__PURE__ */ p("div", { className: m.filterRow, children: [
/* @__PURE__ */ l(O, { className: m.filterLabel, children: s.label }),
ne(s),
/* @__PURE__ */ l(
ce,
{
variant: "subtle",
color: "red",
className: m.filterDelete,
onClick: () => _e(t),
children: /* @__PURE__ */ l(it, { size: 16 })
}
)
] }, t) : null;
}) }),
H.length > 0 && /* @__PURE__ */ p(_, { position: "bottom-start", children: [
/* @__PURE__ */ l(_.Target, { children: /* @__PURE__ */ l(
R,
{
variant: "subtle",
size: "xs",
leftSection: /* @__PURE__ */ l(Xe, { size: 16 }),
children: x.addFilter || "Add filter"
}
) }),
/* @__PURE__ */ l(_.Dropdown, { children: /* @__PURE__ */ l(oe, { h: H.length > 10 ? 300 : void 0, type: "auto", children: H.map((t) => {
const s = r.find((a) => String(a.key) === t);
return s ? /* @__PURE__ */ l(
_.Item,
{
onClick: () => Oe(t),
children: s.label
},
t
) : null;
}) }) })
] })
] }), je = () => /* @__PURE__ */ l(T, { mb: "md", gap: "sm", children: r.filter((t) => t.filterable).map((t) => /* @__PURE__ */ p("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "xs" }, children: [
/* @__PURE__ */ l(O, { size: "sm", c: "dimmed", mb: "xs", children: t.label }),
ne(t)
] }, String(t.key))) }), Ee = (t) => {
if (!(f != null && f.length)) return null;
const s = f.filter(
(a) => !a.show || a.show(t)
);
return s.length === 0 ? null : /* @__PURE__ */ p(_, { position: "bottom-end", withinPortal: !0, children: [
/* @__PURE__ */ l(_.Target, { children: /* @__PURE__ */ l(ce, { variant: "subtle", size: "sm", children: /* @__PURE__ */ l(Je, { size: 16 }) }) }),
/* @__PURE__ */ l(_.Dropdown, { children: s.map((a, b) => {
const u = a.icon;
return /* @__PURE__ */ l(
_.Item,
{
leftSection: u && /* @__PURE__ */ l(u, { size: 16 }),
color: a.color,
onClick: () => a.onClick(t),
children: a.label
},
b
);
}) })
] });
};
return /* @__PURE__ */ p("div", { className: `${m.container} ${S || ""}`, children: [
/* @__PURE__ */ p(T, { justify: "space-between", mt: "md", mb: "md", children: [
d === "all" ? je() : Te(),
/* @__PURE__ */ l(Fe, { style: { display: "flex", alignSelf: "flex-end" }, children: Ce() })
] }),
/* @__PURE__ */ l(
oe,
{
h: C ? P : void 0,
classNames: m,
offsetScrollbars: !0,
type: "auto",
children: /* @__PURE__ */ p(
k,
{
stickyHeader: C,
striped: !0,
highlightOnHover: !0,
className: Q(
m.table,
y
),
children: [
/* @__PURE__ */ l(k.Thead, { "data-sticky-header": C ? "true" : void 0, children: /* @__PURE__ */ p(k.Tr, { children: [
r.map((t, s) => /* @__PURE__ */ l(
Ie,
{
disabled: !t.tooltip,
label: t.tooltip,
multiline: !0,
w: 220,
children: /* @__PURE__ */ l(
k.Th,
{
onClick: () => xe(t),
className: Q(
t.sortable ? m.sortable : "",
t.columnClassName || ""
),
style: t.columnStyle,
"data-sticky-column": s === 0 && E ? "true" : void 0,
children: /* @__PURE__ */ p(T, { gap: "xs", wrap: "nowrap", children: [
t.label,
t.sortable && o.sortField === t.key && /* @__PURE__ */ l("span", { children: o.sortDirection === "DESC" ? " ↓" : " ↑" })
] })
}
)
},
String(t.key)
)),
f != null && f.length ? /* @__PURE__ */ l(
k.Th,
{
w: 40,
"data-sticky-action": F ? "true" : void 0
}
) : null
] }) }),
/* @__PURE__ */ l(k.Tbody, { children: n ? (
// Loading skeleton rows
Array.from({ length: o.size || 10 }).map((t, s) => /* @__PURE__ */ p(k.Tr, { children: [
r.map((a, b) => /* @__PURE__ */ l(
k.Td,
{
className: b === 0 && E ? m.stickyColumn : "",
children: /* @__PURE__ */ l("div", { className: m.skeleton })
},
String(a.key)
)),
f != null && f.length ? /* @__PURE__ */ l(k.Td, { children: /* @__PURE__ */ l("div", { className: m.skeleton }) }, "rowActionsColumnKey") : null
] }, s))
) : ((ie = e == null ? void 0 : e.content) == null ? void 0 : ie.length) === 0 ? /* @__PURE__ */ l(k.Tr, { children: /* @__PURE__ */ l(k.Td, { colSpan: r.length + (f != null && f.length ? 1 : 0), children: /* @__PURE__ */ l(O, { c: "dimmed", ta: "center", py: "xl", children: g || x.noRecordsFound || "No records found" }) }) }) : (ae = e == null ? void 0 : e.content) == null ? void 0 : ae.map((t, s) => /* @__PURE__ */ p(k.Tr, { children: [
r.map((a, b) => /* @__PURE__ */ l(
k.Td,
{
className: Q(
a.columnClassName
),
style: a.columnStyle,
"data-sticky-column": b === 0 && E ? "true" : void 0,
children: a.render ? a.render(t[a.key], t) : String(t[a.key] ?? "")
},
String(a.key)
)),
f != null && f.length ? /* @__PURE__ */ l(
k.Td,
{
"data-sticky-action": F ? "true" : void 0,
children: Ee(t)
}
) : null
] }, s)) })
]
}
)
}
),
(e == null ? void 0 : e.totalElements) > 0 && /* @__PURE__ */ p(T, { justify: "space-between", mt: "md", children: [
/* @__PURE__ */ l("div", { children: x.totalItems ? `${x.totalItems}: ${e.totalElements}` : `Total: ${e.totalElements} items` }),
/* @__PURE__ */ l(
Ne,
{
value: e.number + 1,
onChange: Se,
total: Math.ceil(e.totalElements / e.size)
}
)
] })
] });
}
const vt = {
// Boolean renderer with customizable labels and colors
boolean: (e) => (r) => /* @__PURE__ */ l(
V,
{
color: r ? (e == null ? void 0 : e.activeColor) ?? "green" : (e == null ? void 0 : e.inactiveColor) ?? "red",
variant: "light",
children: r ? (e == null ? void 0 : e.activeLabel) ?? "Active" : (e == null ? void 0 : e.inactiveLabel) ?? "Inactive"
}
),
// Array of strings renderer (e.g., for tags, roles, etc.)
stringArray: (e) => (r) => /* @__PURE__ */ l(T, { gap: "xs", wrap: "wrap", children: r.map((n) => /* @__PURE__ */ l(
V,
{
color: e == null ? void 0 : e.color,
variant: (e == null ? void 0 : e.variant) ?? "light",
children: n
},
n
)) }),
// Date renderer with format options
date: (e) => (r) => {
const n = r instanceof Date ? r : Be(r);
return Pe(n, (e == null ? void 0 : e.format) ?? "dd.MM.yyyy");
},
// Currency renderer
currency: (e) => (r) => new Intl.NumberFormat((e == null ? void 0 : e.locale) ?? "en-US", {
style: "currency",
currency: (e == null ? void 0 : e.currency) ?? "USD"
}).format(r),
// Percentage renderer
percentage: (e) => (r) => `${r.toFixed((e == null ? void 0 : e.decimals) ?? 2)}%`,
// Status renderer with custom colors and labels
status: (e) => (r) => {
const n = e.statuses[r];
return /* @__PURE__ */ l(V, { color: (n == null ? void 0 : n.color) ?? "gray", variant: "light", children: (n == null ? void 0 : n.label) ?? r });
}
}, bt = (e = 0, r = 10, n, i = "ASC", o = []) => ({
page: e,
size: r,
sortField: n,
sortDirection: i,
filters: o
});
function yt({
form: e,
name: r,
label: n,
mode: i = "edit",
...o
}) {
return i === "readonly" ? /* @__PURE__ */ p(z, { gap: "xs", children: [
/* @__PURE__ */ l(O, { size: "sm", c: "dimmed", children: n }),
/* @__PURE__ */ l(O, { children: String(e.values[r] || "-") })
] }) : /* @__PURE__ */ l(
pe,
{
...o,
label: n,
...e.getInputProps(r)
}
);
}
function mt({
form: e,
name: r,
label: n,
data: i,
mode: o = "edit",
...f
}) {
if (o === "readonly") {
const g = String(e.values[r]), S = i.find((d) => typeof d == "string" ? d === g : "value" in d && d.value === g), y = typeof S == "string" ? S : "value" in S ? S.label : "";
return /* @__PURE__ */ p(z, { gap: "xs", children: [
/* @__PURE__ */ l(O, { size: "sm", c: "dimmed", children: n }),
/* @__PURE__ */ l(O, { children: y || "-" })
] });
}
return /* @__PURE__ */ l(
ve,
{
...f,
label: n,
data: i,
...e.getInputProps(r)
}
);
}
function St({
form: e,
name: r,
label: n,
data: i,
mode: o = "edit",
displayBadges: f = !1,
...g
}) {
if (o === "readonly") {
const d = (e.values[r] || []).map(
(c) => i.find((v) => typeof v == "string" ? v === c : "value" in v && v.value === c)
).map((c) => c ? typeof c == "string" ? c : "value" in c ? c.label : "" : "").filter(Boolean);
return /* @__PURE__ */ p(z, { gap: "xs", children: [
/* @__PURE__ */ l(O, { size: "sm", c: "dimmed", children: n }),
f ? /* @__PURE__ */ l(T, { gap: "xs", children: d.map((c, v) => /* @__PURE__ */ l(V, { variant: "light", children: c }, v)) }) : /* @__PURE__ */ l(O, { children: d.join(", ") || "-" })
] });
}
return /* @__PURE__ */ l(
ge,
{
...g,
label: n,
data: i,
...e.getInputProps(r)
}
);
}
function xt({
form: e,
name: r,
label: n,
mode: i = "edit",
...o
}) {
if (i === "readonly") {
const f = !!e.values[r];
return /* @__PURE__ */ p(z, { gap: "xs", children: [
/* @__PURE__ */ l(O, { size: "sm", c: "dimmed", children: n }),
/* @__PURE__ */ l(O, { children: f ? "Yes" : "No" })
] });
}
return /* @__PURE__ */ l(
Le,
{
...o,
label: n,
...e.getInputProps(r)
}
);
}
function wt({
form: e,
name: r,
label: n,
mode: i = "edit",
...o
}) {
return i === "readonly" ? /* @__PURE__ */ p(z, { gap: "xs", children: [
/* @__PURE__ */ l(O, { size: "sm", c: "dimmed", children: n }),
/* @__PURE__ */ l(O, { children: "••••••••" })
] }) : /* @__PURE__ */ l(
Me,
{
...o,
label: n,
...e.getInputProps(r)
}
);
}
function kt({
form: e,
onSubmit: r,
onCancel: n,
loading: i = !1,
submitLabel: o = "Submit",
cancelLabel: f = "Cancel",
children: g,
mode: S = "edit"
}) {
const y = /* @__PURE__ */ p(z, { gap: "md", children: [
g,
S === "edit" && /* @__PURE__ */ p(T, { justify: "flex-end", gap: "sm", children: [
n && /* @__PURE__ */ l(
R,
{
variant: "subtle",
onClick: n,
disabled: i,
children: f
}
),
/* @__PURE__ */ l(
R,
{
type: "submit",
loading: i,
children: o
}
)
] })
] });
return S === "readonly" ? y : /* @__PURE__ */ l("form", { onSubmit: r ? e.onSubmit(r) : void 0, children: y });
}
export {
kt as BaseForm,
xt as CheckboxField,
gt as DataTable,
St as MultiSelectField,
wt as PasswordField,
mt as SelectField,
yt as TextField,
bt as createSearchRequest,
vt as tableRenderers
};