@rio-cloud/rio-uikit 2.5.1 → 3.0.0-beta.1

package/hooks/useDraggableElement.js

@@ -1,126 +1,109 @@
-import { useState as M, useRef as C, useEffect as Y, useCallback as H, useLayoutEffect as N } from "react";
-import { createPortal as O } from "react-dom";
-import { getOrCreatePortalRoot as W } from "../utils/portalRoot.js";
-const y = 4, v = "is-dragging", s = (a, e, o) => Math.min(o, Math.max(e, a)), R = (a) => a?.current?.getBoundingClientRect() ?? null, I = (a, e, o) => a === "container" && o ? {
-  top: s(
-    (o.height - e.height) / 2,
-    0,
-    Math.max(0, o.height - e.height)
-  ),
-  left: s(
-    (o.width - e.width) / 2,
-    0,
-    Math.max(0, o.width - e.width)
-  )
+import { getOrCreatePortalRoot as e } from "../utils/portalRoot.js";
+import { useCallback as t, useEffect as n, useLayoutEffect as r, useRef as i, useState as a } from "react";
+import { createPortal as o } from "react-dom";
+//#region src/hooks/useDraggableElement.ts
+var s = 4, c = "is-dragging", l = (e, t, n) => Math.min(n, Math.max(t, e)), u = (e) => e?.current?.getBoundingClientRect() ?? null, d = (e, t, n) => e === "container" && n ? {
+	top: l((n.height - t.height) / 2, 0, Math.max(0, n.height - t.height)),
+	left: l((n.width - t.width) / 2, 0, Math.max(0, n.width - t.width))
 } : {
-  top: s(
-    (window.innerHeight - e.height) / 2,
-    0,
-    Math.max(0, window.innerHeight - e.height)
-  ),
-  left: s(
-    (window.innerWidth - e.width) / 2,
-    0,
-    Math.max(0, window.innerWidth - e.width)
-  )
-}, j = (a = {}) => {
-  const { positioning: e = "viewport", initialPosition: o, collisionContainerRef: d } = a, [u, D] = M(!1), [g, p] = M({ top: 0, left: 0, hasDragged: !1 }), [x, L] = M(null), h = C(null), w = C(null), c = e === "viewport";
-  Y(() => {
-    if (!c) {
-      L(null);
-      return;
-    }
-    L(W());
-  }, [c]);
-  const S = H(
-    (t, r) => {
-      if (!c)
-        return t;
-      const n = r ?? x;
-      return n ? O(t, n) : null;
-    },
-    [c, x]
-  );
-  N(() => {
-    if (g.hasDragged || !o)
-      return;
-    const t = h.current;
-    if (!t)
-      return;
-    const r = o === "center" ? I(
-      e,
-      t.getBoundingClientRect(),
-      R(d)
-    ) : o;
-    p(
-      (n) => n.top === r.top && n.left === r.left ? n : { top: r.top, left: r.left, hasDragged: !1 }
-    );
-  }, [d, o, g.hasDragged, e]);
-  const T = H((t) => {
-    if (t.button !== 0)
-      return;
-    t.preventDefault(), t.stopPropagation();
-    const r = h.current;
-    if (!r)
-      return;
-    const n = r.getBoundingClientRect();
-    w.current = {
-      offsetX: t.clientX - n.left,
-      offsetY: t.clientY - n.top,
-      startX: t.clientX,
-      startY: t.clientY,
-      hasMoved: !1
-    }, D(!0);
-  }, []);
-  return Y(() => {
-    if (!u)
-      return;
-    const t = document.documentElement;
-    t.classList.add(v);
-    const r = (B) => {
-      const i = w.current, P = h.current;
-      if (!i || !P)
-        return;
-      const { clientX: m, clientY: E } = B, _ = Math.hypot(m - i.startX, E - i.startY);
-      if (!i.hasMoved && _ < y)
-        return;
-      i.hasMoved || (i.hasMoved = !0);
-      const f = P.getBoundingClientRect(), l = R(d);
-      if (e === "container" && l) {
-        const A = s(
-          m - l.left - i.offsetX,
-          0,
-          Math.max(0, l.width - f.width)
-        ), G = s(
-          E - l.top - i.offsetY,
-          0,
-          Math.max(0, l.height - f.height)
-        );
-        p({
-          top: G,
-          left: A,
-          hasDragged: !0
-        });
-        return;
-      }
-      const X = {
-        left: s(m - i.offsetX, 0, Math.max(0, window.innerWidth - f.width)),
-        top: s(E - i.offsetY, 0, Math.max(0, window.innerHeight - f.height))
-      };
-      p({
-        top: X.top,
-        left: X.left,
-        hasDragged: !0
-      });
-    }, n = () => {
-      t.classList.remove(v), D(!1), w.current = null;
-    };
-    return window.addEventListener("pointermove", r), window.addEventListener("pointerup", n), window.addEventListener("pointercancel", n), () => {
-      window.removeEventListener("pointermove", r), window.removeEventListener("pointerup", n), window.removeEventListener("pointercancel", n), t.classList.remove(v);
-    };
-  }, [d, u, e]), { draggableRef: h, isDragging: u, position: g, onDragHandleDown: T, renderElement: S };
+	top: l((window.innerHeight - t.height) / 2, 0, Math.max(0, window.innerHeight - t.height)),
+	left: l((window.innerWidth - t.width) / 2, 0, Math.max(0, window.innerWidth - t.width))
+}, f = (f = {}) => {
+	let { positioning: p = "viewport", initialPosition: m, collisionContainerRef: h } = f, [g, _] = a(!1), [v, y] = a({
+		top: 0,
+		left: 0,
+		hasDragged: !1
+	}), [b, x] = a(null), S = i(null), C = i(null), w = p === "viewport";
+	n(() => {
+		if (!w) {
+			x(null);
+			return;
+		}
+		x(e());
+	}, [w]);
+	let T = t((e, t) => {
+		if (!w) return e;
+		let n = t ?? b;
+		return n ? o(e, n) : null;
+	}, [w, b]);
+	r(() => {
+		if (v.hasDragged || !m) return;
+		let e = S.current;
+		if (!e) return;
+		let t = m === "center" ? d(p, e.getBoundingClientRect(), u(h)) : m;
+		y((e) => e.top === t.top && e.left === t.left ? e : {
+			top: t.top,
+			left: t.left,
+			hasDragged: !1
+		});
+	}, [
+		h,
+		m,
+		v.hasDragged,
+		p
+	]);
+	let E = t((e) => {
+		if (e.button !== 0) return;
+		e.preventDefault(), e.stopPropagation();
+		let t = S.current;
+		if (!t) return;
+		let n = t.getBoundingClientRect();
+		C.current = {
+			offsetX: e.clientX - n.left,
+			offsetY: e.clientY - n.top,
+			startX: e.clientX,
+			startY: e.clientY,
+			hasMoved: !1
+		}, _(!0);
+	}, []);
+	return n(() => {
+		if (!g) return;
+		let e = document.documentElement;
+		e.classList.add(c);
+		let t = (e) => {
+			let t = C.current, n = S.current;
+			if (!t || !n) return;
+			let { clientX: r, clientY: i } = e, a = Math.hypot(r - t.startX, i - t.startY);
+			if (!t.hasMoved && a < s) return;
+			t.hasMoved ||= !0;
+			let o = n.getBoundingClientRect(), c = u(h);
+			if (p === "container" && c) {
+				let e = l(r - c.left - t.offsetX, 0, Math.max(0, c.width - o.width)), n = l(i - c.top - t.offsetY, 0, Math.max(0, c.height - o.height));
+				y({
+					top: n,
+					left: e,
+					hasDragged: !0
+				});
+				return;
+			}
+			let d = {
+				left: l(r - t.offsetX, 0, Math.max(0, window.innerWidth - o.width)),
+				top: l(i - t.offsetY, 0, Math.max(0, window.innerHeight - o.height))
+			};
+			y({
+				top: d.top,
+				left: d.left,
+				hasDragged: !0
+			});
+		}, n = () => {
+			e.classList.remove(c), _(!1), C.current = null;
+		};
+		return window.addEventListener("pointermove", t), window.addEventListener("pointerup", n), window.addEventListener("pointercancel", n), () => {
+			window.removeEventListener("pointermove", t), window.removeEventListener("pointerup", n), window.removeEventListener("pointercancel", n), e.classList.remove(c);
+		};
+	}, [
+		h,
+		g,
+		p
+	]), {
+		draggableRef: S,
+		isDragging: g,
+		position: v,
+		onDragHandleDown: E,
+		renderElement: T
+	};
 };
-export {
-  j as default
-};
-//# sourceMappingURL=useDraggableElement.js.map
+//#endregion
+export { f as default };
+
+//# sourceMappingURL=useDraggableElement.js.map

package/hooks/useDraggableElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDraggableElement.js","sources":["../../src/hooks/useDraggableElement.ts"],"sourcesContent":["import {\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type MutableRefObject,\n    type PointerEvent as ReactPointerEvent,\n    type ReactNode,\n    type RefObject,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { getOrCreatePortalRoot } from '../utils/portalRoot';\n\nexport type DraggablePosition = {\n    /**\n     * Top offset in pixels relative to the active positioning context.\n     */\n    top: number;\n\n    /**\n     * Left offset in pixels relative to the active positioning context.\n     */\n    left: number;\n\n    /**\n     * Indicates whether the element has been moved by dragging at least once.\n     */\n    hasDragged: boolean;\n};\n\nexport type UseDraggableResult<T extends HTMLElement> = {\n    /**\n     * Ref that must be attached to the draggable element container.\n     */\n    draggableRef: MutableRefObject<T | null>;\n\n    /**\n     * Indicates whether a drag interaction is currently active.\n     */\n    isDragging: boolean;\n\n    /**\n     * Current draggable coordinates and drag-state metadata.\n     */\n    position: DraggablePosition;\n\n    /**\n     * Pointer down handler for the dedicated drag handle element.\n     */\n    onDragHandleDown: (event: ReactPointerEvent<HTMLElement>) => void;\n\n    /**\n     * Renders the provided element through the shared portal root in viewport mode.\n     * An optional custom target can be passed for specialized overlay hosts.\n     * In container mode, the element is returned unchanged and this helper is usually not needed.\n     */\n    renderElement: (element: ReactNode, target?: HTMLElement | null) => ReactNode;\n};\n\nexport type UseDraggableElementOptions = {\n    /**\n     * Defines whether drag coordinates are resolved against the viewport or a collision container.\n     * Viewport mode also enables portal rendering via `renderElement`.\n     */\n    positioning?: 'viewport' | 'container';\n\n    /**\n     * Optional initial position for the draggable element.\n     * Use `center` to center the element inside the active positioning context on mount.\n     */\n    initialPosition?: 'center' | Pick<DraggablePosition, 'top' | 'left'>;\n\n    /**\n     * Optional container whose visible client rect is used as the drag boundary in container mode.\n     */\n    collisionContainerRef?: RefObject<HTMLElement | null>;\n};\n\ntype DraggableState = {\n    offsetX: number;\n    offsetY: number;\n    startX: number;\n    startY: number;\n    hasMoved: boolean;\n};\n\nconst MOVEMENT_THRESHOLD_PX = 4;\nconst DRAGGING_CLASS_NAME = 'is-dragging';\n\nconst clampToRange = (value: number, min: number, max: number) => Math.min(max, Math.max(min, value));\n\nconst resolveCollisionContainerRect = (collisionContainerRef?: RefObject<HTMLElement | null>) =>\n    collisionContainerRef?.current?.getBoundingClientRect() ?? null;\n\nconst resolveCenteredPosition = (\n    positioning: UseDraggableElementOptions['positioning'],\n    draggableRect: DOMRect,\n    collisionContainerRect: DOMRect | null\n) => {\n    if (positioning === 'container' && collisionContainerRect) {\n        return {\n            top: clampToRange(\n                (collisionContainerRect.height - draggableRect.height) / 2,\n                0,\n                Math.max(0, collisionContainerRect.height - draggableRect.height)\n            ),\n            left: clampToRange(\n                (collisionContainerRect.width - draggableRect.width) / 2,\n                0,\n                Math.max(0, collisionContainerRect.width - draggableRect.width)\n            ),\n        };\n    }\n\n    return {\n        top: clampToRange(\n            (window.innerHeight - draggableRect.height) / 2,\n            0,\n            Math.max(0, window.innerHeight - draggableRect.height)\n        ),\n        left: clampToRange(\n            (window.innerWidth - draggableRect.width) / 2,\n            0,\n            Math.max(0, window.innerWidth - draggableRect.width)\n        ),\n    };\n};\n\nconst useDraggableElement = <T extends HTMLElement = HTMLDivElement>(\n    options: UseDraggableElementOptions = {}\n): UseDraggableResult<T> => {\n    const { positioning = 'viewport', initialPosition, collisionContainerRef } = options;\n\n    const [isDragging, setIsDragging] = useState(false);\n    const [position, setPosition] = useState<DraggablePosition>({ top: 0, left: 0, hasDragged: false });\n    const [portalRoot, setPortalRoot] = useState<HTMLElement | null>(null);\n\n    const draggableRef = useRef<T | null>(null);\n    const dragStateRef = useRef<DraggableState | null>(null);\n    const portalEnabled = positioning === 'viewport';\n\n    useEffect(() => {\n        if (!portalEnabled) {\n            setPortalRoot(null);\n            return;\n        }\n\n        setPortalRoot(getOrCreatePortalRoot());\n    }, [portalEnabled]);\n\n    const renderElement = useCallback(\n        (element: ReactNode, target?: HTMLElement | null) => {\n            if (!portalEnabled) {\n                return element;\n            }\n\n            const renderTarget = target ?? portalRoot;\n            return renderTarget ? createPortal(element, renderTarget) : null;\n        },\n        [portalEnabled, portalRoot]\n    );\n\n    useLayoutEffect(() => {\n        if (position.hasDragged || !initialPosition) {\n            return;\n        }\n\n        const draggableElement = draggableRef.current;\n        if (!draggableElement) {\n            return;\n        }\n\n        const nextPosition =\n            initialPosition === 'center'\n                ? resolveCenteredPosition(\n                      positioning,\n                      draggableElement.getBoundingClientRect(),\n                      resolveCollisionContainerRect(collisionContainerRef)\n                  )\n                : initialPosition;\n\n        setPosition(currentPosition =>\n            currentPosition.top === nextPosition.top && currentPosition.left === nextPosition.left\n                ? currentPosition\n                : { top: nextPosition.top, left: nextPosition.left, hasDragged: false }\n        );\n    }, [collisionContainerRef, initialPosition, position.hasDragged, positioning]);\n\n    const onDragHandleDown = useCallback((event: ReactPointerEvent<HTMLElement>) => {\n        if (event.button !== 0) {\n            return;\n        }\n\n        event.preventDefault();\n        event.stopPropagation();\n\n        const draggableElement = draggableRef.current;\n        if (!draggableElement) {\n            return;\n        }\n\n        const rect = draggableElement.getBoundingClientRect();\n        dragStateRef.current = {\n            offsetX: event.clientX - rect.left,\n            offsetY: event.clientY - rect.top,\n            startX: event.clientX,\n            startY: event.clientY,\n            hasMoved: false,\n        };\n        setIsDragging(true);\n    }, []);\n\n    useEffect(() => {\n        if (!isDragging) {\n            return;\n        }\n\n        const rootElement = document.documentElement;\n        rootElement.classList.add(DRAGGING_CLASS_NAME);\n\n        const handlePointerMove = (event: PointerEvent) => {\n            const dragState = dragStateRef.current;\n            const draggableElement = draggableRef.current;\n            if (!dragState || !draggableElement) {\n                return;\n            }\n\n            const { clientX, clientY } = event;\n\n            const movedDistance = Math.hypot(clientX - dragState.startX, clientY - dragState.startY);\n            if (!dragState.hasMoved && movedDistance < MOVEMENT_THRESHOLD_PX) {\n                return;\n            }\n\n            if (!dragState.hasMoved) {\n                dragState.hasMoved = true;\n            }\n\n            const rect = draggableElement.getBoundingClientRect();\n            const collisionContainerRect = resolveCollisionContainerRect(collisionContainerRef);\n\n            if (positioning === 'container' && collisionContainerRect) {\n                const nextLeftPos = clampToRange(\n                    clientX - collisionContainerRect.left - dragState.offsetX,\n                    0,\n                    Math.max(0, collisionContainerRect.width - rect.width)\n                );\n\n                const nextTopPos = clampToRange(\n                    clientY - collisionContainerRect.top - dragState.offsetY,\n                    0,\n                    Math.max(0, collisionContainerRect.height - rect.height)\n                );\n\n                setPosition({\n                    top: nextTopPos,\n                    left: nextLeftPos,\n                    hasDragged: true,\n                });\n\n                return;\n            }\n\n            const nextPosition = {\n                left: clampToRange(clientX - dragState.offsetX, 0, Math.max(0, window.innerWidth - rect.width)),\n                top: clampToRange(clientY - dragState.offsetY, 0, Math.max(0, window.innerHeight - rect.height)),\n            };\n\n            setPosition({\n                top: nextPosition.top,\n                left: nextPosition.left,\n                hasDragged: true,\n            });\n        };\n\n        const handlePointerRelease = () => {\n            rootElement.classList.remove(DRAGGING_CLASS_NAME);\n            setIsDragging(false);\n            dragStateRef.current = null;\n        };\n\n        window.addEventListener('pointermove', handlePointerMove);\n        window.addEventListener('pointerup', handlePointerRelease);\n        window.addEventListener('pointercancel', handlePointerRelease);\n\n        return () => {\n            window.removeEventListener('pointermove', handlePointerMove);\n            window.removeEventListener('pointerup', handlePointerRelease);\n            window.removeEventListener('pointercancel', handlePointerRelease);\n            rootElement.classList.remove(DRAGGING_CLASS_NAME);\n        };\n    }, [collisionContainerRef, isDragging, positioning]);\n\n    return { draggableRef, isDragging, position, onDragHandleDown, renderElement };\n};\n\nexport default useDraggableElement;\n"],"names":["MOVEMENT_THRESHOLD_PX","DRAGGING_CLASS_NAME","clampToRange","value","min","max","resolveCollisionContainerRect","collisionContainerRef","resolveCenteredPosition","positioning","draggableRect","collisionContainerRect","useDraggableElement","options","initialPosition","isDragging","setIsDragging","useState","position","setPosition","portalRoot","setPortalRoot","draggableRef","useRef","dragStateRef","portalEnabled","useEffect","getOrCreatePortalRoot","renderElement","useCallback","element","target","renderTarget","createPortal","useLayoutEffect","draggableElement","nextPosition","currentPosition","onDragHandleDown","event","rect","rootElement","handlePointerMove","dragState","clientX","clientY","movedDistance","nextLeftPos","nextTopPos","handlePointerRelease"],"mappings":"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"}
+{"version":3,"file":"useDraggableElement.js","names":[],"sources":["../../src/hooks/useDraggableElement.ts"],"sourcesContent":["import {\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type MutableRefObject,\n    type PointerEvent as ReactPointerEvent,\n    type ReactNode,\n    type RefObject,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { getOrCreatePortalRoot } from '../utils/portalRoot';\n\nexport type DraggablePosition = {\n    /**\n     * Top offset in pixels relative to the active positioning context.\n     */\n    top: number;\n\n    /**\n     * Left offset in pixels relative to the active positioning context.\n     */\n    left: number;\n\n    /**\n     * Indicates whether the element has been moved by dragging at least once.\n     */\n    hasDragged: boolean;\n};\n\nexport type UseDraggableResult<T extends HTMLElement> = {\n    /**\n     * Ref that must be attached to the draggable element container.\n     */\n    draggableRef: MutableRefObject<T | null>;\n\n    /**\n     * Indicates whether a drag interaction is currently active.\n     */\n    isDragging: boolean;\n\n    /**\n     * Current draggable coordinates and drag-state metadata.\n     */\n    position: DraggablePosition;\n\n    /**\n     * Pointer down handler for the dedicated drag handle element.\n     */\n    onDragHandleDown: (event: ReactPointerEvent<HTMLElement>) => void;\n\n    /**\n     * Renders the provided element through the shared portal root in viewport mode.\n     * An optional custom target can be passed for specialized overlay hosts.\n     * In container mode, the element is returned unchanged and this helper is usually not needed.\n     */\n    renderElement: (element: ReactNode, target?: HTMLElement | null) => ReactNode;\n};\n\nexport type UseDraggableElementOptions = {\n    /**\n     * Defines whether drag coordinates are resolved against the viewport or a collision container.\n     * Viewport mode also enables portal rendering via `renderElement`.\n     */\n    positioning?: 'viewport' | 'container';\n\n    /**\n     * Optional initial position for the draggable element.\n     * Use `center` to center the element inside the active positioning context on mount.\n     */\n    initialPosition?: 'center' | Pick<DraggablePosition, 'top' | 'left'>;\n\n    /**\n     * Optional container whose visible client rect is used as the drag boundary in container mode.\n     */\n    collisionContainerRef?: RefObject<HTMLElement | null>;\n};\n\ntype DraggableState = {\n    offsetX: number;\n    offsetY: number;\n    startX: number;\n    startY: number;\n    hasMoved: boolean;\n};\n\nconst MOVEMENT_THRESHOLD_PX = 4;\nconst DRAGGING_CLASS_NAME = 'is-dragging';\n\nconst clampToRange = (value: number, min: number, max: number) => Math.min(max, Math.max(min, value));\n\nconst resolveCollisionContainerRect = (collisionContainerRef?: RefObject<HTMLElement | null>) =>\n    collisionContainerRef?.current?.getBoundingClientRect() ?? null;\n\nconst resolveCenteredPosition = (\n    positioning: UseDraggableElementOptions['positioning'],\n    draggableRect: DOMRect,\n    collisionContainerRect: DOMRect | null\n) => {\n    if (positioning === 'container' && collisionContainerRect) {\n        return {\n            top: clampToRange(\n                (collisionContainerRect.height - draggableRect.height) / 2,\n                0,\n                Math.max(0, collisionContainerRect.height - draggableRect.height)\n            ),\n            left: clampToRange(\n                (collisionContainerRect.width - draggableRect.width) / 2,\n                0,\n                Math.max(0, collisionContainerRect.width - draggableRect.width)\n            ),\n        };\n    }\n\n    return {\n        top: clampToRange(\n            (window.innerHeight - draggableRect.height) / 2,\n            0,\n            Math.max(0, window.innerHeight - draggableRect.height)\n        ),\n        left: clampToRange(\n            (window.innerWidth - draggableRect.width) / 2,\n            0,\n            Math.max(0, window.innerWidth - draggableRect.width)\n        ),\n    };\n};\n\nconst useDraggableElement = <T extends HTMLElement = HTMLDivElement>(\n    options: UseDraggableElementOptions = {}\n): UseDraggableResult<T> => {\n    const { positioning = 'viewport', initialPosition, collisionContainerRef } = options;\n\n    const [isDragging, setIsDragging] = useState(false);\n    const [position, setPosition] = useState<DraggablePosition>({ top: 0, left: 0, hasDragged: false });\n    const [portalRoot, setPortalRoot] = useState<HTMLElement | null>(null);\n\n    const draggableRef = useRef<T | null>(null);\n    const dragStateRef = useRef<DraggableState | null>(null);\n    const portalEnabled = positioning === 'viewport';\n\n    useEffect(() => {\n        if (!portalEnabled) {\n            setPortalRoot(null);\n            return;\n        }\n\n        setPortalRoot(getOrCreatePortalRoot());\n    }, [portalEnabled]);\n\n    const renderElement = useCallback(\n        (element: ReactNode, target?: HTMLElement | null) => {\n            if (!portalEnabled) {\n                return element;\n            }\n\n            const renderTarget = target ?? portalRoot;\n            return renderTarget ? createPortal(element, renderTarget) : null;\n        },\n        [portalEnabled, portalRoot]\n    );\n\n    useLayoutEffect(() => {\n        if (position.hasDragged || !initialPosition) {\n            return;\n        }\n\n        const draggableElement = draggableRef.current;\n        if (!draggableElement) {\n            return;\n        }\n\n        const nextPosition =\n            initialPosition === 'center'\n                ? resolveCenteredPosition(\n                      positioning,\n                      draggableElement.getBoundingClientRect(),\n                      resolveCollisionContainerRect(collisionContainerRef)\n                  )\n                : initialPosition;\n\n        setPosition(currentPosition =>\n            currentPosition.top === nextPosition.top && currentPosition.left === nextPosition.left\n                ? currentPosition\n                : { top: nextPosition.top, left: nextPosition.left, hasDragged: false }\n        );\n    }, [collisionContainerRef, initialPosition, position.hasDragged, positioning]);\n\n    const onDragHandleDown = useCallback((event: ReactPointerEvent<HTMLElement>) => {\n        if (event.button !== 0) {\n            return;\n        }\n\n        event.preventDefault();\n        event.stopPropagation();\n\n        const draggableElement = draggableRef.current;\n        if (!draggableElement) {\n            return;\n        }\n\n        const rect = draggableElement.getBoundingClientRect();\n        dragStateRef.current = {\n            offsetX: event.clientX - rect.left,\n            offsetY: event.clientY - rect.top,\n            startX: event.clientX,\n            startY: event.clientY,\n            hasMoved: false,\n        };\n        setIsDragging(true);\n    }, []);\n\n    useEffect(() => {\n        if (!isDragging) {\n            return;\n        }\n\n        const rootElement = document.documentElement;\n        rootElement.classList.add(DRAGGING_CLASS_NAME);\n\n        const handlePointerMove = (event: PointerEvent) => {\n            const dragState = dragStateRef.current;\n            const draggableElement = draggableRef.current;\n            if (!dragState || !draggableElement) {\n                return;\n            }\n\n            const { clientX, clientY } = event;\n\n            const movedDistance = Math.hypot(clientX - dragState.startX, clientY - dragState.startY);\n            if (!dragState.hasMoved && movedDistance < MOVEMENT_THRESHOLD_PX) {\n                return;\n            }\n\n            if (!dragState.hasMoved) {\n                dragState.hasMoved = true;\n            }\n\n            const rect = draggableElement.getBoundingClientRect();\n            const collisionContainerRect = resolveCollisionContainerRect(collisionContainerRef);\n\n            if (positioning === 'container' && collisionContainerRect) {\n                const nextLeftPos = clampToRange(\n                    clientX - collisionContainerRect.left - dragState.offsetX,\n                    0,\n                    Math.max(0, collisionContainerRect.width - rect.width)\n                );\n\n                const nextTopPos = clampToRange(\n                    clientY - collisionContainerRect.top - dragState.offsetY,\n                    0,\n                    Math.max(0, collisionContainerRect.height - rect.height)\n                );\n\n                setPosition({\n                    top: nextTopPos,\n                    left: nextLeftPos,\n                    hasDragged: true,\n                });\n\n                return;\n            }\n\n            const nextPosition = {\n                left: clampToRange(clientX - dragState.offsetX, 0, Math.max(0, window.innerWidth - rect.width)),\n                top: clampToRange(clientY - dragState.offsetY, 0, Math.max(0, window.innerHeight - rect.height)),\n            };\n\n            setPosition({\n                top: nextPosition.top,\n                left: nextPosition.left,\n                hasDragged: true,\n            });\n        };\n\n        const handlePointerRelease = () => {\n            rootElement.classList.remove(DRAGGING_CLASS_NAME);\n            setIsDragging(false);\n            dragStateRef.current = null;\n        };\n\n        window.addEventListener('pointermove', handlePointerMove);\n        window.addEventListener('pointerup', handlePointerRelease);\n        window.addEventListener('pointercancel', handlePointerRelease);\n\n        return () => {\n            window.removeEventListener('pointermove', handlePointerMove);\n            window.removeEventListener('pointerup', handlePointerRelease);\n            window.removeEventListener('pointercancel', handlePointerRelease);\n            rootElement.classList.remove(DRAGGING_CLASS_NAME);\n        };\n    }, [collisionContainerRef, isDragging, positioning]);\n\n    return { draggableRef, isDragging, position, onDragHandleDown, renderElement };\n};\n\nexport default useDraggableElement;\n"],"mappings":"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"}

package/hooks/useEffectOnce.js

@@ -1,8 +1,9 @@
-import { useEffect as f } from "react";
-const c = (e) => {
-  f(e, []);
+import { useEffect as e } from "react";
+//#region src/hooks/useEffectOnce.ts
+var t = (t) => {
+	e(t, []);
 };
-export {
-  c as default
-};
-//# sourceMappingURL=useEffectOnce.js.map
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=useEffectOnce.js.map

package/hooks/useEffectOnce.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEffectOnce.js","sources":["../../src/hooks/useEffectOnce.ts"],"sourcesContent":["import { useEffect, type EffectCallback } from 'react';\n\nconst useEffectOnce = (callback: EffectCallback) => {\n    useEffect(callback, []);\n};\n\nexport default useEffectOnce;\n"],"names":["useEffectOnce","callback","useEffect"],"mappings":";AAEA,MAAMA,IAAgB,CAACC,MAA6B;AAChD,EAAAC,EAAUD,GAAU,EAAE;AAC1B;"}
+{"version":3,"file":"useEffectOnce.js","names":[],"sources":["../../src/hooks/useEffectOnce.ts"],"sourcesContent":["import { useEffect, type EffectCallback } from 'react';\n\nconst useEffectOnce = (callback: EffectCallback) => {\n    useEffect(callback, []);\n};\n\nexport default useEffectOnce;\n"],"mappings":";;AAEA,IAAM,KAAiB,MAA6B;CAChD,EAAU,GAAU,CAAC,CAAC;AAC1B"}

package/hooks/useElapsedTime.js

@@ -1,11 +1,12 @@
-import { useRef as o, useEffect as r } from "react";
-const u = (e = Date.now()) => {
-  const t = o(e), n = () => Date.now() - t.current;
-  return r(() => {
-    t.current = e;
-  }, [e]), n;
+import { useEffect as e, useRef as t } from "react";
+//#region src/hooks/useElapsedTime.ts
+var n = (n = Date.now()) => {
+	let r = t(n);
+	return e(() => {
+		r.current = n;
+	}, [n]), () => Date.now() - r.current;
 };
-export {
-  u as default
-};
-//# sourceMappingURL=useElapsedTime.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=useElapsedTime.js.map

package/hooks/useElapsedTime.js.map

@@ -1 +1 @@
-{"version":3,"file":"useElapsedTime.js","sources":["../../src/hooks/useElapsedTime.ts"],"sourcesContent":["import { useRef, useEffect } from 'react';\n\n/**\n * Custom React hook to measure the elapsed time since a specified start time or the component's mount time.\n *\n * @param {number} [startTime=Date.now()] - The start time in milliseconds from which to measure the elapsed time.\n * @returns {Function} A function that returns the elapsed time in milliseconds since the specified start time\n * or the component's mount time.\n *\n * @example\n * import useElapsedTime from '@rio-cloud/rio-uikit/useElapsedTime';\n * import Button from '@rio-cloud/rio-uikit/Button';\n *\n * const MyComponent = () => {\n *   const getElapsedTime = useElapsedTime();\n *\n *   const handleClick = () => {\n *     const elapsedTime = getElapsedTime();\n *     console.log(`Elapsed time: ${elapsedTime} ms`);\n *   };\n *\n *   return (\n *       <Button onClick={handleClick}>Get elapsed time</Button>\n *   );\n * };\n */\nconst useElapsedTime = (startTime: number = Date.now()): (() => number) => {\n    const startTimeRef = useRef(startTime);\n\n    const getElapsedTime = () => Date.now() - startTimeRef.current;\n\n    useEffect(() => {\n        startTimeRef.current = startTime;\n    }, [startTime]);\n\n    return getElapsedTime;\n};\n\nexport default useElapsedTime;\n"],"names":["useElapsedTime","startTime","startTimeRef","useRef","getElapsedTime","useEffect"],"mappings":";AA0BA,MAAMA,IAAiB,CAACC,IAAoB,KAAK,UAA0B;AACvE,QAAMC,IAAeC,EAAOF,CAAS,GAE/BG,IAAiB,MAAM,KAAK,IAAA,IAAQF,EAAa;AAEvD,SAAAG,EAAU,MAAM;AACZ,IAAAH,EAAa,UAAUD;AAAA,EAC3B,GAAG,CAACA,CAAS,CAAC,GAEPG;AACX;"}
+{"version":3,"file":"useElapsedTime.js","names":[],"sources":["../../src/hooks/useElapsedTime.ts"],"sourcesContent":["import { useRef, useEffect } from 'react';\n\n/**\n * Custom React hook to measure the elapsed time since a specified start time or the component's mount time.\n *\n * @param {number} [startTime=Date.now()] - The start time in milliseconds from which to measure the elapsed time.\n * @returns {Function} A function that returns the elapsed time in milliseconds since the specified start time\n * or the component's mount time.\n *\n * @example\n * import useElapsedTime from '@rio-cloud/rio-uikit/useElapsedTime';\n * import Button from '@rio-cloud/rio-uikit/Button';\n *\n * const MyComponent = () => {\n *   const getElapsedTime = useElapsedTime();\n *\n *   const handleClick = () => {\n *     const elapsedTime = getElapsedTime();\n *     console.log(`Elapsed time: ${elapsedTime} ms`);\n *   };\n *\n *   return (\n *       <Button onClick={handleClick}>Get elapsed time</Button>\n *   );\n * };\n */\nconst useElapsedTime = (startTime: number = Date.now()): (() => number) => {\n    const startTimeRef = useRef(startTime);\n\n    const getElapsedTime = () => Date.now() - startTimeRef.current;\n\n    useEffect(() => {\n        startTimeRef.current = startTime;\n    }, [startTime]);\n\n    return getElapsedTime;\n};\n\nexport default useElapsedTime;\n"],"mappings":";;AA0BA,IAAM,KAAkB,IAAoB,KAAK,IAAI,MAAsB;CACvE,IAAM,IAAe,EAAO,CAAS;CAQrC,OAJA,QAAgB;EACZ,EAAa,UAAU;CAC3B,GAAG,CAAC,CAAS,CAAC,SAJe,KAAK,IAAI,IAAI,EAAa;AAO3D"}

package/hooks/useElementSize.d.ts

@@ -5,5 +5,5 @@ import { RefObject } from 'react';
  * @param elementRef - Reference to the DOM element whose size is to be tracked.
  * @returns An array containing the width and height of the element.
  */
-declare const useElementSize: (elementRef: RefObject<HTMLElement>) => (number | undefined)[];
+declare const useElementSize: <T extends HTMLElement>(elementRef: RefObject<T | null>) => (number | undefined)[];
 export default useElementSize;

package/hooks/useElementSize.js

@@ -1,17 +1,17 @@
-import { useState as n, useEffect as u } from "react";
-const d = (t) => {
-  const [s, c] = n(), [o, i] = n();
-  return u(() => {
-    const r = new ResizeObserver((h) => {
-      for (const e of h)
-        e.contentRect && (c(e.contentRect.width), i(e.contentRect.height));
-    });
-    return t.current && r.observe(t.current), () => {
-      r.disconnect();
-    };
-  }, [t]), [s, o];
+import { useEffect as e, useState as t } from "react";
+//#region src/hooks/useElementSize.ts
+var n = (n) => {
+	let [r, i] = t(), [a, o] = t();
+	return e(() => {
+		let e = new ResizeObserver((e) => {
+			for (let t of e) t.contentRect && (i(t.contentRect.width), o(t.contentRect.height));
+		});
+		return n.current && e.observe(n.current), () => {
+			e.disconnect();
+		};
+	}, [n]), [r, a];
 };
-export {
-  d as default
-};
-//# sourceMappingURL=useElementSize.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=useElementSize.js.map

package/hooks/useElementSize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useElementSize.js","sources":["../../src/hooks/useElementSize.ts"],"sourcesContent":["import { useEffect, useState, type RefObject } from 'react';\n\n/**\n * Custom hook to track the size of a DOM element.\n *\n * @param elementRef - Reference to the DOM element whose size is to be tracked.\n * @returns An array containing the width and height of the element.\n */\nconst useElementSize = (elementRef: RefObject<HTMLElement>) => {\n    const [width, setWidth] = useState<number | undefined>();\n    const [height, setHeight] = useState<number | undefined>();\n\n    useEffect(() => {\n        const resizeObserver = new ResizeObserver(entries => {\n            for (const entry of entries) {\n                if (entry.contentRect) {\n                    setWidth(entry.contentRect.width);\n                    setHeight(entry.contentRect.height);\n                }\n            }\n        });\n\n        if (elementRef.current) {\n            resizeObserver.observe(elementRef.current);\n        }\n\n        return () => {\n            resizeObserver.disconnect();\n        };\n    }, [elementRef]);\n\n    return [width, height];\n};\n\nexport default useElementSize;\n"],"names":["useElementSize","elementRef","width","setWidth","useState","height","setHeight","useEffect","resizeObserver","entries","entry"],"mappings":";AAQA,MAAMA,IAAiB,CAACC,MAAuC;AAC3D,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAA,GACpB,CAACC,GAAQC,CAAS,IAAIF,EAAA;AAE5B,SAAAG,EAAU,MAAM;AACZ,UAAMC,IAAiB,IAAI,eAAe,CAAAC,MAAW;AACjD,iBAAWC,KAASD;AAChB,QAAIC,EAAM,gBACNP,EAASO,EAAM,YAAY,KAAK,GAChCJ,EAAUI,EAAM,YAAY,MAAM;AAAA,IAG9C,CAAC;AAED,WAAIT,EAAW,WACXO,EAAe,QAAQP,EAAW,OAAO,GAGtC,MAAM;AACT,MAAAO,EAAe,WAAA;AAAA,IACnB;AAAA,EACJ,GAAG,CAACP,CAAU,CAAC,GAER,CAACC,GAAOG,CAAM;AACzB;"}
+{"version":3,"file":"useElementSize.js","names":[],"sources":["../../src/hooks/useElementSize.ts"],"sourcesContent":["import { useEffect, useState, type RefObject } from 'react';\n\n/**\n * Custom hook to track the size of a DOM element.\n *\n * @param elementRef - Reference to the DOM element whose size is to be tracked.\n * @returns An array containing the width and height of the element.\n */\nconst useElementSize = <T extends HTMLElement>(elementRef: RefObject<T | null>) => {\n    const [width, setWidth] = useState<number | undefined>();\n    const [height, setHeight] = useState<number | undefined>();\n\n    useEffect(() => {\n        const resizeObserver = new ResizeObserver(entries => {\n            for (const entry of entries) {\n                if (entry.contentRect) {\n                    setWidth(entry.contentRect.width);\n                    setHeight(entry.contentRect.height);\n                }\n            }\n        });\n\n        if (elementRef.current) {\n            resizeObserver.observe(elementRef.current);\n        }\n\n        return () => {\n            resizeObserver.disconnect();\n        };\n    }, [elementRef]);\n\n    return [width, height];\n};\n\nexport default useElementSize;\n"],"mappings":";;AAQA,IAAM,KAAyC,MAAoC;CAC/E,IAAM,CAAC,GAAO,KAAY,EAA6B,GACjD,CAAC,GAAQ,KAAa,EAA6B;CAqBzD,OAnBA,QAAgB;EACZ,IAAM,IAAiB,IAAI,gBAAe,MAAW;GACjD,KAAK,IAAM,KAAS,GAChB,AAAI,EAAM,gBACN,EAAS,EAAM,YAAY,KAAK,GAChC,EAAU,EAAM,YAAY,MAAM;EAG9C,CAAC;EAMD,OAJI,EAAW,WACX,EAAe,QAAQ,EAAW,OAAO,SAGhC;GACT,EAAe,WAAW;EAC9B;CACJ,GAAG,CAAC,CAAU,CAAC,GAER,CAAC,GAAO,CAAM;AACzB"}

package/hooks/useEsc.js

@@ -1,8 +1,9 @@
-import o from "./useKey.js";
-const c = (e) => {
-  o((s) => s.key === "Escape" && e(s));
+import e from "./useKey.js";
+//#region src/hooks/useEsc.ts
+var t = (t) => {
+	e((e) => e.key === "Escape" && t(e));
 };
-export {
-  c as default
-};
-//# sourceMappingURL=useEsc.js.map
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=useEsc.js.map

package/hooks/useEsc.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEsc.js","sources":["../../src/hooks/useEsc.ts"],"sourcesContent":["import useKey from './useKey';\n\n/**\n * Custom hook to execute a callback when the 'Escape' key is pressed.\n *\n * @param callback - The function to execute when the 'Escape' key is pressed.\n */\nconst useEsc = (callback: (event: KeyboardEvent) => void) => {\n    useKey(event => event.key === 'Escape' && callback(event));\n};\n\nexport default useEsc;\n"],"names":["useEsc","callback","useKey","event"],"mappings":";AAOA,MAAMA,IAAS,CAACC,MAA6C;AACzD,EAAAC,EAAO,OAASC,EAAM,QAAQ,YAAYF,EAASE,CAAK,CAAC;AAC7D;"}
+{"version":3,"file":"useEsc.js","names":[],"sources":["../../src/hooks/useEsc.ts"],"sourcesContent":["import useKey from './useKey';\n\n/**\n * Custom hook to execute a callback when the 'Escape' key is pressed.\n *\n * @param callback - The function to execute when the 'Escape' key is pressed.\n */\nconst useEsc = (callback: (event: KeyboardEvent) => void) => {\n    useKey(event => event.key === 'Escape' && callback(event));\n};\n\nexport default useEsc;\n"],"mappings":";;AAOA,IAAM,KAAU,MAA6C;CACzD,GAAO,MAAS,EAAM,QAAQ,YAAY,EAAS,CAAK,CAAC;AAC7D"}

package/hooks/useEvent.js

@@ -1,13 +1,17 @@
-import { useEffect as f } from "react";
-const u = (n, d, r = !1, e = document) => {
-  f(() => {
-    if (!(!e || !e.addEventListener))
-      return e.addEventListener(n, d, r), () => {
-        e.removeEventListener(n, d, r);
-      };
-  }, [n, r, e]);
+import { useEffect as e } from "react";
+//#region src/hooks/useEvent.ts
+var t = (t, n, r = !1, i = document) => {
+	e(() => {
+		if (!(!i || !i.addEventListener)) return i.addEventListener(t, n, r), () => {
+			i.removeEventListener(t, n, r);
+		};
+	}, [
+		t,
+		r,
+		i
+	]);
 };
-export {
-  u as default
-};
-//# sourceMappingURL=useEvent.js.map
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=useEvent.js.map

package/hooks/useEvent.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEvent.js","sources":["../../src/hooks/useEvent.ts"],"sourcesContent":["import { useEffect } from 'react';\n\ntype WindowEventMapWithFullscreen = {\n    fullscreenchange: Event;\n    webkitfullscreenchange: Event;\n    mozfullscreenchange: Event;\n\n    fullscreenerror: Event;\n    webkitfullscreenerror: Event;\n    mozfullscreenerror: Event;\n};\n\n/**\n * Custom hook to add event listeners to the specified target.\n *\n * @param eventType - The type of event to listen for.\n * @param callback - The function to execute when the event occurs.\n * @param options - Optional. An object that specifies characteristics about the event listener.\n * @param target - Optional. The target element to which to attach the event listener.\n */\nconst useEvent = <\n    K extends keyof WindowEventMap,\n    W extends keyof WindowEventMapWithFullscreen,\n    T extends HTMLElement = HTMLDivElement,\n>(\n    eventType: K | W,\n    callback: EventListener,\n    options: boolean | AddEventListenerOptions = false,\n    target: Document | Window | T | null = document\n) => {\n    useEffect(() => {\n        if (!target || !target.addEventListener) {\n            return;\n        }\n\n        target.addEventListener(eventType, callback, options);\n\n        return () => {\n            target.removeEventListener(eventType, callback, options);\n        };\n    }, [eventType, options, target]);\n};\n\nexport default useEvent;\n"],"names":["useEvent","eventType","callback","options","target","useEffect"],"mappings":";AAoBA,MAAMA,IAAW,CAKbC,GACAC,GACAC,IAA6C,IAC7CC,IAAuC,aACtC;AACD,EAAAC,EAAU,MAAM;AACZ,QAAI,GAACD,KAAU,CAACA,EAAO;AAIvB,aAAAA,EAAO,iBAAiBH,GAAWC,GAAUC,CAAO,GAE7C,MAAM;AACT,QAAAC,EAAO,oBAAoBH,GAAWC,GAAUC,CAAO;AAAA,MAC3D;AAAA,EACJ,GAAG,CAACF,GAAWE,GAASC,CAAM,CAAC;AACnC;"}
+{"version":3,"file":"useEvent.js","names":[],"sources":["../../src/hooks/useEvent.ts"],"sourcesContent":["import { useEffect } from 'react';\n\ntype WindowEventMapWithFullscreen = {\n    fullscreenchange: Event;\n    webkitfullscreenchange: Event;\n    mozfullscreenchange: Event;\n\n    fullscreenerror: Event;\n    webkitfullscreenerror: Event;\n    mozfullscreenerror: Event;\n};\n\n/**\n * Custom hook to add event listeners to the specified target.\n *\n * @param eventType - The type of event to listen for.\n * @param callback - The function to execute when the event occurs.\n * @param options - Optional. An object that specifies characteristics about the event listener.\n * @param target - Optional. The target element to which to attach the event listener.\n */\nconst useEvent = <\n    K extends keyof WindowEventMap,\n    W extends keyof WindowEventMapWithFullscreen,\n    T extends HTMLElement = HTMLDivElement,\n>(\n    eventType: K | W,\n    callback: EventListener,\n    options: boolean | AddEventListenerOptions = false,\n    target: Document | Window | T | null = document\n) => {\n    useEffect(() => {\n        if (!target || !target.addEventListener) {\n            return;\n        }\n\n        target.addEventListener(eventType, callback, options);\n\n        return () => {\n            target.removeEventListener(eventType, callback, options);\n        };\n    }, [eventType, options, target]);\n};\n\nexport default useEvent;\n"],"mappings":";;AAoBA,IAAM,KAKF,GACA,GACA,IAA6C,IAC7C,IAAuC,aACtC;CACD,QAAgB;EACR,OAAC,KAAU,CAAC,EAAO,mBAMvB,OAFA,EAAO,iBAAiB,GAAW,GAAU,CAAO,SAEvC;GACT,EAAO,oBAAoB,GAAW,GAAU,CAAO;EAC3D;CACJ,GAAG;EAAC;EAAW;EAAS;CAAM,CAAC;AACnC"}

package/hooks/useEventListenerCount.js

@@ -1,28 +1,32 @@
-import { useState as v, useEffect as d } from "react";
-import { throttle as l } from "es-toolkit/function";
-const g = () => {
-  const [u, E] = v({}), [c, p] = v(0);
-  return d(() => {
-    console.log("init useEventListener interceptor");
-    const o = /* @__PURE__ */ new Set(), s = EventTarget.prototype.addEventListener, i = EventTarget.prototype.removeEventListener, a = l(() => {
-      const e = Array.from(o).reduce(
-        (t, { type: n }) => (t[n] = (t[n] || 0) + 1, t),
-        {}
-      );
-      E(e), p(o.size);
-    }, 1e3);
-    return EventTarget.prototype.addEventListener = function(e, t, n) {
-      t && (o.add({ type: e, listener: t }), a()), s.call(this, e, t, n);
-    }, EventTarget.prototype.removeEventListener = function(e, t, n) {
-      o.forEach((r) => {
-        r.type === e && r.listener === t && o.delete(r);
-      }), a(), i.call(this, e, t, n);
-    }, () => {
-      EventTarget.prototype.addEventListener = s, EventTarget.prototype.removeEventListener = i;
-    };
-  }, []), { counts: u, total: c };
+import { useEffect as e, useState as t } from "react";
+import { throttle as n } from "es-toolkit/function";
+//#region src/hooks/useEventListenerCount.ts
+var r = () => {
+	let [r, i] = t({}), [a, o] = t(0);
+	return e(() => {
+		console.log("init useEventListener interceptor");
+		let e = /* @__PURE__ */ new Set(), t = EventTarget.prototype.addEventListener, r = EventTarget.prototype.removeEventListener, a = n(() => {
+			let t = Array.from(e).reduce((e, { type: t }) => (e[t] = (e[t] || 0) + 1, e), {});
+			i(t), o(e.size);
+		}, 1e3);
+		return EventTarget.prototype.addEventListener = function(n, r, i) {
+			r && (e.add({
+				type: n,
+				listener: r
+			}), a()), t.call(this, n, r, i);
+		}, EventTarget.prototype.removeEventListener = function(t, n, i) {
+			e.forEach((r) => {
+				r.type === t && r.listener === n && e.delete(r);
+			}), a(), r.call(this, t, n, i);
+		}, () => {
+			EventTarget.prototype.addEventListener = t, EventTarget.prototype.removeEventListener = r;
+		};
+	}, []), {
+		counts: r,
+		total: a
+	};
 };
-export {
-  g as default
-};
-//# sourceMappingURL=useEventListenerCount.js.map
+//#endregion
+export { r as default };
+
+//# sourceMappingURL=useEventListenerCount.js.map

package/hooks/useEventListenerCount.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEventListenerCount.js","sources":["../../src/hooks/useEventListenerCount.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { throttle } from 'es-toolkit/function';\n\nconst useEventListenerCount = () => {\n    const [listenerCounts, setListenerCounts] = useState<Record<string, number>>({});\n    const [totalCount, setTotalCount] = useState(0);\n\n    useEffect(() => {\n        console.log('init useEventListener interceptor');\n\n        const eventListeners = new Set<{ type: string; listener: EventListenerOrEventListenerObject }>();\n\n        const originalAddEventListener = EventTarget.prototype.addEventListener;\n        const originalRemoveEventListener = EventTarget.prototype.removeEventListener;\n\n        const updateListeners = throttle(() => {\n            const counts = Array.from(eventListeners).reduce(\n                (acc, { type }) => {\n                    acc[type] = (acc[type] || 0) + 1;\n                    return acc;\n                },\n                {} as Record<string, number>\n            );\n\n            setListenerCounts(counts);\n            setTotalCount(eventListeners.size);\n        }, 1000);\n\n        EventTarget.prototype.addEventListener = function (type, listener, options) {\n            if (listener) {\n                eventListeners.add({ type, listener });\n                updateListeners();\n            }\n            originalAddEventListener.call(this, type, listener, options);\n        };\n\n        EventTarget.prototype.removeEventListener = function (type, listener, options) {\n            eventListeners.forEach(item => {\n                if (item.type === type && item.listener === listener) {\n                    eventListeners.delete(item);\n                }\n            });\n            updateListeners();\n            originalRemoveEventListener.call(this, type, listener, options);\n        };\n\n        return () => {\n            EventTarget.prototype.addEventListener = originalAddEventListener;\n            EventTarget.prototype.removeEventListener = originalRemoveEventListener;\n        };\n    }, []);\n\n    return { counts: listenerCounts, total: totalCount };\n};\n\nexport default useEventListenerCount;\n"],"names":["useEventListenerCount","listenerCounts","setListenerCounts","useState","totalCount","setTotalCount","useEffect","eventListeners","originalAddEventListener","originalRemoveEventListener","updateListeners","throttle","counts","acc","type","listener","options","item"],"mappings":";;AAGA,MAAMA,IAAwB,MAAM;AAChC,QAAM,CAACC,GAAgBC,CAAiB,IAAIC,EAAiC,CAAA,CAAE,GACzE,CAACC,GAAYC,CAAa,IAAIF,EAAS,CAAC;AAE9C,SAAAG,EAAU,MAAM;AACZ,YAAQ,IAAI,mCAAmC;AAE/C,UAAMC,wBAAqB,IAAA,GAErBC,IAA2B,YAAY,UAAU,kBACjDC,IAA8B,YAAY,UAAU,qBAEpDC,IAAkBC,EAAS,MAAM;AACnC,YAAMC,IAAS,MAAM,KAAKL,CAAc,EAAE;AAAA,QACtC,CAACM,GAAK,EAAE,MAAAC,SACJD,EAAIC,CAAI,KAAKD,EAAIC,CAAI,KAAK,KAAK,GACxBD;AAAA,QAEX,CAAA;AAAA,MAAC;AAGL,MAAAX,EAAkBU,CAAM,GACxBP,EAAcE,EAAe,IAAI;AAAA,IACrC,GAAG,GAAI;AAEP,uBAAY,UAAU,mBAAmB,SAAUO,GAAMC,GAAUC,GAAS;AACxE,MAAID,MACAR,EAAe,IAAI,EAAE,MAAAO,GAAM,UAAAC,EAAA,CAAU,GACrCL,EAAA,IAEJF,EAAyB,KAAK,MAAMM,GAAMC,GAAUC,CAAO;AAAA,IAC/D,GAEA,YAAY,UAAU,sBAAsB,SAAUF,GAAMC,GAAUC,GAAS;AAC3E,MAAAT,EAAe,QAAQ,CAAAU,MAAQ;AAC3B,QAAIA,EAAK,SAASH,KAAQG,EAAK,aAAaF,KACxCR,EAAe,OAAOU,CAAI;AAAA,MAElC,CAAC,GACDP,EAAA,GACAD,EAA4B,KAAK,MAAMK,GAAMC,GAAUC,CAAO;AAAA,IAClE,GAEO,MAAM;AACT,kBAAY,UAAU,mBAAmBR,GACzC,YAAY,UAAU,sBAAsBC;AAAA,IAChD;AAAA,EACJ,GAAG,CAAA,CAAE,GAEE,EAAE,QAAQR,GAAgB,OAAOG,EAAA;AAC5C;"}
+{"version":3,"file":"useEventListenerCount.js","names":[],"sources":["../../src/hooks/useEventListenerCount.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { throttle } from 'es-toolkit/function';\n\nconst useEventListenerCount = () => {\n    const [listenerCounts, setListenerCounts] = useState<Record<string, number>>({});\n    const [totalCount, setTotalCount] = useState(0);\n\n    useEffect(() => {\n        console.log('init useEventListener interceptor');\n\n        const eventListeners = new Set<{ type: string; listener: EventListenerOrEventListenerObject }>();\n\n        const originalAddEventListener = EventTarget.prototype.addEventListener;\n        const originalRemoveEventListener = EventTarget.prototype.removeEventListener;\n\n        const updateListeners = throttle(() => {\n            const counts = Array.from(eventListeners).reduce(\n                (acc, { type }) => {\n                    acc[type] = (acc[type] || 0) + 1;\n                    return acc;\n                },\n                {} as Record<string, number>\n            );\n\n            setListenerCounts(counts);\n            setTotalCount(eventListeners.size);\n        }, 1000);\n\n        EventTarget.prototype.addEventListener = function (type, listener, options) {\n            if (listener) {\n                eventListeners.add({ type, listener });\n                updateListeners();\n            }\n            originalAddEventListener.call(this, type, listener, options);\n        };\n\n        EventTarget.prototype.removeEventListener = function (type, listener, options) {\n            eventListeners.forEach(item => {\n                if (item.type === type && item.listener === listener) {\n                    eventListeners.delete(item);\n                }\n            });\n            updateListeners();\n            originalRemoveEventListener.call(this, type, listener, options);\n        };\n\n        return () => {\n            EventTarget.prototype.addEventListener = originalAddEventListener;\n            EventTarget.prototype.removeEventListener = originalRemoveEventListener;\n        };\n    }, []);\n\n    return { counts: listenerCounts, total: totalCount };\n};\n\nexport default useEventListenerCount;\n"],"mappings":";;;AAGA,IAAM,UAA8B;CAChC,IAAM,CAAC,GAAgB,KAAqB,EAAiC,CAAC,CAAC,GACzE,CAAC,GAAY,KAAiB,EAAS,CAAC;CA+C9C,OA7CA,QAAgB;EACZ,QAAQ,IAAI,mCAAmC;EAE/C,IAAM,oBAAiB,IAAI,IAAoE,GAEzF,IAA2B,YAAY,UAAU,kBACjD,IAA8B,YAAY,UAAU,qBAEpD,IAAkB,QAAe;GACnC,IAAM,IAAS,MAAM,KAAK,CAAc,CAAC,CAAC,QACrC,GAAK,EAAE,eACJ,EAAI,MAAS,EAAI,MAAS,KAAK,GACxB,IAEX,CAAC,CACL;GAGA,AADA,EAAkB,CAAM,GACxB,EAAc,EAAe,IAAI;EACrC,GAAG,GAAI;EAoBP,OAlBA,YAAY,UAAU,mBAAmB,SAAU,GAAM,GAAU,GAAS;GAKxE,AAJI,MACA,EAAe,IAAI;IAAE;IAAM;GAAS,CAAC,GACrC,EAAgB,IAEpB,EAAyB,KAAK,MAAM,GAAM,GAAU,CAAO;EAC/D,GAEA,YAAY,UAAU,sBAAsB,SAAU,GAAM,GAAU,GAAS;GAO3E,AANA,EAAe,SAAQ,MAAQ;IAC3B,AAAI,EAAK,SAAS,KAAQ,EAAK,aAAa,KACxC,EAAe,OAAO,CAAI;GAElC,CAAC,GACD,EAAgB,GAChB,EAA4B,KAAK,MAAM,GAAM,GAAU,CAAO;EAClE,SAEa;GAET,AADA,YAAY,UAAU,mBAAmB,GACzC,YAAY,UAAU,sBAAsB;EAChD;CACJ,GAAG,CAAC,CAAC,GAEE;EAAE,QAAQ;EAAgB,OAAO;CAAW;AACvD"}