@ztwoint/z-ui 0.1.70 → 0.1.72

package/dist/components/table-filter/close-filter-confirm/filter-confirmation-dialog.d.ts

@@ -4,7 +4,6 @@ interface FilterConfirmationDialogProps {
     onKeepChanges: () => void;
     onRevertChanges: () => void;
     onApplyChanges: () => void;
-    hasUnsavedChanges: boolean;
 }
 export declare const FilterConfirmationDialog: React.FC<FilterConfirmationDialogProps>;
 export {};

package/dist/components/table-filter/close-filter-confirm/filter-confirmation-dialog.js

@@ -1,33 +1,32 @@
 import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import { Button as l } from "../../button/button.js";
-import { Z2Dialog as s, Z2DialogContent as d, Z2DialogHeader as h, Z2DialogTitle as c, Z2DialogDescription as g, Z2DialogFooter as m } from "../../dialog/dialog.js";
-const v = ({
-  onClose: r,
-  onKeepChanges: i,
-  onRevertChanges: o,
-  onApplyChanges: a,
-  hasUnsavedChanges: t
-}) => t ? /* @__PURE__ */ e(s, { open: !0, onOpenChange: r, children: /* @__PURE__ */ n(d, { className: "max-w-md p-4 rounded-2xl", children: [
-  /* @__PURE__ */ n(h, { children: [
+import { Button as i } from "../../button/button.js";
+import { Z2Dialog as t, Z2DialogContent as s, Z2DialogHeader as d, Z2DialogTitle as h, Z2DialogDescription as c, Z2DialogFooter as g } from "../../dialog/dialog.js";
+const f = ({
+  onClose: l,
+  onKeepChanges: o,
+  onRevertChanges: r,
+  onApplyChanges: a
+}) => /* @__PURE__ */ e(t, { open: !0, onOpenChange: l, children: /* @__PURE__ */ n(s, { className: "max-w-md p-4 rounded-2xl", children: [
+  /* @__PURE__ */ n(d, { children: [
     /* @__PURE__ */ n("div", { className: "flex justify-between", children: [
-      /* @__PURE__ */ e(c, { children: "Unsaved Filter Changes" }),
+      /* @__PURE__ */ e(h, { children: "Unsaved Filter Changes" }),
       /* @__PURE__ */ e(
-        l,
+        i,
         {
           "aria-label": "Close",
           className: "ml-4 p-2 text-xl leading-none font-bold bg-transparent border-none shadow-none hover:bg-gray-100 min-w-0 min-h-0",
-          onClick: i,
+          onClick: o,
           children: "×"
         }
       )
     ] }),
-    /* @__PURE__ */ e(g, { children: "You have unsaved filter changes. Would you like to keep these changes or revert to the previous state?" })
+    /* @__PURE__ */ e(c, { children: "You have unsaved filter changes. Would you like to keep these changes or revert to the previous state?" })
   ] }),
-  /* @__PURE__ */ n(m, { children: [
-    /* @__PURE__ */ e(l, { onClick: o, variant: "stroke", shade: "danger", size: "small", children: "Discard" }),
-    /* @__PURE__ */ e(l, { onClick: a, variant: "filled", shade: "brand", size: "small", children: "Apply Changes" })
+  /* @__PURE__ */ n(g, { children: [
+    /* @__PURE__ */ e(i, { onClick: r, variant: "stroke", shade: "danger", size: "small", children: "Discard" }),
+    /* @__PURE__ */ e(i, { onClick: a, variant: "filled", shade: "brand", size: "small", children: "Apply Changes" })
   ] })
-] }) }) : null;
+] }) });
 export {
-  v as FilterConfirmationDialog
+  f as FilterConfirmationDialog
 };

package/dist/components/table-filter/close-filter-confirm/filter-confirmation-dialog.utils.js

@@ -1,20 +1,20 @@
-const v = (l, n) => {
-  if (l.length !== n.length)
+const v = (u, t) => {
+  if (u.length !== t.length)
     return !1;
-  const u = [...l].sort((e, t) => e.field.localeCompare(t.field)), r = [...n].sort((e, t) => e.field.localeCompare(t.field));
-  return u.every((e, t) => {
-    const a = r[t];
-    return e.field !== a.field || e.condition !== a.condition ? !1 : Array.isArray(e.value) && Array.isArray(a.value) ? e.value.length !== a.value.length ? !1 : e.value.every((i, s) => i === a.value[s]) : Array.isArray(e.value) || Array.isArray(a.value) ? !1 : e.value === a.value;
+  const i = [...u].sort((r, l) => r.field.localeCompare(l.field)), e = [...t].sort((r, l) => r.field.localeCompare(l.field));
+  return i.every((r, l) => {
+    const a = e[l];
+    return r.field !== a.field || r.condition !== a.condition ? !1 : Array.isArray(r.value) && Array.isArray(a.value) ? r.value.length !== a.value.length ? !1 : r.value.every((n, s) => n === a.value[s]) : Array.isArray(r.value) || Array.isArray(a.value) ? !1 : r.value === a.value;
   });
-}, o = (l, n) => {
-  const u = l.filter((r) => Array.isArray(r.value) ? r.value.length > 0 : r.value !== "");
-  return !v(u, n);
-}, f = (l, n, u) => {
-  const r = n.find((a) => a.field === l), e = u.find((a) => a.field === l);
-  return !r || !(Array.isArray(r.value) ? r.value.length > 0 : r.value !== "") ? !1 : !e || r.condition !== e.condition ? !0 : Array.isArray(r.value) && Array.isArray(e.value) ? r.value.length !== e.value.length ? !0 : !r.value.every((a, i) => a === e.value[i]) : Array.isArray(r.value) || Array.isArray(e.value) ? !0 : r.value !== e.value;
+}, o = (u, t) => {
+  const i = u.filter((e) => Array.isArray(e.value) ? e.value.length > 0 : e.value !== "");
+  return !v(i, t);
+}, y = (u, t, i) => {
+  const e = t.find((n) => n.field === u), r = i.find((n) => n.field === u), l = e && (Array.isArray(e.value) ? e.value.length > 0 : e.value !== ""), a = r && (Array.isArray(r.value) ? r.value.length > 0 : r.value !== "");
+  return !l && a || l && !a ? !0 : !l && !a ? !1 : l && a && e && r ? e.condition !== r.condition ? !0 : Array.isArray(e.value) && Array.isArray(r.value) ? e.value.length !== r.value.length ? !0 : !e.value.every((n, s) => n === r.value[s]) : Array.isArray(e.value) || Array.isArray(r.value) ? !0 : e.value !== r.value : !1;
 };
 export {
   v as areFiltersEqual,
   o as hasUnsavedFilterChanges,
-  f as hasUnsavedFilterChangesForColumn
+  y as hasUnsavedFilterChangesForColumn
 };

package/dist/components/table-filter/table-filter-button.js

@@ -1,73 +1,73 @@
 import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import * as C from "react";
+import * as y from "react";
 import * as m from "@radix-ui/react-popover";
 import { Button as u } from "../button/button.js";
-import { useTableFilterContext as I } from "./table-filter.context.js";
+import { useTableFilterContext as H } from "./table-filter.context.js";
 import U from "./filters/text.js";
-import H from "./filters/boolean.js";
-import V from "./filters/number/number.js";
-import q from "./filters/checkbox.js";
-import E from "../assets/icons/circle-check-filled.js";
-import { SelectedFiltersDisplay as G } from "./selected-filters-display/selected-filters-display.js";
-import { createFilterDisplayItems as J, calculateTotalCount as L } from "./selected-filters-display/selected-filters-display.utils.js";
-import { FilterConfirmationDialog as M } from "./close-filter-confirm/filter-confirmation-dialog.js";
-import { hasUnsavedFilterChanges as F } from "./close-filter-confirm/filter-confirmation-dialog.utils.js";
+import V from "./filters/boolean.js";
+import q from "./filters/number/number.js";
+import E from "./filters/checkbox.js";
+import G from "../assets/icons/circle-check-filled.js";
+import { SelectedFiltersDisplay as J } from "./selected-filters-display/selected-filters-display.js";
+import { createFilterDisplayItems as L, calculateTotalCount as M } from "./selected-filters-display/selected-filters-display.utils.js";
+import { FilterConfirmationDialog as Q } from "./close-filter-confirm/filter-confirmation-dialog.js";
+import { hasUnsavedFilterChanges as C } from "./close-filter-confirm/filter-confirmation-dialog.utils.js";
 const ne = () => {
-  const [N, a] = C.useState(!1), [x, n] = C.useState(!1), {
+  const [F, a] = y.useState(!1), [x, n] = y.useState(!1), {
     selectedColumn: r,
-    setSelectedColumn: k,
+    setSelectedColumn: N,
     getFilterForColumn: w,
-    hasFilterForColumn: K,
-    updateColumnFilter: j,
-    clearAllFilters: A,
-    resetToAppliedFilters: D,
-    applyFilters: O,
+    hasFilterForColumn: k,
+    updateColumnFilter: K,
+    clearAllFilters: j,
+    resetToAppliedFilters: A,
+    applyFilters: D,
     hasActiveFilters: d,
     tempFilters: i,
     filterSchema: c,
     filter: h,
     filterComponents: p = {}
-  } = I(), P = (e) => {
-    !e && x ? F(i, h.value) ? a(!0) : n(!1) : n(e);
+  } = H(), O = (e) => {
+    !e && x ? C(i, h.value) ? a(!0) : n(!1) : n(e);
   }, g = () => {
-    O(), n(!1);
-  }, S = () => {
+    D(), a(!1), n(!1);
+  }, P = () => {
     a(!1), n(!1);
+  }, S = () => {
+    A(), a(!1), n(!1);
   }, T = () => {
-    D(), a(!1), n(!1);
-  }, $ = () => {
     a(!1);
-  }, R = J(i, c), v = L(R), z = () => {
+  }, $ = C(i, h.value), R = L(i, c), z = M(R), B = () => {
     if (!r) return null;
-    const e = c.find((s) => s.filterKey === r), b = {
-      boolean: H,
+    const e = c.find((o) => o.filterKey === r), v = {
+      boolean: V,
       string: U,
-      number: V,
-      checkbox: q
-    }, y = (e == null ? void 0 : e.type) && (p == null ? void 0 : p[e.type]) || b[(e == null ? void 0 : e.type) ?? "string"];
-    if (!y)
+      number: q,
+      checkbox: E
+    }, b = (e == null ? void 0 : e.type) && (p == null ? void 0 : p[e.type]) || v[(e == null ? void 0 : e.type) ?? "string"];
+    if (!b)
       return console.warn(
         `No filter component found for column "${e == null ? void 0 : e.filterKey}" with type "${e == null ? void 0 : e.type}". Provide a custom filter component or use supported types: "string", "number", "boolean", "checkbox".`
       ), null;
-    const o = w(r), B = {
-      condition: (o == null ? void 0 : o.condition) || "",
-      value: (o == null ? void 0 : o.value) || ""
+    const s = w(r), I = {
+      condition: (s == null ? void 0 : s.condition) || "",
+      value: (s == null ? void 0 : s.value) || ""
     };
     return /* @__PURE__ */ t("div", { className: "flex-1 h-full", children: /* @__PURE__ */ t("div", { className: "mb-4 h-full", children: /* @__PURE__ */ t(
-      y,
+      b,
       {
-        value: B,
-        onChange: ({ condition: s, value: f }) => j(r, s, f),
-        filterOptions: e != null && e.options ? Object.entries(e.options).map(([s, f]) => ({
-          label: s,
-          value: s,
+        value: I,
+        onChange: ({ condition: o, value: f }) => K(r, o, f),
+        filterOptions: e != null && e.options ? Object.entries(e.options).map(([o, f]) => ({
+          label: o,
+          value: o,
           total: f
         })) : void 0
       },
       r
     ) }) });
   };
-  return /* @__PURE__ */ l(m.Root, { open: x, onOpenChange: P, children: [
+  return /* @__PURE__ */ l(m.Root, { open: x, onOpenChange: O, children: [
     /* @__PURE__ */ t(m.Trigger, { asChild: !0, children: /* @__PURE__ */ l(
       u,
       {
@@ -93,22 +93,22 @@ const ne = () => {
               c.map((e) => /* @__PURE__ */ l(
                 "button",
                 {
-                  onClick: () => k(e.filterKey),
+                  onClick: () => N(e.filterKey),
                   className: `w-full text-left p-2 text-sm flex items-center justify-between hover:bg-surface-neutral-hovered transition-colors rounded-lg ${r === e.filterKey ? "bg-surface-neutral-focused text-text-brand-primary" : "text-text-neutral-primary"}`,
                   children: [
                     /* @__PURE__ */ t("span", { className: "truncate", children: e.title }),
-                    K(e.filterKey) && /* @__PURE__ */ t(E, { className: "w-4 h-4 text-text-brand-secondary flex-shrink-0 ml-2" })
+                    k(e.filterKey) && /* @__PURE__ */ t(G, { className: "w-4 h-4 text-text-brand-secondary flex-shrink-0 ml-2" })
                   ]
                 },
                 e.filterKey
               ))
             ] }),
-            /* @__PURE__ */ t("div", { className: "flex-1 flex flex-col", children: r ? z() : /* @__PURE__ */ t("div", { className: "flex-1 flex items-center justify-center text-text-neutral-muted", children: "Select a column to configure its filter" }) })
+            /* @__PURE__ */ t("div", { className: "flex-1 flex flex-col", children: r ? B() : /* @__PURE__ */ t("div", { className: "flex-1 flex items-center justify-center text-text-neutral-muted", children: "Select a column to configure its filter" }) })
           ] }),
-          !!v && /* @__PURE__ */ l("div", { className: "flex justify-between items-end p-4 border-t border-stroke-solid-medium min-h-[71px]", children: [
-            /* @__PURE__ */ t(G, { selectedFilters: i, schema: c }),
+          $ && /* @__PURE__ */ l("div", { className: "flex justify-between items-end p-4 border-t border-stroke-solid-medium min-h-[73px]", children: [
+            /* @__PURE__ */ t(J, { selectedFilters: i, schema: c }),
             /* @__PURE__ */ l("div", { className: "flex justify-end gap-2", children: [
-              /* @__PURE__ */ t(u, { onClick: A, variant: "stroke", shade: "neutral", size: "small", children: "Clear All" }),
+              /* @__PURE__ */ t(u, { onClick: j, variant: "stroke", shade: "neutral", size: "small", children: "Clear All" }),
               /* @__PURE__ */ t(
                 u,
                 {
@@ -116,7 +116,8 @@ const ne = () => {
                   variant: "filled",
                   shade: "neutral",
                   size: "small",
-                  children: `Apply ${v || ""}`
+                  className: "min-w-20",
+                  children: `Apply ${z || ""}`
                 }
               )
             ] })
@@ -124,14 +125,13 @@ const ne = () => {
         ]
       }
     ) }),
-    N && /* @__PURE__ */ t(
-      M,
+    F && /* @__PURE__ */ t(
+      Q,
       {
-        onClose: $,
-        onKeepChanges: S,
-        onRevertChanges: T,
-        onApplyChanges: g,
-        hasUnsavedChanges: F(i, h.value)
+        onClose: T,
+        onKeepChanges: P,
+        onRevertChanges: S,
+        onApplyChanges: g
       }
     )
   ] });

package/dist/components/table-filter/table-filter-column-button.js

@@ -1,72 +1,73 @@
 import { jsxs as a, jsx as l } from "react/jsx-runtime";
-import * as y from "react";
+import * as x from "react";
 import * as p from "@radix-ui/react-popover";
-import { Button as f } from "../button/button.js";
-import { useTableFilterContext as U } from "./table-filter.context.js";
-import I from "./filters/text.js";
-import V from "./filters/boolean.js";
-import q from "./filters/number/number.js";
-import E from "./filters/checkbox.js";
-import G from "../assets/icons/circle-check-filled.js";
-import { getFilterCount as H } from "./selected-filters-display/selected-filters-display.utils.js";
-import { FilterConfirmationDialog as J } from "./close-filter-confirm/filter-confirmation-dialog.js";
-import { hasUnsavedFilterChangesForColumn as x } from "./close-filter-confirm/filter-confirmation-dialog.utils.js";
-const te = ({ filterName: t }) => {
-  const [k, r] = y.useState(!1), [u, s] = y.useState(!1), {
-    getFilterForColumn: w,
-    hasAppliedFilterForColumn: A,
-    updateColumnFilter: C,
-    applyFilters: d,
-    resetToAppliedFilters: O,
-    filterSchema: P,
-    filterComponents: c = {},
-    tempFilters: g,
-    filter: v
-  } = U(), T = (o) => {
-    !o && u ? x(t, g, v.value) ? r(!0) : s(!1) : s(o);
-  }, $ = () => {
-    d(), s(!1);
+import { Button as h } from "../button/button.js";
+import { useTableFilterContext as V } from "./table-filter.context.js";
+import q from "./filters/text.js";
+import E from "./filters/boolean.js";
+import G from "./filters/number/number.js";
+import H from "./filters/checkbox.js";
+import J from "../assets/icons/circle-check-filled.js";
+import { getFilterCount as L } from "./selected-filters-display/selected-filters-display.utils.js";
+import { FilterConfirmationDialog as M } from "./close-filter-confirm/filter-confirmation-dialog.js";
+import { hasUnsavedFilterChangesForColumn as w } from "./close-filter-confirm/filter-confirmation-dialog.utils.js";
+const le = ({ filterName: n }) => {
+  const [k, r] = x.useState(!1), [f, s] = x.useState(!1), {
+    getFilterForColumn: A,
+    hasAppliedFilterForColumn: O,
+    updateColumnFilter: u,
+    applyFilters: c,
+    resetToAppliedFilters: P,
+    filterSchema: T,
+    filterComponents: d = {},
+    tempFilters: C,
+    filter: g
+  } = V(), $ = (o) => {
+    !o && f ? w(n, C, g.value) ? r(!0) : s(!1) : s(o);
   }, j = () => {
-    r(!1), s(!1);
+    c(), r(!1), s(!1);
   }, D = () => {
-    O(), r(!1), s(!1);
+    r(!1), s(!1);
   }, K = () => {
+    P(), r(!1), s(!1);
+  }, R = () => {
     r(!1);
-  }, e = P.find((o) => o.filterKey === t);
-  if (!e)
-    return console.warn(`Column "${t}" not found in schema`), null;
-  const R = {
-    boolean: V,
-    string: I,
-    number: q,
-    checkbox: E
-  }, F = e.type && (c == null ? void 0 : c[e.type]) || R[e.type ?? "string"];
+  }, v = w(n, C, g.value), t = T.find((o) => o.filterKey === n);
+  if (!t)
+    return console.warn(`Column "${n}" not found in schema`), null;
+  const S = {
+    boolean: E,
+    string: q,
+    number: G,
+    checkbox: H
+  }, F = t.type && (d == null ? void 0 : d[t.type]) || S[t.type ?? "string"];
   if (!F)
     return console.warn(
-      `No filter component found for column "${e.filterKey}" with type "${e.type}". Provide a custom filter component or use supported types: "string", "number", "boolean", "checkbox".`
+      `No filter component found for column "${t.filterKey}" with type "${t.type}". Provide a custom filter component or use supported types: "string", "number", "boolean", "checkbox".`
     ), null;
-  const n = w(t), m = A(t), b = e.options ? Object.entries(e.options).map(([o, i]) => ({
+  const e = A(n), m = O(n), b = t.options ? Object.entries(t.options).map(([o, i]) => ({
     label: o,
     value: o,
     total: i
-  })) : void 0, h = n ? H(n, b) : void 0, S = {
-    condition: (n == null ? void 0 : n.condition) || "",
-    value: (n == null ? void 0 : n.value) || ""
-  }, z = () => {
-    C(t, "", ""), d(), s(!1);
-  }, B = () => {
-    d(), s(!1);
+  })) : void 0, y = e ? L(e, b) : void 0, z = e != null && e.value ? Array.isArray(e.value) ? e.value.length : 1 : 0, B = {
+    condition: (e == null ? void 0 : e.condition) || "",
+    value: (e == null ? void 0 : e.value) || ""
+  }, I = () => {
+    const o = u(n, "", "");
+    c(o), s(!1);
+  }, U = () => {
+    c(), s(!1);
   };
-  return /* @__PURE__ */ a(p.Root, { open: u, onOpenChange: T, children: [
+  return /* @__PURE__ */ a(p.Root, { open: f, onOpenChange: $, children: [
     /* @__PURE__ */ l(p.Trigger, { asChild: !0, children: /* @__PURE__ */ l(
-      f,
+      h,
       {
         variant: m ? "filled" : "stroke",
         shade: m ? "brand" : "neutral",
         size: "small",
         children: /* @__PURE__ */ a("span", { className: "flex items-center gap-2", children: [
-          e.title,
-          m && /* @__PURE__ */ l(G, { className: "w-4 h-4 text-white flex-shrink-0" })
+          t.title,
+          m && /* @__PURE__ */ l(J, { className: "w-4 h-4 text-white flex-shrink-0" })
         ] })
       }
     ) }),
@@ -80,34 +81,29 @@ const te = ({ filterName: t }) => {
           /* @__PURE__ */ l(
             F,
             {
-              value: S,
-              onChange: ({ condition: o, value: i }) => C(t, o, i),
+              value: B,
+              onChange: ({ condition: o, value: i }) => u(n, o, i),
               filterOptions: b
             }
           ),
-          !!h && /* @__PURE__ */ a("div", { className: "flex justify-between gap-2 p-3 border-t border-stroke-solid-medium", children: [
-            /* @__PURE__ */ l(f, { onClick: z, variant: "stroke", shade: "neutral", size: "small", children: "Clear All" }),
-            /* @__PURE__ */ l(f, { onClick: B, variant: "filled", shade: "neutral", size: "small", children: `Apply${h !== void 0 ? ` ${h}` : ""}` })
+          (v || !!z) && /* @__PURE__ */ a("div", { className: "flex justify-between gap-2 p-3 border-t border-stroke-solid-medium", children: [
+            /* @__PURE__ */ l(h, { onClick: I, variant: "stroke", shade: "neutral", size: "small", children: "Clear All" }),
+            v && /* @__PURE__ */ l(h, { onClick: U, variant: "filled", shade: "neutral", size: "small", children: `Apply${y !== void 0 ? ` ${y}` : ""}` })
           ] })
         ]
       }
     ) }),
     k && /* @__PURE__ */ l(
-      J,
+      M,
       {
-        onClose: K,
-        onKeepChanges: j,
-        onRevertChanges: D,
-        onApplyChanges: $,
-        hasUnsavedChanges: x(
-          t,
-          g,
-          v.value
-        )
+        onClose: R,
+        onKeepChanges: D,
+        onRevertChanges: K,
+        onApplyChanges: j
       }
     )
   ] });
 };
 export {
-  te as TableFilterColumnButton
+  le as TableFilterColumnButton
 };

package/dist/components/table-filter/table-filter.context.d.ts

@@ -6,10 +6,10 @@ export interface TableFilterContextValue {
     getFilterForColumn: (columnKey: string) => FilterRule | undefined;
     hasFilterForColumn: (columnKey: string) => boolean;
     hasAppliedFilterForColumn: (columnKey: string) => boolean;
-    updateColumnFilter: (columnKey: string, condition?: string, value?: string | string[]) => void;
+    updateColumnFilter: (columnKey: string, condition?: string, value?: string | string[]) => FilterRule[];
     clearAllFilters: () => void;
     resetToAppliedFilters: () => void;
-    applyFilters: () => void;
+    applyFilters: (newFilters?: FilterRule[]) => void;
     hasActiveFilters: boolean;
     tempFilters: FilterRule[];
     filterSchema: FilterSchema;

package/dist/components/table-filter/table-filter.hook.d.ts

@@ -6,10 +6,10 @@ declare const useTableFilter: ({ filter, filterSchema }: TableFilterProps) => {
     getFilterForColumn: (columnKey: string) => FilterRule | undefined;
     hasFilterForColumn: (columnKey: string) => boolean;
     hasAppliedFilterForColumn: (columnKey: string) => boolean;
-    updateColumnFilter: (columnKey: string, condition?: string, value?: string | string[]) => void;
+    updateColumnFilter: (columnKey: string, condition?: string, value?: string | string[]) => FilterRule[];
     clearAllFilters: () => void;
     resetToAppliedFilters: () => void;
-    applyFilters: () => void;
+    applyFilters: (newFilters?: FilterRule[]) => void;
     hasActiveFilters: boolean;
     tempFilters: FilterRule[];
 };

package/dist/components/table-filter/table-filter.hook.js

@@ -1,56 +1,57 @@
-import u from "react";
-const E = ({ filter: l, filterSchema: a }) => {
-  const [i, c] = u.useState(null), [r, s] = u.useState(l.value);
-  u.useEffect(() => {
-    !i && a.length > 0 && c(a[0].filterKey);
-  }, [i, a]);
-  const d = (t) => r.find((e) => e.field === t), F = (t) => {
-    const e = d(t);
+import i from "react";
+const E = ({ filter: l, filterSchema: o }) => {
+  const [d, c] = i.useState(null), [n, s] = i.useState(l.value);
+  i.useEffect(() => {
+    !d && o.length > 0 && c(o[0].filterKey);
+  }, [d, o]);
+  const f = (t) => n.find((e) => e.field === t), p = (t) => {
+    const e = f(t);
     return e ? Array.isArray(e.value) ? e.value.length > 0 : e.value !== "" : !1;
-  }, p = (t) => l.value.find((e) => e.field === t), A = (t) => {
-    const e = p(t);
+  }, A = (t) => l.value.find((e) => e.field === t), m = (t) => {
+    const e = A(t);
     return e ? Array.isArray(e.value) ? e.value.length > 0 : e.value !== "" : !1;
-  }, g = (t, e, o) => {
-    const f = r.findIndex((n) => n.field === t);
-    if (f >= 0) {
-      const n = r.map(
-        (v, x) => x === f ? {
+  }, g = (t, e, r) => {
+    const F = n.findIndex((a) => a.field === t);
+    let u = [];
+    if (F >= 0)
+      u = n.map(
+        (v, T) => T === F ? {
           ...v,
           ...e !== void 0 ? { condition: e } : {},
-          ...o !== void 0 ? { value: o } : {}
+          ...r !== void 0 ? { value: r } : {}
         } : v
       );
-      s(n);
-    } else {
-      const n = {
+    else {
+      const a = {
         field: t,
         ...e ? { condition: e } : {},
-        value: o || ""
+        value: r || ""
       };
-      s([...r, n]);
+      u = [...n, a];
     }
-  }, m = () => {
-    s([]);
+    return s(u), u;
   }, C = () => {
-    s(l.value);
+    s([]);
   }, h = () => {
-    const t = r.filter((e) => Array.isArray(e.value) ? e.value.length > 0 : e.value !== "");
-    l.onChange(t);
-  }, y = l.value.length > 0;
-  return u.useEffect(() => {
+    s(l.value);
+  }, y = (t) => {
+    const e = (t || n).filter((r) => Array.isArray(r.value) ? r.value.length > 0 : r.value !== "");
+    l.onChange(e);
+  }, x = l.value.length > 0;
+  return i.useEffect(() => {
     s(l.value);
   }, [l.value]), {
-    selectedColumn: i,
+    selectedColumn: d,
     setSelectedColumn: c,
-    getFilterForColumn: d,
-    hasFilterForColumn: F,
-    hasAppliedFilterForColumn: A,
+    getFilterForColumn: f,
+    hasFilterForColumn: p,
+    hasAppliedFilterForColumn: m,
     updateColumnFilter: g,
-    clearAllFilters: m,
-    resetToAppliedFilters: C,
-    applyFilters: h,
-    hasActiveFilters: y,
-    tempFilters: r
+    clearAllFilters: C,
+    resetToAppliedFilters: h,
+    applyFilters: y,
+    hasActiveFilters: x,
+    tempFilters: n
   };
 };
 export {