@m5kdev/web-ui 0.8.7 → 0.8.8

package/dist/src/modules/table/components/TableFiltering.js

@@ -0,0 +1,420 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../../../_virtual/_rolldown/runtime.js");
+const require_src_components_ui_button = require("../../../components/ui/button.js");
+const require_src_modules_table_filterTransformers = require("../filterTransformers.js");
+let react = require("react");
+let _heroui_react = require("@heroui/react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let _internationalized_date = require("@internationalized/date");
+//#region src/modules/table/components/TableFiltering.tsx
+const componentForFilterMethod = {
+	text: (value, onChange) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.Input, {
+		size: "sm",
+		"aria-label": "Select Value",
+		className: "flex-1 min-w-0 text-sm",
+		value: value ?? "",
+		onChange: (e) => onChange(e.target.value)
+	}),
+	number: (value, onChange) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.Input, {
+		size: "sm",
+		"aria-label": "Select Value",
+		type: "number",
+		className: "flex-1 min-w-0 text-sm",
+		value: value?.toString() ?? "",
+		onChange: (e) => onChange(Number.parseFloat(e.target.value) || 0)
+	}),
+	date: (value, onChange) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.DatePicker, {
+		size: "sm",
+		"aria-label": "Select Value",
+		className: "flex-1 min-w-0 text-sm",
+		value: value ?? void 0,
+		onChange: (date) => date && onChange(date),
+		maxValue: (0, _internationalized_date.today)((0, _internationalized_date.getLocalTimeZone)())
+	}),
+	range: (value, onChange) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.DateRangePicker, {
+		size: "sm",
+		"aria-label": "Select Value",
+		className: "flex-1 min-w-0 text-sm",
+		value: value ?? void 0,
+		onChange: (range) => range && onChange(range),
+		maxValue: (0, _internationalized_date.today)((0, _internationalized_date.getLocalTimeZone)())
+	}),
+	radio: (value, onChange) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_heroui_react.Select, {
+		size: "sm",
+		"aria-label": "Select Value",
+		className: "flex-1 min-w-0 text-sm",
+		selectedKeys: value ? ["true"] : ["false"],
+		onSelectionChange: (keys) => onChange(keys.currentKey === "true"),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.SelectItem, {
+			className: "text-sm",
+			children: "True"
+		}, "true"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.SelectItem, {
+			className: "text-sm",
+			children: "False"
+		}, "false")]
+	}),
+	select: (value, onChange, options = []) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.Select, {
+		size: "sm",
+		"aria-label": "Select Value",
+		className: "flex-1 min-w-0 text-sm",
+		selectedKeys: value ?? /* @__PURE__ */ new Set(),
+		onSelectionChange: (keys) => keys && onChange(keys),
+		children: options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.SelectItem, {
+			className: "text-sm",
+			children: option.label
+		}, option.value))
+	}),
+	multiSelect: (value, onChange, options = []) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.Select, {
+		size: "sm",
+		"aria-label": "Select Value",
+		selectionMode: "multiple",
+		className: "flex-1 min-w-0 text-sm",
+		selectedKeys: value ? new Set(value) : /* @__PURE__ */ new Set(),
+		onSelectionChange: (keys) => onChange(keys),
+		children: options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.SelectItem, {
+			className: "text-sm",
+			children: option.label
+		}, option.value))
+	})
+};
+const defaultFilterMethods = {
+	string: [
+		{
+			value: "contains",
+			label: "Contains",
+			component: "text"
+		},
+		{
+			value: "equals",
+			label: "Equals",
+			component: "text"
+		},
+		{
+			value: "starts_with",
+			label: "Starts With",
+			component: "text"
+		},
+		{
+			value: "ends_with",
+			label: "Ends With",
+			component: "text"
+		}
+	],
+	number: [
+		{
+			value: "equals",
+			label: "Equals",
+			component: "number"
+		},
+		{
+			value: "greater_than",
+			label: "Greater Than",
+			component: "number"
+		},
+		{
+			value: "less_than",
+			label: "Less Than",
+			component: "number"
+		}
+	],
+	date: [
+		{
+			value: "on",
+			label: "On",
+			component: "date"
+		},
+		{
+			value: "between",
+			label: "Between",
+			component: "range"
+		},
+		{
+			value: "before",
+			label: "Before",
+			component: "date"
+		},
+		{
+			value: "after",
+			label: "After",
+			component: "date"
+		},
+		{
+			value: "intersect",
+			label: "During",
+			component: "range"
+		}
+	],
+	boolean: [{
+		value: "equals",
+		label: "Equals",
+		component: "radio"
+	}],
+	enum: [{
+		value: "oneOf",
+		label: "One Of",
+		component: "multiSelect"
+	}, {
+		value: "equals",
+		label: "Equals",
+		component: "select"
+	}]
+};
+const SINGLE_FILTER_KEY = "single-filter";
+const mergeFilterMethods = (overrides) => ({
+	string: overrides?.string && overrides.string.length > 0 ? overrides.string : defaultFilterMethods.string,
+	number: overrides?.number && overrides.number.length > 0 ? overrides.number : defaultFilterMethods.number,
+	date: overrides?.date && overrides.date.length > 0 ? overrides.date : defaultFilterMethods.date,
+	boolean: overrides?.boolean && overrides.boolean.length > 0 ? overrides.boolean : defaultFilterMethods.boolean,
+	enum: overrides?.enum && overrides.enum.length > 0 ? overrides.enum : defaultFilterMethods.enum
+});
+const TableFiltering = ({ columns, onFiltersChange, filters: initialFilters = [], onClose, singleFilter = false, filterMethods }) => {
+	const [filters, setFilters] = (0, react.useState)({});
+	const effectiveFilterMethods = (0, react.useMemo)(() => mergeFilterMethods(filterMethods), [filterMethods]);
+	const createEmptyFilter = (0, react.useCallback)(() => ({
+		columnId: "",
+		type: null,
+		value: null,
+		method: null,
+		options: null,
+		endColumnId: null,
+		periodStartColumnId: null,
+		periodEndColumnId: null
+	}), []);
+	const addFilter = (0, react.useCallback)(() => {
+		setFilters((prev) => {
+			if (!singleFilter) {
+				const filterId = crypto.randomUUID();
+				return {
+					...prev,
+					[filterId]: createEmptyFilter()
+				};
+			}
+			return Object.keys(prev).length > 0 ? prev : { [SINGLE_FILTER_KEY]: createEmptyFilter() };
+		});
+	}, [createEmptyFilter, singleFilter]);
+	const removeFilter = (0, react.useCallback)((filterId) => {
+		setFilters((prev) => {
+			if (!singleFilter) {
+				const { [filterId]: _, ...rest } = prev;
+				return rest;
+			}
+			return { [SINGLE_FILTER_KEY]: createEmptyFilter() };
+		});
+	}, [createEmptyFilter, singleFilter]);
+	const columnsMap = (0, react.useMemo)(() => new Map(columns.map((column) => [column.id, column])), [columns]);
+	(0, react.useEffect)(() => {
+		const transformedFilters = require_src_modules_table_filterTransformers.transformFiltersToHeroUI(initialFilters, columnsMap, effectiveFilterMethods);
+		if (!singleFilter) {
+			setFilters(Object.fromEntries(transformedFilters.map((filter) => [filter.columnId, filter])));
+			return;
+		}
+		const firstFilter = transformedFilters[0];
+		setFilters({ [SINGLE_FILTER_KEY]: firstFilter ?? createEmptyFilter() });
+	}, [
+		createEmptyFilter,
+		initialFilters,
+		singleFilter,
+		columnsMap,
+		effectiveFilterMethods
+	]);
+	const selectColumn = (0, react.useCallback)((filterId, columnId) => {
+		setFilters((prev) => {
+			const oldFilter = prev[filterId];
+			if (!oldFilter) return prev;
+			const column = columnsMap.get(columnId);
+			if (!column) return prev;
+			const intersectMethod = columnId.endsWith("__period") ? effectiveFilterMethods.date.find((m) => m.value === "intersect") ?? null : null;
+			return {
+				...prev,
+				[filterId]: {
+					...oldFilter,
+					columnId,
+					type: column.type ?? null,
+					options: column.options ?? null,
+					endColumnId: column.endColumnId ?? null,
+					periodStartColumnId: column.periodStartColumnId ?? null,
+					periodEndColumnId: column.periodEndColumnId ?? null,
+					method: intersectMethod,
+					value: null
+				}
+			};
+		});
+	}, [columnsMap, effectiveFilterMethods]);
+	const selectMethod = (0, react.useCallback)((filterId, method) => {
+		setFilters((prev) => {
+			const oldFilter = prev[filterId];
+			if (!oldFilter) return prev;
+			return {
+				...prev,
+				[filterId]: {
+					...oldFilter,
+					method,
+					value: null
+				}
+			};
+		});
+	}, []);
+	const selectValue = (0, react.useCallback)((filterId, value) => {
+		setFilters((prev) => {
+			const oldFilter = prev[filterId];
+			if (!oldFilter) return prev;
+			return {
+				...prev,
+				[filterId]: {
+					...oldFilter,
+					value
+				}
+			};
+		});
+	}, []);
+	const filterEntries = (0, react.useMemo)(() => Object.entries(filters), [filters]);
+	const availableColumnsMap = (0, react.useMemo)(() => {
+		const map = /* @__PURE__ */ new Map();
+		filterEntries.forEach(([filterId]) => {
+			const columnsUsedByOtherFilters = new Set(filterEntries.filter(([id]) => id !== filterId).map(([_, f]) => f.columnId).filter((id) => id !== ""));
+			map.set(filterId, columns.filter((column) => !columnsUsedByOtherFilters.has(column.id)));
+		});
+		return map;
+	}, [filterEntries, columns]);
+	const applyFilters = (0, react.useCallback)(() => {
+		onFiltersChange(require_src_modules_table_filterTransformers.transformFiltersFromHeroUI(Object.values(filters)));
+		onClose?.();
+	}, [
+		filters,
+		onFiltersChange,
+		onClose
+	]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col gap-2 p-1 min-w-[600px]",
+		children: [
+			filterEntries.map(([filterId, filter]) => {
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableFilteringItem, {
+					id: filterId,
+					filter,
+					columns: availableColumnsMap.get(filterId) ?? columns,
+					selectColumn,
+					selectMethod,
+					removeFilter,
+					selectValue,
+					filterMethods: effectiveFilterMethods
+				}, filterId);
+			}),
+			!singleFilter && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src_components_ui_button.Button, {
+				variant: "outline",
+				size: "sm",
+				onClick: addFilter,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.PlusIcon, { className: "h-4 w-4" }), "Add Filter"]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src_components_ui_button.Button, {
+				onClick: applyFilters,
+				children: singleFilter ? "Apply Filter" : "Apply Filters"
+			})
+		]
+	});
+};
+const TableFilteringItem = ({ id, filter, columns, selectColumn, selectMethod, selectValue, removeFilter, filterMethods }) => {
+	const handleColumnChange = (0, react.useCallback)((keys) => {
+		selectColumn(id, String(keys.currentKey));
+	}, [id, selectColumn]);
+	const methodsForType = (0, react.useMemo)(() => {
+		if (!filter.type) return [];
+		if (filter.columnId.endsWith("__period")) {
+			const intersectMethod = filterMethods.date.find((m) => m.value === "intersect");
+			return intersectMethod ? [intersectMethod] : [];
+		}
+		const baseMethods = filterMethods[filter.type] ?? [];
+		const emptyMethods = [{
+			value: "isEmpty",
+			label: "Is Empty",
+			component: null
+		}, {
+			value: "isNotEmpty",
+			label: "Is Not Empty",
+			component: null
+		}];
+		if (filter.type !== "boolean" && filter.type !== "date") return [...baseMethods, ...emptyMethods];
+		return baseMethods;
+	}, [
+		filter.type,
+		filter.columnId,
+		filter.method?.value,
+		filterMethods
+	]);
+	const handleMethodChange = (0, react.useCallback)((keys) => {
+		if (!filter.type) return;
+		const method = methodsForType.find((currentMethod) => currentMethod.value === String(keys.currentKey));
+		if (method) selectMethod(id, method);
+	}, [
+		id,
+		filter.type,
+		selectMethod,
+		methodsForType
+	]);
+	const handleValueChange = (0, react.useCallback)((value) => {
+		selectValue(id, value);
+	}, [id, selectValue]);
+	const methodSelect = (0, react.useMemo)(() => {
+		if (!filter.type) return null;
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.Select, {
+			size: "sm",
+			"aria-label": "Select Method",
+			className: "w-40 flex-shrink-0 text-sm",
+			selectedKeys: filter.method?.value ? [filter.method.value] : [],
+			onSelectionChange: handleMethodChange,
+			popoverProps: { className: "w-auto min-w-max" },
+			children: methodsForType.map((method) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.SelectItem, {
+				className: "text-sm",
+				children: method.label
+			}, method.value))
+		});
+	}, [
+		filter.type,
+		filter.method?.value,
+		methodsForType,
+		handleMethodChange
+	]);
+	const filterValueComponent = (0, react.useMemo)(() => {
+		if (!filter.method?.component) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "flex-1 min-w-0" });
+		const ComponentFn = componentForFilterMethod[filter.method.component];
+		if (!ComponentFn) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "flex-1 min-w-0" });
+		return ComponentFn(filter.value, handleValueChange, filter.options ?? []);
+	}, [
+		filter.method?.component,
+		filter.value,
+		filter.options,
+		handleValueChange
+	]);
+	const columnSelectItems = (0, react.useMemo)(() => columns.map((column) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.SelectItem, {
+		className: "text-sm",
+		children: String(column.label)
+	}, column.id)), [columns]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex items-center gap-2 w-full",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-1 items-center gap-2 min-w-0",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_react.Select, {
+					size: "sm",
+					"aria-label": "Select Column",
+					className: "w-40 flex-shrink-0 text-sm",
+					selectedKeys: filter.columnId ? [filter.columnId] : [],
+					onSelectionChange: handleColumnChange,
+					popoverProps: { className: "w-auto min-w-max" },
+					children: columnSelectItems
+				}),
+				methodSelect,
+				filterValueComponent
+			]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src_components_ui_button.Button, {
+			variant: "outline",
+			size: "sm",
+			onClick: () => removeFilter(id),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.XIcon, { className: "h-4 w-4" })
+		})]
+	});
+};
+//#endregion
+exports.TableFiltering = TableFiltering;
+
+//# sourceMappingURL=TableFiltering.js.map

package/dist/src/modules/table/components/TableFiltering.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableFiltering.js","names":["Input","DatePicker","DateRangePicker","Select","SelectItem","transformFiltersToHeroUI","transformFiltersFromHeroUI","Button","PlusIcon","XIcon"],"sources":["../../../../../src/modules/table/components/TableFiltering.tsx"],"sourcesContent":["import {\r\n  DatePicker,\r\n  DateRangePicker,\r\n  type DateValue,\r\n  Input,\r\n  Select,\r\n  SelectItem,\r\n  type SharedSelection,\r\n} from \"@heroui/react\";\r\nimport { getLocalTimeZone, today } from \"@internationalized/date\";\r\nimport type { QueryFilters } from \"@m5kdev/commons/modules/schemas/query.schema\";\r\nimport type {\r\n  ColumnDataType,\r\n  ComponentForFilterMethod,\r\n  FilterMethod,\r\n  FilterMethods,\r\n} from \"@m5kdev/commons/modules/table/filter.types\";\r\nimport { PlusIcon, XIcon } from \"lucide-react\";\r\nimport type { ReactNode } from \"react\";\r\nimport { useCallback, useEffect, useMemo, useState } from \"react\";\r\nimport { Button } from \"../../../components/ui/button\";\r\nimport {\r\n  type FilterValue,\r\n  type HeroUIFilter,\r\n  transformFiltersFromHeroUI,\r\n  transformFiltersToHeroUI,\r\n} from \"../filterTransformers\";\r\n\r\ntype ComponentRenderer = (\r\n  value: FilterValue,\r\n  onChange: (value: FilterValue) => void,\r\n  options?: { label: string; value: string }[]\r\n) => ReactNode;\r\n\r\nconst componentForFilterMethod: Record<ComponentForFilterMethod, ComponentRenderer> = {\r\n  text: (value, onChange) => (\r\n    <Input\r\n      size=\"sm\"\r\n      aria-label=\"Select Value\"\r\n      className=\"flex-1 min-w-0 text-sm\"\r\n      value={(value as string) ?? \"\"}\r\n      onChange={(e) => onChange(e.target.value)}\r\n    />\r\n  ),\r\n  number: (value, onChange) => (\r\n    <Input\r\n      size=\"sm\"\r\n      aria-label=\"Select Value\"\r\n      type=\"number\"\r\n      className=\"flex-1 min-w-0 text-sm\"\r\n      value={(value as number | null)?.toString() ?? \"\"}\r\n      onChange={(e) => onChange(Number.parseFloat(e.target.value) || 0)}\r\n    />\r\n  ),\r\n  date: (value, onChange) => (\r\n    <DatePicker\r\n      size=\"sm\"\r\n      aria-label=\"Select Value\"\r\n      className=\"flex-1 min-w-0 text-sm\"\r\n      value={(value as any) ?? undefined}\r\n      onChange={(date) => date && onChange(date as FilterValue)}\r\n      maxValue={today(getLocalTimeZone()) as unknown as DateValue}\r\n    />\r\n  ),\r\n  range: (value, onChange) => (\r\n    <DateRangePicker\r\n      size=\"sm\"\r\n      aria-label=\"Select Value\"\r\n      className=\"flex-1 min-w-0 text-sm\"\r\n      value={(value as any) ?? undefined}\r\n      onChange={(range) => range && onChange(range as FilterValue)}\r\n      maxValue={today(getLocalTimeZone()) as unknown as DateValue}\r\n    />\r\n  ),\r\n  radio: (value, onChange) => (\r\n    <Select\r\n      size=\"sm\"\r\n      aria-label=\"Select Value\"\r\n      className=\"flex-1 min-w-0 text-sm\"\r\n      selectedKeys={(value as boolean | null) ? [\"true\"] : [\"false\"]}\r\n      onSelectionChange={(keys) => onChange(keys.currentKey === \"true\")}\r\n    >\r\n      <SelectItem key=\"true\" className=\"text-sm\">\r\n        True\r\n      </SelectItem>\r\n      <SelectItem key=\"false\" className=\"text-sm\">\r\n        False\r\n      </SelectItem>\r\n    </Select>\r\n  ),\r\n  select: (value, onChange, options = []) => (\r\n    <Select\r\n      size=\"sm\"\r\n      aria-label=\"Select Value\"\r\n      className=\"flex-1 min-w-0 text-sm\"\r\n      selectedKeys={(value as SharedSelection) ?? new Set()}\r\n      onSelectionChange={(keys) => keys && onChange(keys as FilterValue)}\r\n    >\r\n      {options.map((option) => (\r\n        <SelectItem key={option.value} className=\"text-sm\">\r\n          {option.label}\r\n        </SelectItem>\r\n      ))}\r\n    </Select>\r\n  ),\r\n  multiSelect: (value, onChange, options = []) => (\r\n    <Select\r\n      size=\"sm\"\r\n      aria-label=\"Select Value\"\r\n      selectionMode=\"multiple\"\r\n      className=\"flex-1 min-w-0 text-sm\"\r\n      selectedKeys={value ? new Set(value as SharedSelection) : new Set()}\r\n      onSelectionChange={(keys) => onChange(keys as FilterValue)}\r\n    >\r\n      {options.map((option) => (\r\n        <SelectItem key={option.value} className=\"text-sm\">\r\n          {option.label}\r\n        </SelectItem>\r\n      ))}\r\n    </Select>\r\n  ),\r\n};\r\n\r\nconst defaultFilterMethods: FilterMethods = {\r\n  string: [\r\n    { value: \"contains\", label: \"Contains\", component: \"text\" },\r\n    { value: \"equals\", label: \"Equals\", component: \"text\" },\r\n    { value: \"starts_with\", label: \"Starts With\", component: \"text\" },\r\n    { value: \"ends_with\", label: \"Ends With\", component: \"text\" },\r\n  ],\r\n  number: [\r\n    { value: \"equals\", label: \"Equals\", component: \"number\" },\r\n    { value: \"greater_than\", label: \"Greater Than\", component: \"number\" },\r\n    { value: \"less_than\", label: \"Less Than\", component: \"number\" },\r\n  ],\r\n  date: [\r\n    { value: \"on\", label: \"On\", component: \"date\" },\r\n    { value: \"between\", label: \"Between\", component: \"range\" },\r\n    { value: \"before\", label: \"Before\", component: \"date\" },\r\n    { value: \"after\", label: \"After\", component: \"date\" },\r\n    { value: \"intersect\", label: \"During\", component: \"range\" },\r\n  ],\r\n  boolean: [{ value: \"equals\", label: \"Equals\", component: \"radio\" }],\r\n  enum: [\r\n    { value: \"oneOf\", label: \"One Of\", component: \"multiSelect\" },\r\n    { value: \"equals\", label: \"Equals\", component: \"select\" },\r\n  ],\r\n};\r\n\r\nconst SINGLE_FILTER_KEY = \"single-filter\";\r\n\r\ntype TableFilteringProps = {\r\n  columns: {\r\n    id: string;\r\n    label: string;\r\n    type?: ColumnDataType | null;\r\n    options?: { label: string; value: string }[] | null;\r\n    endColumnId?: string | null;\r\n    periodStartColumnId?: string | null;\r\n    periodEndColumnId?: string | null;\r\n  }[];\r\n  onFiltersChange: (filters: QueryFilters) => void;\r\n  filters: QueryFilters;\r\n  onClose?: () => void;\r\n  singleFilter?: boolean;\r\n  filterMethods?: Partial<FilterMethods>;\r\n};\r\n\r\nconst mergeFilterMethods = (overrides?: Partial<FilterMethods>): FilterMethods => ({\r\n  string:\r\n    overrides?.string && overrides.string.length > 0\r\n      ? overrides.string\r\n      : defaultFilterMethods.string,\r\n  number:\r\n    overrides?.number && overrides.number.length > 0\r\n      ? overrides.number\r\n      : defaultFilterMethods.number,\r\n  date: overrides?.date && overrides.date.length > 0 ? overrides.date : defaultFilterMethods.date,\r\n  boolean:\r\n    overrides?.boolean && overrides.boolean.length > 0\r\n      ? overrides.boolean\r\n      : defaultFilterMethods.boolean,\r\n  enum: overrides?.enum && overrides.enum.length > 0 ? overrides.enum : defaultFilterMethods.enum,\r\n});\r\n\r\nexport const TableFiltering = ({\r\n  columns,\r\n  onFiltersChange,\r\n  filters: initialFilters = [],\r\n  onClose,\r\n  singleFilter = false,\r\n  filterMethods,\r\n}: TableFilteringProps) => {\r\n  const [filters, setFilters] = useState<Record<string, HeroUIFilter>>({});\r\n  const effectiveFilterMethods = useMemo(() => mergeFilterMethods(filterMethods), [filterMethods]);\r\n\r\n  const createEmptyFilter = useCallback(\r\n    (): HeroUIFilter => ({\r\n      columnId: \"\",\r\n      type: null,\r\n      value: null,\r\n      method: null,\r\n      options: null,\r\n      endColumnId: null,\r\n      periodStartColumnId: null,\r\n      periodEndColumnId: null,\r\n    }),\r\n    []\r\n  );\r\n\r\n  const addFilter = useCallback(() => {\r\n    setFilters((prev) => {\r\n      if (!singleFilter) {\r\n        const filterId = crypto.randomUUID();\r\n        return {\r\n          ...prev,\r\n          [filterId]: createEmptyFilter(),\r\n        };\r\n      }\r\n\r\n      // single filter mode\r\n      return Object.keys(prev).length > 0 ? prev : { [SINGLE_FILTER_KEY]: createEmptyFilter() };\r\n    });\r\n  }, [createEmptyFilter, singleFilter]);\r\n\r\n  const removeFilter = useCallback(\r\n    (filterId: string) => {\r\n      setFilters((prev) => {\r\n        if (!singleFilter) {\r\n          const { [filterId]: _, ...rest } = prev;\r\n          return rest;\r\n        }\r\n\r\n        // single filter mode resets the lone filter\r\n        return { [SINGLE_FILTER_KEY]: createEmptyFilter() };\r\n      });\r\n    },\r\n    [createEmptyFilter, singleFilter]\r\n  );\r\n\r\n  const columnsMap = useMemo(\r\n    () => new Map(columns.map((column) => [column.id, column])),\r\n    [columns]\r\n  );\r\n\r\n  useEffect(() => {\r\n    // Transform initialFilters from FiltersToApply format to HeroUIFilter format\r\n    const transformedFilters = transformFiltersToHeroUI(\r\n      initialFilters,\r\n      columnsMap,\r\n      effectiveFilterMethods\r\n    );\r\n\r\n    if (!singleFilter) {\r\n      setFilters(Object.fromEntries(transformedFilters.map((filter) => [filter.columnId, filter])));\r\n      return;\r\n    }\r\n\r\n    const firstFilter = transformedFilters[0];\r\n    setFilters({\r\n      [SINGLE_FILTER_KEY]: firstFilter ?? createEmptyFilter(),\r\n    });\r\n  }, [createEmptyFilter, initialFilters, singleFilter, columnsMap, effectiveFilterMethods]);\r\n\r\n  const selectColumn = useCallback(\r\n    (filterId: string, columnId: string) => {\r\n      setFilters((prev) => {\r\n        const oldFilter = prev[filterId];\r\n        if (!oldFilter) return prev;\r\n        const column = columnsMap.get(columnId);\r\n        if (!column) return prev;\r\n\r\n        // If Period column, auto-set intersect method\r\n        const isPeriodColumn = columnId.endsWith(\"__period\");\r\n        const intersectMethod = isPeriodColumn\r\n          ? (effectiveFilterMethods.date.find((m) => m.value === \"intersect\") ?? null)\r\n          : null;\r\n\r\n        return {\r\n          ...prev,\r\n          [filterId]: {\r\n            ...oldFilter,\r\n            columnId,\r\n            type: column.type ?? null,\r\n            options: column.options ?? null,\r\n            endColumnId: column.endColumnId ?? null,\r\n            periodStartColumnId: column.periodStartColumnId ?? null,\r\n            periodEndColumnId: column.periodEndColumnId ?? null,\r\n            method: intersectMethod,\r\n            value: null,\r\n          },\r\n        };\r\n      });\r\n    },\r\n    [columnsMap, effectiveFilterMethods]\r\n  );\r\n\r\n  const selectMethod = useCallback((filterId: string, method: FilterMethod) => {\r\n    setFilters((prev) => {\r\n      const oldFilter = prev[filterId];\r\n      if (!oldFilter) return prev;\r\n      return {\r\n        ...prev,\r\n        [filterId]: { ...oldFilter, method, value: null },\r\n      };\r\n    });\r\n  }, []);\r\n\r\n  const selectValue = useCallback((filterId: string, value: FilterValue) => {\r\n    setFilters((prev) => {\r\n      const oldFilter = prev[filterId];\r\n      if (!oldFilter) return prev;\r\n      return {\r\n        ...prev,\r\n        [filterId]: { ...oldFilter, value },\r\n      };\r\n    });\r\n  }, []);\r\n\r\n  const filterEntries = useMemo(() => Object.entries(filters), [filters]);\r\n\r\n  const availableColumnsMap = useMemo(() => {\r\n    const map = new Map<string, typeof columns>();\r\n    filterEntries.forEach(([filterId]) => {\r\n      const columnsUsedByOtherFilters = new Set(\r\n        filterEntries\r\n          .filter(([id]) => id !== filterId)\r\n          .map(([_, f]) => f.columnId)\r\n          .filter((id) => id !== \"\")\r\n      );\r\n      map.set(\r\n        filterId,\r\n        columns.filter((column) => !columnsUsedByOtherFilters.has(column.id))\r\n      );\r\n    });\r\n    return map;\r\n  }, [filterEntries, columns]);\r\n\r\n  const applyFilters = useCallback(() => {\r\n    const heroUIFilters = Object.values(filters);\r\n    const filtersToApply = transformFiltersFromHeroUI(heroUIFilters);\r\n    onFiltersChange(filtersToApply);\r\n    onClose?.();\r\n  }, [filters, onFiltersChange, onClose]);\r\n\r\n  return (\r\n    <div className=\"flex flex-col gap-2 p-1 min-w-[600px]\">\r\n      {filterEntries.map(([filterId, filter]) => {\r\n        const availableColumns = availableColumnsMap.get(filterId) ?? columns;\r\n        return (\r\n          <TableFilteringItem\r\n            key={filterId}\r\n            id={filterId}\r\n            filter={filter}\r\n            columns={availableColumns}\r\n            selectColumn={selectColumn}\r\n            selectMethod={selectMethod}\r\n            removeFilter={removeFilter}\r\n            selectValue={selectValue}\r\n            filterMethods={effectiveFilterMethods}\r\n          />\r\n        );\r\n      })}\r\n      {!singleFilter && (\r\n        <Button variant=\"outline\" size=\"sm\" onClick={addFilter}>\r\n          <PlusIcon className=\"h-4 w-4\" />\r\n          Add Filter\r\n        </Button>\r\n      )}\r\n      <Button onClick={applyFilters}>{singleFilter ? \"Apply Filter\" : \"Apply Filters\"}</Button>\r\n    </div>\r\n  );\r\n};\r\n\r\nconst TableFilteringItem = ({\r\n  id,\r\n  filter,\r\n  columns,\r\n  selectColumn,\r\n  selectMethod,\r\n  selectValue,\r\n  removeFilter,\r\n  filterMethods,\r\n}: {\r\n  id: string;\r\n  filter: HeroUIFilter;\r\n  columns: {\r\n    id: string;\r\n    label: string;\r\n    type?: ColumnDataType | null;\r\n    options?: { label: string; value: string }[] | null;\r\n    endColumnId?: string | null;\r\n    periodStartColumnId?: string | null;\r\n    periodEndColumnId?: string | null;\r\n  }[];\r\n  selectColumn: (filterId: string, columnId: string) => void;\r\n  selectMethod: (filterId: string, method: FilterMethod) => void;\r\n  selectValue: (filterId: string, value: FilterValue) => void;\r\n  removeFilter: (filterId: string) => void;\r\n  filterMethods: FilterMethods;\r\n}) => {\r\n  const handleColumnChange = useCallback(\r\n    (keys: any) => {\r\n      const columnId = String(keys.currentKey);\r\n      selectColumn(id, columnId);\r\n    },\r\n    [id, selectColumn]\r\n  );\r\n\r\n  const methodsForType = useMemo(() => {\r\n    if (!filter.type) return [];\r\n\r\n    // Period columns only support intersect method\r\n    const isPeriodColumn = filter.columnId.endsWith(\"__period\");\r\n    if (isPeriodColumn) {\r\n      const intersectMethod = filterMethods.date.find((m) => m.value === \"intersect\");\r\n      return intersectMethod ? [intersectMethod] : [];\r\n    }\r\n\r\n    const baseMethods = filterMethods[filter.type as ColumnDataType] ?? [];\r\n    const emptyMethods: FilterMethod[] = [\r\n      { value: \"isEmpty\", label: \"Is Empty\", component: null },\r\n      { value: \"isNotEmpty\", label: \"Is Not Empty\", component: null },\r\n    ];\r\n\r\n    if (filter.type !== \"boolean\" && filter.type !== \"date\") {\r\n      return [...baseMethods, ...emptyMethods];\r\n    }\r\n\r\n    return baseMethods;\r\n  }, [filter.type, filter.columnId, filter.method?.value, filterMethods]);\r\n\r\n  const handleMethodChange = useCallback(\r\n    (keys: any) => {\r\n      if (!filter.type) return;\r\n      // Use methodsForType instead of filterMethods to include dynamically added methods\r\n      const method = methodsForType.find(\r\n        (currentMethod: FilterMethod) => currentMethod.value === String(keys.currentKey)\r\n      );\r\n      if (method) {\r\n        selectMethod(id, method);\r\n      }\r\n    },\r\n    [id, filter.type, selectMethod, methodsForType]\r\n  );\r\n\r\n  const handleValueChange = useCallback(\r\n    (value: FilterValue) => {\r\n      selectValue(id, value);\r\n    },\r\n    [id, selectValue]\r\n  );\r\n\r\n  const methodSelect = useMemo(() => {\r\n    if (!filter.type) return null;\r\n    return (\r\n      <Select\r\n        size=\"sm\"\r\n        aria-label=\"Select Method\"\r\n        className=\"w-40 flex-shrink-0 text-sm\"\r\n        selectedKeys={filter.method?.value ? [filter.method.value] : []}\r\n        onSelectionChange={handleMethodChange}\r\n        popoverProps={{\r\n          className: \"w-auto min-w-max\",\r\n        }}\r\n      >\r\n        {methodsForType.map((method: FilterMethod) => (\r\n          <SelectItem key={method.value} className=\"text-sm\">\r\n            {method.label}\r\n          </SelectItem>\r\n        ))}\r\n      </Select>\r\n    );\r\n  }, [filter.type, filter.method?.value, methodsForType, handleMethodChange]);\r\n\r\n  const filterValueComponent = useMemo(() => {\r\n    if (!filter.method?.component) {\r\n      return <div className=\"flex-1 min-w-0\" />;\r\n    }\r\n    const component = filter.method.component as ComponentForFilterMethod;\r\n    const ComponentFn =\r\n      componentForFilterMethod[component as keyof typeof componentForFilterMethod];\r\n    if (!ComponentFn) return <div className=\"flex-1 min-w-0\" />;\r\n    return ComponentFn(filter.value as any, handleValueChange, filter.options ?? []);\r\n  }, [filter.method?.component, filter.value, filter.options, handleValueChange]);\r\n\r\n  const columnSelectItems = useMemo(\r\n    () =>\r\n      columns.map((column) => (\r\n        <SelectItem key={column.id} className=\"text-sm\">\r\n          {String(column.label)}\r\n        </SelectItem>\r\n      )),\r\n    [columns]\r\n  );\r\n\r\n  return (\r\n    <div className=\"flex items-center gap-2 w-full\">\r\n      <div className=\"flex flex-1 items-center gap-2 min-w-0\">\r\n        <Select\r\n          size=\"sm\"\r\n          aria-label=\"Select Column\"\r\n          className=\"w-40 flex-shrink-0 text-sm\"\r\n          selectedKeys={filter.columnId ? [filter.columnId] : []}\r\n          onSelectionChange={handleColumnChange}\r\n          popoverProps={{\r\n            className: \"w-auto min-w-max\",\r\n          }}\r\n        >\r\n          {columnSelectItems}\r\n        </Select>\r\n        {methodSelect}\r\n        {filterValueComponent}\r\n      </div>\r\n      <Button variant=\"outline\" size=\"sm\" onClick={() => removeFilter(id)}>\r\n        <XIcon className=\"h-4 w-4\" />\r\n      </Button>\r\n    </div>\r\n  );\r\n};\r\n"],"mappings":"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"}

package/dist/src/modules/table/components/TableFiltering.mjs

@@ -1,9 +1,9 @@
 import { Button as Button$1 } from "../../../components/ui/button.mjs";
 import { transformFiltersFromHeroUI, transformFiltersToHeroUI } from "../filterTransformers.mjs";
-import { PlusIcon, XIcon } from "lucide-react";
 import { useCallback, useEffect, useMemo, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { DatePicker, DateRangePicker, Input, Select, SelectItem } from "@heroui/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { PlusIcon, XIcon } from "lucide-react";
 import { getLocalTimeZone, today } from "@internationalized/date";
 //#region src/modules/table/components/TableFiltering.tsx
 const componentForFilterMethod = {

package/dist/src/modules/table/components/TableGroupBy.d.ts

@@ -0,0 +1,22 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/modules/table/components/TableGroupBy.d.ts
+interface TableGroupByColumn {
+  id: string;
+  label: string;
+}
+interface TableGroupByProps {
+  columns: TableGroupByColumn[];
+  activeGrouping: string[];
+  onGroupingChange: (columnIds: string[]) => void;
+  onClose: () => void;
+}
+declare const TableGroupBy: ({
+  columns,
+  activeGrouping,
+  onGroupingChange,
+  onClose
+}: TableGroupByProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TableGroupBy };
+//# sourceMappingURL=TableGroupBy.d.ts.map

package/dist/src/modules/table/components/TableGroupBy.js

@@ -0,0 +1,60 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../../../_virtual/_rolldown/runtime.js");
+const require_src_lib_utils = require("../../../lib/utils.js");
+const require_src_components_ui_button = require("../../../components/ui/button.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/modules/table/components/TableGroupBy.tsx
+const TableGroupBy = ({ columns, activeGrouping, onGroupingChange, onClose }) => {
+	const [selected, setSelected] = (0, react.useState)(activeGrouping);
+	const toggle = (id) => {
+		setSelected((prev) => prev.includes(id) ? prev.filter((s) => s !== id) : [...prev, id]);
+	};
+	const onApply = () => {
+		onGroupingChange(selected);
+		onClose();
+	};
+	const onClear = () => {
+		setSelected([]);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col gap-2 p-1 min-w-[180px]",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex flex-col gap-0.5",
+			children: columns.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				className: require_src_lib_utils.cn("text-left px-2 py-1.5 rounded text-sm hover:bg-muted transition-colors flex items-center gap-2", selected.includes(col.id) && "bg-muted font-medium"),
+				onClick: () => toggle(col.id),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: require_src_lib_utils.cn("h-4 w-4 rounded border border-muted-foreground/40 flex items-center justify-center shrink-0 text-xs", selected.includes(col.id) && "bg-primary border-primary text-primary-foreground"),
+						children: selected.includes(col.id) ? "✓" : ""
+					}),
+					col.label,
+					selected.includes(col.id) && selected.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-muted-foreground text-xs ml-auto",
+						children: selected.indexOf(col.id) + 1
+					})
+				]
+			}, col.id))
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex gap-1.5",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src_components_ui_button.Button, {
+				size: "sm",
+				variant: "outline",
+				onClick: onClear,
+				className: "flex-1",
+				children: "Clear"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src_components_ui_button.Button, {
+				size: "sm",
+				onClick: onApply,
+				className: "flex-1",
+				children: "Apply"
+			})]
+		})]
+	});
+};
+//#endregion
+exports.TableGroupBy = TableGroupBy;
+
+//# sourceMappingURL=TableGroupBy.js.map

package/dist/src/modules/table/components/TableGroupBy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableGroupBy.js","names":["cn","Button"],"sources":["../../../../../src/modules/table/components/TableGroupBy.tsx"],"sourcesContent":["import { useState } from \"react\";\r\nimport { Button } from \"../../../components/ui/button\";\r\nimport { cn } from \"../../../lib/utils\";\r\n\r\ninterface TableGroupByColumn {\r\n  id: string;\r\n  label: string;\r\n}\r\n\r\ninterface TableGroupByProps {\r\n  columns: TableGroupByColumn[];\r\n  activeGrouping: string[];\r\n  onGroupingChange: (columnIds: string[]) => void;\r\n  onClose: () => void;\r\n}\r\n\r\nexport const TableGroupBy = ({\r\n  columns,\r\n  activeGrouping,\r\n  onGroupingChange,\r\n  onClose,\r\n}: TableGroupByProps) => {\r\n  const [selected, setSelected] = useState<string[]>(activeGrouping);\r\n\r\n  const toggle = (id: string) => {\r\n    setSelected((prev) => (prev.includes(id) ? prev.filter((s) => s !== id) : [...prev, id]));\r\n  };\r\n\r\n  const onApply = () => {\r\n    onGroupingChange(selected);\r\n    onClose();\r\n  };\r\n\r\n  const onClear = () => {\r\n    setSelected([]);\r\n  };\r\n\r\n  return (\r\n    <div className=\"flex flex-col gap-2 p-1 min-w-[180px]\">\r\n      <div className=\"flex flex-col gap-0.5\">\r\n        {columns.map((col) => (\r\n          <button\r\n            key={col.id}\r\n            type=\"button\"\r\n            className={cn(\r\n              \"text-left px-2 py-1.5 rounded text-sm hover:bg-muted transition-colors flex items-center gap-2\",\r\n              selected.includes(col.id) && \"bg-muted font-medium\"\r\n            )}\r\n            onClick={() => toggle(col.id)}\r\n          >\r\n            <span\r\n              className={cn(\r\n                \"h-4 w-4 rounded border border-muted-foreground/40 flex items-center justify-center shrink-0 text-xs\",\r\n                selected.includes(col.id) && \"bg-primary border-primary text-primary-foreground\"\r\n              )}\r\n            >\r\n              {selected.includes(col.id) ? \"✓\" : \"\"}\r\n            </span>\r\n            {col.label}\r\n            {selected.includes(col.id) && selected.length > 1 && (\r\n              <span className=\"text-muted-foreground text-xs ml-auto\">\r\n                {selected.indexOf(col.id) + 1}\r\n              </span>\r\n            )}\r\n          </button>\r\n        ))}\r\n      </div>\r\n      <div className=\"flex gap-1.5\">\r\n        <Button size=\"sm\" variant=\"outline\" onClick={onClear} className=\"flex-1\">\r\n          Clear\r\n        </Button>\r\n        <Button size=\"sm\" onClick={onApply} className=\"flex-1\">\r\n          Apply\r\n        </Button>\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n"],"mappings":";;;;;;;AAgBA,MAAa,gBAAgB,EAC3B,SACA,gBACA,kBACA,cACuB;CACvB,MAAM,CAAC,UAAU,gBAAA,GAAA,MAAA,UAAkC,eAAe;CAElE,MAAM,UAAU,OAAe;AAC7B,eAAa,SAAU,KAAK,SAAS,GAAG,GAAG,KAAK,QAAQ,MAAM,MAAM,GAAG,GAAG,CAAC,GAAG,MAAM,GAAG,CAAE;;CAG3F,MAAM,gBAAgB;AACpB,mBAAiB,SAAS;AAC1B,WAAS;;CAGX,MAAM,gBAAgB;AACpB,cAAY,EAAE,CAAC;;AAGjB,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,WAAU;YAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,WAAU;aACZ,QAAQ,KAAK,QACZ,iBAAA,GAAA,kBAAA,MAAC,UAAD;IAEE,MAAK;IACL,WAAWA,sBAAAA,GACT,kGACA,SAAS,SAAS,IAAI,GAAG,IAAI,uBAC9B;IACD,eAAe,OAAO,IAAI,GAAG;cAP/B;KASE,iBAAA,GAAA,kBAAA,KAAC,QAAD;MACE,WAAWA,sBAAAA,GACT,uGACA,SAAS,SAAS,IAAI,GAAG,IAAI,oDAC9B;gBAEA,SAAS,SAAS,IAAI,GAAG,GAAG,MAAM;MAC9B,CAAA;KACN,IAAI;KACJ,SAAS,SAAS,IAAI,GAAG,IAAI,SAAS,SAAS,KAC9C,iBAAA,GAAA,kBAAA,KAAC,QAAD;MAAM,WAAU;gBACb,SAAS,QAAQ,IAAI,GAAG,GAAG;MACvB,CAAA;KAEF;MAtBF,IAAI,GAsBF,CACT;GACE,CAAA,EACN,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAU;aAAf,CACE,iBAAA,GAAA,kBAAA,KAACC,iCAAAA,QAAD;IAAQ,MAAK;IAAK,SAAQ;IAAU,SAAS;IAAS,WAAU;cAAS;IAEhE,CAAA,EACT,iBAAA,GAAA,kBAAA,KAACA,iCAAAA,QAAD;IAAQ,MAAK;IAAK,SAAS;IAAS,WAAU;cAAS;IAE9C,CAAA,CACL;KACF"}

package/dist/src/modules/table/components/TablePagination.d.ts

@@ -0,0 +1,19 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { TableProps } from "@m5kdev/frontend/modules/table/hooks/useNuqsTable";
+
+//#region src/modules/table/components/TablePagination.d.ts
+interface TablePaginationProps {
+  pageCount: number;
+  page: TableProps["page"];
+  limit: TableProps["limit"];
+  setPagination: TableProps["setPagination"];
+}
+declare const TablePagination: ({
+  pageCount,
+  page,
+  limit,
+  setPagination
+}: TablePaginationProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TablePagination };
+//# sourceMappingURL=TablePagination.d.ts.map