@himanshu-sorathiya/react-kit 1.0.2 → 1.0.5

package/dist/index.d.ts

@@ -5,6 +5,42 @@ export interface ModalProps {
 	className?: string;
 }
 export declare function Modal({ children, className }: ModalProps): import("react").ReactPortal;
+export type FilterType = "text" | "number" | "boolean" | "date" | "select" | "multiselect" | "custom";
+export type TextOperator = "contains" | "equals" | "startsWith" | "endsWith" | "notContains";
+export type NumberOperator = "equals" | "greaterThan" | "lessThan" | "greaterThanOrEqual" | "lessThanOrEqual" | "between";
+export type BooleanOperator = "equals";
+export type DateOperator = "equals" | "before" | "after" | "between";
+export type SelectOperator = "equals" | "notEquals";
+export type MultiselectOperator = "in" | "notIn" | "intersects";
+export type CustomOperator = "custom";
+export type FilterOperator = TextOperator | NumberOperator | BooleanOperator | DateOperator | SelectOperator | MultiselectOperator | CustomOperator;
+export interface FilterOptions {
+	caseSensitive?: boolean;
+	compare?: (itemValue: any, filterValue: any, item: any) => boolean;
+}
+export interface FilterConfig extends FilterOptions {
+	id: string;
+	field: string;
+	type: FilterType;
+	operator: FilterOperator;
+	value: any;
+}
+export type FilterState = FilterConfig[];
+export interface UseFilterReturn<T> {
+	filteredItems: T[];
+	filters: FilterState;
+	addFilter: (filter: FilterConfig) => void;
+	removeFilter: (id: string | string[]) => void;
+	clearFilters: () => void;
+	resetFilters: () => void;
+	setFilters: (filters: FilterConfig[]) => void;
+	toggleFilter: (filter: FilterConfig) => void;
+	updateFilterConfig: (id: string, partialConfig: Partial<Omit<FilterConfig, "id">>) => void;
+	getFilterValue: (id: string) => any;
+	updateFilterValue: (id: string, value: any) => void;
+	isFilterActive: (id: string) => boolean;
+}
+export declare function useFilter<T>(data: T[], initialFilters?: FilterState): UseFilterReturn<T>;
 export interface UseModalReturn<TData> {
 	id: string | null;
 	data: TData | undefined;
@@ -29,5 +65,36 @@ export interface UsePaginationReturn<T> {
 	resetPageSize: () => void;
 }
 export declare function usePagination<T>(data: T[], initialPageSize: number, initialPageIndex?: number): UsePaginationReturn<T>;
+export type SortType = "numeric" | "alphabetical" | "alphanumeric" | "boolean" | "date" | "basic" | "custom";
+export interface SortOptions {
+	desc?: boolean;
+	caseSensitive?: boolean;
+	disableSortRemoval?: boolean;
+	invertSorting?: boolean;
+	sortUndefined?: "first" | "last" | false | -1 | 1;
+	compare?: (a: any, b: any) => number;
+}
+export interface SortConfig extends SortOptions {
+	id: string;
+	type: SortType;
+	field?: string;
+}
+export type SortState = Array<SortConfig>;
+export interface UseSortReturn<T> {
+	sortedItems: T[];
+	sorts: SortState;
+	addSort: (sort: SortConfig) => void;
+	removeSort: (id: string | string[]) => void;
+	clearSorts: () => void;
+	resetSorts: () => void;
+	setSorts: (sorts: SortState) => void;
+	getSortDirection: (id: string) => "asc" | "desc" | undefined;
+	toggleSort: (id: string, type: SortType, options?: SortOptions & {
+		multi?: boolean;
+	}) => void;
+	getNextSortingOrder: (id: string) => "asc" | "desc" | "none";
+	getSortIndex: (id: string) => number | undefined;
+}
+export declare function useSort<T>(data: T[], initialSorts?: SortState): UseSortReturn<T>;
 
-export { };
+export {};

package/dist/index.js

@@ -1,6 +1,6 @@
-import { useCallback as e, useEffect as t, useMemo as n, useRef as r, useState as i } from "react";
-import { createPortal as a } from "react-dom";
 import { createStore as o, useSelector as s } from "@tanstack/react-store";
+import { useCallback as e, useState as i, useMemo as n, useRef as r, useEffect as t } from "react";
+import { createPortal as a } from "react-dom";
 import { jsx as c } from "react/jsx-runtime";
 //#region src/store/modalStore.ts
 var l = o({
@@ -48,8 +48,99 @@ function d({ children: e, className: n = "" }) {
 	}), document.body);
 }
 //#endregion
+//#region src/utils/filterUtils.ts
+var f = {
+	text: {
+		contains: (e, t, n) => n?.caseSensitive ? String(e).includes(String(t)) : String(e).toLowerCase().includes(String(t).toLowerCase()),
+		equals: (e, t, n) => n?.caseSensitive ? String(e) === String(t) : String(e).toLowerCase() === String(t).toLowerCase(),
+		startsWith: (e, t, n) => n?.caseSensitive ? String(e).startsWith(String(t)) : String(e).toLowerCase().startsWith(String(t).toLowerCase()),
+		endsWith: (e, t, n) => n?.caseSensitive ? String(e).endsWith(String(t)) : String(e).toLowerCase().endsWith(String(t).toLowerCase()),
+		notContains: (e, t, n) => n?.caseSensitive ? !String(e).includes(String(t)) : !String(e).toLowerCase().includes(String(t).toLowerCase())
+	},
+	number: {
+		equals: (e, t) => Number(e) === Number(t),
+		greaterThan: (e, t) => Number(e) > Number(t),
+		lessThan: (e, t) => Number(e) < Number(t),
+		greaterThanOrEqual: (e, t) => Number(e) >= Number(t),
+		lessThanOrEqual: (e, t) => Number(e) <= Number(t),
+		between: (e, t) => Number(e) >= Number(t.min) && Number(e) <= Number(t.max)
+	},
+	boolean: { equals: (e, t) => !!e == !!t },
+	date: {
+		equals: (e, t) => new Date(e).getTime() === new Date(t).getTime(),
+		before: (e, t) => new Date(e).getTime() < new Date(t).getTime(),
+		after: (e, t) => new Date(e).getTime() > new Date(t).getTime(),
+		between: (e, t) => {
+			let n = new Date(e).getTime();
+			return n >= new Date(t.min).getTime() && n <= new Date(t.max).getTime();
+		}
+	},
+	select: {
+		equals: (e, t) => e === t,
+		notEquals: (e, t) => e !== t
+	},
+	multiselect: {
+		in: (e, t) => t.includes(e),
+		notIn: (e, t) => !t.includes(e),
+		intersects: (e, t) => e.some((e) => t.includes(e))
+	}
+};
+function p(e, t, n) {
+	if (typeof e != "object" || !e) return e;
+	let r = t || n;
+	return r.includes(".") ? r.split(".").reduce((e, t) => e?.[t], e) : e?.[r];
+}
+//#endregion
+//#region src/hooks/useFilter.ts
+function m(t, n = []) {
+	let [r, a] = i(n), o = t.filter((e) => r.every((t) => {
+		let { id: n, field: r, type: i, operator: a, value: o, compare: s, ...c } = t, l = p(e, r, n);
+		if (i === "custom" || a === "custom") return s ? s(l, o, e) : !0;
+		let u = f[i];
+		if (!u) return !0;
+		let d = u[a];
+		return d ? d(l, o, c) : !0;
+	})), s = e((e) => {
+		a((t) => t.some((t) => t.id === e.id) ? t.map((t) => t.id === e.id ? e : t) : [...t, e]);
+	}, []), c = e((e) => {
+		a((t) => Array.isArray(e) ? t.filter((t) => !e.includes(t.id)) : t.filter((t) => t.id !== e));
+	}, []), l = e(() => {
+		a([]);
+	}, []), u = e(() => {
+		a(n);
+	}, [n]), d = e((e) => {
+		a(e);
+	}, []), m = e((e) => r.find((t) => t.id === e)?.value, [r]), h = e((e, t) => {
+		a((n) => n.map((n) => n.id === e ? {
+			...n,
+			value: t
+		} : n));
+	}, []), g = e((e) => r.some((t) => t.id === e), [r]);
+	return {
+		filteredItems: o,
+		filters: r,
+		addFilter: s,
+		removeFilter: c,
+		clearFilters: l,
+		resetFilters: u,
+		toggleFilter: e((e) => {
+			a((t) => t.some((t) => t.id === e.id) ? t.filter((t) => t.id !== e.id) : [...t, e]);
+		}, []),
+		updateFilterConfig: e((e, t) => {
+			a((n) => n.map((n) => n.id === e ? {
+				...n,
+				...t
+			} : n));
+		}, []),
+		setFilters: d,
+		getFilterValue: m,
+		updateFilterValue: h,
+		isFilterActive: g
+	};
+}
+//#endregion
 //#region src/hooks/usePagination.ts
-function f(t, r, a = 0) {
+function h(t, r, a = 0) {
 	let [o, s] = i(r), [c, l] = i(a), u = Math.max(1, Math.ceil(t.length / Math.max(1, o))), d = Math.min(Math.max(0, c), u - 1);
 	return c !== d && l(d), {
 		currentItems: n(() => typeof o != "number" || o < 1 ? [] : t.slice(c * o, (c + 1) * o), [
@@ -95,4 +186,156 @@ function f(t, r, a = 0) {
 	};
 }
 //#endregion
-export { d as Modal, u as useModal, f as usePagination };
+//#region src/utils/sortUtils.ts
+function g(e, t, n = {}) {
+	let { sortUndefined: r, desc: i = !1 } = n, a = w(e, t, r, i);
+	if (a !== null) return a;
+	let o = !!e;
+	return o === !!t ? 0 : o ? 1 : -1;
+}
+function _(e, t, n = {}) {
+	let { sortUndefined: r, desc: i = !1 } = n, a = w(e, t, r, i);
+	return a === null ? (Number.isNaN(Number(e)) ? 0 : Number(e)) - (Number.isNaN(Number(t)) ? 0 : Number(t)) : a;
+}
+function v(e, t, n = {}) {
+	let { desc: r = !1, sortUndefined: i, caseSensitive: a = !1 } = n, o = w(e, t, i, r);
+	if (o !== null) return o;
+	let s = String(e), c = String(t);
+	return s.localeCompare(c, void 0, { sensitivity: a ? "variant" : "base" });
+}
+function y(e, t, n = {}) {
+	let { desc: r = !1, sortUndefined: i, caseSensitive: a = !1 } = n, o = w(e, t, i, r);
+	if (o !== null) return o;
+	let s = String(e), c = String(t);
+	return s.localeCompare(c, void 0, {
+		numeric: !0,
+		sensitivity: a ? "variant" : "base"
+	});
+}
+function b(e, t, n = {}) {
+	let { desc: r = !1, sortUndefined: i } = n, a = w(e, t, i, r);
+	if (a !== null) return a;
+	let o = new Date(e).getTime(), s = new Date(t).getTime();
+	return (Number.isNaN(o) ? 0 : o) - (Number.isNaN(s) ? 0 : s);
+}
+function x(e, t, n = {}) {
+	let { desc: r = !1, sortUndefined: i } = n, a = w(e, t, i, r);
+	return a === null ? e < t ? -1 : +(e > t) : a;
+}
+function S(e, t, n = {}) {
+	let { desc: r = !1, sortUndefined: i, compare: a } = n, o = w(e, t, i, r);
+	return o === null ? typeof a == "function" ? a(e, t) : e < t ? -1 : +(e > t) : o;
+}
+function C(e, t, n) {
+	if (typeof e != "object" || !e) return e;
+	let r = t || n;
+	return r.includes(".") ? r.split(".").reduce((e, t) => e?.[t], e) : e?.[r];
+}
+function w(e, t, n = !1, r) {
+	let i = e ?? void 0, a = t ?? void 0;
+	if (i !== void 0 && a !== void 0) return null;
+	if (i === void 0 && a === void 0 || n === !1) return 0;
+	if (n === "first") return i === void 0 ? -1 : 1;
+	if (n === "last") return i === void 0 ? 1 : -1;
+	if (n === -1) {
+		let e = r ? 1 : -1;
+		return i === void 0 ? e : -e;
+	}
+	if (n === 1) {
+		let e = r ? 1 : -1;
+		return i === void 0 ? -e : e;
+	}
+	return null;
+}
+//#endregion
+//#region src/hooks/useSort.ts
+function T(t, r = []) {
+	let [a, o] = i(r);
+	return {
+		sortedItems: n(() => t.toSorted((e, t) => {
+			for (let n of a) {
+				let { type: r, field: i, id: a, desc: o = !1, invertSorting: s = !1 } = n, c = C(e, i, a), l = C(t, i, a), u;
+				switch (r) {
+					case "numeric":
+						u = _(c, l, n);
+						break;
+					case "alphabetical":
+						u = v(c, l, n);
+						break;
+					case "alphanumeric":
+						u = y(c, l, n);
+						break;
+					case "boolean":
+						u = g(c, l, n);
+						break;
+					case "date":
+						u = b(c, l, n);
+						break;
+					case "basic":
+						u = x(c, l, n);
+						break;
+					case "custom":
+						u = S(c, l, n);
+						break;
+					default: u = x(c, l, n);
+				}
+				if (u !== 0) return u * (o === s ? 1 : -1);
+			}
+			return 0;
+		}), [a, t]),
+		sorts: a,
+		addSort: e((e) => o((t) => t.some((t) => t.id === e.id) ? t.map((t) => t.id === e.id ? e : t) : [...t, e]), []),
+		removeSort: e((e) => {
+			o((t) => Array.isArray(e) ? t.filter((t) => !e.includes(t.id)) : t.filter((t) => t.id !== e));
+		}, []),
+		clearSorts: e(() => o([]), []),
+		resetSorts: e(() => o(r), [r]),
+		setSorts: e((e) => o(e), []),
+		getSortDirection: e((e) => {
+			let t = a.find((t) => t.id === e);
+			return t ? t.desc ? "desc" : "asc" : void 0;
+		}, [a]),
+		toggleSort: e((e, t, n) => {
+			let { multi: r = !1, ...i } = n || {};
+			o((n) => {
+				let a = n.find((t) => t.id === e);
+				if (!a) {
+					let a = {
+						id: e,
+						type: t,
+						...i,
+						desc: !1
+					};
+					return r ? [...n, a] : [a];
+				}
+				if (!a.desc) {
+					let t = {
+						...a,
+						...i,
+						desc: !0
+					};
+					return r ? n.map((n) => n.id === e ? t : n) : [t];
+				}
+				if (a.disableSortRemoval || i.disableSortRemoval) {
+					let t = {
+						...a,
+						...i,
+						desc: !1
+					};
+					return r ? n.map((n) => n.id === e ? t : n) : [t];
+				}
+				return r ? n.filter((t) => t.id !== e) : [];
+			});
+		}, []),
+		getNextSortingOrder: e((e) => {
+			let t = a.find((t) => t.id === e);
+			return t ? t.desc ? t.disableSortRemoval ? "asc" : "none" : "desc" : "asc";
+		}, [a]),
+		getSortIndex: e((e) => {
+			let t = a.findIndex((t) => t.id === e);
+			return t === -1 ? void 0 : t + 1;
+		}, [a])
+	};
+}
+//#endregion
+export { d as Modal, m as useFilter, u as useModal, h as usePagination, T as useSort };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@himanshu-sorathiya/react-kit",
-	"version": "1.0.2",
+	"version": "1.0.5",
 	"description": "An opinionated collection of react hooks, and reusable UI components.",
 	"type": "module",
 	"module": "./dist/index.js",