nest-filter 1.0.0 → 1.0.1

package/README.md

@@ -0,0 +1,145 @@
+
+# 🌳 Nest Filter
+
+[![npm version](https://img.shields.io/badge/npm-v1.0.0-blue.svg)](https://www.npmjs.com/package/nest-filter)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
+[![React](https://img.shields.io/badge/React-18%2B-61DAFB.svg)](https://reactjs.org/)
+[![Tailwind CSS](https://img.shields.io/badge/Tailwind-3.0%2B-38B2AC.svg)](https://tailwindcss.com/)
+
+**Nest Filter** is an enterprise-grade, highly optimized advanced filtering component for React. It allows users to build complex, nested logical queries (AND/OR) through a beautiful, accessible modal interface.
+
+---
+
+## ✨ Features
+
+- 🚀 **Zero Configuration Logic**: Automatically generates operators based on data types (String, Number, Date, Boolean, Select).
+- 🌲 **Infinite Nesting**: Build complex query trees with recursive AND/OR logical blocks.
+- ⚡ **Optimized Performance**: Memoized components and stable state management to handle large datasets.
+- 🎨 **Shadcn/UI Aesthetic**: Built with Tailwind CSS for a modern, professional look that fits into any dashboard.
+- 🛠 **Type Safe**: Fully written in TypeScript with Generic support for your data models.
+- 🔍 **Robust Matching**: Built-in normalization (trimming and case-insensitivity) to prevent common filtering bugs.
+
+---
+
+<!-- ## 📺 Visual Preview
+
+### 🖼️ Modal UI
+![Advanced Filter Modal Placeholder](https://raw.githubusercontent.com/lucide-react/lucide/main/icons/layers.svg) 
+*(Imagine a sleek modal here with nested logic blocks, dropdowns, and clear action buttons)* -->
+
+<!-- ### 🎥 Demo in Action
+> [!TIP]
+> **View the Interactive Demo Video**
+> [![Watch the video](https://img.shields.io/badge/Video-Play_Demo-red?style=for-the-badge&logo=youtube)](https://your-video-link-here.com)
+
+--- -->
+
+## 📦 Installation
+
+```bash
+npm install nest-filter
+```
+
+> **Note**: This package requires `lucide-react` for icons and `tailwindcss` for styling.
+
+---
+
+## 🚀 Quick Start
+
+```tsx
+import { useState } from 'react';
+import { AdvancedFilter } from 'nest-filter';
+
+// 1. Define your columns
+const COLUMNS = [
+  { id: 'name', label: 'Full Name', type: 'string' },
+  { id: 'age', label: 'Age', type: 'number' },
+  { id: 'status', label: 'Status', type: 'select', options: ['Active', 'Paused', 'Banned'] },
+  { id: 'is_verified', label: 'Verified', type: 'boolean' },
+  { id: 'created_at', label: 'Join Date', type: 'date' },
+];
+
+function App() {
+  const [isOpen, setIsOpen] = useState(false);
+  const [data, setData] = useState(MY_RAW_DATA);
+  const [filteredData, setFilteredData] = useState(MY_RAW_DATA);
+
+  return (
+    <div>
+      <button onClick={() => setIsOpen(true)}>Open Filters</button>
+      
+      <AdvancedFilter
+        isOpen={isOpen}
+        onClose={() => setIsOpen(false)}
+        data={data}
+        columns={COLUMNS}
+        setFilteredData={setFilteredData}
+      />
+
+      {/* Render your table using filteredData */}
+    </div>
+  );
+}
+```
+
+---
+
+## 📖 API Documentation
+
+### Props
+
+| Prop | Type | Required | Description |
+| :--- | :--- | :--- | :--- |
+| `isOpen` | `boolean` | Yes | Controls the visibility of the modal. |
+| `onClose` | `() => void` | Yes | Callback fired when the modal requests to close. |
+| `data` | `T[]` | Yes | Your raw array of objects to be filtered. |
+| `columns` | `ColumnDefinition<T>[]` | Yes | Configuration for which fields can be filtered. |
+| `setFilteredData` | `(data: T[]) => void` | Yes | Callback that receives the newly filtered array after "Apply". |
+| `initialFilters` | `FilterGroup<T>` | No | Pass an existing filter tree to restore state. |
+
+### Column Definition Object
+
+```typescript
+interface ColumnDefinition<T> {
+  id: keyof T;        // The key in your data object
+  label: string;      // Human-readable name shown in UI
+  type: ColumnType;   // 'string' | 'number' | 'date' | 'boolean' | 'select'
+  options?: string[]; // Required ONLY if type is 'select'
+}
+```
+
+---
+
+## 🔍 Filtering Logic Details
+
+**Nest Filter** uses a deep-recursive evaluation engine. Here is how it handles different types:
+
+- **String**: Normalizes both data and input (trimmed, lowercase) to ensure "Exact Match" works even with copy-pasted whitespace.
+- **Select**: Provides a dropdown of your predefined `options`. It performs an exact, case-insensitive match against the record.
+- **Number**: Converts inputs to floats and supports standard mathematical operators (`>`, `<`, `<=`, etc.).
+- **Date**: Handles timestamp strings or Date objects, offering "Before", "After", and "On Date" comparisons.
+- **Boolean**: Simply toggles the rule to filter for `true` or `false` states without needing an input value.
+
+---
+
+## 🎨 Customization
+
+The component uses **Tailwind CSS**. To ensure the modal looks perfect, make sure your `tailwind.config.js` includes the `nest-filter` node module path (if you are shipping styles separately) or that your project has the standard Shadcn-like colors defined (`slate`, `blue`, etc.).
+
+---
+
+## 🤝 Contributing
+
+Contributions, issues, and feature requests are welcome! Feel free to check the [issues page](https://github.com/your-username/nest-filter/issues).
+
+---
+
+## 📜 License
+
+Distributed under the MIT License. See `LICENSE` for more information.
+
+---
+
+<p align="center">
+  Made with ❤️ for the Developer Community
+</p>

package/dist/components/AdvancedFilter.js

@@ -156,7 +156,7 @@ const AdvancedFilter = ({ isOpen, onClose, data, columns, setFilteredData, initi
         setFilteredData(data);
         onClose();
     };
-    return (jsxs(Dialog, { open: isOpen, onOpenChange: onClose, title: "Advanced Filters", description: "Refine your dataset using structured logic and multi-type comparisons.", children: [jsx("div", { className: "max-h-[60vh] overflow-y-auto px-1 custom-scrollbar pr-3 pb-32", children: jsx(FilterGroupUI, { group: rootGroup, depth: 0, columns: columns, onAddRule: handleAddRule, onAddGroup: handleAddGroup, onUpdateRule: handleUpdateRule, onUpdateGroupLogic: handleUpdateGroupLogic, onRemoveItem: handleRemoveItem }) }), jsxs("div", { className: "flex w-full justify-between items-center gap-4", children: [jsxs(Button, { variant: "ghost", onClick: handleClear, className: "text-slate-400 hover:text-red-500 font-black text-[10px] uppercase tracking-widest gap-2", children: [jsx(FilterX, { className: "h-4 w-4" }), " Reset Filters"] }), jsxs("div", { className: "flex gap-2", children: [jsx(Button, { variant: "outline", onClick: onClose, className: "font-bold h-11 px-6", children: "Cancel" }), jsx(Button, { onClick: handleApply, className: "bg-slate-900 font-bold h-11 px-10 rounded-lg shadow-lg hover:shadow-xl transition-shadow", children: "Apply View" })] })] })] }));
+    return (jsxs(Dialog, { open: isOpen, onOpenChange: onClose, title: "Advanced Filters by arijit", description: "Refine your dataset using structured logic and multi-type comparisons.", children: [jsx("div", { className: "max-h-[60vh] overflow-y-auto px-1 custom-scrollbar pr-3 pb-32", children: jsx(FilterGroupUI, { group: rootGroup, depth: 0, columns: columns, onAddRule: handleAddRule, onAddGroup: handleAddGroup, onUpdateRule: handleUpdateRule, onUpdateGroupLogic: handleUpdateGroupLogic, onRemoveItem: handleRemoveItem }) }), jsxs("div", { className: "flex w-full justify-between items-center gap-4", children: [jsxs(Button, { variant: "ghost", onClick: handleClear, className: "text-slate-400 hover:text-red-500 font-black text-[10px] uppercase tracking-widest gap-2", children: [jsx(FilterX, { className: "h-4 w-4" }), " Reset Filters"] }), jsxs("div", { className: "flex gap-2", children: [jsx(Button, { variant: "outline", onClick: onClose, className: "font-bold h-11 px-6", children: "Cancel" }), jsx(Button, { onClick: handleApply, className: "bg-slate-900 font-bold h-11 px-10 rounded-lg shadow-lg hover:shadow-xl transition-shadow", children: "Apply View" })] })] })] }));
 };
 
 export { AdvancedFilter };

package/dist/components/AdvancedFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdvancedFilter.js","sources":["../../src/components/AdvancedFilter.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useState, useEffect, useCallback } from \"react\";\nimport {\n  FilterRule,\n  FilterGroup,\n  ColumnDefinition,\n  LogicalOperator,\n  FilterOperator,\n  FilterItem,\n} from \"../types\";\nimport { Button } from \"./ui/Button\";\nimport { Input } from \"./ui/Input\";\nimport { Select } from \"./ui/Select\";\nimport { Dialog } from \"./ui/Dialog\";\nimport {\n  Plus,\n  Trash2,\n  Layers,\n  Binary,\n  FilterX,\n  ListFilter,\n} from \"lucide-react\";\nimport { applyFilters } from \"../utils/filterLogic\";\n\ninterface AdvancedFilterProps<T> {\n  isOpen: boolean;\n  onClose: () => void;\n  data: T[];\n  columns: ColumnDefinition<T>[];\n  setFilteredData: (data: T[]) => void;\n  initialFilters?: FilterGroup<T>;\n}\n\nconst getOperatorsForType = (\n  type: string\n): { value: FilterOperator; label: string }[] => {\n  switch (type) {\n    case \"string\":\n      return [\n        { value: \"contains\", label: \"Contains\" },\n        { value: \"not_contains\", label: \"Does not contain\" },\n        { value: \"equals\", label: \"Exact match\" },\n      ];\n    case \"select\":\n      return [\n        { value: \"equals\", label: \"Is\" },\n        { value: \"not_equals\", label: \"Is not\" },\n      ];\n    case \"number\":\n      return [\n        { value: \"equals\", label: \"=\" },\n        { value: \"not_equals\", label: \"!=\" },\n        { value: \"gt\", label: \">\" },\n        { value: \"lt\", label: \"<\" },\n        { value: \"gte\", label: \">=\" },\n        { value: \"lte\", label: \"<=\" },\n      ];\n    case \"date\":\n      return [\n        { value: \"is\", label: \"On date\" },\n        { value: \"before\", label: \"Before\" },\n        { value: \"after\", label: \"After\" },\n      ];\n    case \"boolean\":\n      return [\n        { value: \"true\", label: \"True\" },\n        { value: \"false\", label: \"False\" },\n      ];\n    default:\n      return [];\n  }\n};\n\nconst FilterGroupUI = <T,>({\n  group,\n  depth,\n  columns,\n  onAddRule,\n  onAddGroup,\n  onUpdateRule,\n  onUpdateGroupLogic,\n  onRemoveItem,\n}: {\n  group: FilterGroup<T>;\n  depth: number;\n  columns: ColumnDefinition<T>[];\n  onAddRule: (parentId: string) => void;\n  onAddGroup: (parentId: string) => void;\n  onUpdateRule: (ruleId: string, updates: Partial<FilterRule<T>>) => void;\n  onUpdateGroupLogic: (groupId: string, logic: LogicalOperator) => void;\n  onRemoveItem: (itemId: string) => void;\n}) => {\n  return (\n    <div\n      className={`rounded-lg border border-slate-200 bg-slate-50/50 p-4 mb-4 ${\n        depth > 0 ? \"ml-6 md:ml-10 relative border-l-2 border-l-slate-300\" : \"\"\n      }`}\n    >\n      <div className=\"flex flex-wrap items-center justify-between gap-4 mb-4\">\n        <div className=\"flex items-center gap-2\">\n          <span className=\"text-[10px] font-bold uppercase tracking-widest text-slate-500\">\n            Group Logic\n          </span>\n          <div className=\"flex rounded-md border border-slate-200 bg-white p-1 shadow-sm\">\n            <button\n              onClick={() => onUpdateGroupLogic(group.id, \"AND\")}\n              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${\n                group.logic === \"AND\"\n                  ? \"bg-slate-900 text-slate-50\"\n                  : \"text-slate-500 hover:text-slate-900\"\n              }`}\n            >\n              AND\n            </button>\n            <button\n              onClick={() => onUpdateGroupLogic(group.id, \"OR\")}\n              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${\n                group.logic === \"OR\"\n                  ? \"bg-slate-900 text-slate-50\"\n                  : \"text-slate-500 hover:text-slate-900\"\n              }`}\n            >\n              OR\n            </button>\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={() => onAddRule(group.id)}\n            className=\"h-7 text-[10px] font-bold uppercase\"\n          >\n            <Plus className=\"mr-1 h-3 w-3\" /> Rule\n          </Button>\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={() => onAddGroup(group.id)}\n            className=\"h-7 text-[10px] font-bold uppercase\"\n          >\n            <Layers className=\"mr-1 h-3 w-3\" /> Group\n          </Button>\n          {depth > 0 && (\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={() => onRemoveItem(group.id)}\n              className=\"text-slate-400\"\n            >\n              <Trash2 className=\"h-5 w-5 text-red-500\" />\n            </Button>\n          )}\n        </div>\n      </div>\n\n      <div className=\"space-y-3\">\n        {group.items.map((item) => {\n          const column = columns.find(\n            (c) => c.id === (item.type === \"rule\" ? item.columnId : null)\n          );\n          return item.type === \"rule\" ? (\n            <div\n              key={item.id}\n              className=\"flex flex-col md:flex-row md:items-center gap-3 p-3 bg-white border border-slate-200 rounded-md shadow-sm\"\n            >\n              <div className=\"flex-1 min-w-[140px]\">\n                <Select\n                  value={item.columnId as string}\n                  options={columns.map((c) => ({\n                    value: c.id as string,\n                    label: c.label,\n                  }))}\n                  onValueChange={(val) => {\n                    const colId = val as keyof T;\n                    const col = columns.find((c) => c.id === colId);\n                    onUpdateRule(item.id, {\n                      columnId: colId,\n                      operator:\n                        col?.type === \"date\"\n                          ? \"is\"\n                          : col?.type === \"number\"\n                          ? \"equals\"\n                          : col?.type === \"select\"\n                          ? \"equals\"\n                          : \"contains\",\n                      value: \"\",\n                    });\n                  }}\n                />\n              </div>\n              <div className=\"w-full md:w-44\">\n                <Select\n                  value={item.operator}\n                  options={getOperatorsForType(column?.type || \"string\")}\n                  onValueChange={(val) =>\n                    onUpdateRule(item.id, { operator: val as FilterOperator })\n                  }\n                />\n              </div>\n              <div className=\"flex-[1.5] min-w-[180px]\">\n                {column?.type === \"date\" ? (\n                  <Input\n                    type=\"date\"\n                    value={item.value || \"\"}\n                    onChange={(e) =>\n                      onUpdateRule(item.id, { value: e.target.value })\n                    }\n                  />\n                ) : column?.type === \"boolean\" ? (\n                  <div className=\"h-10 flex items-center px-3 border border-slate-200 rounded-md bg-slate-50 text-[10px] font-black uppercase tracking-tighter text-slate-400 italic\">\n                    <Binary className=\"h-3 w-3 mr-2\" />\n                    Binary state\n                  </div>\n                ) : column?.type === \"select\" ? (\n                  <Select\n                    value={item.value || \"\"}\n                    placeholder=\"Choose option...\"\n                    options={(column.options || []).map((opt) => ({\n                      value: opt,\n                      label: opt,\n                    }))}\n                    onValueChange={(val) =>\n                      onUpdateRule(item.id, { value: val })\n                    }\n                  />\n                ) : (\n                  <Input\n                    placeholder=\"Search query...\"\n                    value={item.value || \"\"}\n                    onChange={(e) =>\n                      onUpdateRule(item.id, { value: e.target.value })\n                    }\n                  />\n                )}\n              </div>\n              <Button\n                variant=\"ghost\"\n                size=\"icon\"\n                onClick={() => onRemoveItem(item.id)}\n                className=\"h-9 w-9 text-slate-300 hover:text-red-500 hover:bg-red-50\"\n              >\n                <Trash2 className=\"h-5 w-5 text-red-500\" />\n              </Button>\n            </div>\n          ) : (\n            <FilterGroupUI\n              group={item}\n              depth={depth + 1}\n              columns={columns}\n              onAddRule={onAddRule}\n              onAddGroup={onAddGroup}\n              onUpdateRule={onUpdateRule}\n              onUpdateGroupLogic={onUpdateGroupLogic}\n              onRemoveItem={onRemoveItem}\n            />\n          );\n        })}\n        {group.items.length === 0 && (\n          <div className=\"flex flex-col items-center justify-center py-6 rounded-md border border-dashed border-slate-200 bg-white/50\">\n            <ListFilter className=\"h-5 w-5 text-slate-300 mb-1\" />\n            <p className=\"text-[10px] text-slate-400 font-bold uppercase tracking-widest\">\n              Add a rule to filter\n            </p>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport const AdvancedFilter = <T,>({\n  isOpen,\n  onClose,\n  data,\n  columns,\n  setFilteredData,\n  initialFilters,\n}: AdvancedFilterProps<T>) => {\n  const [rootGroup, setRootGroup] = useState<FilterGroup<T>>({\n    type: \"group\",\n    id: \"root\",\n    logic: \"AND\",\n    items: [],\n  });\n\n  useEffect(() => {\n    if (initialFilters) setRootGroup(initialFilters);\n  }, [initialFilters, isOpen]);\n\n  const updateItemRecursively = useCallback(\n    (\n      group: FilterGroup<T>,\n      targetId: string,\n      updater: (item: FilterItem<T>) => FilterItem<T> | null\n    ): FilterGroup<T> => {\n      if (group.id === targetId) return updater(group) as FilterGroup<T>;\n      return {\n        ...group,\n        items: group.items\n          .map((item) => {\n            if (item.id === targetId) return updater(item);\n            if (item.type === \"group\")\n              return updateItemRecursively(item, targetId, updater);\n            return item;\n          })\n          .filter(Boolean) as FilterItem<T>[],\n      };\n    },\n    []\n  );\n\n  const handleAddRule = useCallback(\n    (parentId: string) => {\n      const firstCol = columns[0];\n      const newRule: FilterRule<T> = {\n        type: \"rule\",\n        id: Math.random().toString(36).substr(2, 9),\n        columnId: firstCol.id,\n        operator:\n          firstCol.type === \"string\"\n            ? \"contains\"\n            : firstCol.type === \"select\"\n            ? \"equals\"\n            : \"equals\",\n        value: \"\",\n      };\n      setRootGroup((prev) =>\n        updateItemRecursively(prev, parentId, (group) => ({\n          ...(group as FilterGroup<T>),\n          items: [...(group as FilterGroup<T>).items, newRule],\n        }))\n      );\n    },\n    [columns, updateItemRecursively]\n  );\n\n  const handleAddGroup = useCallback(\n    (parentId: string) => {\n      const newGroup: FilterGroup<T> = {\n        type: \"group\",\n        id: Math.random().toString(36).substr(2, 9),\n        logic: \"AND\",\n        items: [],\n      };\n      setRootGroup((prev) =>\n        updateItemRecursively(prev, parentId, (group) => ({\n          ...(group as FilterGroup<T>),\n          items: [...(group as FilterGroup<T>).items, newGroup],\n        }))\n      );\n    },\n    [updateItemRecursively]\n  );\n\n  const handleUpdateRule = useCallback(\n    (ruleId: string, updates: Partial<FilterRule<T>>) => {\n      setRootGroup((prev) =>\n        updateItemRecursively(\n          prev,\n          ruleId,\n          (rule) => ({ ...rule, ...updates } as FilterRule<T>)\n        )\n      );\n    },\n    [updateItemRecursively]\n  );\n\n  const handleUpdateGroupLogic = useCallback(\n    (groupId: string, logic: LogicalOperator) => {\n      setRootGroup((prev) =>\n        updateItemRecursively(\n          prev,\n          groupId,\n          (group) => ({ ...group, logic } as FilterGroup<T>)\n        )\n      );\n    },\n    [updateItemRecursively]\n  );\n\n  const handleRemoveItem = useCallback(\n    (itemId: string) => {\n      setRootGroup((prev) => updateItemRecursively(prev, itemId, () => null));\n    },\n    [updateItemRecursively]\n  );\n\n  const handleApply = () => {\n    const filtered = applyFilters(data, rootGroup, columns);\n    setFilteredData(filtered);\n    onClose();\n  };\n\n  const handleClear = () => {\n    const emptyGroup: FilterGroup<T> = {\n      type: \"group\",\n      id: \"root\",\n      logic: \"AND\",\n      items: [],\n    };\n    setRootGroup(emptyGroup);\n    setFilteredData(data);\n    onClose();\n  };\n\n  return (\n    <Dialog\n      open={isOpen}\n      onOpenChange={onClose}\n      title=\"Advanced Filters\"\n      description=\"Refine your dataset using structured logic and multi-type comparisons.\"\n    >\n      <div className=\"max-h-[60vh] overflow-y-auto px-1 custom-scrollbar pr-3 pb-32\">\n        <FilterGroupUI\n          group={rootGroup}\n          depth={0}\n          columns={columns}\n          onAddRule={handleAddRule}\n          onAddGroup={handleAddGroup}\n          onUpdateRule={handleUpdateRule}\n          onUpdateGroupLogic={handleUpdateGroupLogic}\n          onRemoveItem={handleRemoveItem}\n        />\n      </div>\n      <div className=\"flex w-full justify-between items-center gap-4\">\n        <Button\n          variant=\"ghost\"\n          onClick={handleClear}\n          className=\"text-slate-400 hover:text-red-500 font-black text-[10px] uppercase tracking-widest gap-2\"\n        >\n          <FilterX className=\"h-4 w-4\" /> Reset Filters\n        </Button>\n        <div className=\"flex gap-2\">\n          <Button\n            variant=\"outline\"\n            onClick={onClose}\n            className=\"font-bold h-11 px-6\"\n          >\n            Cancel\n          </Button>\n          <Button\n            onClick={handleApply}\n            className=\"bg-slate-900 font-bold h-11 px-10 rounded-lg shadow-lg hover:shadow-xl transition-shadow\"\n          >\n            Apply View\n          </Button>\n        </div>\n      </div>\n    </Dialog>\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;AAiCA,MAAM,mBAAmB,GAAG,CAC1B,IAAY,KACkC;IAC9C,QAAQ,IAAI;AACV,QAAA,KAAK,QAAQ;YACX,OAAO;AACL,gBAAA,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE;AACxC,gBAAA,EAAE,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,kBAAkB,EAAE;AACpD,gBAAA,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE;aAC1C;AACH,QAAA,KAAK,QAAQ;YACX,OAAO;AACL,gBAAA,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE;AAChC,gBAAA,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE;aACzC;AACH,QAAA,KAAK,QAAQ;YACX,OAAO;AACL,gBAAA,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE;AAC/B,gBAAA,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,IAAI,EAAE;AACpC,gBAAA,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE;AAC3B,gBAAA,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE;AAC3B,gBAAA,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE;AAC7B,gBAAA,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE;aAC9B;AACH,QAAA,KAAK,MAAM;YACT,OAAO;AACL,gBAAA,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE;AACjC,gBAAA,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE;AACpC,gBAAA,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;aACnC;AACH,QAAA,KAAK,SAAS;YACZ,OAAO;AACL,gBAAA,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE;AAChC,gBAAA,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;aACnC;AACH,QAAA;AACE,YAAA,OAAO,EAAE;;AAEf,CAAC;AAED,MAAM,aAAa,GAAG,CAAK,EACzB,KAAK,EACL,KAAK,EACL,OAAO,EACP,SAAS,EACT,UAAU,EACV,YAAY,EACZ,kBAAkB,EAClB,YAAY,GAUb,KAAI;AACH,IAAA,QACEA,IAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,CAAA,2DAAA,EACT,KAAK,GAAG,CAAC,GAAG,sDAAsD,GAAG,EACvE,CAAA,CAAE,EAAA,QAAA,EAAA,CAEFA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAAA,CACrEA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA,QAAA,EAAA,CACtCC,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,gEAAgE,EAAA,QAAA,EAAA,aAAA,EAAA,CAEzE,EACPD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gEAAgE,EAAA,QAAA,EAAA,CAC7EC,GAAA,CAAA,QAAA,EAAA,EACE,OAAO,EAAE,MAAM,kBAAkB,CAAC,KAAK,CAAC,EAAE,EAAE,KAAK,CAAC,EAClD,SAAS,EAAE,CAAA,2DAAA,EACT,KAAK,CAAC,KAAK,KAAK;AACd,8CAAE;8CACA,qCACN,CAAA,CAAE,EAAA,QAAA,EAAA,KAAA,EAAA,CAGK,EACTA,GAAA,CAAA,QAAA,EAAA,EACE,OAAO,EAAE,MAAM,kBAAkB,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,CAAC,EACjD,SAAS,EAAE,CAAA,2DAAA,EACT,KAAK,CAAC,KAAK,KAAK;AACd,8CAAE;AACF,8CAAE,qCACN,CAAA,CAAE,EAAA,QAAA,EAAA,IAAA,EAAA,CAGK,IACL,CAAA,EAAA,CACF,EAEND,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA,QAAA,EAAA,CACtCA,IAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,MAAM,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC,EAClC,SAAS,EAAC,qCAAqC,EAAA,QAAA,EAAA,CAE/CC,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,cAAc,EAAA,CAAG,EAAA,OAAA,CAAA,EAAA,CAC1B,EACTD,IAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,MAAM,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,EACnC,SAAS,EAAC,qCAAqC,EAAA,QAAA,EAAA,CAE/CC,GAAA,CAAC,MAAM,IAAC,SAAS,EAAC,cAAc,EAAA,CAAG,EAAA,QAAA,CAAA,EAAA,CAC5B,EACR,KAAK,GAAG,CAAC,KACRA,GAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,MAAM,YAAY,CAAC,KAAK,CAAC,EAAE,CAAC,EACrC,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAE1BA,GAAA,CAAC,MAAM,EAAA,EAAC,SAAS,EAAC,sBAAsB,GAAG,EAAA,CACpC,CACV,CAAA,EAAA,CACG,CAAA,EAAA,CACF,EAEND,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,WAAW,EAAA,QAAA,EAAA,CACvB,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,KAAI;AACxB,wBAAA,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CACzB,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,MAAM,IAAI,CAAC,IAAI,KAAK,MAAM,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,CAC9D;AACD,wBAAA,OAAO,IAAI,CAAC,IAAI,KAAK,MAAM,IACzBA,IAAA,CAAA,KAAA,EAAA,EAEE,SAAS,EAAC,2GAA2G,aAErHC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,sBAAsB,EAAA,QAAA,EACnCA,GAAA,CAAC,MAAM,IACL,KAAK,EAAE,IAAI,CAAC,QAAkB,EAC9B,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM;4CAC3B,KAAK,EAAE,CAAC,CAAC,EAAY;4CACrB,KAAK,EAAE,CAAC,CAAC,KAAK;AACf,yCAAA,CAAC,CAAC,EACH,aAAa,EAAE,CAAC,GAAG,KAAI;4CACrB,MAAM,KAAK,GAAG,GAAc;AAC5B,4CAAA,MAAM,GAAG,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,KAAK,CAAC;AAC/C,4CAAA,YAAY,CAAC,IAAI,CAAC,EAAE,EAAE;AACpB,gDAAA,QAAQ,EAAE,KAAK;AACf,gDAAA,QAAQ,EACN,GAAG,EAAE,IAAI,KAAK;AACZ,sDAAE;AACF,sDAAE,GAAG,EAAE,IAAI,KAAK;AAChB,0DAAE;AACF,0DAAE,GAAG,EAAE,IAAI,KAAK;AAChB,8DAAE;AACF,8DAAE,UAAU;AAChB,gDAAA,KAAK,EAAE,EAAE;AACV,6CAAA,CAAC;AACJ,wCAAA,CAAC,GACD,EAAA,CACE,EACNA,aAAK,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAC7BA,GAAA,CAAC,MAAM,EAAA,EACL,KAAK,EAAE,IAAI,CAAC,QAAQ,EACpB,OAAO,EAAE,mBAAmB,CAAC,MAAM,EAAE,IAAI,IAAI,QAAQ,CAAC,EACtD,aAAa,EAAE,CAAC,GAAG,KACjB,YAAY,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAqB,EAAE,CAAC,GAE5D,EAAA,CACE,EACNA,aAAK,SAAS,EAAC,0BAA0B,EAAA,QAAA,EACtC,MAAM,EAAE,IAAI,KAAK,MAAM,IACtBA,GAAA,CAAC,KAAK,IACJ,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,EAAE,EACvB,QAAQ,EAAE,CAAC,CAAC,KACV,YAAY,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,EAAA,CAElD,IACA,MAAM,EAAE,IAAI,KAAK,SAAS,IAC5BD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,oJAAoJ,EAAA,QAAA,EAAA,CACjKC,GAAA,CAAC,MAAM,EAAA,EAAC,SAAS,EAAC,cAAc,EAAA,CAAG,oBAE/B,IACJ,MAAM,EAAE,IAAI,KAAK,QAAQ,IAC3BA,GAAA,CAAC,MAAM,IACL,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,EAAE,EACvB,WAAW,EAAC,kBAAkB,EAC9B,OAAO,EAAE,CAAC,MAAM,CAAC,OAAO,IAAI,EAAE,EAAE,GAAG,CAAC,CAAC,GAAG,MAAM;AAC5C,4CAAA,KAAK,EAAE,GAAG;AACV,4CAAA,KAAK,EAAE,GAAG;AACX,yCAAA,CAAC,CAAC,EACH,aAAa,EAAE,CAAC,GAAG,KACjB,YAAY,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,EAAA,CAEvC,KAEFA,GAAA,CAAC,KAAK,IACJ,WAAW,EAAC,iBAAiB,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,EAAE,EACvB,QAAQ,EAAE,CAAC,CAAC,KACV,YAAY,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,EAAA,CAElD,CACH,EAAA,CACG,EACNA,GAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,MAAM,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,EACpC,SAAS,EAAC,2DAA2D,EAAA,QAAA,EAErEA,GAAA,CAAC,MAAM,EAAA,EAAC,SAAS,EAAC,sBAAsB,GAAG,EAAA,CACpC,CAAA,EAAA,EAhFJ,IAAI,CAAC,EAAE,CAiFR,KAENA,GAAA,CAAC,aAAa,EAAA,EACZ,KAAK,EAAE,IAAI,EACX,KAAK,EAAE,KAAK,GAAG,CAAC,EAChB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,YAAY,EAAE,YAAY,EAAA,CAC1B,CACH;AACH,oBAAA,CAAC,CAAC,EACD,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,KACvBD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,6GAA6G,EAAA,QAAA,EAAA,CAC1HC,GAAA,CAAC,UAAU,EAAA,EAAC,SAAS,EAAC,6BAA6B,EAAA,CAAG,EACtDA,GAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,gEAAgE,qCAEzE,CAAA,EAAA,CACA,CACP,CAAA,EAAA,CACG,CAAA,EAAA,CACF;AAEV,CAAC;AAEM,MAAM,cAAc,GAAG,CAAK,EACjC,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAO,EACP,eAAe,EACf,cAAc,GACS,KAAI;AAC3B,IAAA,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAiB;AACzD,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,KAAK,EAAE,KAAK;AACZ,QAAA,KAAK,EAAE,EAAE;AACV,KAAA,CAAC;IAEF,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,cAAc;YAAE,YAAY,CAAC,cAAc,CAAC;AAClD,IAAA,CAAC,EAAE,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;IAE5B,MAAM,qBAAqB,GAAG,WAAW,CACvC,CACE,KAAqB,EACrB,QAAgB,EAChB,OAAsD,KACpC;AAClB,QAAA,IAAI,KAAK,CAAC,EAAE,KAAK,QAAQ;AAAE,YAAA,OAAO,OAAO,CAAC,KAAK,CAAmB;QAClE,OAAO;AACL,YAAA,GAAG,KAAK;YACR,KAAK,EAAE,KAAK,CAAC;AACV,iBAAA,GAAG,CAAC,CAAC,IAAI,KAAI;AACZ,gBAAA,IAAI,IAAI,CAAC,EAAE,KAAK,QAAQ;AAAE,oBAAA,OAAO,OAAO,CAAC,IAAI,CAAC;AAC9C,gBAAA,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO;oBACvB,OAAO,qBAAqB,CAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,CAAC;AACvD,gBAAA,OAAO,IAAI;AACb,YAAA,CAAC;iBACA,MAAM,CAAC,OAAO,CAAoB;SACtC;IACH,CAAC,EACD,EAAE,CACH;AAED,IAAA,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,QAAQ,GAAG,OAAO,CAAC,CAAC,CAAC;AAC3B,QAAA,MAAM,OAAO,GAAkB;AAC7B,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,EAAE,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC;YAC3C,QAAQ,EAAE,QAAQ,CAAC,EAAE;AACrB,YAAA,QAAQ,EACN,QAAQ,CAAC,IAAI,KAAK;AAChB,kBAAE;AACF,kBAAE,QAAQ,CAAC,IAAI,KAAK;AACpB,sBAAE;AACF,sBAAE,QAAQ;AACd,YAAA,KAAK,EAAE,EAAE;SACV;AACD,QAAA,YAAY,CAAC,CAAC,IAAI,KAChB,qBAAqB,CAAC,IAAI,EAAE,QAAQ,EAAE,CAAC,KAAK,MAAM;AAChD,YAAA,GAAI,KAAwB;YAC5B,KAAK,EAAE,CAAC,GAAI,KAAwB,CAAC,KAAK,EAAE,OAAO,CAAC;SACrD,CAAC,CAAC,CACJ;AACH,IAAA,CAAC,EACD,CAAC,OAAO,EAAE,qBAAqB,CAAC,CACjC;AAED,IAAA,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,QAAQ,GAAmB;AAC/B,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,EAAE,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC;AAC3C,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,KAAK,EAAE,EAAE;SACV;AACD,QAAA,YAAY,CAAC,CAAC,IAAI,KAChB,qBAAqB,CAAC,IAAI,EAAE,QAAQ,EAAE,CAAC,KAAK,MAAM;AAChD,YAAA,GAAI,KAAwB;YAC5B,KAAK,EAAE,CAAC,GAAI,KAAwB,CAAC,KAAK,EAAE,QAAQ,CAAC;SACtD,CAAC,CAAC,CACJ;AACH,IAAA,CAAC,EACD,CAAC,qBAAqB,CAAC,CACxB;IAED,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,MAAc,EAAE,OAA+B,KAAI;AAClD,QAAA,YAAY,CAAC,CAAC,IAAI,KAChB,qBAAqB,CACnB,IAAI,EACJ,MAAM,EACN,CAAC,IAAI,MAAM,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO,EAAoB,CAAA,CACrD,CACF;AACH,IAAA,CAAC,EACD,CAAC,qBAAqB,CAAC,CACxB;IAED,MAAM,sBAAsB,GAAG,WAAW,CACxC,CAAC,OAAe,EAAE,KAAsB,KAAI;QAC1C,YAAY,CAAC,CAAC,IAAI,KAChB,qBAAqB,CACnB,IAAI,EACJ,OAAO,EACP,CAAC,KAAK,MAAM,EAAE,GAAG,KAAK,EAAE,KAAK,EAAqB,CAAA,CACnD,CACF;AACH,IAAA,CAAC,EACD,CAAC,qBAAqB,CAAC,CACxB;AAED,IAAA,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,MAAc,KAAI;AACjB,QAAA,YAAY,CAAC,CAAC,IAAI,KAAK,qBAAqB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC,CAAC;AACzE,IAAA,CAAC,EACD,CAAC,qBAAqB,CAAC,CACxB;IAED,MAAM,WAAW,GAAG,MAAK;QACvB,MAAM,QAAQ,GAAG,YAAY,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC;QACvD,eAAe,CAAC,QAAQ,CAAC;AACzB,QAAA,OAAO,EAAE;AACX,IAAA,CAAC;IAED,MAAM,WAAW,GAAG,MAAK;AACvB,QAAA,MAAM,UAAU,GAAmB;AACjC,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,KAAK,EAAE,EAAE;SACV;QACD,YAAY,CAAC,UAAU,CAAC;QACxB,eAAe,CAAC,IAAI,CAAC;AACrB,QAAA,OAAO,EAAE;AACX,IAAA,CAAC;AAED,IAAA,QACED,IAAA,CAAC,MAAM,EAAA,EACL,IAAI,EAAE,MAAM,EACZ,YAAY,EAAE,OAAO,EACrB,KAAK,EAAC,kBAAkB,EACxB,WAAW,EAAC,wEAAwE,EAAA,QAAA,EAAA,CAEpFC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,+DAA+D,EAAA,QAAA,EAC5EA,GAAA,CAAC,aAAa,EAAA,EACZ,KAAK,EAAE,SAAS,EAChB,KAAK,EAAE,CAAC,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,aAAa,EACxB,UAAU,EAAE,cAAc,EAC1B,YAAY,EAAE,gBAAgB,EAC9B,kBAAkB,EAAE,sBAAsB,EAC1C,YAAY,EAAE,gBAAgB,EAAA,CAC9B,GACE,EACND,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gDAAgD,EAAA,QAAA,EAAA,CAC7DA,IAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,OAAO,EACf,OAAO,EAAE,WAAW,EACpB,SAAS,EAAC,0FAA0F,EAAA,QAAA,EAAA,CAEpGC,GAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,SAAS,EAAA,CAAG,EAAA,gBAAA,CAAA,EAAA,CACxB,EACTD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,YAAY,EAAA,QAAA,EAAA,CACzBC,GAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAC,qBAAqB,EAAA,QAAA,EAAA,QAAA,EAAA,CAGxB,EACTA,GAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAE,WAAW,EACpB,SAAS,EAAC,0FAA0F,EAAA,QAAA,EAAA,YAAA,EAAA,CAG7F,CAAA,EAAA,CACL,CAAA,EAAA,CACF,CAAA,EAAA,CACC;AAEb;;;;"}
+{"version":3,"file":"AdvancedFilter.js","sources":["../../src/components/AdvancedFilter.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useState, useEffect, useCallback } from \"react\";\nimport {\n  FilterRule,\n  FilterGroup,\n  ColumnDefinition,\n  LogicalOperator,\n  FilterOperator,\n  FilterItem,\n} from \"../types\";\nimport { Button } from \"./ui/Button\";\nimport { Input } from \"./ui/Input\";\nimport { Select } from \"./ui/Select\";\nimport { Dialog } from \"./ui/Dialog\";\nimport {\n  Plus,\n  Trash2,\n  Layers,\n  Binary,\n  FilterX,\n  ListFilter,\n} from \"lucide-react\";\nimport { applyFilters } from \"../utils/filterLogic\";\n\ninterface AdvancedFilterProps<T> {\n  isOpen: boolean;\n  onClose: () => void;\n  data: T[];\n  columns: ColumnDefinition<T>[];\n  setFilteredData: (data: T[]) => void;\n  initialFilters?: FilterGroup<T>;\n}\n\nconst getOperatorsForType = (\n  type: string\n): { value: FilterOperator; label: string }[] => {\n  switch (type) {\n    case \"string\":\n      return [\n        { value: \"contains\", label: \"Contains\" },\n        { value: \"not_contains\", label: \"Does not contain\" },\n        { value: \"equals\", label: \"Exact match\" },\n      ];\n    case \"select\":\n      return [\n        { value: \"equals\", label: \"Is\" },\n        { value: \"not_equals\", label: \"Is not\" },\n      ];\n    case \"number\":\n      return [\n        { value: \"equals\", label: \"=\" },\n        { value: \"not_equals\", label: \"!=\" },\n        { value: \"gt\", label: \">\" },\n        { value: \"lt\", label: \"<\" },\n        { value: \"gte\", label: \">=\" },\n        { value: \"lte\", label: \"<=\" },\n      ];\n    case \"date\":\n      return [\n        { value: \"is\", label: \"On date\" },\n        { value: \"before\", label: \"Before\" },\n        { value: \"after\", label: \"After\" },\n      ];\n    case \"boolean\":\n      return [\n        { value: \"true\", label: \"True\" },\n        { value: \"false\", label: \"False\" },\n      ];\n    default:\n      return [];\n  }\n};\n\nconst FilterGroupUI = <T,>({\n  group,\n  depth,\n  columns,\n  onAddRule,\n  onAddGroup,\n  onUpdateRule,\n  onUpdateGroupLogic,\n  onRemoveItem,\n}: {\n  group: FilterGroup<T>;\n  depth: number;\n  columns: ColumnDefinition<T>[];\n  onAddRule: (parentId: string) => void;\n  onAddGroup: (parentId: string) => void;\n  onUpdateRule: (ruleId: string, updates: Partial<FilterRule<T>>) => void;\n  onUpdateGroupLogic: (groupId: string, logic: LogicalOperator) => void;\n  onRemoveItem: (itemId: string) => void;\n}) => {\n  return (\n    <div\n      className={`rounded-lg border border-slate-200 bg-slate-50/50 p-4 mb-4 ${\n        depth > 0 ? \"ml-6 md:ml-10 relative border-l-2 border-l-slate-300\" : \"\"\n      }`}\n    >\n      <div className=\"flex flex-wrap items-center justify-between gap-4 mb-4\">\n        <div className=\"flex items-center gap-2\">\n          <span className=\"text-[10px] font-bold uppercase tracking-widest text-slate-500\">\n            Group Logic\n          </span>\n          <div className=\"flex rounded-md border border-slate-200 bg-white p-1 shadow-sm\">\n            <button\n              onClick={() => onUpdateGroupLogic(group.id, \"AND\")}\n              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${\n                group.logic === \"AND\"\n                  ? \"bg-slate-900 text-slate-50\"\n                  : \"text-slate-500 hover:text-slate-900\"\n              }`}\n            >\n              AND\n            </button>\n            <button\n              onClick={() => onUpdateGroupLogic(group.id, \"OR\")}\n              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${\n                group.logic === \"OR\"\n                  ? \"bg-slate-900 text-slate-50\"\n                  : \"text-slate-500 hover:text-slate-900\"\n              }`}\n            >\n              OR\n            </button>\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={() => onAddRule(group.id)}\n            className=\"h-7 text-[10px] font-bold uppercase\"\n          >\n            <Plus className=\"mr-1 h-3 w-3\" /> Rule\n          </Button>\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={() => onAddGroup(group.id)}\n            className=\"h-7 text-[10px] font-bold uppercase\"\n          >\n            <Layers className=\"mr-1 h-3 w-3\" /> Group\n          </Button>\n          {depth > 0 && (\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={() => onRemoveItem(group.id)}\n              className=\"text-slate-400\"\n            >\n              <Trash2 className=\"h-5 w-5 text-red-500\" />\n            </Button>\n          )}\n        </div>\n      </div>\n\n      <div className=\"space-y-3\">\n        {group.items.map((item) => {\n          const column = columns.find(\n            (c) => c.id === (item.type === \"rule\" ? item.columnId : null)\n          );\n          return item.type === \"rule\" ? (\n            <div\n              key={item.id}\n              className=\"flex flex-col md:flex-row md:items-center gap-3 p-3 bg-white border border-slate-200 rounded-md shadow-sm\"\n            >\n              <div className=\"flex-1 min-w-[140px]\">\n                <Select\n                  value={item.columnId as string}\n                  options={columns.map((c) => ({\n                    value: c.id as string,\n                    label: c.label,\n                  }))}\n                  onValueChange={(val) => {\n                    const colId = val as keyof T;\n                    const col = columns.find((c) => c.id === colId);\n                    onUpdateRule(item.id, {\n                      columnId: colId,\n                      operator:\n                        col?.type === \"date\"\n                          ? \"is\"\n                          : col?.type === \"number\"\n                          ? \"equals\"\n                          : col?.type === \"select\"\n                          ? \"equals\"\n                          : \"contains\",\n                      value: \"\",\n                    });\n                  }}\n                />\n              </div>\n              <div className=\"w-full md:w-44\">\n                <Select\n                  value={item.operator}\n                  options={getOperatorsForType(column?.type || \"string\")}\n                  onValueChange={(val) =>\n                    onUpdateRule(item.id, { operator: val as FilterOperator })\n                  }\n                />\n              </div>\n              <div className=\"flex-[1.5] min-w-[180px]\">\n                {column?.type === \"date\" ? (\n                  <Input\n                    type=\"date\"\n                    value={item.value || \"\"}\n                    onChange={(e) =>\n                      onUpdateRule(item.id, { value: e.target.value })\n                    }\n                  />\n                ) : column?.type === \"boolean\" ? (\n                  <div className=\"h-10 flex items-center px-3 border border-slate-200 rounded-md bg-slate-50 text-[10px] font-black uppercase tracking-tighter text-slate-400 italic\">\n                    <Binary className=\"h-3 w-3 mr-2\" />\n                    Binary state\n                  </div>\n                ) : column?.type === \"select\" ? (\n                  <Select\n                    value={item.value || \"\"}\n                    placeholder=\"Choose option...\"\n                    options={(column.options || []).map((opt) => ({\n                      value: opt,\n                      label: opt,\n                    }))}\n                    onValueChange={(val) =>\n                      onUpdateRule(item.id, { value: val })\n                    }\n                  />\n                ) : (\n                  <Input\n                    placeholder=\"Search query...\"\n                    value={item.value || \"\"}\n                    onChange={(e) =>\n                      onUpdateRule(item.id, { value: e.target.value })\n                    }\n                  />\n                )}\n              </div>\n              <Button\n                variant=\"ghost\"\n                size=\"icon\"\n                onClick={() => onRemoveItem(item.id)}\n                className=\"h-9 w-9 text-slate-300 hover:text-red-500 hover:bg-red-50\"\n              >\n                <Trash2 className=\"h-5 w-5 text-red-500\" />\n              </Button>\n            </div>\n          ) : (\n            <FilterGroupUI\n              group={item}\n              depth={depth + 1}\n              columns={columns}\n              onAddRule={onAddRule}\n              onAddGroup={onAddGroup}\n              onUpdateRule={onUpdateRule}\n              onUpdateGroupLogic={onUpdateGroupLogic}\n              onRemoveItem={onRemoveItem}\n            />\n          );\n        })}\n        {group.items.length === 0 && (\n          <div className=\"flex flex-col items-center justify-center py-6 rounded-md border border-dashed border-slate-200 bg-white/50\">\n            <ListFilter className=\"h-5 w-5 text-slate-300 mb-1\" />\n            <p className=\"text-[10px] text-slate-400 font-bold uppercase tracking-widest\">\n              Add a rule to filter\n            </p>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport const AdvancedFilter = <T,>({\n  isOpen,\n  onClose,\n  data,\n  columns,\n  setFilteredData,\n  initialFilters,\n}: AdvancedFilterProps<T>) => {\n  const [rootGroup, setRootGroup] = useState<FilterGroup<T>>({\n    type: \"group\",\n    id: \"root\",\n    logic: \"AND\",\n    items: [],\n  });\n\n  useEffect(() => {\n    if (initialFilters) setRootGroup(initialFilters);\n  }, [initialFilters, isOpen]);\n\n  const updateItemRecursively = useCallback(\n    (\n      group: FilterGroup<T>,\n      targetId: string,\n      updater: (item: FilterItem<T>) => FilterItem<T> | null\n    ): FilterGroup<T> => {\n      if (group.id === targetId) return updater(group) as FilterGroup<T>;\n      return {\n        ...group,\n        items: group.items\n          .map((item) => {\n            if (item.id === targetId) return updater(item);\n            if (item.type === \"group\")\n              return updateItemRecursively(item, targetId, updater);\n            return item;\n          })\n          .filter(Boolean) as FilterItem<T>[],\n      };\n    },\n    []\n  );\n\n  const handleAddRule = useCallback(\n    (parentId: string) => {\n      const firstCol = columns[0];\n      const newRule: FilterRule<T> = {\n        type: \"rule\",\n        id: Math.random().toString(36).substr(2, 9),\n        columnId: firstCol.id,\n        operator:\n          firstCol.type === \"string\"\n            ? \"contains\"\n            : firstCol.type === \"select\"\n            ? \"equals\"\n            : \"equals\",\n        value: \"\",\n      };\n      setRootGroup((prev) =>\n        updateItemRecursively(prev, parentId, (group) => ({\n          ...(group as FilterGroup<T>),\n          items: [...(group as FilterGroup<T>).items, newRule],\n        }))\n      );\n    },\n    [columns, updateItemRecursively]\n  );\n\n  const handleAddGroup = useCallback(\n    (parentId: string) => {\n      const newGroup: FilterGroup<T> = {\n        type: \"group\",\n        id: Math.random().toString(36).substr(2, 9),\n        logic: \"AND\",\n        items: [],\n      };\n      setRootGroup((prev) =>\n        updateItemRecursively(prev, parentId, (group) => ({\n          ...(group as FilterGroup<T>),\n          items: [...(group as FilterGroup<T>).items, newGroup],\n        }))\n      );\n    },\n    [updateItemRecursively]\n  );\n\n  const handleUpdateRule = useCallback(\n    (ruleId: string, updates: Partial<FilterRule<T>>) => {\n      setRootGroup((prev) =>\n        updateItemRecursively(\n          prev,\n          ruleId,\n          (rule) => ({ ...rule, ...updates } as FilterRule<T>)\n        )\n      );\n    },\n    [updateItemRecursively]\n  );\n\n  const handleUpdateGroupLogic = useCallback(\n    (groupId: string, logic: LogicalOperator) => {\n      setRootGroup((prev) =>\n        updateItemRecursively(\n          prev,\n          groupId,\n          (group) => ({ ...group, logic } as FilterGroup<T>)\n        )\n      );\n    },\n    [updateItemRecursively]\n  );\n\n  const handleRemoveItem = useCallback(\n    (itemId: string) => {\n      setRootGroup((prev) => updateItemRecursively(prev, itemId, () => null));\n    },\n    [updateItemRecursively]\n  );\n\n  const handleApply = () => {\n    const filtered = applyFilters(data, rootGroup, columns);\n    setFilteredData(filtered);\n    onClose();\n  };\n\n  const handleClear = () => {\n    const emptyGroup: FilterGroup<T> = {\n      type: \"group\",\n      id: \"root\",\n      logic: \"AND\",\n      items: [],\n    };\n    setRootGroup(emptyGroup);\n    setFilteredData(data);\n    onClose();\n  };\n\n  return (\n    <Dialog\n      open={isOpen}\n      onOpenChange={onClose}\n      title=\"Advanced Filters by arijit\"\n      description=\"Refine your dataset using structured logic and multi-type comparisons.\"\n    >\n      <div className=\"max-h-[60vh] overflow-y-auto px-1 custom-scrollbar pr-3 pb-32\">\n        <FilterGroupUI\n          group={rootGroup}\n          depth={0}\n          columns={columns}\n          onAddRule={handleAddRule}\n          onAddGroup={handleAddGroup}\n          onUpdateRule={handleUpdateRule}\n          onUpdateGroupLogic={handleUpdateGroupLogic}\n          onRemoveItem={handleRemoveItem}\n        />\n      </div>\n      <div className=\"flex w-full justify-between items-center gap-4\">\n        <Button\n          variant=\"ghost\"\n          onClick={handleClear}\n          className=\"text-slate-400 hover:text-red-500 font-black text-[10px] uppercase tracking-widest gap-2\"\n        >\n          <FilterX className=\"h-4 w-4\" /> Reset Filters\n        </Button>\n        <div className=\"flex gap-2\">\n          <Button\n            variant=\"outline\"\n            onClick={onClose}\n            className=\"font-bold h-11 px-6\"\n          >\n            Cancel\n          </Button>\n          <Button\n            onClick={handleApply}\n            className=\"bg-slate-900 font-bold h-11 px-10 rounded-lg shadow-lg hover:shadow-xl transition-shadow\"\n          >\n            Apply View\n          </Button>\n        </div>\n      </div>\n    </Dialog>\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nest-filter",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/AdvancedFilter.tsx

@@ -1,453 +1,453 @@
-import * as React from "react";
-import { useState, useEffect, useCallback } from "react";
-import {
-  FilterRule,
-  FilterGroup,
-  ColumnDefinition,
-  LogicalOperator,
-  FilterOperator,
-  FilterItem,
-} from "../types";
-import { Button } from "./ui/Button";
-import { Input } from "./ui/Input";
-import { Select } from "./ui/Select";
-import { Dialog } from "./ui/Dialog";
-import {
-  Plus,
-  Trash2,
-  Layers,
-  Binary,
-  FilterX,
-  ListFilter,
-} from "lucide-react";
-import { applyFilters } from "../utils/filterLogic";
-
-interface AdvancedFilterProps<T> {
-  isOpen: boolean;
-  onClose: () => void;
-  data: T[];
-  columns: ColumnDefinition<T>[];
-  setFilteredData: (data: T[]) => void;
-  initialFilters?: FilterGroup<T>;
-}
-
-const getOperatorsForType = (
-  type: string
-): { value: FilterOperator; label: string }[] => {
-  switch (type) {
-    case "string":
-      return [
-        { value: "contains", label: "Contains" },
-        { value: "not_contains", label: "Does not contain" },
-        { value: "equals", label: "Exact match" },
-      ];
-    case "select":
-      return [
-        { value: "equals", label: "Is" },
-        { value: "not_equals", label: "Is not" },
-      ];
-    case "number":
-      return [
-        { value: "equals", label: "=" },
-        { value: "not_equals", label: "!=" },
-        { value: "gt", label: ">" },
-        { value: "lt", label: "<" },
-        { value: "gte", label: ">=" },
-        { value: "lte", label: "<=" },
-      ];
-    case "date":
-      return [
-        { value: "is", label: "On date" },
-        { value: "before", label: "Before" },
-        { value: "after", label: "After" },
-      ];
-    case "boolean":
-      return [
-        { value: "true", label: "True" },
-        { value: "false", label: "False" },
-      ];
-    default:
-      return [];
-  }
-};
-
-const FilterGroupUI = <T,>({
-  group,
-  depth,
-  columns,
-  onAddRule,
-  onAddGroup,
-  onUpdateRule,
-  onUpdateGroupLogic,
-  onRemoveItem,
-}: {
-  group: FilterGroup<T>;
-  depth: number;
-  columns: ColumnDefinition<T>[];
-  onAddRule: (parentId: string) => void;
-  onAddGroup: (parentId: string) => void;
-  onUpdateRule: (ruleId: string, updates: Partial<FilterRule<T>>) => void;
-  onUpdateGroupLogic: (groupId: string, logic: LogicalOperator) => void;
-  onRemoveItem: (itemId: string) => void;
-}) => {
-  return (
-    <div
-      className={`rounded-lg border border-slate-200 bg-slate-50/50 p-4 mb-4 ${
-        depth > 0 ? "ml-6 md:ml-10 relative border-l-2 border-l-slate-300" : ""
-      }`}
-    >
-      <div className="flex flex-wrap items-center justify-between gap-4 mb-4">
-        <div className="flex items-center gap-2">
-          <span className="text-[10px] font-bold uppercase tracking-widest text-slate-500">
-            Group Logic
-          </span>
-          <div className="flex rounded-md border border-slate-200 bg-white p-1 shadow-sm">
-            <button
-              onClick={() => onUpdateGroupLogic(group.id, "AND")}
-              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${
-                group.logic === "AND"
-                  ? "bg-slate-900 text-slate-50"
-                  : "text-slate-500 hover:text-slate-900"
-              }`}
-            >
-              AND
-            </button>
-            <button
-              onClick={() => onUpdateGroupLogic(group.id, "OR")}
-              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${
-                group.logic === "OR"
-                  ? "bg-slate-900 text-slate-50"
-                  : "text-slate-500 hover:text-slate-900"
-              }`}
-            >
-              OR
-            </button>
-          </div>
-        </div>
-
-        <div className="flex items-center gap-2">
-          <Button
-            variant="outline"
-            size="sm"
-            onClick={() => onAddRule(group.id)}
-            className="h-7 text-[10px] font-bold uppercase"
-          >
-            <Plus className="mr-1 h-3 w-3" /> Rule
-          </Button>
-          <Button
-            variant="outline"
-            size="sm"
-            onClick={() => onAddGroup(group.id)}
-            className="h-7 text-[10px] font-bold uppercase"
-          >
-            <Layers className="mr-1 h-3 w-3" /> Group
-          </Button>
-          {depth > 0 && (
-            <Button
-              variant="ghost"
-              size="sm"
-              onClick={() => onRemoveItem(group.id)}
-              className="text-slate-400"
-            >
-              <Trash2 className="h-5 w-5 text-red-500" />
-            </Button>
-          )}
-        </div>
-      </div>
-
-      <div className="space-y-3">
-        {group.items.map((item) => {
-          const column = columns.find(
-            (c) => c.id === (item.type === "rule" ? item.columnId : null)
-          );
-          return item.type === "rule" ? (
-            <div
-              key={item.id}
-              className="flex flex-col md:flex-row md:items-center gap-3 p-3 bg-white border border-slate-200 rounded-md shadow-sm"
-            >
-              <div className="flex-1 min-w-[140px]">
-                <Select
-                  value={item.columnId as string}
-                  options={columns.map((c) => ({
-                    value: c.id as string,
-                    label: c.label,
-                  }))}
-                  onValueChange={(val) => {
-                    const colId = val as keyof T;
-                    const col = columns.find((c) => c.id === colId);
-                    onUpdateRule(item.id, {
-                      columnId: colId,
-                      operator:
-                        col?.type === "date"
-                          ? "is"
-                          : col?.type === "number"
-                          ? "equals"
-                          : col?.type === "select"
-                          ? "equals"
-                          : "contains",
-                      value: "",
-                    });
-                  }}
-                />
-              </div>
-              <div className="w-full md:w-44">
-                <Select
-                  value={item.operator}
-                  options={getOperatorsForType(column?.type || "string")}
-                  onValueChange={(val) =>
-                    onUpdateRule(item.id, { operator: val as FilterOperator })
-                  }
-                />
-              </div>
-              <div className="flex-[1.5] min-w-[180px]">
-                {column?.type === "date" ? (
-                  <Input
-                    type="date"
-                    value={item.value || ""}
-                    onChange={(e) =>
-                      onUpdateRule(item.id, { value: e.target.value })
-                    }
-                  />
-                ) : column?.type === "boolean" ? (
-                  <div className="h-10 flex items-center px-3 border border-slate-200 rounded-md bg-slate-50 text-[10px] font-black uppercase tracking-tighter text-slate-400 italic">
-                    <Binary className="h-3 w-3 mr-2" />
-                    Binary state
-                  </div>
-                ) : column?.type === "select" ? (
-                  <Select
-                    value={item.value || ""}
-                    placeholder="Choose option..."
-                    options={(column.options || []).map((opt) => ({
-                      value: opt,
-                      label: opt,
-                    }))}
-                    onValueChange={(val) =>
-                      onUpdateRule(item.id, { value: val })
-                    }
-                  />
-                ) : (
-                  <Input
-                    placeholder="Search query..."
-                    value={item.value || ""}
-                    onChange={(e) =>
-                      onUpdateRule(item.id, { value: e.target.value })
-                    }
-                  />
-                )}
-              </div>
-              <Button
-                variant="ghost"
-                size="icon"
-                onClick={() => onRemoveItem(item.id)}
-                className="h-9 w-9 text-slate-300 hover:text-red-500 hover:bg-red-50"
-              >
-                <Trash2 className="h-5 w-5 text-red-500" />
-              </Button>
-            </div>
-          ) : (
-            <FilterGroupUI
-              group={item}
-              depth={depth + 1}
-              columns={columns}
-              onAddRule={onAddRule}
-              onAddGroup={onAddGroup}
-              onUpdateRule={onUpdateRule}
-              onUpdateGroupLogic={onUpdateGroupLogic}
-              onRemoveItem={onRemoveItem}
-            />
-          );
-        })}
-        {group.items.length === 0 && (
-          <div className="flex flex-col items-center justify-center py-6 rounded-md border border-dashed border-slate-200 bg-white/50">
-            <ListFilter className="h-5 w-5 text-slate-300 mb-1" />
-            <p className="text-[10px] text-slate-400 font-bold uppercase tracking-widest">
-              Add a rule to filter
-            </p>
-          </div>
-        )}
-      </div>
-    </div>
-  );
-};
-
-export const AdvancedFilter = <T,>({
-  isOpen,
-  onClose,
-  data,
-  columns,
-  setFilteredData,
-  initialFilters,
-}: AdvancedFilterProps<T>) => {
-  const [rootGroup, setRootGroup] = useState<FilterGroup<T>>({
-    type: "group",
-    id: "root",
-    logic: "AND",
-    items: [],
-  });
-
-  useEffect(() => {
-    if (initialFilters) setRootGroup(initialFilters);
-  }, [initialFilters, isOpen]);
-
-  const updateItemRecursively = useCallback(
-    (
-      group: FilterGroup<T>,
-      targetId: string,
-      updater: (item: FilterItem<T>) => FilterItem<T> | null
-    ): FilterGroup<T> => {
-      if (group.id === targetId) return updater(group) as FilterGroup<T>;
-      return {
-        ...group,
-        items: group.items
-          .map((item) => {
-            if (item.id === targetId) return updater(item);
-            if (item.type === "group")
-              return updateItemRecursively(item, targetId, updater);
-            return item;
-          })
-          .filter(Boolean) as FilterItem<T>[],
-      };
-    },
-    []
-  );
-
-  const handleAddRule = useCallback(
-    (parentId: string) => {
-      const firstCol = columns[0];
-      const newRule: FilterRule<T> = {
-        type: "rule",
-        id: Math.random().toString(36).substr(2, 9),
-        columnId: firstCol.id,
-        operator:
-          firstCol.type === "string"
-            ? "contains"
-            : firstCol.type === "select"
-            ? "equals"
-            : "equals",
-        value: "",
-      };
-      setRootGroup((prev) =>
-        updateItemRecursively(prev, parentId, (group) => ({
-          ...(group as FilterGroup<T>),
-          items: [...(group as FilterGroup<T>).items, newRule],
-        }))
-      );
-    },
-    [columns, updateItemRecursively]
-  );
-
-  const handleAddGroup = useCallback(
-    (parentId: string) => {
-      const newGroup: FilterGroup<T> = {
-        type: "group",
-        id: Math.random().toString(36).substr(2, 9),
-        logic: "AND",
-        items: [],
-      };
-      setRootGroup((prev) =>
-        updateItemRecursively(prev, parentId, (group) => ({
-          ...(group as FilterGroup<T>),
-          items: [...(group as FilterGroup<T>).items, newGroup],
-        }))
-      );
-    },
-    [updateItemRecursively]
-  );
-
-  const handleUpdateRule = useCallback(
-    (ruleId: string, updates: Partial<FilterRule<T>>) => {
-      setRootGroup((prev) =>
-        updateItemRecursively(
-          prev,
-          ruleId,
-          (rule) => ({ ...rule, ...updates } as FilterRule<T>)
-        )
-      );
-    },
-    [updateItemRecursively]
-  );
-
-  const handleUpdateGroupLogic = useCallback(
-    (groupId: string, logic: LogicalOperator) => {
-      setRootGroup((prev) =>
-        updateItemRecursively(
-          prev,
-          groupId,
-          (group) => ({ ...group, logic } as FilterGroup<T>)
-        )
-      );
-    },
-    [updateItemRecursively]
-  );
-
-  const handleRemoveItem = useCallback(
-    (itemId: string) => {
-      setRootGroup((prev) => updateItemRecursively(prev, itemId, () => null));
-    },
-    [updateItemRecursively]
-  );
-
-  const handleApply = () => {
-    const filtered = applyFilters(data, rootGroup, columns);
-    setFilteredData(filtered);
-    onClose();
-  };
-
-  const handleClear = () => {
-    const emptyGroup: FilterGroup<T> = {
-      type: "group",
-      id: "root",
-      logic: "AND",
-      items: [],
-    };
-    setRootGroup(emptyGroup);
-    setFilteredData(data);
-    onClose();
-  };
-
-  return (
-    <Dialog
-      open={isOpen}
-      onOpenChange={onClose}
-      title="Advanced Filters"
-      description="Refine your dataset using structured logic and multi-type comparisons."
-    >
-      <div className="max-h-[60vh] overflow-y-auto px-1 custom-scrollbar pr-3 pb-32">
-        <FilterGroupUI
-          group={rootGroup}
-          depth={0}
-          columns={columns}
-          onAddRule={handleAddRule}
-          onAddGroup={handleAddGroup}
-          onUpdateRule={handleUpdateRule}
-          onUpdateGroupLogic={handleUpdateGroupLogic}
-          onRemoveItem={handleRemoveItem}
-        />
-      </div>
-      <div className="flex w-full justify-between items-center gap-4">
-        <Button
-          variant="ghost"
-          onClick={handleClear}
-          className="text-slate-400 hover:text-red-500 font-black text-[10px] uppercase tracking-widest gap-2"
-        >
-          <FilterX className="h-4 w-4" /> Reset Filters
-        </Button>
-        <div className="flex gap-2">
-          <Button
-            variant="outline"
-            onClick={onClose}
-            className="font-bold h-11 px-6"
-          >
-            Cancel
-          </Button>
-          <Button
-            onClick={handleApply}
-            className="bg-slate-900 font-bold h-11 px-10 rounded-lg shadow-lg hover:shadow-xl transition-shadow"
-          >
-            Apply View
-          </Button>
-        </div>
-      </div>
-    </Dialog>
-  );
-};
+import * as React from "react";
+import { useState, useEffect, useCallback } from "react";
+import {
+  FilterRule,
+  FilterGroup,
+  ColumnDefinition,
+  LogicalOperator,
+  FilterOperator,
+  FilterItem,
+} from "../types";
+import { Button } from "./ui/Button";
+import { Input } from "./ui/Input";
+import { Select } from "./ui/Select";
+import { Dialog } from "./ui/Dialog";
+import {
+  Plus,
+  Trash2,
+  Layers,
+  Binary,
+  FilterX,
+  ListFilter,
+} from "lucide-react";
+import { applyFilters } from "../utils/filterLogic";
+
+interface AdvancedFilterProps<T> {
+  isOpen: boolean;
+  onClose: () => void;
+  data: T[];
+  columns: ColumnDefinition<T>[];
+  setFilteredData: (data: T[]) => void;
+  initialFilters?: FilterGroup<T>;
+}
+
+const getOperatorsForType = (
+  type: string
+): { value: FilterOperator; label: string }[] => {
+  switch (type) {
+    case "string":
+      return [
+        { value: "contains", label: "Contains" },
+        { value: "not_contains", label: "Does not contain" },
+        { value: "equals", label: "Exact match" },
+      ];
+    case "select":
+      return [
+        { value: "equals", label: "Is" },
+        { value: "not_equals", label: "Is not" },
+      ];
+    case "number":
+      return [
+        { value: "equals", label: "=" },
+        { value: "not_equals", label: "!=" },
+        { value: "gt", label: ">" },
+        { value: "lt", label: "<" },
+        { value: "gte", label: ">=" },
+        { value: "lte", label: "<=" },
+      ];
+    case "date":
+      return [
+        { value: "is", label: "On date" },
+        { value: "before", label: "Before" },
+        { value: "after", label: "After" },
+      ];
+    case "boolean":
+      return [
+        { value: "true", label: "True" },
+        { value: "false", label: "False" },
+      ];
+    default:
+      return [];
+  }
+};
+
+const FilterGroupUI = <T,>({
+  group,
+  depth,
+  columns,
+  onAddRule,
+  onAddGroup,
+  onUpdateRule,
+  onUpdateGroupLogic,
+  onRemoveItem,
+}: {
+  group: FilterGroup<T>;
+  depth: number;
+  columns: ColumnDefinition<T>[];
+  onAddRule: (parentId: string) => void;
+  onAddGroup: (parentId: string) => void;
+  onUpdateRule: (ruleId: string, updates: Partial<FilterRule<T>>) => void;
+  onUpdateGroupLogic: (groupId: string, logic: LogicalOperator) => void;
+  onRemoveItem: (itemId: string) => void;
+}) => {
+  return (
+    <div
+      className={`rounded-lg border border-slate-200 bg-slate-50/50 p-4 mb-4 ${
+        depth > 0 ? "ml-6 md:ml-10 relative border-l-2 border-l-slate-300" : ""
+      }`}
+    >
+      <div className="flex flex-wrap items-center justify-between gap-4 mb-4">
+        <div className="flex items-center gap-2">
+          <span className="text-[10px] font-bold uppercase tracking-widest text-slate-500">
+            Group Logic
+          </span>
+          <div className="flex rounded-md border border-slate-200 bg-white p-1 shadow-sm">
+            <button
+              onClick={() => onUpdateGroupLogic(group.id, "AND")}
+              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${
+                group.logic === "AND"
+                  ? "bg-slate-900 text-slate-50"
+                  : "text-slate-500 hover:text-slate-900"
+              }`}
+            >
+              AND
+            </button>
+            <button
+              onClick={() => onUpdateGroupLogic(group.id, "OR")}
+              className={`px-3 py-1 text-[10px] font-black rounded-sm transition-all ${
+                group.logic === "OR"
+                  ? "bg-slate-900 text-slate-50"
+                  : "text-slate-500 hover:text-slate-900"
+              }`}
+            >
+              OR
+            </button>
+          </div>
+        </div>
+
+        <div className="flex items-center gap-2">
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={() => onAddRule(group.id)}
+            className="h-7 text-[10px] font-bold uppercase"
+          >
+            <Plus className="mr-1 h-3 w-3" /> Rule
+          </Button>
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={() => onAddGroup(group.id)}
+            className="h-7 text-[10px] font-bold uppercase"
+          >
+            <Layers className="mr-1 h-3 w-3" /> Group
+          </Button>
+          {depth > 0 && (
+            <Button
+              variant="ghost"
+              size="sm"
+              onClick={() => onRemoveItem(group.id)}
+              className="text-slate-400"
+            >
+              <Trash2 className="h-5 w-5 text-red-500" />
+            </Button>
+          )}
+        </div>
+      </div>
+
+      <div className="space-y-3">
+        {group.items.map((item) => {
+          const column = columns.find(
+            (c) => c.id === (item.type === "rule" ? item.columnId : null)
+          );
+          return item.type === "rule" ? (
+            <div
+              key={item.id}
+              className="flex flex-col md:flex-row md:items-center gap-3 p-3 bg-white border border-slate-200 rounded-md shadow-sm"
+            >
+              <div className="flex-1 min-w-[140px]">
+                <Select
+                  value={item.columnId as string}
+                  options={columns.map((c) => ({
+                    value: c.id as string,
+                    label: c.label,
+                  }))}
+                  onValueChange={(val) => {
+                    const colId = val as keyof T;
+                    const col = columns.find((c) => c.id === colId);
+                    onUpdateRule(item.id, {
+                      columnId: colId,
+                      operator:
+                        col?.type === "date"
+                          ? "is"
+                          : col?.type === "number"
+                          ? "equals"
+                          : col?.type === "select"
+                          ? "equals"
+                          : "contains",
+                      value: "",
+                    });
+                  }}
+                />
+              </div>
+              <div className="w-full md:w-44">
+                <Select
+                  value={item.operator}
+                  options={getOperatorsForType(column?.type || "string")}
+                  onValueChange={(val) =>
+                    onUpdateRule(item.id, { operator: val as FilterOperator })
+                  }
+                />
+              </div>
+              <div className="flex-[1.5] min-w-[180px]">
+                {column?.type === "date" ? (
+                  <Input
+                    type="date"
+                    value={item.value || ""}
+                    onChange={(e) =>
+                      onUpdateRule(item.id, { value: e.target.value })
+                    }
+                  />
+                ) : column?.type === "boolean" ? (
+                  <div className="h-10 flex items-center px-3 border border-slate-200 rounded-md bg-slate-50 text-[10px] font-black uppercase tracking-tighter text-slate-400 italic">
+                    <Binary className="h-3 w-3 mr-2" />
+                    Binary state
+                  </div>
+                ) : column?.type === "select" ? (
+                  <Select
+                    value={item.value || ""}
+                    placeholder="Choose option..."
+                    options={(column.options || []).map((opt) => ({
+                      value: opt,
+                      label: opt,
+                    }))}
+                    onValueChange={(val) =>
+                      onUpdateRule(item.id, { value: val })
+                    }
+                  />
+                ) : (
+                  <Input
+                    placeholder="Search query..."
+                    value={item.value || ""}
+                    onChange={(e) =>
+                      onUpdateRule(item.id, { value: e.target.value })
+                    }
+                  />
+                )}
+              </div>
+              <Button
+                variant="ghost"
+                size="icon"
+                onClick={() => onRemoveItem(item.id)}
+                className="h-9 w-9 text-slate-300 hover:text-red-500 hover:bg-red-50"
+              >
+                <Trash2 className="h-5 w-5 text-red-500" />
+              </Button>
+            </div>
+          ) : (
+            <FilterGroupUI
+              group={item}
+              depth={depth + 1}
+              columns={columns}
+              onAddRule={onAddRule}
+              onAddGroup={onAddGroup}
+              onUpdateRule={onUpdateRule}
+              onUpdateGroupLogic={onUpdateGroupLogic}
+              onRemoveItem={onRemoveItem}
+            />
+          );
+        })}
+        {group.items.length === 0 && (
+          <div className="flex flex-col items-center justify-center py-6 rounded-md border border-dashed border-slate-200 bg-white/50">
+            <ListFilter className="h-5 w-5 text-slate-300 mb-1" />
+            <p className="text-[10px] text-slate-400 font-bold uppercase tracking-widest">
+              Add a rule to filter
+            </p>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export const AdvancedFilter = <T,>({
+  isOpen,
+  onClose,
+  data,
+  columns,
+  setFilteredData,
+  initialFilters,
+}: AdvancedFilterProps<T>) => {
+  const [rootGroup, setRootGroup] = useState<FilterGroup<T>>({
+    type: "group",
+    id: "root",
+    logic: "AND",
+    items: [],
+  });
+
+  useEffect(() => {
+    if (initialFilters) setRootGroup(initialFilters);
+  }, [initialFilters, isOpen]);
+
+  const updateItemRecursively = useCallback(
+    (
+      group: FilterGroup<T>,
+      targetId: string,
+      updater: (item: FilterItem<T>) => FilterItem<T> | null
+    ): FilterGroup<T> => {
+      if (group.id === targetId) return updater(group) as FilterGroup<T>;
+      return {
+        ...group,
+        items: group.items
+          .map((item) => {
+            if (item.id === targetId) return updater(item);
+            if (item.type === "group")
+              return updateItemRecursively(item, targetId, updater);
+            return item;
+          })
+          .filter(Boolean) as FilterItem<T>[],
+      };
+    },
+    []
+  );
+
+  const handleAddRule = useCallback(
+    (parentId: string) => {
+      const firstCol = columns[0];
+      const newRule: FilterRule<T> = {
+        type: "rule",
+        id: Math.random().toString(36).substr(2, 9),
+        columnId: firstCol.id,
+        operator:
+          firstCol.type === "string"
+            ? "contains"
+            : firstCol.type === "select"
+            ? "equals"
+            : "equals",
+        value: "",
+      };
+      setRootGroup((prev) =>
+        updateItemRecursively(prev, parentId, (group) => ({
+          ...(group as FilterGroup<T>),
+          items: [...(group as FilterGroup<T>).items, newRule],
+        }))
+      );
+    },
+    [columns, updateItemRecursively]
+  );
+
+  const handleAddGroup = useCallback(
+    (parentId: string) => {
+      const newGroup: FilterGroup<T> = {
+        type: "group",
+        id: Math.random().toString(36).substr(2, 9),
+        logic: "AND",
+        items: [],
+      };
+      setRootGroup((prev) =>
+        updateItemRecursively(prev, parentId, (group) => ({
+          ...(group as FilterGroup<T>),
+          items: [...(group as FilterGroup<T>).items, newGroup],
+        }))
+      );
+    },
+    [updateItemRecursively]
+  );
+
+  const handleUpdateRule = useCallback(
+    (ruleId: string, updates: Partial<FilterRule<T>>) => {
+      setRootGroup((prev) =>
+        updateItemRecursively(
+          prev,
+          ruleId,
+          (rule) => ({ ...rule, ...updates } as FilterRule<T>)
+        )
+      );
+    },
+    [updateItemRecursively]
+  );
+
+  const handleUpdateGroupLogic = useCallback(
+    (groupId: string, logic: LogicalOperator) => {
+      setRootGroup((prev) =>
+        updateItemRecursively(
+          prev,
+          groupId,
+          (group) => ({ ...group, logic } as FilterGroup<T>)
+        )
+      );
+    },
+    [updateItemRecursively]
+  );
+
+  const handleRemoveItem = useCallback(
+    (itemId: string) => {
+      setRootGroup((prev) => updateItemRecursively(prev, itemId, () => null));
+    },
+    [updateItemRecursively]
+  );
+
+  const handleApply = () => {
+    const filtered = applyFilters(data, rootGroup, columns);
+    setFilteredData(filtered);
+    onClose();
+  };
+
+  const handleClear = () => {
+    const emptyGroup: FilterGroup<T> = {
+      type: "group",
+      id: "root",
+      logic: "AND",
+      items: [],
+    };
+    setRootGroup(emptyGroup);
+    setFilteredData(data);
+    onClose();
+  };
+
+  return (
+    <Dialog
+      open={isOpen}
+      onOpenChange={onClose}
+      title="Advanced Filters"
+      description="Refine your dataset using structured logic and multi-type comparisons."
+    >
+      <div className="max-h-[60vh] overflow-y-auto px-1 custom-scrollbar pr-3 pb-32">
+        <FilterGroupUI
+          group={rootGroup}
+          depth={0}
+          columns={columns}
+          onAddRule={handleAddRule}
+          onAddGroup={handleAddGroup}
+          onUpdateRule={handleUpdateRule}
+          onUpdateGroupLogic={handleUpdateGroupLogic}
+          onRemoveItem={handleRemoveItem}
+        />
+      </div>
+      <div className="flex w-full justify-between items-center gap-4">
+        <Button
+          variant="ghost"
+          onClick={handleClear}
+          className="text-slate-400 hover:text-red-500 font-black text-[10px] uppercase tracking-widest gap-2"
+        >
+          <FilterX className="h-4 w-4" /> Reset Filters
+        </Button>
+        <div className="flex gap-2">
+          <Button
+            variant="outline"
+            onClick={onClose}
+            className="font-bold h-11 px-6"
+          >
+            Cancel
+          </Button>
+          <Button
+            onClick={handleApply}
+            className="bg-slate-900 font-bold h-11 px-10 rounded-lg shadow-lg hover:shadow-xl transition-shadow"
+          >
+            Apply View
+          </Button>
+        </div>
+      </div>
+    </Dialog>
+  );
+};