dgz-ui-shared
Version:
Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library
181 lines (180 loc) • 5.59 kB
JavaScript
import { j as e } from "./jsx-runtime-C5mzlN2N.js";
import { y as O, P as D } from "./radio-group-CqPTye2U-DGs9dBuR.js";
import { u as n } from "./button-Bp2lHjov-BTlHPcva.js";
import { u as b } from "./useTranslation-dH-uwymc.js";
import { c } from "./createLucideIcon-B950nf2d.js";
import { memo as E, useState as y, useEffect as f, useCallback as k } from "react";
import { l as F } from "./lodash-CYNxjS-I.js";
import { O as q, _ as A, u as I } from "./popover-HTqpqYpJ-CwZxzUFN.js";
import { M as L } from "./MyInput-CHKuq1qI.js";
import { M as P } from "./MySelect-B49OLiFT.js";
import { u as R } from "./useFilter-DMpxv27U.js";
/**
* @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 C = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], T = c("chevron-down", C);
/**
* @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 V = [
["path", { d: "M10 18h4", key: "1ulq68" }],
["path", { d: "M11 6H3", key: "1u26ik" }],
["path", { d: "M15 6h6", key: "1jlkvy" }],
["path", { d: "M18 9V3", key: "xwwp7m" }],
["path", { d: "M7 12h8", key: "7a1bxv" }]
], W = c("list-filter-plus", V);
/**
* @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 B = [
["path", { d: "M3 6h18", key: "d0wm0j" }],
["path", { d: "M7 12h10", key: "b7w52i" }],
["path", { d: "M10 18h4", key: "1ulq68" }]
], H = c("list-filter", B);
/**
* @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 G = [
["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
], J = c("search", G), re = ({
name: l = "search",
defaultValue: a,
onSearchChange: o
}) => {
const { t } = b(), r = (i) => {
const m = new FormData(i.currentTarget);
o(m.get(l) || void 0), i.preventDefault();
};
return /* @__PURE__ */ e.jsxs(
"form",
{
className: "relative w-full max-w-64 min-w-40",
onSubmit: r,
children: [
/* @__PURE__ */ e.jsx(
O,
{
className: "h-8 rounded-lg",
name: l,
placeholder: t("Search..."),
defaultValue: a ? `${a}` : ""
}
),
/* @__PURE__ */ e.jsx(
n,
{
type: "submit",
variant: "ghost",
className: "text-foreground absolute top-0 right-0 cursor-pointer rounded-md !bg-transparent",
size: "sm",
children: /* @__PURE__ */ e.jsx(J, {})
}
)
]
}
);
}, ne = E(function({
filters: a,
params: o,
onFilter: t,
onChange: r,
onCancel: i,
...m
}) {
const { t: d } = b(), [v, M] = y(!1), [N, h] = y(!1), { form: u } = R({ params: o }), { watch: w, getValues: g, handleSubmit: S, control: x, reset: j } = u;
f(() => {
let s = !1;
a.map(($) => {
const p = F.get(o, `${$.name}`);
(Array.isArray(p) ? p.length > 0 : p) && (s = !0), M(s);
});
}, [a, o]), f(() => {
r == null || r(g());
}, [w()]);
const _ = k(
(s = {}) => {
t == null || t(s), h(!1);
},
[t]
), z = k(() => {
j(), t && o && t({
...o,
...Object.fromEntries(
a.map((s) => [s.name, void 0])
)
}), h(!1);
}, [t, j, o, a]);
return /* @__PURE__ */ e.jsxs(q, { open: N, onOpenChange: h, children: [
/* @__PURE__ */ e.jsx(A, { children: /* @__PURE__ */ e.jsx(
n,
{
asChild: !0,
size: "sm",
variant: "secondary",
className: "ml-auto px-3",
...m,
children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center", children: [
v ? /* @__PURE__ */ e.jsx(W, { size: 20 }) : /* @__PURE__ */ e.jsx(H, { size: 20 }),
" ",
/* @__PURE__ */ e.jsx("span", { className: "hidden lg:!inline", children: d("Filter") }),
/* @__PURE__ */ e.jsx(T, {})
] })
}
) }),
/* @__PURE__ */ e.jsx(I, { side: "bottom", align: "end", className: "", children: /* @__PURE__ */ e.jsx(D, { ...u, children: /* @__PURE__ */ e.jsxs("form", { onSubmit: S(_), className: "space-y-2", children: [
/* @__PURE__ */ e.jsx("div", { className: "h-full shrink p-1", children: a.map(
(s) => s.options ? /* @__PURE__ */ e.jsx(
P,
{
control: x,
name: s.name,
placeholder: s.placeholder,
isMulti: s.isMulti,
options: s.options,
label: s.label
},
s.name
) : /* @__PURE__ */ e.jsx(
L,
{
control: x,
placeholder: s.placeholder,
name: s.name,
label: s.label
},
s.name
)
) }),
/* @__PURE__ */ e.jsxs("div", { className: "flex shrink-0 justify-end gap-2", children: [
/* @__PURE__ */ e.jsx(
n,
{
variant: "destructive",
type: "reset",
size: "sm",
onClick: z,
children: d("Reset")
}
),
/* @__PURE__ */ e.jsx(n, { type: "submit", size: "sm", children: d("Apply") })
] })
] }) }) })
] });
});
export {
ne as F,
re as S
};