UNPKG

dgz-ui-shared

Version:

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library

179 lines (178 loc) 5.47 kB
import { j as e } from "./jsx-runtime-C5mzlN2N.js"; import { y as $, a as C, M as O, b as D } from "./MyInput-qse97Dxt.js"; import { u as r } from "./check-DE-1lGDl-24KCJ29m.js"; import { u as k } from "./useTranslation-dH-uwymc.js"; import { c } from "./createLucideIcon-B950nf2d.js"; import { memo as E, useState as y, useEffect as f, useCallback as b } from "react"; import { O as q, _ as A, u as I } from "./popover-DDxpKohG-BbuLlzlz.js"; import { M as L } from "./MySelect-U6BUrvYu.js"; import { u as R } from "./useFilter-YZXVbbYx.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 T = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], V = c("chevron-down", T); /** * @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 W = [ ["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" }] ], B = c("list-filter-plus", W); /** * @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 H = [ ["path", { d: "M3 6h18", key: "d0wm0j" }], ["path", { d: "M7 12h10", key: "b7w52i" }], ["path", { d: "M10 18h4", key: "1ulq68" }] ], P = c("list-filter", H); /** * @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), te = ({ name: l = "search", defaultValue: a, onSearchChange: t }) => { const { t: n } = k(), o = (i) => { const d = new FormData(i.currentTarget); t(d.get(l)), i.preventDefault(); }; return /* @__PURE__ */ e.jsxs( "form", { className: "relative min-w-40 w-full max-w-64", onSubmit: o, children: [ /* @__PURE__ */ e.jsx( $, { className: "rounded-lg h-8", name: l, placeholder: n("Search..."), defaultValue: a ? `${a}` : "" } ), /* @__PURE__ */ e.jsx( r, { type: "submit", variant: "ghost", className: "!bg-transparent absolute top-0 right-0 cursor-pointer rounded-md text-foreground", size: "sm", children: /* @__PURE__ */ e.jsx(J, {}) } ) ] } ); }, ne = E(function({ filters: a, params: t, onFilter: n, onChange: o, onCancel: i, ...d }) { const { t: m } = k(), [M, v] = y(!1), [N, h] = y(!1), { form: u } = R({ params: t }), { watch: g, getValues: w, handleSubmit: S, control: x, reset: j } = u; f(() => { let s = !1; a.map((z) => { const p = C.get(t, `${z.name}`); (Array.isArray(p) ? p.length > 0 : p) && (s = !0), v(s); }); }, [a, t]), f(() => { o && o(w()); }, [g()]); const _ = b( (s = {}) => { n && n(s), h(!1); }, [n] ), F = b(() => { j(), n && t && n({ ...t, ...Object.fromEntries( a.map((s) => [s.name, void 0]) ) }), h(!1); }, [n, j, t, a]); return /* @__PURE__ */ e.jsxs(q, { open: N, onOpenChange: h, children: [ /* @__PURE__ */ e.jsx(A, { children: /* @__PURE__ */ e.jsx( r, { asChild: !0, size: "sm", variant: "secondary", className: "ml-auto px-3", ...d, children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center", children: [ M ? /* @__PURE__ */ e.jsx(B, { size: 20 }) : /* @__PURE__ */ e.jsx(P, { size: 20 }), " ", /* @__PURE__ */ e.jsx("span", { className: "hidden md:inline", children: m("Filter") }), /* @__PURE__ */ e.jsx(V, {}) ] }) } ) }), /* @__PURE__ */ e.jsx(I, { side: "bottom", align: "end", className: "", children: /* @__PURE__ */ e.jsx(O, { ...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( L, { control: x, name: s.name, placeholder: s.placeholder, isMulti: s.isMulti, options: s.options, label: s.label }, s.name ) : /* @__PURE__ */ e.jsx( D, { 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( r, { variant: "destructive", type: "reset", size: "sm", onClick: F, children: m("Reset") } ), /* @__PURE__ */ e.jsx(r, { type: "submit", size: "sm", children: m("Apply") }) ] }) ] }) }) }) ] }); }); export { ne as F, te as S };