dgz-ui-shared
Version:
Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library
911 lines (910 loc) • 32.3 kB
JavaScript
import { j as h } from "../../jsx-runtime-C5mzlN2N.js";
import { n as je, u as Ne } from "../../check-DE-1lGDl-24KCJ29m.js";
import { O as Ce, k as Se, d as Re, l as Ee, v as Te, p as _e } from "../../dropdown-menu-D3ab2Xna-ClM4t858.js";
import { D as ee, a as Le, M as ke } from "../../MyLimitSelect-CE7LgUe3.js";
import * as s from "react";
import U, { useEffect as Pe, useState as De } from "react";
import { R as re, a as H } from "../../MyInput-qse97Dxt.js";
import { a as p, x as D, j as Ae, h as $, R as O, b as k, n as L, w as Me } from "../../index-DqTIeHVj-CYOpXZHK.js";
import { c as ze } from "../../select-BehdTDP2-BxIxRb2_.js";
import { m as N } from "../../utils-D0f6bOsw-HrLsble-.js";
import { u as He, a as $e, b as We } from "../../useSortable-JADc91Wp.js";
import { S as Ie } from "../../ScrollArea-DZ-ZHSWz.js";
import { S as te } from "../../SortOrder-CwuehjY1.js";
import { E as Fe } from "../../Empty-BINT6CbW.js";
import { c as B } from "../../createLucideIcon-B950nf2d.js";
import { S as Ye, F as Ue } from "../../FilterWrapper-BJc7AO1q.js";
import { u as Ve } from "../../useTranslation-dH-uwymc.js";
function Xe(e, t) {
return s.useReducer((r, n) => t[r][n] ?? r, e);
}
var G = "ScrollArea", [ne, Dr] = Ae(G), [Oe, j] = ne(G), le = s.forwardRef(
(e, t) => {
const {
__scopeScrollArea: r,
type: n = "hover",
dir: o,
scrollHideDelay: l = 600,
...a
} = e, [d, i] = s.useState(null), [u, c] = s.useState(null), [m, f] = s.useState(null), [v, y] = s.useState(null), [T, _] = s.useState(null), [w, R] = s.useState(0), [x, b] = s.useState(0), [E, A] = s.useState(!1), [W, I] = s.useState(!1), g = D(t, (M) => i(M)), C = je(o);
return /* @__PURE__ */ p.jsx(
Oe,
{
scope: r,
type: n,
dir: C,
scrollHideDelay: l,
scrollArea: d,
viewport: u,
onViewportChange: c,
content: m,
onContentChange: f,
scrollbarX: v,
onScrollbarXChange: y,
scrollbarXEnabled: E,
onScrollbarXEnabledChange: A,
scrollbarY: T,
onScrollbarYChange: _,
scrollbarYEnabled: W,
onScrollbarYEnabledChange: I,
onCornerWidthChange: R,
onCornerHeightChange: b,
children: /* @__PURE__ */ p.jsx(
$.div,
{
dir: C,
...a,
ref: g,
style: {
position: "relative",
// Pass corner sizes as CSS vars to reduce re-renders of context consumers
"--radix-scroll-area-corner-width": w + "px",
"--radix-scroll-area-corner-height": x + "px",
...e.style
}
}
)
}
);
}
);
le.displayName = G;
var se = "ScrollAreaViewport", ae = s.forwardRef(
(e, t) => {
const { __scopeScrollArea: r, children: n, nonce: o, ...l } = e, a = j(se, r), d = s.useRef(null), i = D(t, d, a.onViewportChange);
return /* @__PURE__ */ p.jsxs(p.Fragment, { children: [
/* @__PURE__ */ p.jsx(
"style",
{
dangerouslySetInnerHTML: {
__html: "[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}"
},
nonce: o
}
),
/* @__PURE__ */ p.jsx(
$.div,
{
"data-radix-scroll-area-viewport": "",
...l,
ref: i,
style: {
/**
* We don't support `visible` because the intention is to have at least one scrollbar
* if this component is used and `visible` will behave like `auto` in that case
* https://developer.mozilla.org/en-US/docs/Web/CSS/overflow#description
*
* We don't handle `auto` because the intention is for the native implementation
* to be hidden if using this component. We just want to ensure the node is scrollable
* so could have used either `scroll` or `auto` here. We picked `scroll` to prevent
* the browser from having to work out whether to render native scrollbars or not,
* we tell it to with the intention of hiding them in CSS.
*/
overflowX: a.scrollbarXEnabled ? "scroll" : "hidden",
overflowY: a.scrollbarYEnabled ? "scroll" : "hidden",
...e.style
},
children: /* @__PURE__ */ p.jsx("div", { ref: a.onContentChange, style: { minWidth: "100%", display: "table" }, children: n })
}
)
] });
}
);
ae.displayName = se;
var S = "ScrollAreaScrollbar", J = s.forwardRef(
(e, t) => {
const { forceMount: r, ...n } = e, o = j(S, e.__scopeScrollArea), { onScrollbarXEnabledChange: l, onScrollbarYEnabledChange: a } = o, d = e.orientation === "horizontal";
return s.useEffect(() => (d ? l(!0) : a(!0), () => {
d ? l(!1) : a(!1);
}), [d, l, a]), o.type === "hover" ? /* @__PURE__ */ p.jsx(Be, { ...n, ref: t, forceMount: r }) : o.type === "scroll" ? /* @__PURE__ */ p.jsx(qe, { ...n, ref: t, forceMount: r }) : o.type === "auto" ? /* @__PURE__ */ p.jsx(ie, { ...n, ref: t, forceMount: r }) : o.type === "always" ? /* @__PURE__ */ p.jsx(Q, { ...n, ref: t }) : null;
}
);
J.displayName = S;
var Be = s.forwardRef((e, t) => {
const { forceMount: r, ...n } = e, o = j(S, e.__scopeScrollArea), [l, a] = s.useState(!1);
return s.useEffect(() => {
const d = o.scrollArea;
let i = 0;
if (d) {
const u = () => {
window.clearTimeout(i), a(!0);
}, c = () => {
i = window.setTimeout(() => a(!1), o.scrollHideDelay);
};
return d.addEventListener("pointerenter", u), d.addEventListener("pointerleave", c), () => {
window.clearTimeout(i), d.removeEventListener("pointerenter", u), d.removeEventListener("pointerleave", c);
};
}
}, [o.scrollArea, o.scrollHideDelay]), /* @__PURE__ */ p.jsx(O, { present: r || l, children: /* @__PURE__ */ p.jsx(
ie,
{
"data-state": l ? "visible" : "hidden",
...n,
ref: t
}
) });
}), qe = s.forwardRef((e, t) => {
const { forceMount: r, ...n } = e, o = j(S, e.__scopeScrollArea), l = e.orientation === "horizontal", a = Z(() => i("SCROLL_END"), 100), [d, i] = Xe("hidden", {
hidden: {
SCROLL: "scrolling"
},
scrolling: {
SCROLL_END: "idle",
POINTER_ENTER: "interacting"
},
interacting: {
SCROLL: "interacting",
POINTER_LEAVE: "idle"
},
idle: {
HIDE: "hidden",
SCROLL: "scrolling",
POINTER_ENTER: "interacting"
}
});
return s.useEffect(() => {
if (d === "idle") {
const u = window.setTimeout(() => i("HIDE"), o.scrollHideDelay);
return () => window.clearTimeout(u);
}
}, [d, o.scrollHideDelay, i]), s.useEffect(() => {
const u = o.viewport, c = l ? "scrollLeft" : "scrollTop";
if (u) {
let m = u[c];
const f = () => {
const v = u[c];
m !== v && (i("SCROLL"), a()), m = v;
};
return u.addEventListener("scroll", f), () => u.removeEventListener("scroll", f);
}
}, [o.viewport, l, i, a]), /* @__PURE__ */ p.jsx(O, { present: r || d !== "hidden", children: /* @__PURE__ */ p.jsx(
Q,
{
"data-state": d === "hidden" ? "hidden" : "visible",
...n,
ref: t,
onPointerEnter: k(e.onPointerEnter, () => i("POINTER_ENTER")),
onPointerLeave: k(e.onPointerLeave, () => i("POINTER_LEAVE"))
}
) });
}), ie = s.forwardRef((e, t) => {
const r = j(S, e.__scopeScrollArea), { forceMount: n, ...o } = e, [l, a] = s.useState(!1), d = e.orientation === "horizontal", i = Z(() => {
if (r.viewport) {
const u = r.viewport.offsetWidth < r.viewport.scrollWidth, c = r.viewport.offsetHeight < r.viewport.scrollHeight;
a(d ? u : c);
}
}, 10);
return P(r.viewport, i), P(r.content, i), /* @__PURE__ */ p.jsx(O, { present: n || l, children: /* @__PURE__ */ p.jsx(
Q,
{
"data-state": l ? "visible" : "hidden",
...o,
ref: t
}
) });
}), Q = s.forwardRef((e, t) => {
const { orientation: r = "vertical", ...n } = e, o = j(S, e.__scopeScrollArea), l = s.useRef(null), a = s.useRef(0), [d, i] = s.useState({
content: 0,
viewport: 0,
scrollbar: { size: 0, paddingStart: 0, paddingEnd: 0 }
}), u = pe(d.viewport, d.content), c = {
...n,
sizes: d,
onSizesChange: i,
hasThumb: u > 0 && u < 1,
onThumbChange: (f) => l.current = f,
onThumbPointerUp: () => a.current = 0,
onThumbPointerDown: (f) => a.current = f
};
function m(f, v) {
return er(f, a.current, d, v);
}
return r === "horizontal" ? /* @__PURE__ */ p.jsx(
Ze,
{
...c,
ref: t,
onThumbPositionChange: () => {
if (o.viewport && l.current) {
const f = o.viewport.scrollLeft, v = oe(f, d, o.dir);
l.current.style.transform = `translate3d(${v}px, 0, 0)`;
}
},
onWheelScroll: (f) => {
o.viewport && (o.viewport.scrollLeft = f);
},
onDragScroll: (f) => {
o.viewport && (o.viewport.scrollLeft = m(f, o.dir));
}
}
) : r === "vertical" ? /* @__PURE__ */ p.jsx(
Ge,
{
...c,
ref: t,
onThumbPositionChange: () => {
if (o.viewport && l.current) {
const f = o.viewport.scrollTop, v = oe(f, d);
l.current.style.transform = `translate3d(0, ${v}px, 0)`;
}
},
onWheelScroll: (f) => {
o.viewport && (o.viewport.scrollTop = f);
},
onDragScroll: (f) => {
o.viewport && (o.viewport.scrollTop = m(f));
}
}
) : null;
}), Ze = s.forwardRef((e, t) => {
const { sizes: r, onSizesChange: n, ...o } = e, l = j(S, e.__scopeScrollArea), [a, d] = s.useState(), i = s.useRef(null), u = D(t, i, l.onScrollbarXChange);
return s.useEffect(() => {
i.current && d(getComputedStyle(i.current));
}, [i]), /* @__PURE__ */ p.jsx(
de,
{
"data-orientation": "horizontal",
...o,
ref: u,
sizes: r,
style: {
bottom: 0,
left: l.dir === "rtl" ? "var(--radix-scroll-area-corner-width)" : 0,
right: l.dir === "ltr" ? "var(--radix-scroll-area-corner-width)" : 0,
"--radix-scroll-area-thumb-width": q(r) + "px",
...e.style
},
onThumbPointerDown: (c) => e.onThumbPointerDown(c.x),
onDragScroll: (c) => e.onDragScroll(c.x),
onWheelScroll: (c, m) => {
if (l.viewport) {
const f = l.viewport.scrollLeft + c.deltaX;
e.onWheelScroll(f), me(f, m) && c.preventDefault();
}
},
onResize: () => {
i.current && l.viewport && a && n({
content: l.viewport.scrollWidth,
viewport: l.viewport.offsetWidth,
scrollbar: {
size: i.current.clientWidth,
paddingStart: X(a.paddingLeft),
paddingEnd: X(a.paddingRight)
}
});
}
}
);
}), Ge = s.forwardRef((e, t) => {
const { sizes: r, onSizesChange: n, ...o } = e, l = j(S, e.__scopeScrollArea), [a, d] = s.useState(), i = s.useRef(null), u = D(t, i, l.onScrollbarYChange);
return s.useEffect(() => {
i.current && d(getComputedStyle(i.current));
}, [i]), /* @__PURE__ */ p.jsx(
de,
{
"data-orientation": "vertical",
...o,
ref: u,
sizes: r,
style: {
top: 0,
right: l.dir === "ltr" ? 0 : void 0,
left: l.dir === "rtl" ? 0 : void 0,
bottom: "var(--radix-scroll-area-corner-height)",
"--radix-scroll-area-thumb-height": q(r) + "px",
...e.style
},
onThumbPointerDown: (c) => e.onThumbPointerDown(c.y),
onDragScroll: (c) => e.onDragScroll(c.y),
onWheelScroll: (c, m) => {
if (l.viewport) {
const f = l.viewport.scrollTop + c.deltaY;
e.onWheelScroll(f), me(f, m) && c.preventDefault();
}
},
onResize: () => {
i.current && l.viewport && a && n({
content: l.viewport.scrollHeight,
viewport: l.viewport.offsetHeight,
scrollbar: {
size: i.current.clientHeight,
paddingStart: X(a.paddingTop),
paddingEnd: X(a.paddingBottom)
}
});
}
}
);
}), [Je, ce] = ne(S), de = s.forwardRef((e, t) => {
const {
__scopeScrollArea: r,
sizes: n,
hasThumb: o,
onThumbChange: l,
onThumbPointerUp: a,
onThumbPointerDown: d,
onThumbPositionChange: i,
onDragScroll: u,
onWheelScroll: c,
onResize: m,
...f
} = e, v = j(S, r), [y, T] = s.useState(null), _ = D(t, (g) => T(g)), w = s.useRef(null), R = s.useRef(""), x = v.viewport, b = n.content - n.viewport, E = L(c), A = L(i), W = Z(m, 10);
function I(g) {
if (w.current) {
const C = g.clientX - w.current.left, M = g.clientY - w.current.top;
u({ x: C, y: M });
}
}
return s.useEffect(() => {
const g = (C) => {
const M = C.target;
y != null && y.contains(M) && E(C, b);
};
return document.addEventListener("wheel", g, { passive: !1 }), () => document.removeEventListener("wheel", g, { passive: !1 });
}, [x, y, b, E]), s.useEffect(A, [n, A]), P(y, W), P(v.content, W), /* @__PURE__ */ p.jsx(
Je,
{
scope: r,
scrollbar: y,
hasThumb: o,
onThumbChange: L(l),
onThumbPointerUp: L(a),
onThumbPositionChange: A,
onThumbPointerDown: L(d),
children: /* @__PURE__ */ p.jsx(
$.div,
{
...f,
ref: _,
style: { position: "absolute", ...f.style },
onPointerDown: k(e.onPointerDown, (g) => {
g.button === 0 && (g.target.setPointerCapture(g.pointerId), w.current = y.getBoundingClientRect(), R.current = document.body.style.webkitUserSelect, document.body.style.webkitUserSelect = "none", v.viewport && (v.viewport.style.scrollBehavior = "auto"), I(g));
}),
onPointerMove: k(e.onPointerMove, I),
onPointerUp: k(e.onPointerUp, (g) => {
const C = g.target;
C.hasPointerCapture(g.pointerId) && C.releasePointerCapture(g.pointerId), document.body.style.webkitUserSelect = R.current, v.viewport && (v.viewport.style.scrollBehavior = ""), w.current = null;
})
}
)
}
);
}), V = "ScrollAreaThumb", fe = s.forwardRef(
(e, t) => {
const { forceMount: r, ...n } = e, o = ce(V, e.__scopeScrollArea);
return /* @__PURE__ */ p.jsx(O, { present: r || o.hasThumb, children: /* @__PURE__ */ p.jsx(Qe, { ref: t, ...n }) });
}
), Qe = s.forwardRef(
(e, t) => {
const { __scopeScrollArea: r, style: n, ...o } = e, l = j(V, r), a = ce(V, r), { onThumbPositionChange: d } = a, i = D(
t,
(m) => a.onThumbChange(m)
), u = s.useRef(void 0), c = Z(() => {
u.current && (u.current(), u.current = void 0);
}, 100);
return s.useEffect(() => {
const m = l.viewport;
if (m) {
const f = () => {
if (c(), !u.current) {
const v = rr(m, d);
u.current = v, d();
}
};
return d(), m.addEventListener("scroll", f), () => m.removeEventListener("scroll", f);
}
}, [l.viewport, c, d]), /* @__PURE__ */ p.jsx(
$.div,
{
"data-state": a.hasThumb ? "visible" : "hidden",
...o,
ref: i,
style: {
width: "var(--radix-scroll-area-thumb-width)",
height: "var(--radix-scroll-area-thumb-height)",
...n
},
onPointerDownCapture: k(e.onPointerDownCapture, (m) => {
const f = m.target.getBoundingClientRect(), v = m.clientX - f.left, y = m.clientY - f.top;
a.onThumbPointerDown({ x: v, y });
}),
onPointerUp: k(e.onPointerUp, a.onThumbPointerUp)
}
);
}
);
fe.displayName = V;
var K = "ScrollAreaCorner", he = s.forwardRef(
(e, t) => {
const r = j(K, e.__scopeScrollArea), n = !!(r.scrollbarX && r.scrollbarY);
return r.type !== "scroll" && n ? /* @__PURE__ */ p.jsx(Ke, { ...e, ref: t }) : null;
}
);
he.displayName = K;
var Ke = s.forwardRef((e, t) => {
const { __scopeScrollArea: r, ...n } = e, o = j(K, r), [l, a] = s.useState(0), [d, i] = s.useState(0), u = !!(l && d);
return P(o.scrollbarX, () => {
var c;
const m = ((c = o.scrollbarX) == null ? void 0 : c.offsetHeight) || 0;
o.onCornerHeightChange(m), i(m);
}), P(o.scrollbarY, () => {
var c;
const m = ((c = o.scrollbarY) == null ? void 0 : c.offsetWidth) || 0;
o.onCornerWidthChange(m), a(m);
}), u ? /* @__PURE__ */ p.jsx(
$.div,
{
...n,
ref: t,
style: {
width: l,
height: d,
position: "absolute",
right: o.dir === "ltr" ? 0 : void 0,
left: o.dir === "rtl" ? 0 : void 0,
bottom: 0,
...e.style
}
}
) : null;
});
function X(e) {
return e ? parseInt(e, 10) : 0;
}
function pe(e, t) {
const r = e / t;
return isNaN(r) ? 0 : r;
}
function q(e) {
const t = pe(e.viewport, e.content), r = e.scrollbar.paddingStart + e.scrollbar.paddingEnd, n = (e.scrollbar.size - r) * t;
return Math.max(n, 18);
}
function er(e, t, r, n = "ltr") {
const o = q(r), l = o / 2, a = t || l, d = o - a, i = r.scrollbar.paddingStart + a, u = r.scrollbar.size - r.scrollbar.paddingEnd - d, c = r.content - r.viewport, m = n === "ltr" ? [0, c] : [c * -1, 0];
return ue([i, u], m)(e);
}
function oe(e, t, r = "ltr") {
const n = q(t), o = t.scrollbar.paddingStart + t.scrollbar.paddingEnd, l = t.scrollbar.size - o, a = t.content - t.viewport, d = l - n, i = r === "ltr" ? [0, a] : [a * -1, 0], u = ze(e, i);
return ue([0, a], [0, d])(u);
}
function ue(e, t) {
return (r) => {
if (e[0] === e[1] || t[0] === t[1]) return t[0];
const n = (t[1] - t[0]) / (e[1] - e[0]);
return t[0] + n * (r - e[0]);
};
}
function me(e, t) {
return e > 0 && e < t;
}
var rr = (e, t = () => {
}) => {
let r = { left: e.scrollLeft, top: e.scrollTop }, n = 0;
return function o() {
const l = { left: e.scrollLeft, top: e.scrollTop }, a = r.left !== l.left, d = r.top !== l.top;
(a || d) && t(), r = l, n = window.requestAnimationFrame(o);
}(), () => window.cancelAnimationFrame(n);
};
function Z(e, t) {
const r = L(e), n = s.useRef(0);
return s.useEffect(() => () => window.clearTimeout(n.current), []), s.useCallback(() => {
window.clearTimeout(n.current), n.current = window.setTimeout(r, t);
}, [r, t]);
}
function P(e, t) {
const r = L(t);
Me(() => {
let n = 0;
if (e) {
const o = new ResizeObserver(() => {
cancelAnimationFrame(n), n = window.requestAnimationFrame(r);
});
return o.observe(e), () => {
window.cancelAnimationFrame(n), o.unobserve(e);
};
}
}, [e, r]);
}
var we = le, tr = ae, or = he;
const ve = s.forwardRef(({ className: e, children: t, ...r }, n) => /* @__PURE__ */ p.jsxs(
we,
{
ref: n,
className: N("relative overflow-auto", e),
...r,
children: [
/* @__PURE__ */ p.jsx(tr, { className: "h-full w-full rounded-[inherit]", children: t }),
/* @__PURE__ */ p.jsx(xe, {}),
/* @__PURE__ */ p.jsx(or, {})
]
}
));
ve.displayName = we.displayName;
const xe = s.forwardRef(({ className: e, orientation: t = "vertical", ...r }, n) => /* @__PURE__ */ p.jsx(
J,
{
ref: n,
orientation: t,
className: N(
"flex touch-none select-none transition-colors",
t === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
t === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
e
),
...r,
children: /* @__PURE__ */ p.jsx(fe, { className: "relative flex-1 rounded-full bg-border" })
}
));
xe.displayName = J.displayName;
const ge = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx(ve, { className: "w-full", children: /* @__PURE__ */ p.jsx(
"table",
{
ref: r,
className: N("caption-bottom text-sm w-full", e),
...t
}
) }));
ge.displayName = "Table";
const be = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx("thead", { ref: r, className: N("[&_tr]:border-b", e), ...t }));
be.displayName = "TableHeader";
const ye = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx(
"tbody",
{
ref: r,
className: N("[&_tr:last-child]:border-0", e),
...t
}
));
ye.displayName = "TableBody";
const nr = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx(
"tfoot",
{
ref: r,
className: N(
"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
e
),
...t
}
));
nr.displayName = "TableFooter";
const F = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx(
"tr",
{
ref: r,
className: N(
"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
e
),
...t
}
));
F.displayName = "TableRow";
const Y = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx(
"th",
{
ref: r,
className: N(
"h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
e
),
...t
}
));
Y.displayName = "TableHead";
const z = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx(
"td",
{
ref: r,
className: N("p-4 align-middle [&:has([role=checkbox])]:pr-0", e),
...t
}
));
z.displayName = "TableCell";
const lr = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ p.jsx(
"caption",
{
ref: r,
className: N("mt-4 text-sm text-muted-foreground", e),
...t
}
));
lr.displayName = "TableCaption";
/**
* @license lucide-react v0.511.0 - ISC
*
* This source code is licensed under the ISC license.
* See the LICENSE file in the root directory of this source tree.
*/
const sr = [
["path", { d: "m3 16 4 4 4-4", key: "1co6wj" }],
["path", { d: "M7 20V4", key: "1yoxec" }],
["path", { d: "M11 4h10", key: "1w87gc" }],
["path", { d: "M11 8h7", key: "djye34" }],
["path", { d: "M11 12h4", key: "q8tih4" }]
], ar = B("arrow-down-wide-narrow", sr);
/**
* @license lucide-react v0.511.0 - ISC
*
* This source code is licensed under the ISC license.
* See the LICENSE file in the root directory of this source tree.
*/
const ir = [
["path", { d: "m21 16-4 4-4-4", key: "f6ql7i" }],
["path", { d: "M17 20V4", key: "1ejh1v" }],
["path", { d: "m3 8 4-4 4 4", key: "11wl7u" }],
["path", { d: "M7 4v16", key: "1glfcx" }]
], cr = B("arrow-up-down", ir);
/**
* @license lucide-react v0.511.0 - ISC
*
* This source code is licensed under the ISC license.
* See the LICENSE file in the root directory of this source tree.
*/
const dr = [
["path", { d: "m3 8 4-4 4 4", key: "11wl7u" }],
["path", { d: "M7 4v16", key: "1glfcx" }],
["path", { d: "M11 12h10", key: "1438ji" }],
["path", { d: "M11 16h7", key: "uosisv" }],
["path", { d: "M11 20h4", key: "1krc32" }]
], fr = B("arrow-up-wide-narrow", dr);
/**
* @license lucide-react v0.511.0 - ISC
*
* This source code is licensed under the ISC license.
* See the LICENSE file in the root directory of this source tree.
*/
const hr = [
["path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8", key: "v9h5vc" }],
["path", { d: "M21 3v5h-5", key: "1q7to0" }],
["path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16", key: "3uifl3" }],
["path", { d: "M8 16H3v5", key: "1cv678" }]
], pr = B("refresh-cw", hr), ur = ({ color: e = "currentColor", size: t = 24, className: r, ...n }) => U.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", width: t, height: t, fill: e, ...n, className: "remixicon " + (r || "") }, U.createElement("path", { d: "M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z" })), mr = ({ color: e = "currentColor", size: t = 24, className: r, ...n }) => U.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", width: t, height: t, fill: e, ...n, className: "remixicon " + (r || "") }, U.createElement("path", { d: "M11 5H5V19H11V5ZM13 5V19H19V5H13ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3Z" })), wr = ({
rows: e = [],
columns: t,
onRowClick: r,
rowKey: n,
params: o = {
page: 1,
limit: ee
},
hasNumbers: l = !1,
hasCheckbox: a = !1,
selectedItems: d,
onSelectedItemsChange: i,
onSortOrderChange: u
}) => {
const { sortObject: c, handleSort: m } = He({
sortField: o == null ? void 0 : o.sortField,
sortOrder: o == null ? void 0 : o.sortField,
onSortOrderChange: u
}), {
selectedRows: f,
isRowSelected: v,
isAllRowsSelected: y,
handleSelectAllRows: T,
handleSelectRow: _
} = $e({ rows: e, defaultSelectedRows: d });
return Pe(() => {
i && i(f);
}, [f]), /* @__PURE__ */ h.jsx(Ie, { className: "border-y h-full shrink", children: /* @__PURE__ */ h.jsxs(ge, { children: [
/* @__PURE__ */ h.jsx(be, { children: /* @__PURE__ */ h.jsxs(F, { children: [
a && /* @__PURE__ */ h.jsx(Y, { className: "w-12 p-3", children: /* @__PURE__ */ h.jsx(
re,
{
className: "mt-1",
checked: y(n),
onCheckedChange: (w) => T(n, !!w),
"aria-label": "Select all"
}
) }),
l && /* @__PURE__ */ h.jsx(Y, { className: "w-12 p-2", children: "#" }),
t.filter((w) => !w.hidden).map((w) => /* @__PURE__ */ h.jsx(
Y,
{
style: w.styles,
className: N("p-2", w.sortable && "cursor-pointer"),
onClick: () => m(w.dataIndex),
children: /* @__PURE__ */ h.jsxs("div", { className: "flex gap-2 items-center", children: [
w.name,
" ",
w.sortable && ((c == null ? void 0 : c.sortField) === w.key ? /* @__PURE__ */ h.jsxs(h.Fragment, { children: [
(c == null ? void 0 : c.sortOrder) === te.DESC && /* @__PURE__ */ h.jsx(ar, { size: 15 }),
(c == null ? void 0 : c.sortOrder) === te.ASC && /* @__PURE__ */ h.jsx(fr, { size: 15 })
] }) : /* @__PURE__ */ h.jsx(cr, { size: 15 }))
] })
},
w.key
))
] }) }),
/* @__PURE__ */ h.jsx(ye, { className: "[&>tr:nth-child(even)]:bg-bg-secondary", children: e.length ? e.map((w, R) => /* @__PURE__ */ h.jsxs(
F,
{
onClick: () => {
r && r(w);
},
"data-state": v(w[n]) && "selected",
children: [
a && /* @__PURE__ */ h.jsx(
z,
{
className: "w-12 p-3",
onClick: (x) => x.stopPropagation(),
children: /* @__PURE__ */ h.jsx(
re,
{
className: "mt-1",
checked: v(w[n]),
onCheckedChange: (x) => _(w[n], !!x),
"aria-label": "Select row"
}
)
}
),
l && /* @__PURE__ */ h.jsx(z, { className: "w-12 p-2", children: (o.page - 1) * (o.limit || ee) + R + 1 }),
t.filter((x) => !x.hidden).map((x) => /* @__PURE__ */ h.jsx(
z,
{
className: "max-w-xs overflow-hidden text-ellipsis p-2 text-body-xs-medium",
style: x.styles,
children: x.render ? x.render(H.get(w, x.dataIndex), w) : H.get(w, x.dataIndex, "")
},
`${R}-${x.key}`
))
]
},
`${w[n]}`
)) : /* @__PURE__ */ h.jsx(F, { children: /* @__PURE__ */ h.jsx(
z,
{
colSpan: l ? a ? t.length + 2 : t.length + 1 : t.length,
children: /* @__PURE__ */ h.jsx(Fe, {})
}
) }) })
] }) });
}, Ar = ({
dataSource: e,
columns: t,
onRowClick: r,
rowKey: n,
hasNumbers: o = !1,
hasSearch: l = !1,
hasCheckbox: a = !1,
hasPagination: d = !1,
onParamChange: i,
tableKey: u,
filters: c = [],
handleFilterChange: m,
params: f,
hasColumnsVisibilityDropdown: v = !1
}) => {
const { t: y } = Ve(), [T, _] = De([]), { formattedColumns: w, handleColumnsChange: R, resetColumns: x } = We({ key: u, columns: t });
return /* @__PURE__ */ h.jsxs(
"div",
{
className: "border border-border-light overflow-hidden rounded-xl w-full shadow-xs !max-h-[calc(100vh-var(--spacing)*24)] flex flex-col",
children: [
(l || v && u || !H.isEmpty(c)) && /* @__PURE__ */ h.jsxs("div", { className: "flex items-center justify-between p-4 gap-3 shrink-0", children: [
/* @__PURE__ */ h.jsx("div", { className: "shrink w-full", children: l && /* @__PURE__ */ h.jsx(
Ye,
{
defaultValue: H.get(f, "search", ""),
onSearchChange: (b) => ({ ...f, search: b, page: 1 })
}
) }),
/* @__PURE__ */ h.jsxs("div", { className: "flex shrink-0 items-center justify-end gap-3", children: [
v && u && /* @__PURE__ */ h.jsxs(Ce, { children: [
/* @__PURE__ */ h.jsx(Se, { asChild: !0, children: /* @__PURE__ */ h.jsxs(
Ne,
{
variant: "secondary",
size: "sm",
className: "ml-auto px-3 rounded-lg",
children: [
/* @__PURE__ */ h.jsx(mr, {}),
" ",
/* @__PURE__ */ h.jsx("span", { className: "hidden md:inline", children: y("Customize columns") }),
/* @__PURE__ */ h.jsx(ur, {})
]
}
) }),
/* @__PURE__ */ h.jsxs(Re, { align: "end", children: [
/* @__PURE__ */ h.jsxs(
Ee,
{
className: "capitalize",
onClick: x,
children: [
/* @__PURE__ */ h.jsx(pr, {}),
" ",
y("Reset columns")
]
}
),
/* @__PURE__ */ h.jsx(Te, {}),
w.map((b) => /* @__PURE__ */ h.jsx(
_e,
{
className: "capitalize",
checked: !b.hidden,
onCheckedChange: (E) => R(b, !E),
children: b.name
},
b.key
))
] })
] }),
!H.isEmpty(c) && /* @__PURE__ */ h.jsx(Ue, { filters: c, onFilter: m })
] })
] }),
/* @__PURE__ */ h.jsx(
wr,
{
params: f,
rows: e == null ? void 0 : e.docs,
rowKey: n,
columns: w,
hasCheckbox: a,
hasNumbers: o,
onRowClick: r,
onSelectedItemsChange: _,
onSortOrderChange: ({ sortField: b, sortOrder: E }) => {
i && i({ ...f, sortField: b, sortOrder: E });
}
}
),
d && /* @__PURE__ */ h.jsxs("div", { className: "flex flex-col lg:flex-row items-center justify-between gap-3 p-4 shrink-0", children: [
/* @__PURE__ */ h.jsx("div", { className: "text-sm", children: /* @__PURE__ */ h.jsx(
Le,
{
onLimitChange: (b) => {
i && i({ ...f, limit: b, page: 1 });
},
defaultValue: e == null ? void 0 : e.limit
}
) }),
/* @__PURE__ */ h.jsxs("div", { className: "text-sm text-muted-foreground", children: [
T.length,
" of ",
(e == null ? void 0 : e.total) || 0,
" row(s) selected."
] }),
/* @__PURE__ */ h.jsx("div", { children: /* @__PURE__ */ h.jsx(
ke,
{
onPageChange: (b) => {
i && i({ ...f, page: b });
},
currentPage: e == null ? void 0 : e.page,
totalPages: e == null ? void 0 : e.totalPages
}
) })
] })
]
}
);
};
export {
Ar as DataTable,
wr as MyTable
};