@moontra/moonui-pro 2.26.18 → 2.26.20

package/dist/index.mjs

@@ -73508,104 +73508,69 @@ function DataTableQuickFilter({
   filter,
   data
 }) {
+  const [open, setOpen] = useState(false);
   const [searchValue, setSearchValue] = useState("");
-  let column = table.getColumn(filter.column);
-  if (!column) {
-    const allColumns = table.getAllColumns();
-    column = allColumns.find((col) => {
-      const colDef = col.columnDef;
-      return colDef.accessorKey === filter.column || col.id === filter.column;
-    });
-  }
-  if (typeof window !== "undefined" && true) {
-    const allColumns = table.getAllColumns();
-    console.log(`QuickFilter: Looking for column '${filter.column}'`, {
-      availableColumns: allColumns.map((c2) => ({ id: c2.id, accessorKey: c2.columnDef.accessorKey })),
-      columnFound: !!column
-    });
-  }
-  if (!column) {
-    console.warn(`QuickFilter: Column '${filter.column}' not found in table`);
-    return null;
-  }
-  const columnDef = column.columnDef;
-  const filterValueAccessor = columnDef?.meta?.filterValueAccessor;
-  const filterOptions = columnDef?.meta?.filterOptions;
-  const getFilterValue = (row) => {
-    if (filterValueAccessor) {
-      return filterValueAccessor(row);
-    }
-    const value = row[filter.column];
-    if (value === void 0) {
-      const accessor = column.columnDef.accessorKey || column.columnDef.accessorFn;
-      if (typeof accessor === "function") {
-        return accessor(row);
-      } else if (accessor && typeof accessor === "string") {
-        const keys2 = accessor.split(".");
-        let nestedValue = row;
-        for (const key of keys2) {
-          nestedValue = nestedValue?.[key];
-          if (nestedValue === void 0)
-            break;
-        }
-        return nestedValue;
-      }
+  const column = t__default.useMemo(() => {
+    let col = table.getColumn(filter.column);
+    if (!col) {
+      const allCols = table.getAllColumns();
+      col = allCols.find(
+        (c2) => c2.id === filter.column || c2.columnDef.accessorKey === filter.column
+      );
     }
-    return value;
-  };
+    return col;
+  }, [table, filter.column]);
   const availableOptions = useMemo(() => {
     if (filter.options && filter.options !== "auto") {
       return filter.options;
     }
-    if (filterOptions) {
-      return filterOptions;
-    }
     const uniqueValues = /* @__PURE__ */ new Set();
     data.forEach((row) => {
-      const value = getFilterValue(row);
+      let value = row[filter.column];
+      if (value === void 0 && filter.column.includes(".")) {
+        const keys2 = filter.column.split(".");
+        value = row;
+        for (const key of keys2) {
+          value = value?.[key];
+        }
+      }
       if (value != null && value !== "") {
         uniqueValues.add(String(value));
       }
     });
-    const options = Array.from(uniqueValues).sort().slice(0, 50);
-    if (typeof window !== "undefined" && true) {
-      console.log(`QuickFilter Debug [${filter.column}]:`, {
-        dataLength: data.length,
-        uniqueValues: uniqueValues.size,
-        options,
-        filterOptions: filter.options,
-        sampleData: data.length > 0 ? data[0] : null,
-        columnExists: !!column,
-        columnDef: column?.columnDef
-      });
-    }
-    return options;
-  }, [data, filter.options, filterOptions, filter.column]);
+    return Array.from(uniqueValues).sort();
+  }, [data, filter.column, filter.options]);
+  const filterValue = column?.getFilterValue();
+  const selectedValues = useMemo(() => {
+    if (!filterValue)
+      return /* @__PURE__ */ new Set();
+    if (Array.isArray(filterValue))
+      return new Set(filterValue);
+    return /* @__PURE__ */ new Set([String(filterValue)]);
+  }, [filterValue]);
   const optionCounts = useMemo(() => {
     if (!filter.showCounts)
       return {};
     const counts = {};
-    availableOptions.forEach((option) => {
-      counts[option] = 0;
-    });
     data.forEach((row) => {
-      const value = getFilterValue(row);
-      if (value != null && counts[String(value)] !== void 0) {
-        counts[String(value)]++;
+      let value = row[filter.column];
+      if (value === void 0 && filter.column.includes(".")) {
+        const keys2 = filter.column.split(".");
+        value = row;
+        for (const key of keys2) {
+          value = value?.[key];
+        }
+      }
+      if (value != null && value !== "") {
+        const strValue = String(value);
+        counts[strValue] = (counts[strValue] || 0) + 1;
       }
     });
     return counts;
-  }, [data, filter.showCounts, availableOptions]);
-  const filterValue = column.getFilterValue();
-  const selectedValues = useMemo(() => {
-    if (!filterValue)
-      return /* @__PURE__ */ new Set();
-    if (Array.isArray(filterValue))
-      return new Set(filterValue);
-    return /* @__PURE__ */ new Set([String(filterValue)]);
-  }, [filterValue]);
-  const label = filter.label || column.id;
+  }, [data, filter.column, filter.showCounts]);
   const handleSelect = (value) => {
+    if (!column)
+      return;
     if (filter.multi) {
       const newValues = new Set(selectedValues);
       if (newValues.has(value)) {
@@ -73627,9 +73592,10 @@ function DataTableQuickFilter({
     }
   };
   const handleClear = () => {
-    column.setFilterValue(void 0);
+    column?.setFilterValue(void 0);
     setSearchValue("");
   };
+  const label = filter.label || filter.column;
   const filteredOptions = useMemo(() => {
     if (!searchValue)
       return availableOptions;
@@ -73637,12 +73603,14 @@ function DataTableQuickFilter({
       (option) => option.toLowerCase().includes(searchValue.toLowerCase())
     );
   }, [availableOptions, searchValue]);
-  return /* @__PURE__ */ jsxs(MoonUIPopoverPro, { children: [
+  const isDisabled = !column || availableOptions.length === 0;
+  return /* @__PURE__ */ jsxs(MoonUIPopoverPro, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ jsx(MoonUIPopoverTriggerPro, { asChild: true, children: /* @__PURE__ */ jsxs(
       MoonUIButtonPro,
       {
         variant: "outline",
         size: "sm",
+        disabled: isDisabled,
         className: cn(
           "h-8 border-dashed",
           selectedValues.size > 0 && "border-solid"
@@ -73663,51 +73631,57 @@ function DataTableQuickFilter({
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx(MoonUIPopoverContentPro, { className: "w-[250px] p-0", align: "start", children: /* @__PURE__ */ jsxs(MoonUICommandPro, { shouldFilter: false, children: [
-      /* @__PURE__ */ jsx(
-        MoonUICommandInputPro,
-        {
-          placeholder: `Search ${label.toLowerCase()}...`,
-          value: searchValue,
-          onValueChange: setSearchValue
-        }
-      ),
-      /* @__PURE__ */ jsx(MoonUICommandListPro, { children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx(MoonUICommandEmptyPro, { children: "No results found" }) : /* @__PURE__ */ jsx(MoonUICommandGroupPro, { children: filteredOptions.map((option) => {
+    /* @__PURE__ */ jsx(MoonUIPopoverContentPro, { className: "w-[250px] p-0", align: "start", children: /* @__PURE__ */ jsxs("div", { className: "p-2", children: [
+      availableOptions.length > 0 && /* @__PURE__ */ jsx("div", { className: "pb-2", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx(Search, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }),
+        /* @__PURE__ */ jsx(
+          MoonUIInputPro,
+          {
+            placeholder: `Search ${label.toLowerCase()}...`,
+            value: searchValue,
+            onChange: (e) => setSearchValue(e.target.value),
+            className: "h-8 w-full pl-8"
+          }
+        )
+      ] }) }),
+      availableOptions.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-center text-sm text-muted-foreground py-4", children: "No options available" }) : filteredOptions.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-center text-sm text-muted-foreground py-4", children: "No results found" }) : /* @__PURE__ */ jsx("div", { className: "space-y-1 max-h-[300px] overflow-y-auto", children: filteredOptions.map((option) => {
         const isSelected = selectedValues.has(option);
         return /* @__PURE__ */ jsxs(
-          MoonUICommandItemPro,
+          "button",
           {
-            value: option,
-            onSelect: () => handleSelect(option),
+            onClick: () => handleSelect(option),
+            className: cn(
+              "flex w-full items-center justify-between rounded px-2 py-1.5 text-sm hover:bg-accent",
+              isSelected && "bg-accent"
+            ),
             children: [
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary",
-                    isSelected ? "bg-primary text-primary-foreground" : "opacity-50 [&_svg]:invisible"
-                  ),
-                  children: /* @__PURE__ */ jsx(Check, { className: cn("h-4 w-4") })
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "flex-1", children: option }),
-              filter.showCounts && optionCounts[option] !== void 0 && /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs text-muted-foreground", children: optionCounts[option] })
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary",
+                      isSelected ? "bg-primary text-primary-foreground" : "opacity-50 [&_svg]:invisible"
+                    ),
+                    children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" })
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { children: option })
+              ] }),
+              filter.showCounts && optionCounts[option] !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: optionCounts[option] })
             ]
           },
           option
         );
-      }) }) }),
-      selectedValues.size > 0 && /* @__PURE__ */ jsx("div", { className: "border-t p-2", children: /* @__PURE__ */ jsxs(
+      }) }),
+      selectedValues.size > 0 && /* @__PURE__ */ jsx("div", { className: "border-t mt-2 pt-2", children: /* @__PURE__ */ jsx(
         MoonUIButtonPro,
         {
           variant: "ghost",
           size: "sm",
           className: "w-full justify-center",
           onClick: handleClear,
-          children: [
-            /* @__PURE__ */ jsx(X, { className: "mr-2 h-4 w-4" }),
-            "Clear filter"
-          ]
+          children: "Clear filter"
         }
       ) })
     ] }) })

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@moontra/moonui-pro",
-    "version": "2.26.18",
+    "version": "2.26.20",
     "description": "Premium React components for MoonUI - Advanced UI library with 50+ pro components including performance, interactive, and gesture components",
     "type": "module",
     "main": "dist/index.mjs",