@moontra/moonui-pro 2.26.18 → 2.26.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.global.js +69 -69
- package/dist/index.global.js.map +1 -1
- package/dist/index.mjs +72 -119
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -73508,104 +73508,68 @@ function DataTableQuickFilter({
|
|
|
73508
73508
|
filter,
|
|
73509
73509
|
data
|
|
73510
73510
|
}) {
|
|
73511
|
-
const [
|
|
73512
|
-
|
|
73513
|
-
|
|
73514
|
-
|
|
73515
|
-
|
|
73516
|
-
|
|
73517
|
-
|
|
73518
|
-
|
|
73519
|
-
}
|
|
73520
|
-
if (typeof window !== "undefined" && true) {
|
|
73521
|
-
const allColumns = table.getAllColumns();
|
|
73522
|
-
console.log(`QuickFilter: Looking for column '${filter.column}'`, {
|
|
73523
|
-
availableColumns: allColumns.map((c2) => ({ id: c2.id, accessorKey: c2.columnDef.accessorKey })),
|
|
73524
|
-
columnFound: !!column
|
|
73525
|
-
});
|
|
73526
|
-
}
|
|
73527
|
-
if (!column) {
|
|
73528
|
-
console.warn(`QuickFilter: Column '${filter.column}' not found in table`);
|
|
73529
|
-
return null;
|
|
73530
|
-
}
|
|
73531
|
-
const columnDef = column.columnDef;
|
|
73532
|
-
const filterValueAccessor = columnDef?.meta?.filterValueAccessor;
|
|
73533
|
-
const filterOptions = columnDef?.meta?.filterOptions;
|
|
73534
|
-
const getFilterValue = (row) => {
|
|
73535
|
-
if (filterValueAccessor) {
|
|
73536
|
-
return filterValueAccessor(row);
|
|
73537
|
-
}
|
|
73538
|
-
const value = row[filter.column];
|
|
73539
|
-
if (value === void 0) {
|
|
73540
|
-
const accessor = column.columnDef.accessorKey || column.columnDef.accessorFn;
|
|
73541
|
-
if (typeof accessor === "function") {
|
|
73542
|
-
return accessor(row);
|
|
73543
|
-
} else if (accessor && typeof accessor === "string") {
|
|
73544
|
-
const keys2 = accessor.split(".");
|
|
73545
|
-
let nestedValue = row;
|
|
73546
|
-
for (const key of keys2) {
|
|
73547
|
-
nestedValue = nestedValue?.[key];
|
|
73548
|
-
if (nestedValue === void 0)
|
|
73549
|
-
break;
|
|
73550
|
-
}
|
|
73551
|
-
return nestedValue;
|
|
73552
|
-
}
|
|
73511
|
+
const [open, setOpen] = useState(false);
|
|
73512
|
+
const column = t__default.useMemo(() => {
|
|
73513
|
+
let col = table.getColumn(filter.column);
|
|
73514
|
+
if (!col) {
|
|
73515
|
+
const allCols = table.getAllColumns();
|
|
73516
|
+
col = allCols.find(
|
|
73517
|
+
(c2) => c2.id === filter.column || c2.columnDef.accessorKey === filter.column
|
|
73518
|
+
);
|
|
73553
73519
|
}
|
|
73554
|
-
return
|
|
73555
|
-
};
|
|
73520
|
+
return col;
|
|
73521
|
+
}, [table, filter.column]);
|
|
73556
73522
|
const availableOptions = useMemo(() => {
|
|
73557
73523
|
if (filter.options && filter.options !== "auto") {
|
|
73558
73524
|
return filter.options;
|
|
73559
73525
|
}
|
|
73560
|
-
if (filterOptions) {
|
|
73561
|
-
return filterOptions;
|
|
73562
|
-
}
|
|
73563
73526
|
const uniqueValues = /* @__PURE__ */ new Set();
|
|
73564
73527
|
data.forEach((row) => {
|
|
73565
|
-
|
|
73528
|
+
let value = row[filter.column];
|
|
73529
|
+
if (value === void 0 && filter.column.includes(".")) {
|
|
73530
|
+
const keys2 = filter.column.split(".");
|
|
73531
|
+
value = row;
|
|
73532
|
+
for (const key of keys2) {
|
|
73533
|
+
value = value?.[key];
|
|
73534
|
+
}
|
|
73535
|
+
}
|
|
73566
73536
|
if (value != null && value !== "") {
|
|
73567
73537
|
uniqueValues.add(String(value));
|
|
73568
73538
|
}
|
|
73569
73539
|
});
|
|
73570
|
-
|
|
73571
|
-
|
|
73572
|
-
|
|
73573
|
-
|
|
73574
|
-
|
|
73575
|
-
|
|
73576
|
-
|
|
73577
|
-
|
|
73578
|
-
|
|
73579
|
-
|
|
73580
|
-
});
|
|
73581
|
-
}
|
|
73582
|
-
return options;
|
|
73583
|
-
}, [data, filter.options, filterOptions, filter.column]);
|
|
73540
|
+
return Array.from(uniqueValues).sort();
|
|
73541
|
+
}, [data, filter.column, filter.options]);
|
|
73542
|
+
const filterValue = column?.getFilterValue();
|
|
73543
|
+
const selectedValues = useMemo(() => {
|
|
73544
|
+
if (!filterValue)
|
|
73545
|
+
return /* @__PURE__ */ new Set();
|
|
73546
|
+
if (Array.isArray(filterValue))
|
|
73547
|
+
return new Set(filterValue);
|
|
73548
|
+
return /* @__PURE__ */ new Set([String(filterValue)]);
|
|
73549
|
+
}, [filterValue]);
|
|
73584
73550
|
const optionCounts = useMemo(() => {
|
|
73585
73551
|
if (!filter.showCounts)
|
|
73586
73552
|
return {};
|
|
73587
73553
|
const counts = {};
|
|
73588
|
-
availableOptions.forEach((option) => {
|
|
73589
|
-
counts[option] = 0;
|
|
73590
|
-
});
|
|
73591
73554
|
data.forEach((row) => {
|
|
73592
|
-
|
|
73593
|
-
if (value
|
|
73594
|
-
|
|
73555
|
+
let value = row[filter.column];
|
|
73556
|
+
if (value === void 0 && filter.column.includes(".")) {
|
|
73557
|
+
const keys2 = filter.column.split(".");
|
|
73558
|
+
value = row;
|
|
73559
|
+
for (const key of keys2) {
|
|
73560
|
+
value = value?.[key];
|
|
73561
|
+
}
|
|
73562
|
+
}
|
|
73563
|
+
if (value != null && value !== "") {
|
|
73564
|
+
const strValue = String(value);
|
|
73565
|
+
counts[strValue] = (counts[strValue] || 0) + 1;
|
|
73595
73566
|
}
|
|
73596
73567
|
});
|
|
73597
73568
|
return counts;
|
|
73598
|
-
}, [data, filter.
|
|
73599
|
-
const filterValue = column.getFilterValue();
|
|
73600
|
-
const selectedValues = useMemo(() => {
|
|
73601
|
-
if (!filterValue)
|
|
73602
|
-
return /* @__PURE__ */ new Set();
|
|
73603
|
-
if (Array.isArray(filterValue))
|
|
73604
|
-
return new Set(filterValue);
|
|
73605
|
-
return /* @__PURE__ */ new Set([String(filterValue)]);
|
|
73606
|
-
}, [filterValue]);
|
|
73607
|
-
const label = filter.label || column.id;
|
|
73569
|
+
}, [data, filter.column, filter.showCounts]);
|
|
73608
73570
|
const handleSelect = (value) => {
|
|
73571
|
+
if (!column)
|
|
73572
|
+
return;
|
|
73609
73573
|
if (filter.multi) {
|
|
73610
73574
|
const newValues = new Set(selectedValues);
|
|
73611
73575
|
if (newValues.has(value)) {
|
|
@@ -73627,22 +73591,17 @@ function DataTableQuickFilter({
|
|
|
73627
73591
|
}
|
|
73628
73592
|
};
|
|
73629
73593
|
const handleClear = () => {
|
|
73630
|
-
column
|
|
73631
|
-
setSearchValue("");
|
|
73594
|
+
column?.setFilterValue(void 0);
|
|
73632
73595
|
};
|
|
73633
|
-
const
|
|
73634
|
-
|
|
73635
|
-
|
|
73636
|
-
return availableOptions.filter(
|
|
73637
|
-
(option) => option.toLowerCase().includes(searchValue.toLowerCase())
|
|
73638
|
-
);
|
|
73639
|
-
}, [availableOptions, searchValue]);
|
|
73640
|
-
return /* @__PURE__ */ jsxs(MoonUIPopoverPro, { children: [
|
|
73596
|
+
const label = filter.label || filter.column;
|
|
73597
|
+
const isDisabled = !column || availableOptions.length === 0;
|
|
73598
|
+
return /* @__PURE__ */ jsxs(MoonUIPopoverPro, { open, onOpenChange: setOpen, children: [
|
|
73641
73599
|
/* @__PURE__ */ jsx(MoonUIPopoverTriggerPro, { asChild: true, children: /* @__PURE__ */ jsxs(
|
|
73642
73600
|
MoonUIButtonPro,
|
|
73643
73601
|
{
|
|
73644
73602
|
variant: "outline",
|
|
73645
73603
|
size: "sm",
|
|
73604
|
+
disabled: isDisabled,
|
|
73646
73605
|
className: cn(
|
|
73647
73606
|
"h-8 border-dashed",
|
|
73648
73607
|
selectedValues.size > 0 && "border-solid"
|
|
@@ -73663,51 +73622,45 @@ function DataTableQuickFilter({
|
|
|
73663
73622
|
]
|
|
73664
73623
|
}
|
|
73665
73624
|
) }),
|
|
73666
|
-
/* @__PURE__ */ jsx(MoonUIPopoverContentPro, { className: "w-[250px] p-0", align: "start", children: /* @__PURE__ */ jsxs(
|
|
73667
|
-
/* @__PURE__ */ jsx(
|
|
73668
|
-
MoonUICommandInputPro,
|
|
73669
|
-
{
|
|
73670
|
-
placeholder: `Search ${label.toLowerCase()}...`,
|
|
73671
|
-
value: searchValue,
|
|
73672
|
-
onValueChange: setSearchValue
|
|
73673
|
-
}
|
|
73674
|
-
),
|
|
73675
|
-
/* @__PURE__ */ jsx(MoonUICommandListPro, { children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx(MoonUICommandEmptyPro, { children: "No results found" }) : /* @__PURE__ */ jsx(MoonUICommandGroupPro, { children: filteredOptions.map((option) => {
|
|
73625
|
+
/* @__PURE__ */ jsx(MoonUIPopoverContentPro, { className: "w-[250px] p-0", align: "start", children: /* @__PURE__ */ jsxs("div", { className: "p-2", children: [
|
|
73626
|
+
availableOptions.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-center text-sm text-muted-foreground py-4", children: "No options available" }) : /* @__PURE__ */ jsx("div", { className: "space-y-1", children: availableOptions.map((option) => {
|
|
73676
73627
|
const isSelected = selectedValues.has(option);
|
|
73677
73628
|
return /* @__PURE__ */ jsxs(
|
|
73678
|
-
|
|
73629
|
+
"button",
|
|
73679
73630
|
{
|
|
73680
|
-
|
|
73681
|
-
|
|
73631
|
+
onClick: () => handleSelect(option),
|
|
73632
|
+
className: cn(
|
|
73633
|
+
"flex w-full items-center justify-between rounded px-2 py-1.5 text-sm hover:bg-accent",
|
|
73634
|
+
isSelected && "bg-accent"
|
|
73635
|
+
),
|
|
73682
73636
|
children: [
|
|
73683
|
-
/* @__PURE__ */
|
|
73684
|
-
|
|
73685
|
-
|
|
73686
|
-
|
|
73687
|
-
|
|
73688
|
-
|
|
73689
|
-
|
|
73690
|
-
|
|
73691
|
-
|
|
73692
|
-
|
|
73693
|
-
|
|
73694
|
-
|
|
73637
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
|
|
73638
|
+
/* @__PURE__ */ jsx(
|
|
73639
|
+
"div",
|
|
73640
|
+
{
|
|
73641
|
+
className: cn(
|
|
73642
|
+
"mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary",
|
|
73643
|
+
isSelected ? "bg-primary text-primary-foreground" : "opacity-50 [&_svg]:invisible"
|
|
73644
|
+
),
|
|
73645
|
+
children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" })
|
|
73646
|
+
}
|
|
73647
|
+
),
|
|
73648
|
+
/* @__PURE__ */ jsx("span", { children: option })
|
|
73649
|
+
] }),
|
|
73650
|
+
filter.showCounts && optionCounts[option] !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: optionCounts[option] })
|
|
73695
73651
|
]
|
|
73696
73652
|
},
|
|
73697
73653
|
option
|
|
73698
73654
|
);
|
|
73699
|
-
}) })
|
|
73700
|
-
selectedValues.size > 0 && /* @__PURE__ */ jsx("div", { className: "border-t
|
|
73655
|
+
}) }),
|
|
73656
|
+
selectedValues.size > 0 && /* @__PURE__ */ jsx("div", { className: "border-t mt-2 pt-2", children: /* @__PURE__ */ jsx(
|
|
73701
73657
|
MoonUIButtonPro,
|
|
73702
73658
|
{
|
|
73703
73659
|
variant: "ghost",
|
|
73704
73660
|
size: "sm",
|
|
73705
73661
|
className: "w-full justify-center",
|
|
73706
73662
|
onClick: handleClear,
|
|
73707
|
-
children:
|
|
73708
|
-
/* @__PURE__ */ jsx(X, { className: "mr-2 h-4 w-4" }),
|
|
73709
|
-
"Clear filter"
|
|
73710
|
-
]
|
|
73663
|
+
children: "Clear filter"
|
|
73711
73664
|
}
|
|
73712
73665
|
) })
|
|
73713
73666
|
] }) })
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@moontra/moonui-pro",
|
|
3
|
-
"version": "2.26.
|
|
3
|
+
"version": "2.26.19",
|
|
4
4
|
"description": "Premium React components for MoonUI - Advanced UI library with 50+ pro components including performance, interactive, and gesture components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.mjs",
|