dgz-ui-shared 1.1.24 → 1.1.26

package/README.md

@@ -1,31 +1,236 @@
-- Actions
-- Confirm
-- ConfirmContainer
-- DataTable
-- DateRangePicker
-- Empty
-- ExportData
-- FilterWrapper
-- Loader
-- MyCheckbox
-- MyDatePicker
-- MyDateRangePicker
-- MyGallery
-- MyHtmlEditor
-- MyInput
-- MyLimitSelect
-- MyMaskInput
-- MyModal
-- MyPagination
-- MyRadio
-- MySelect
-- MySwitch
-- MyTable
-- MyTextarea
-- MyTimePicker
-- MyTooltip
-- ScrollArea
-- Search
-- SearchWithCtrl
-- Spin
-- ThemeToggle
+# dgz-ui-shared
+
+A robust, shared UI library built for React applications using TypeScript, Tailwind CSS, and `dgz-ui`. This library provides a collection of high-level components, hooks, and utilities to streamline development, featuring advanced data tables, form integrations, and responsive design patterns.
+
+## Features
+
+- **Advanced Data Table**: A feature-rich table component with server-side pagination, sorting, filtering, searching, column visibility management, and export capabilities.
+- **Form Components**: Wrappers for common form inputs (`Input`, `Select`, `DatePicker`, `Checkbox`, etc.) seamlessly integrated with `react-hook-form` and `zod` validation.
+- **Confirmation Dialogs**: Promise-based confirmation modals (including password confirmation) via the `useConfirm` hook.
+- **UI Patterns**: Ready-to-use components for Modals, Galleries, Tooltips, and Loaders.
+- **Theming**: Built-in dark/light mode support with `ThemeProvider` and `ThemeToggle`.
+- **Responsive Utilities**: Hooks for managing media queries and responsive layouts.
+- **Internationalization**: Built with `i18next` support for easy localization.
+
+## Installation
+
+Install the package via npm:
+
+```bash
+npm install dgz-ui-shared
+```
+
+Ensure you have the required peer dependencies installed:
+
+```bash
+npm install react react-dom dayjs
+```
+
+## Setup
+
+### 1. Import Styles
+
+Import the library's CSS in your main entry file (e.g., `main.tsx` or `App.tsx`):
+
+```tsx
+import 'dgz-ui-shared/dist/dgz-ui-shared.css';
+```
+
+### 2. Theme Provider
+
+Wrap your application with the `ThemeProvider` to enable theme management:
+
+```tsx
+import { ThemeProvider } from 'dgz-ui-shared/providers';
+
+function App() {
+  return (
+    <ThemeProvider defaultTheme="system" storageKey="vite-ui-theme">
+      <YourApp />
+    </ThemeProvider>
+  );
+}
+```
+
+## Usage Examples
+
+### Data Table
+
+The `DataTable` component is the centerpiece of this library. It handles complex data presentation needs with minimal boilerplate.
+
+```tsx
+import { DataTable } from 'dgz-ui-shared/components/datatable';
+import { useDataTable } from 'dgz-ui-shared/hooks';
+
+const MyUserTable = () => {
+  // Define columns
+  const columns = [
+    { key: 'name', dataIndex: 'name', name: 'Name', sortable: true },
+    { key: 'email', dataIndex: 'email', name: 'Email' },
+    { key: 'role', dataIndex: 'role', name: 'Role' },
+  ];
+
+  // Example data source (usually from an API)
+  const dataSource = {
+    docs: [
+      { id: 1, name: 'John Doe', email: 'john@example.com', role: 'Admin' },
+      // ... more data
+    ],
+    page: 1,
+    limit: 10,
+    totalPages: 5,
+    total: 50,
+  };
+
+  const handleParamChange = (params) => {
+    console.log('Fetch new data with:', params);
+  };
+
+  return (
+    <DataTable
+      tableKey="user-table"
+      rowKey="id"
+      columns={columns}
+      dataSource={dataSource}
+      onParamChange={handleParamChange}
+      hasPagination
+      hasSearch
+      hasColumnsVisibilityDropdown
+      hasCheckbox
+    />
+  );
+};
+```
+
+### Form Components
+
+Use the `My*` form components to build accessible, validated forms with `react-hook-form`.
+
+```tsx
+import { useForm } from 'react-hook-form';
+import { MyInput, MySelect } from 'dgz-ui-shared/components/form';
+import { Button } from 'dgz-ui/button'; // Assuming you have base UI components
+
+const SignUpForm = () => {
+  const { control, handleSubmit } = useForm();
+
+  const onSubmit = (data) => console.log(data);
+
+  return (
+    <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
+      <MyInput
+        control={control}
+        name="username"
+        label="Username"
+        required
+        placeholder="Enter your username"
+      />
+
+      <MySelect
+        control={control}
+        name="role"
+        label="Role"
+        options={[
+          { value: 'admin', label: 'Admin' },
+          { value: 'user', label: 'User' },
+        ]}
+      />
+
+      <Button type="submit">Submit</Button>
+    </form>
+  );
+};
+```
+
+### Confirmation Dialogs
+
+Trigger confirmation modals programmatically using `useConfirm`.
+
+```tsx
+import { useConfirm } from 'dgz-ui-shared/hooks';
+import { Button } from 'dgz-ui/button';
+
+const DeleteButton = () => {
+  const { confirm } = useConfirm();
+
+  const handleDelete = () => {
+    confirm({
+      onConfirm: () => {
+        console.log('Item deleted!');
+      },
+    });
+  };
+
+  return <Button onClick={handleDelete}>Delete Item</Button>;
+};
+```
+
+### Image Gallery
+
+Display a responsive grid of images with a fullscreen viewer.
+
+```tsx
+import { MyGallery } from 'dgz-ui-shared/components/gallery';
+
+const images = [
+  {
+    id: '1',
+    src: 'https://example.com/large.jpg',
+    thumbnail: 'https://example.com/thumb.jpg',
+    alt: 'Example Image',
+    title: 'Beautiful Scenery',
+  },
+];
+
+const GalleryPage = () => {
+  return <MyGallery images={images} hasInfo />;
+};
+```
+
+## Available Components
+
+| Category         | Components                                                                                                                                                   |
+| ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| **Data Display** | `DataTable`, `MyTable`, `MyGallery`                                                                                                                          |
+| **Form**         | `MyInput`, `MySelect`, `MyCheckbox`, `MyRadio`, `MySwitch`, `MyTextarea`, `MyDatePicker`, `MyDateRangePicker`, `MyTimePicker`, `MyHtmlEditor`, `MyMaskInput` |
+| **Feedback**     | `Loader`, `Spin`, `Empty`                                                                                                                                    |
+| **Overlays**     | `MyModal`, `Confirm`, `PasswordConfirm`, `MyTooltip`                                                                                                         |
+| **Navigation**   | `MyPagination`, `MyLimitSelect`                                                                                                                              |
+| **Utils**        | `ThemeToggle`, `ExportData`, `FilterWrapper`, `Search`                                                                                                       |
+
+## Hooks
+
+| Hook                 | Description                                          |
+| -------------------- | ---------------------------------------------------- |
+| `useDataTable`       | Manages row selection and table state.               |
+| `useColumns`         | Manages column visibility and persistence.           |
+| `useConfirm`         | Provides imperative API for confirmation dialogs.    |
+| `useTheme`           | Access and toggle current theme (light/dark/system). |
+| `useFilter`          | Syncs filter state with URL parameters or form.      |
+| `useMediaQuerySizes` | Responsive breakpoints helpers.                      |
+
+## Development
+
+Clone the repository and install dependencies:
+
+```bash
+git clone https://github.com/Alisher1119/dgz-ui-shared.git
+cd dgz-ui-shared
+npm install
+```
+
+### Available Scripts
+
+- `npm run dev`: Start the development server (Vite).
+- `npm run build`: Build the library for production.
+- `npm run lint`: Lint the codebase.
+- `npm run format`: Format code with Prettier.
+- `npm run test`: Run tests with Vitest.
+
+## License
+
+This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+
+## Author
+
+[Alisher Khayrillaev](https://github.com/Alisher1119)

package/dist/Actions-DYmkv_J9.js

@@ -0,0 +1,29 @@
+import { j as s } from "./jsx-runtime-DS1N_tNq.js";
+import { T as t, A as o, i as m, u as c } from "./dropdown-menu-TWRSm6RK-D_FJpI4C.js";
+import { u as d } from "./button-CdZDBhmr-BT_j3ig5.js";
+import { W as x, f as j } from "./index-BrQ82Wyu.js";
+const A = ({
+  actions: i,
+  triggerProps: n,
+  contentProps: a,
+  title: e
+}) => /* @__PURE__ */ s.jsxs(t, { children: [
+  /* @__PURE__ */ s.jsx(o, { asChild: !0, ...n, children: /* @__PURE__ */ s.jsxs(
+    d,
+    {
+      variant: "secondary",
+      size: "sm",
+      className: "ml-auto rounded-lg px-3",
+      children: [
+        /* @__PURE__ */ s.jsx(x, {}),
+        " ",
+        /* @__PURE__ */ s.jsx("span", { className: "hidden lg:!inline", children: e || "Actions" }),
+        /* @__PURE__ */ s.jsx(j, {})
+      ]
+    }
+  ) }),
+  /* @__PURE__ */ s.jsx(m, { align: "end", ...a, children: i.map((r, l) => /* @__PURE__ */ s.jsx(c, { onClick: () => r.onClick(), children: r.label }, l)) })
+] });
+export {
+  A
+};

package/dist/Actions-Dh8TPahn.cjs

@@ -0,0 +1 @@
+"use strict";const s=require("./jsx-runtime-h4oGeKUK.cjs"),n=require("./dropdown-menu-TWRSm6RK-DQ03CnVw.cjs"),c=require("./button-CdZDBhmr-3yMPCRDo.cjs"),t=require("./index-CGv7FLNy.cjs"),l=({actions:i,triggerProps:r,contentProps:x,title:o})=>s.jsxRuntimeExports.jsxs(n.Tt,{children:[s.jsxRuntimeExports.jsx(n.At,{asChild:!0,...r,children:s.jsxRuntimeExports.jsxs(c.u,{variant:"secondary",size:"sm",className:"ml-auto rounded-lg px-3",children:[s.jsxRuntimeExports.jsx(t.Wg,{})," ",s.jsxRuntimeExports.jsx("span",{className:"hidden lg:!inline",children:o||"Actions"}),s.jsxRuntimeExports.jsx(t.f1,{})]})}),s.jsxRuntimeExports.jsx(n.it,{align:"end",...x,children:i.map((e,u)=>s.jsxRuntimeExports.jsx(n.ut,{onClick:()=>e.onClick(),children:e.label},u))})]});exports.Actions=l;

package/dist/ExportData-DV3HcBlK.cjs

@@ -0,0 +1 @@
+"use strict";const s=require("./jsx-runtime-h4oGeKUK.cjs"),e=require("./dropdown-menu-TWRSm6RK-DQ03CnVw.cjs"),l=require("./button-CdZDBhmr-3yMPCRDo.cjs"),n=require("./index-CGv7FLNy.cjs"),a=require("./Spin-DBoJvG-Y.cjs"),c=({options:r,loading:i=!1,triggerProps:x,contentProps:u,title:o})=>s.jsxRuntimeExports.jsxs(e.Tt,{children:[s.jsxRuntimeExports.jsx(e.At,{asChild:!0,...x,children:s.jsxRuntimeExports.jsxs(l.u,{variant:"secondary",size:"sm",className:"ml-auto rounded-lg px-3",children:[i?s.jsxRuntimeExports.jsx(a.Spin,{}):s.jsxRuntimeExports.jsx(n.ZC,{})," ",s.jsxRuntimeExports.jsx("span",{className:"hidden lg:!inline",children:o||"Export"}),s.jsxRuntimeExports.jsx(n.f1,{})]})}),s.jsxRuntimeExports.jsx(e.it,{align:"end",...u,children:r.map((t,j)=>s.jsxRuntimeExports.jsx(e.ut,{onClick:()=>t.onClick(),children:t.label},j))})]});exports.ExportData=c;

package/dist/ExportData-DvwQ6UCI.js

@@ -0,0 +1,31 @@
+import { j as s } from "./jsx-runtime-DS1N_tNq.js";
+import { T as o, A as m, i as x, u as d } from "./dropdown-menu-TWRSm6RK-D_FJpI4C.js";
+import { u as c } from "./button-CdZDBhmr-BT_j3ig5.js";
+import { Z as p, f as j } from "./index-BrQ82Wyu.js";
+import { S as u } from "./Spin-D1geCtns.js";
+const k = ({
+  options: a,
+  loading: i = !1,
+  triggerProps: e,
+  contentProps: n,
+  title: t
+}) => /* @__PURE__ */ s.jsxs(o, { children: [
+  /* @__PURE__ */ s.jsx(m, { asChild: !0, ...e, children: /* @__PURE__ */ s.jsxs(
+    c,
+    {
+      variant: "secondary",
+      size: "sm",
+      className: "ml-auto rounded-lg px-3",
+      children: [
+        i ? /* @__PURE__ */ s.jsx(u, {}) : /* @__PURE__ */ s.jsx(p, {}),
+        " ",
+        /* @__PURE__ */ s.jsx("span", { className: "hidden lg:!inline", children: t || "Export" }),
+        /* @__PURE__ */ s.jsx(j, {})
+      ]
+    }
+  ) }),
+  /* @__PURE__ */ s.jsx(x, { align: "end", ...n, children: a.map((r, l) => /* @__PURE__ */ s.jsx(d, { onClick: () => r.onClick(), children: r.label }, l)) })
+] });
+export {
+  k as E
+};

package/dist/{FilterWrapper-Dk18nVPy.js → FilterWrapper-CRF1U7yO.js}

@@ -1,120 +1,127 @@
 import { j as e } from "./jsx-runtime-DS1N_tNq.js";
-import { y as D, b as E } from "./input-mask-DBLFIvhN-BBxoZxnd.js";
-import { u as l } from "./button-CdZDBhmr-BT_j3ig5.js";
-import { m as F } from "./utils-B6fNqzRf-B1_jG1K7.js";
-import { u as M } from "./useTranslation-dH-uwymc.js";
-import { c as i } from "./createLucideIcon-B950nf2d.js";
-import { memo as q, useState as b, useEffect as k, useCallback as v } from "react";
-import { l as A } from "./lodash-CYNxjS-I.js";
-import { _ as I, w as L, u as O } from "./popover-OZcfKDD9-C2PVWPLS.js";
-import { M as R } from "./MyInput-B-QCpehg.js";
-import { M as C } from "./MySelect-C5uWRVJh.js";
-import { u as P } from "./useFilter-DJunNBm2.js";
+import { y as A, b as I } from "./input-mask-DBLFIvhN-BBxoZxnd.js";
+import { u as c } from "./button-CdZDBhmr-BT_j3ig5.js";
+import { m as L } from "./utils-B6fNqzRf-B1_jG1K7.js";
+import { u as O } from "./useTranslation-dH-uwymc.js";
+import { c as l } from "./createLucideIcon-B950nf2d.js";
+import { memo as R, useState as b, useEffect as k, useCallback as v } from "react";
+import { l as C } from "./lodash-CYNxjS-I.js";
+import { _ as P, w as T, u as V } from "./popover-OZcfKDD9-C2PVWPLS.js";
+import { M as W } from "./MyInput-B-QCpehg.js";
+import { M as B } from "./MySelect-C5uWRVJh.js";
+import { u as G } from "./useFilter-DJunNBm2.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 = i("chevron-down", T);
+const H = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], J = l("chevron-down", 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 W = [
+const K = [
   ["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 = i("list-filter-plus", W);
+], Q = l("list-filter-plus", K);
 /**
  * @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 = [
+const U = [
   ["path", { d: "M3 6h18", key: "d0wm0j" }],
   ["path", { d: "M7 12h10", key: "b7w52i" }],
   ["path", { d: "M10 18h4", key: "1ulq68" }]
-], H = i("list-filter", G);
+], X = l("list-filter", U);
 /**
  * @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 J = [
+const Y = [
   ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
-], K = i("search", J), ce = ({
-  name: m = "search",
+], Z = l("search", Y), pe = ({
+  name: i = "search",
   defaultValue: t,
   onSearchChange: o,
   placeholder: a,
   className: r,
   ...x
 }) => {
-  const { t: d } = M(), n = (c) => {
-    const p = new FormData(c.currentTarget);
-    o(p.get(m) || void 0), c.preventDefault(), c.stopPropagation();
+  const { t: m } = O(), d = (n) => {
+    const p = new FormData(n.currentTarget);
+    o(p.get(i) || void 0), n.preventDefault(), n.stopPropagation();
   };
   return /* @__PURE__ */ e.jsxs(
     "form",
     {
-      className: F("relative w-full max-w-64 min-w-40", r),
-      onSubmit: n,
+      className: L("relative w-full max-w-64 min-w-40", r),
+      onSubmit: d,
       children: [
         /* @__PURE__ */ e.jsx(
-          D,
+          A,
           {
             ...x,
             className: "h-8 rounded-lg",
-            name: m,
-            placeholder: a || d("Search..."),
+            name: i,
+            placeholder: a || m("Search..."),
             defaultValue: t ? `${t}` : ""
           }
         ),
         /* @__PURE__ */ e.jsx(
-          l,
+          c,
           {
             type: "submit",
             variant: "ghost",
             className: "text-foreground absolute top-0 right-0 cursor-pointer rounded-md !bg-transparent",
             size: "sm",
-            children: /* @__PURE__ */ e.jsx(K, {})
+            children: /* @__PURE__ */ e.jsx(Z, {})
           }
         )
       ]
     }
   );
-}, le = q(function({
+}, he = R(function({
   filters: t,
   params: o,
   onFilter: a,
   onChange: r,
   onCancel: x,
-  ...d
+  triggerProps: m,
+  contentProps: d,
+  title: n,
+  resetText: p,
+  applyText: N,
+  ...M
 }) {
-  const { t: n } = M(), [c, p] = b(!1), [N, h] = b(!1), { form: j } = P({ params: o }), { watch: w, getValues: g, handleSubmit: S, control: y, reset: f } = j;
+  const [w, g] = b(!1), [S, h] = b(!1), { form: j } = G({ params: o }), { watch: _, getValues: z, handleSubmit: $, control: y, reset: f } = j;
   k(() => {
     let s = !1;
-    t.map(($) => {
-      const u = A.get(o, `${$.name}`);
-      (Array.isArray(u) ? u.length > 0 : u) && (s = !0), p(s);
+    t.map((q) => {
+      const u = C.get(o, `${q.name}`);
+      (Array.isArray(u) ? u.length > 0 : u) && (s = !0), g(s);
     });
-  }, [t, o]), k(() => {
-    r == null || r(g());
-  }, [w()]);
-  const _ = v(
+  }, [t, o]);
+  const D = _();
+  k(() => {
+    r == null || r(z());
+  }, [D]);
+  const E = v(
     (s = {}) => {
       a == null || a(s), h(!1);
     },
     [a]
-  ), z = v(() => {
+  ), F = v(() => {
     f(), a && o && a({
       ...o,
       ...Object.fromEntries(
@@ -122,27 +129,27 @@ const J = [
       )
     }), h(!1);
   }, [a, f, o, t]);
-  return /* @__PURE__ */ e.jsxs(I, { open: N, onOpenChange: h, children: [
-    /* @__PURE__ */ e.jsx(L, { children: /* @__PURE__ */ e.jsx(
-      l,
+  return /* @__PURE__ */ e.jsxs(P, { open: S, onOpenChange: h, children: [
+    /* @__PURE__ */ e.jsx(T, { ...m, children: /* @__PURE__ */ e.jsx(
+      c,
       {
         asChild: !0,
         size: "sm",
         variant: "secondary",
         className: "ml-auto px-3",
-        ...d,
+        ...M,
         children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center", children: [
-          c ? /* @__PURE__ */ e.jsx(B, { size: 20 }) : /* @__PURE__ */ e.jsx(H, { size: 20 }),
+          w ? /* @__PURE__ */ e.jsx(Q, { className: "size-5" }) : /* @__PURE__ */ e.jsx(X, { className: "size-5" }),
           " ",
-          /* @__PURE__ */ e.jsx("span", { className: "hidden lg:!inline", children: n("Filter") }),
-          /* @__PURE__ */ e.jsx(V, {})
+          /* @__PURE__ */ e.jsx("span", { className: "hidden lg:!inline", children: n || "Filter" }),
+          /* @__PURE__ */ e.jsx(J, {})
         ] })
       }
     ) }),
-    /* @__PURE__ */ e.jsx(O, { side: "bottom", align: "end", className: "", children: /* @__PURE__ */ e.jsx(E, { ...j, children: /* @__PURE__ */ e.jsxs("form", { onSubmit: S(_), className: "space-y-2", children: [
+    /* @__PURE__ */ e.jsx(V, { side: "bottom", align: "end", ...d, children: /* @__PURE__ */ e.jsx(I, { ...j, children: /* @__PURE__ */ e.jsxs("form", { onSubmit: $(E), className: "space-y-2", children: [
       /* @__PURE__ */ e.jsx("div", { className: "h-full shrink p-1", children: t.map(
         (s) => s.options ? /* @__PURE__ */ e.jsx(
-          C,
+          B,
           {
             control: y,
             name: s.name,
@@ -153,7 +160,7 @@ const J = [
           },
           s.name
         ) : /* @__PURE__ */ e.jsx(
-          R,
+          W,
           {
             control: y,
             placeholder: s.placeholder,
@@ -165,21 +172,21 @@ const J = [
       ) }),
       /* @__PURE__ */ e.jsxs("div", { className: "flex shrink-0 justify-end gap-2", children: [
         /* @__PURE__ */ e.jsx(
-          l,
+          c,
           {
             variant: "destructive",
             type: "reset",
             size: "sm",
-            onClick: z,
-            children: n("Reset")
+            onClick: F,
+            children: p || "Reset"
           }
         ),
-        /* @__PURE__ */ e.jsx(l, { type: "submit", size: "sm", children: n("Apply") })
+        /* @__PURE__ */ e.jsx(c, { type: "submit", size: "sm", children: N || "Apply" })
       ] })
     ] }) }) })
   ] });
 });
 export {
-  le as F,
-  ce as S
+  he as F,
+  pe as S
 };

package/dist/FilterWrapper-uGnbHc44.cjs

@@ -0,0 +1,21 @@
+"use strict";const e=require("./jsx-runtime-h4oGeKUK.cjs"),b=require("./input-mask-DBLFIvhN-C_0RAR2l.cjs"),i=require("./button-CdZDBhmr-3yMPCRDo.cjs"),z=require("./utils-B6fNqzRf-BNysSCt9.cjs"),F=require("./useTranslation-CZf20ucv.cjs"),u=require("./createLucideIcon-BnAj0RnC.cjs"),o=require("react"),$=require("./lodash-C5w_OPmE.cjs"),j=require("./popover-OZcfKDD9-KUWOsIOs.cjs"),B=require("./MyInput-9MnlVZ4h.cjs"),C=require("./MySelect-DNK997Bi.cjs"),O=require("./useFilter-Cwz8oftI.cjs");/**
+ * @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 A=[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]],T=u.createLucideIcon("chevron-down",A);/**
+ * @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"}]],P=u.createLucideIcon("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 V=[["path",{d:"M3 6h18",key:"d0wm0j"}],["path",{d:"M7 12h10",key:"b7w52i"}],["path",{d:"M10 18h4",key:"1ulq68"}]],Z=u.createLucideIcon("list-filter",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 G=[["path",{d:"m21 21-4.34-4.34",key:"14j7rj"}],["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}]],H=u.createLucideIcon("search",G),K=({name:l="search",defaultValue:n,onSearchChange:r,placeholder:t,className:c,...y})=>{const{t:x}=F.useTranslation(),p=a=>{const d=new FormData(a.currentTarget);r(d.get(l)||void 0),a.preventDefault(),a.stopPropagation()};return e.jsxRuntimeExports.jsxs("form",{className:z.mo("relative w-full max-w-64 min-w-40",c),onSubmit:p,children:[e.jsxRuntimeExports.jsx(b.yp,{...y,className:"h-8 rounded-lg",name:l,placeholder:t||x("Search..."),defaultValue:n?`${n}`:""}),e.jsxRuntimeExports.jsx(i.u,{type:"submit",variant:"ghost",className:"text-foreground absolute top-0 right-0 cursor-pointer rounded-md !bg-transparent",size:"sm",children:e.jsxRuntimeExports.jsx(H,{})})]})},J=o.memo(function({filters:n,params:r,onFilter:t,onChange:c,onCancel:y,triggerProps:x,contentProps:p,title:a,resetText:d,applyText:v,...N}){const[q,f]=o.useState(!1),[M,m]=o.useState(!1),{form:E}=O.useFilter({params:r}),{watch:w,getValues:S,handleSubmit:g,control:R,reset:k}=E;o.useEffect(()=>{let s=!1;n.map(L=>{const h=$.lodashExports.get(r,`${L.name}`);(Array.isArray(h)?h.length>0:h)&&(s=!0),f(s)})},[n,r]);const I=w();o.useEffect(()=>{c==null||c(S())},[I]);const _=o.useCallback((s={})=>{t==null||t(s),m(!1)},[t]),D=o.useCallback(()=>{k(),t&&r&&t({...r,...Object.fromEntries(n.map(s=>[s.name,void 0]))}),m(!1)},[t,k,r,n]);return e.jsxRuntimeExports.jsxs(j._e,{open:M,onOpenChange:m,children:[e.jsxRuntimeExports.jsx(j.we,{...x,children:e.jsxRuntimeExports.jsx(i.u,{asChild:!0,size:"sm",variant:"secondary",className:"ml-auto px-3",...N,children:e.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[q?e.jsxRuntimeExports.jsx(P,{className:"size-5"}):e.jsxRuntimeExports.jsx(Z,{className:"size-5"})," ",e.jsxRuntimeExports.jsx("span",{className:"hidden lg:!inline",children:a||"Filter"}),e.jsxRuntimeExports.jsx(T,{})]})})}),e.jsxRuntimeExports.jsx(j.ue,{side:"bottom",align:"end",...p,children:e.jsxRuntimeExports.jsx(b.Gx,{...E,children:e.jsxRuntimeExports.jsxs("form",{onSubmit:g(_),className:"space-y-2",children:[e.jsxRuntimeExports.jsx("div",{className:"h-full shrink p-1",children:n.map(s=>s.options?e.jsxRuntimeExports.jsx(C.MySelect,{control:R,name:s.name,placeholder:s.placeholder,isMulti:s.isMulti,options:s.options,label:s.label},s.name):e.jsxRuntimeExports.jsx(B.MyInput,{control:R,placeholder:s.placeholder,name:s.name,label:s.label},s.name))}),e.jsxRuntimeExports.jsxs("div",{className:"flex shrink-0 justify-end gap-2",children:[e.jsxRuntimeExports.jsx(i.u,{variant:"destructive",type:"reset",size:"sm",onClick:D,children:d||"Reset"}),e.jsxRuntimeExports.jsx(i.u,{type:"submit",size:"sm",children:v||"Apply"})]})]})})})]})});exports.FilterWrapper=J;exports.Search=K;

package/dist/components/actions/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../Actions-uGf1oq7E.cjs");exports.Actions=t.Actions;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../Actions-Dh8TPahn.cjs");exports.Actions=t.Actions;

package/dist/components/actions/index.es.js

@@ -1,4 +1,4 @@
-import { A as s } from "../../Actions-CKVu3P3q.js";
+import { A as s } from "../../Actions-DYmkv_J9.js";
 export {
   s as Actions
 };