@himanshu-sorathiya/react-kit 1.0.21 → 1.0.22

package/dist/events.d.ts

@@ -2,6 +2,36 @@
 
 import { RefObject } from 'react';
 
+export type ClickOutsideEvent = MouseEvent | TouchEvent | PointerEvent | Event;
+export type ClickOutsideTarget = HTMLElement | null;
+export type ClickOutsideTargetRef = RefObject<ClickOutsideTarget> | ClickOutsideTarget;
+export interface UseClickOutsideOptions {
+	enabled?: boolean;
+	eventType?: string | string[];
+}
+export type UseClickOutsideReturn = void;
+export declare function useClickOutside(target: ClickOutsideTargetRef | ClickOutsideTargetRef[], handler: (event: ClickOutsideEvent) => void, options?: UseClickOutsideOptions): UseClickOutsideReturn;
+export type TargetType = EventTarget;
+export type TargetRef<T extends TargetType> = RefObject<T | null> | T | null;
+export interface UseEventListenerOptions<T extends TargetType> extends AddEventListenerOptions {
+	target?: TargetRef<T>;
+}
+export type UseEventListenerReturn = void;
+export declare function useEventListener<K extends keyof WindowEventMap>(eventName: K | K[], handler: (event: WindowEventMap[K]) => void, options?: UseEventListenerOptions<Window> & {
+	target?: Window | null | undefined;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K | K[], handler: (event: DocumentEventMap[K]) => void, options: UseEventListenerOptions<Document> & {
+	target: Document | RefObject<Document | null> | null;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLElement>(eventName: K | K[], handler: (event: HTMLElementEventMap[K]) => void, options: UseEventListenerOptions<T> & {
+	target: T | RefObject<T | null> | null;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends keyof SVGElementEventMap, T extends SVGElement = SVGElement>(eventName: K | K[], handler: (event: SVGElementEventMap[K]) => void, options: UseEventListenerOptions<T> & {
+	target: T | RefObject<T | null> | null;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends string, T extends TargetType = TargetType>(eventName: K | K[], handler: (event: Event) => void, options: UseEventListenerOptions<T> & {
+	target: T | RefObject<T | null> | null;
+}): UseEventListenerReturn;
 declare const validKeyEventTypes: readonly [
 	"keydown",
 	"keyup",

package/dist/events.js

@@ -1,2 +1,2 @@
-import { t as e } from "./events2.js";
-export { e as useKey };
+import { n as e, r as t, t as n } from "./events2.js";
+export { e as useClickOutside, t as useEventListener, n as useKey };

package/dist/events2.js

@@ -1,45 +1,87 @@
 import { useEffect as e, useLayoutEffect as t, useRef as n } from "react";
+//#region src/events/useEventListener/useEventListener.ts
+var r = typeof window < "u" ? t : e;
+function i(t, i, a = {}) {
+	let { target: o, capture: s = !1, passive: c = !1, once: l = !1 } = a, u = o === void 0 ? typeof window > "u" ? null : window : o, d = n(i);
+	r(() => {
+		d.current = i;
+	}, [i]), e(() => {
+		let e = u && "current" in u ? u.current : u;
+		if (!e?.addEventListener) return;
+		let n = Array.isArray(t) ? t : [t], r = (e) => d.current(e);
+		return n.forEach((t) => {
+			e.addEventListener(t, r, {
+				capture: s,
+				passive: c,
+				once: l
+			});
+		}), () => {
+			n.forEach((t) => {
+				e.removeEventListener(t, r, { capture: s });
+			});
+		};
+	}, [
+		Array.isArray(t) ? t.join(",") : t,
+		u,
+		s,
+		c,
+		l
+	]);
+}
+//#endregion
+//#region src/events/useClickOutside/useClickOutside.ts
+var a = typeof window < "u" ? t : e;
+function o(e, t, r = {}) {
+	let { enabled: o = !0, eventType: s = ["mousedown", "touchstart"] } = r, c = n(t);
+	a(() => {
+		c.current = t;
+	}, [t]), i(s, (t) => {
+		o && (Array.isArray(e) ? e : [e]).every((e) => {
+			let n = e && "current" in e ? e.current : e;
+			return n && !n.contains(t.target);
+		}) && c.current(t);
+	}, { target: typeof document > "u" ? null : document });
+}
+//#endregion
 //#region src/events/useKey/constants.ts
-var r = [
+var s = [
 	"keydown",
 	"keyup",
 	"keypress"
-];
-//#endregion
-//#region src/events/useKey/useKey.ts
-function i(i, a, { enabled: o = !0, preventDefault: s = !0, stopPropagation: c = !0, eventType: l = "keydown", preventRepeat: u = !1, ignoreWhenFocusedInInputs: d = !0, ctrlKey: f = !1, shiftKey: p = !1, altKey: m = !1, metaKey: h = !1, target: g = window } = {}) {
-	let _ = n(a), v = n(o), y = n(!1);
-	t(() => {
-		_.current = a;
-	}, [a]), e(() => {
-		v.current = o;
-	}, [o]), e(() => {
-		let e = g && "current" in g ? g.current : g;
+], c = typeof window < "u" ? t : e;
+function l(t, r, { enabled: i = !0, preventDefault: a = !0, stopPropagation: o = !0, eventType: l = "keydown", preventRepeat: u = !1, ignoreWhenFocusedInInputs: d = !0, ctrlKey: f = !1, shiftKey: p = !1, altKey: m = !1, metaKey: h = !1, target: g } = {}) {
+	let _ = g === void 0 ? typeof window > "u" ? null : window : g, v = n(r), y = n(i), b = n(!1);
+	c(() => {
+		v.current = r;
+	}, [r]), e(() => {
+		y.current = i;
+	}, [i]), e(() => {
+		let e = _ && "current" in _ ? _.current : _;
 		if (!e) return;
-		let t = String(i || "").toLowerCase(), n = r.includes(l) ? l : "keydown", a = u && n !== "keyup";
-		function o() {
-			y.current = !1;
+		let n = String(t || "").toLowerCase(), r = s.includes(l) ? l : "keydown", i = u && r !== "keyup";
+		function c() {
+			b.current = !1;
 		}
-		function b(e) {
+		function g(e) {
 			if (!(e instanceof KeyboardEvent)) return;
-			let n = e.key.toLowerCase();
-			(n === t || f && n === "control" || p && n === "shift" || m && n === "alt" || h && n === "meta") && (y.current = !1);
+			let t = e.key.toLowerCase();
+			(t === n || f && t === "control" || p && t === "shift" || m && t === "alt" || h && t === "meta") && (b.current = !1);
 		}
 		function x(e) {
-			if (!(e instanceof KeyboardEvent) || !v.current) return;
-			let n = e.target;
-			if (!(d && n instanceof HTMLElement && (n instanceof HTMLInputElement || n instanceof HTMLTextAreaElement || n instanceof HTMLSelectElement || n.isContentEditable)) && e.ctrlKey === f && e.shiftKey === p && e.altKey === m && e.metaKey === h && t === e.key.toLowerCase()) {
-				if (a && y.current) return;
-				y.current = !0, _.current(e), s && e.preventDefault(), c && e.stopPropagation();
+			if (!(e instanceof KeyboardEvent) || !y.current) return;
+			let t = e.target;
+			if (!(d && t instanceof HTMLElement && (t instanceof HTMLInputElement || t instanceof HTMLTextAreaElement || t instanceof HTMLSelectElement || t.isContentEditable)) && e.ctrlKey === f && e.shiftKey === p && e.altKey === m && e.metaKey === h && n === e.key.toLowerCase()) {
+				if (i && b.current) return;
+				b.current = !0, v.current(e), a && e.preventDefault(), o && e.stopPropagation();
 			}
 		}
-		return e.addEventListener(n, x), a && (e.addEventListener("keyup", b), window.addEventListener("blur", o)), () => {
-			e.removeEventListener(n, x), a && (e.removeEventListener("keyup", b), window.removeEventListener("blur", o));
+		return e.addEventListener(r, x), i && (e.addEventListener("keyup", g), window.addEventListener("blur", c)), () => {
+			e.removeEventListener(r, x), i && (e.removeEventListener("keyup", g), window.removeEventListener("blur", c));
 		};
 	}, [
-		i,
-		s,
-		c,
+		t,
+		a,
+		o,
 		l,
 		u,
 		d,
@@ -47,8 +89,8 @@ function i(i, a, { enabled: o = !0, preventDefault: s = !0, stopPropagation: c =
 		p,
 		m,
 		h,
-		g
+		_
 	]);
 }
 //#endregion
-export { i as t };
+export { o as n, i as r, l as t };

package/dist/index.d.ts

@@ -181,6 +181,36 @@ export declare function isAM(date: DateInput): boolean;
 export declare function isPM(date: DateInput): boolean;
 export declare function isLeapYear(yearOrDate: number | Date): boolean;
 export declare function isInLeapYear(date: DateInput): boolean;
+export type ClickOutsideEvent = MouseEvent | TouchEvent | PointerEvent | Event;
+export type ClickOutsideTarget = HTMLElement | null;
+export type ClickOutsideTargetRef = React$1.RefObject<ClickOutsideTarget> | ClickOutsideTarget;
+export interface UseClickOutsideOptions {
+	enabled?: boolean;
+	eventType?: string | string[];
+}
+export type UseClickOutsideReturn = void;
+export declare function useClickOutside(target: ClickOutsideTargetRef | ClickOutsideTargetRef[], handler: (event: ClickOutsideEvent) => void, options?: UseClickOutsideOptions): UseClickOutsideReturn;
+export type TargetType = EventTarget;
+export type TargetRef<T extends TargetType> = React$1.RefObject<T | null> | T | null;
+export interface UseEventListenerOptions<T extends TargetType> extends AddEventListenerOptions {
+	target?: TargetRef<T>;
+}
+export type UseEventListenerReturn = void;
+export declare function useEventListener<K extends keyof WindowEventMap>(eventName: K | K[], handler: (event: WindowEventMap[K]) => void, options?: UseEventListenerOptions<Window> & {
+	target?: Window | null | undefined;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K | K[], handler: (event: DocumentEventMap[K]) => void, options: UseEventListenerOptions<Document> & {
+	target: Document | React$1.RefObject<Document | null> | null;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLElement>(eventName: K | K[], handler: (event: HTMLElementEventMap[K]) => void, options: UseEventListenerOptions<T> & {
+	target: T | React$1.RefObject<T | null> | null;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends keyof SVGElementEventMap, T extends SVGElement = SVGElement>(eventName: K | K[], handler: (event: SVGElementEventMap[K]) => void, options: UseEventListenerOptions<T> & {
+	target: T | React$1.RefObject<T | null> | null;
+}): UseEventListenerReturn;
+export declare function useEventListener<K extends string, T extends TargetType = TargetType>(eventName: K | K[], handler: (event: Event) => void, options: UseEventListenerOptions<T> & {
+	target: T | React$1.RefObject<T | null> | null;
+}): UseEventListenerReturn;
 declare const validKeyEventTypes: readonly [
 	"keydown",
 	"keyup",

package/dist/index.js

@@ -1,6 +1,6 @@
 import { addBusinessDays as e, addDays as t, addHours as n, addMilliseconds as r, addMinutes as i, addMonths as a, addSeconds as o, addWeeks as s, addYears as c, clampDate as l, closestTo as u, createDate as d, differenceInBusinessDays as f, differenceInDays as p, differenceInHours as m, differenceInMilliseconds as h, differenceInMinutes as g, differenceInMonths as _, differenceInSeconds as v, differenceInWeeks as y, differenceInYears as b, durationToMilliseconds as x, eachDayOfInterval as S, eachMonthOfInterval as C, eachYearOfInterval as w, endOfDay as T, endOfHour as E, endOfMinute as D, endOfMonth as O, endOfQuarter as k, endOfWeek as A, endOfYear as j, format as M, formatDate as N, formatDuration as P, formatISO as F, formatISO9075 as I, formatRFC2822 as L, formatRFC3339 as R, formatRelativeTime as z, fromUnixTime as B, getDate as V, getDayOfWeek as H, getDayOfYear as U, getDaysInMonth as W, getHours as G, getISOWeek as K, getMilliseconds as q, getMinutes as J, getMonth as Y, getQuarter as X, getSeconds as Z, getTimestamp as Q, getYear as $, intervalToDuration as ee, isAM as te, isAfter as ne, isBefore as re, isDate as ie, isEqual as ae, isFirstDayOfMonth as oe, isFuture as se, isInLeapYear as ce, isLastDayOfMonth as le, isLeapYear as ue, isOverlapping as de, isPM as fe, isPast as pe, isSameDay as me, isSameHour as he, isSameMinute as ge, isSameMonth as _e, isSameQuarter as ve, isSameSecond as ye, isSameTime as be, isSameWeek as xe, isSameYear as Se, isThisMonth as Ce, isThisWeek as we, isThisYear as Te, isToday as Ee, isTomorrow as De, isValid as Oe, isWeekday as ke, isWeekend as Ae, isWithinRange as je, isYesterday as Me, max as Ne, min as Pe, parseISO as Fe, roundToNearestMinutes as Ie, setDate as Le, setHours as Re, setISOWeek as ze, setMilliseconds as Be, setMinutes as Ve, setMonth as He, setSeconds as Ue, setYear as We, startOfDay as Ge, startOfHour as Ke, startOfMinute as qe, startOfMonth as Je, startOfQuarter as Ye, startOfWeek as Xe, startOfYear as Ze, subDays as Qe, subHours as $e, subMilliseconds as et, subMinutes as tt, subMonths as nt, subSeconds as rt, subWeeks as it, subYears as at, toDate as ot, toISOString as st, toUnixTime as ct } from "./datetime.js";
-import { t as lt } from "./events2.js";
-import { a as ut, c as dt, i as ft, l as pt, n as mt, o as ht, r as gt, s as _t, t as vt, u as yt } from "./performance2.js";
-import { a as bt, c as xt, i as St, n as Ct, o as wt, r as Tt, s as Et, t as Dt } from "./state2.js";
-import { a as Ot, c as kt, i as At, n as jt, o as Mt, r as Nt, s as Pt, t as Ft } from "./ui2.js";
-export { kt as FuzzyHighlighter, At as ModalLayout, e as addBusinessDays, t as addDays, n as addHours, r as addMilliseconds, i as addMinutes, a as addMonths, o as addSeconds, s as addWeeks, c as addYears, l as clampDate, u as closestTo, d as createDate, f as differenceInBusinessDays, p as differenceInDays, m as differenceInHours, h as differenceInMilliseconds, g as differenceInMinutes, _ as differenceInMonths, v as differenceInSeconds, y as differenceInWeeks, b as differenceInYears, x as durationToMilliseconds, S as eachDayOfInterval, C as eachMonthOfInterval, w as eachYearOfInterval, T as endOfDay, E as endOfHour, D as endOfMinute, O as endOfMonth, k as endOfQuarter, A as endOfWeek, j as endOfYear, M as format, N as formatDate, P as formatDuration, F as formatISO, I as formatISO9075, L as formatRFC2822, R as formatRFC3339, z as formatRelativeTime, B as fromUnixTime, V as getDate, H as getDayOfWeek, U as getDayOfYear, W as getDaysInMonth, G as getHours, K as getISOWeek, q as getMilliseconds, J as getMinutes, Y as getMonth, X as getQuarter, Z as getSeconds, Q as getTimestamp, $ as getYear, ee as intervalToDuration, te as isAM, ne as isAfter, re as isBefore, ie as isDate, ae as isEqual, oe as isFirstDayOfMonth, se as isFuture, ce as isInLeapYear, le as isLastDayOfMonth, ue as isLeapYear, de as isOverlapping, fe as isPM, pe as isPast, me as isSameDay, he as isSameHour, ge as isSameMinute, _e as isSameMonth, ve as isSameQuarter, ye as isSameSecond, be as isSameTime, xe as isSameWeek, Se as isSameYear, Ce as isThisMonth, we as isThisWeek, Te as isThisYear, Ee as isToday, De as isTomorrow, Oe as isValid, ke as isWeekday, Ae as isWeekend, je as isWithinRange, Me as isYesterday, Ne as max, Pe as min, Fe as parseISO, Ie as roundToNearestMinutes, Le as setDate, Re as setHours, ze as setISOWeek, Be as setMilliseconds, Ve as setMinutes, He as setMonth, Ue as setSeconds, We as setYear, Ge as startOfDay, Ke as startOfHour, qe as startOfMinute, Je as startOfMonth, Ye as startOfQuarter, Xe as startOfWeek, Ze as startOfYear, Qe as subDays, $e as subHours, et as subMilliseconds, tt as subMinutes, nt as subMonths, rt as subSeconds, it as subWeeks, at as subYears, ot as toDate, st as toISOString, ct as toUnixTime, yt as useDebounce, pt as useDebouncedCallback, dt as useDebouncedState, _t as useDebouncedValue, Nt as useExpansion, xt as useFilter, Et as useFuzzySearch, wt as useGrouping, lt as useKey, Ot as useModal, Mt as useModalActions, Pt as useModalState, bt as useMultipleSelection, St as useOrder, Tt as usePagination, jt as usePin, ht as useRateLimit, ut as useRateLimitedCallback, Ct as useSingleSelection, Dt as useSort, ft as useThrottle, gt as useThrottledCallback, mt as useThrottledState, vt as useThrottledValue, Ft as useVisibility };
+import { n as lt, r as ut, t as dt } from "./events2.js";
+import { a as ft, c as pt, i as mt, l as ht, n as gt, o as _t, r as vt, s as yt, t as bt, u as xt } from "./performance2.js";
+import { a as St, c as Ct, i as wt, n as Tt, o as Et, r as Dt, s as Ot, t as kt } from "./state2.js";
+import { a as At, c as jt, i as Mt, n as Nt, o as Pt, r as Ft, s as It, t as Lt } from "./ui2.js";
+export { jt as FuzzyHighlighter, Mt as ModalLayout, e as addBusinessDays, t as addDays, n as addHours, r as addMilliseconds, i as addMinutes, a as addMonths, o as addSeconds, s as addWeeks, c as addYears, l as clampDate, u as closestTo, d as createDate, f as differenceInBusinessDays, p as differenceInDays, m as differenceInHours, h as differenceInMilliseconds, g as differenceInMinutes, _ as differenceInMonths, v as differenceInSeconds, y as differenceInWeeks, b as differenceInYears, x as durationToMilliseconds, S as eachDayOfInterval, C as eachMonthOfInterval, w as eachYearOfInterval, T as endOfDay, E as endOfHour, D as endOfMinute, O as endOfMonth, k as endOfQuarter, A as endOfWeek, j as endOfYear, M as format, N as formatDate, P as formatDuration, F as formatISO, I as formatISO9075, L as formatRFC2822, R as formatRFC3339, z as formatRelativeTime, B as fromUnixTime, V as getDate, H as getDayOfWeek, U as getDayOfYear, W as getDaysInMonth, G as getHours, K as getISOWeek, q as getMilliseconds, J as getMinutes, Y as getMonth, X as getQuarter, Z as getSeconds, Q as getTimestamp, $ as getYear, ee as intervalToDuration, te as isAM, ne as isAfter, re as isBefore, ie as isDate, ae as isEqual, oe as isFirstDayOfMonth, se as isFuture, ce as isInLeapYear, le as isLastDayOfMonth, ue as isLeapYear, de as isOverlapping, fe as isPM, pe as isPast, me as isSameDay, he as isSameHour, ge as isSameMinute, _e as isSameMonth, ve as isSameQuarter, ye as isSameSecond, be as isSameTime, xe as isSameWeek, Se as isSameYear, Ce as isThisMonth, we as isThisWeek, Te as isThisYear, Ee as isToday, De as isTomorrow, Oe as isValid, ke as isWeekday, Ae as isWeekend, je as isWithinRange, Me as isYesterday, Ne as max, Pe as min, Fe as parseISO, Ie as roundToNearestMinutes, Le as setDate, Re as setHours, ze as setISOWeek, Be as setMilliseconds, Ve as setMinutes, He as setMonth, Ue as setSeconds, We as setYear, Ge as startOfDay, Ke as startOfHour, qe as startOfMinute, Je as startOfMonth, Ye as startOfQuarter, Xe as startOfWeek, Ze as startOfYear, Qe as subDays, $e as subHours, et as subMilliseconds, tt as subMinutes, nt as subMonths, rt as subSeconds, it as subWeeks, at as subYears, ot as toDate, st as toISOString, ct as toUnixTime, lt as useClickOutside, xt as useDebounce, ht as useDebouncedCallback, pt as useDebouncedState, yt as useDebouncedValue, ut as useEventListener, Ft as useExpansion, Ct as useFilter, Ot as useFuzzySearch, Et as useGrouping, dt as useKey, At as useModal, Pt as useModalActions, It as useModalState, St as useMultipleSelection, wt as useOrder, Dt as usePagination, Nt as usePin, _t as useRateLimit, ft as useRateLimitedCallback, Tt as useSingleSelection, kt as useSort, mt as useThrottle, vt as useThrottledCallback, gt as useThrottledState, bt as useThrottledValue, Lt as useVisibility };

package/package.json

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