@yakad/ui 1.3.163 → 1.3.165

package/dist/interactionHooks/useOnHoverChange.js

@@ -1,23 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-export function useOnHoverChange(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const handleMouseEnter = useCallback((e) => {
-        window.matchMedia("(pointer: fine)").matches && callback(e, true);
-    }, [callback]);
-    const handleMouseLeave = useCallback((e) => {
-        window.matchMedia("(pointer: fine)").matches && callback(e, false);
-    }, [callback]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        element.addEventListener("mouseenter", handleMouseEnter);
-        element.addEventListener("mouseleave", handleMouseLeave);
-        return () => {
-            element.removeEventListener("mouseenter", handleMouseEnter);
-            element.removeEventListener("mouseleave", handleMouseLeave);
-        };
-    }, [handleMouseEnter, handleMouseLeave, targetRef]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnOutsideClick.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnOutsideClick<T extends HTMLElement = HTMLElement>(callback: (e: MouseEvent) => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnOutsideClick.js

@@ -1,21 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-export function useOnOutsideClick(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const handleClick = useCallback((e) => {
-        e.preventDefault();
-        const element = targetRef.current;
-        if (!element)
-            return;
-        if (!element.contains(e.target)) {
-            callback(e);
-        }
-    }, [callback, targetRef]);
-    useEffect(() => {
-        document.addEventListener("click", handleClick);
-        return () => {
-            document.removeEventListener("click", handleClick);
-        };
-    }, [handleClick]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnPinch.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnPinch<T extends HTMLElement = HTMLElement>(callback: (e: TouchEvent, action: "in" | "out") => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnPinch.js

@@ -1,35 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from "react";
-export function useOnPinch(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const [startDistance, setStartDistance] = useState(0);
-    const getDistance = (t1, t2) => Math.hypot(t2.clientX - t1.clientX, t2.clientY - t1.clientY);
-    const handleStart = useCallback((e) => {
-        if (e.touches.length === 2) {
-            const [t1, t2] = e.touches;
-            setStartDistance(getDistance(t1, t2));
-        }
-    }, []);
-    const handleMove = useCallback((e) => {
-        if (e.touches.length === 2) {
-            const [t1, t2] = e.touches;
-            const dist = getDistance(t1, t2);
-            if (dist < startDistance - 20)
-                callback(e, "in");
-            if (dist > startDistance + 20)
-                callback(e, "out");
-        }
-    }, [callback, startDistance]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        element.addEventListener("touchstart", handleStart);
-        element.addEventListener("touchmove", handleMove);
-        return () => {
-            element.removeEventListener("touchstart", handleStart);
-            element.removeEventListener("touchmove", handleMove);
-        };
-    }, [handleMove, handleStart, targetRef]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnResizeChange.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnResizeChange<T extends HTMLElement = HTMLElement>(callback: (e: ResizeObserverEntry) => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnResizeChange.js

@@ -1,23 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-export function useOnResizeChange(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const handleResize = useCallback((e) => {
-        callback(e);
-    }, [callback]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        const resizeObserver = new ResizeObserver((entries) => {
-            for (const entry of entries) {
-                handleResize(entry);
-            }
-        });
-        resizeObserver.observe(element);
-        return () => {
-            resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
-        };
-    }, [handleResize, targetRef]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnRightClick.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnRightClick<T extends HTMLElement = HTMLElement>(callback: (e: MouseEvent) => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnRightClick.js

@@ -1,19 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-export function useOnRightClick(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const handleContextMenu = useCallback((e) => {
-        e.preventDefault();
-        callback(e);
-    }, [callback]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        element.addEventListener("contextmenu", handleContextMenu);
-        return () => {
-            element.removeEventListener("contextmenu", handleContextMenu);
-        };
-    }, [handleContextMenu, targetRef]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnRotate.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnRotate<T extends HTMLElement = HTMLElement>(callback: (e: TouchEvent, deltaAngle: number) => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnRotate.js

@@ -1,36 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from "react";
-export function useOnRotate(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const [startAngle, setStartAngle] = useState(0);
-    const getAngle = (t1, t2) => Math.atan2(t2.clientY - t1.clientY, t2.clientX - t1.clientX) *
-        (180 / Math.PI);
-    const handleStart = useCallback((e) => {
-        if (e.touches.length === 2) {
-            const [t1, t2] = e.touches;
-            setStartAngle(getAngle(t1, t2));
-        }
-    }, []);
-    const handleMove = useCallback((e) => {
-        if (e.touches.length === 2) {
-            const [t1, t2] = e.touches;
-            const angle = getAngle(t1, t2);
-            const deltaAngle = angle - startAngle;
-            if (Math.abs(deltaAngle) > 15) {
-                callback(e, deltaAngle);
-            }
-        }
-    }, [callback, startAngle]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        element.addEventListener("touchstart", handleStart);
-        element.addEventListener("touchmove", handleMove);
-        return () => {
-            element.removeEventListener("touchstart", handleStart);
-            element.removeEventListener("touchmove", handleMove);
-        };
-    }, [handleMove, handleStart, targetRef]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnScroll.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnScroll<T extends HTMLElement = HTMLElement>(callback: (scrolling: boolean) => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnScroll.js

@@ -1,29 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-export function useOnScroll(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const scrollTimeoutRef = useRef(undefined);
-    const scrollingRef = useRef(false);
-    const handleScroll = useCallback(() => {
-        if (!scrollingRef.current) {
-            scrollingRef.current = true;
-            callback(true);
-        }
-        clearTimeout(scrollTimeoutRef.current);
-        scrollTimeoutRef.current = setTimeout(() => {
-            scrollingRef.current = false;
-            callback(false);
-        }, 150);
-    }, [callback]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        element.addEventListener("scroll", handleScroll);
-        return () => {
-            element.removeEventListener("scroll", handleScroll);
-            clearTimeout(scrollTimeoutRef.current);
-        };
-    }, [handleScroll, targetRef]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnSwipe.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnSwipe<T extends HTMLElement = HTMLElement>(callback: (e: TouchEvent, direction: "left" | "right" | "up" | "down") => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnSwipe.js

@@ -1,53 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from "react";
-export function useOnSwipe(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const [swipeCoordinates, setSwipeCoordinates] = useState({
-        startX: 0,
-        startY: 0,
-        endX: 0,
-        endY: 0,
-    });
-    const touchStart = useCallback((e) => {
-        const t = e.touches[0];
-        setSwipeCoordinates(prev => (Object.assign(Object.assign({}, prev), { startX: t.clientX, startY: t.clientY, endX: t.clientX, endY: t.clientY })));
-    }, []);
-    const touchMove = useCallback((e) => {
-        const t = e.touches[0];
-        setSwipeCoordinates(prev => (Object.assign(Object.assign({}, prev), { endX: t.clientX, endY: t.clientY })));
-    }, []);
-    const touchEnd = useCallback((e) => {
-        // Could do unpacking of object but its not necessary
-        const dx = swipeCoordinates.endX - swipeCoordinates.startX;
-        const dy = swipeCoordinates.endY - swipeCoordinates.startY;
-        const absDx = Math.abs(dx);
-        const absDy = Math.abs(dy);
-        const threshold = 30;
-        if (absDx > absDy) {
-            if (dx > threshold)
-                callback(e, "right");
-            if (dx < -threshold)
-                callback(e, "left");
-        }
-        else {
-            if (dy > threshold)
-                callback(e, "down");
-            if (dy < -threshold)
-                callback(e, "up");
-        }
-    }, [callback, swipeCoordinates.endX, swipeCoordinates.startX, swipeCoordinates.endY, swipeCoordinates.startY]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        element.addEventListener("touchstart", touchStart, { passive: true });
-        element.addEventListener("touchmove", touchMove, { passive: true });
-        element.addEventListener("touchend", touchEnd, { passive: true });
-        return () => {
-            element.removeEventListener("touchstart", touchStart);
-            element.removeEventListener("touchmove", touchMove);
-            element.removeEventListener("touchend", touchEnd);
-        };
-    }, [touchStart, touchMove, touchEnd, targetRef]);
-    return targetRef;
-}

package/dist/interactionHooks/useOnVisibilityChange.d.ts

@@ -1,2 +0,0 @@
-import { RefObject } from "react";
-export declare function useOnVisibilityChange<T extends HTMLElement = HTMLElement>(callback: (visible: boolean) => void, ref?: RefObject<T | null> | undefined): RefObject<T | null>;

package/dist/interactionHooks/useOnVisibilityChange.js

@@ -1,21 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-export function useOnVisibilityChange(callback, ref) {
-    const defaultRef = useRef(null);
-    const targetRef = ref !== null && ref !== void 0 ? ref : defaultRef;
-    const handleVisibility = useCallback((visible) => {
-        callback(visible);
-    }, [callback]);
-    useEffect(() => {
-        const element = targetRef.current;
-        if (!element)
-            return;
-        const intersectionObserver = new IntersectionObserver((entries) => {
-            entries[0].isIntersecting ? handleVisibility(true) : handleVisibility(false);
-        });
-        intersectionObserver.observe(element);
-        return () => {
-            intersectionObserver === null || intersectionObserver === void 0 ? void 0 : intersectionObserver.disconnect();
-        };
-    }, [handleVisibility, targetRef]);
-    return targetRef;
-}