"use strict";
/**
 * useLayoutOptimization hook
 *
 * Custom hook to apply performance optimizations to layout components
 */
Object.defineProperty(exports, "__esModule", { value: true });
exports.useLayoutOptimization = useLayoutOptimization;
const react_1 = require("react");
const useMediaQuery_js_1 = require("./useMediaQuery.js");
/**
 * Hook for optimizing layout performance
 * @param {Object} options - Configuration options
 * @param {boolean} options.virtualize - Whether to virtualize large lists
 * @param {boolean} options.lazyLoad - Whether to lazy load components
 * @param {boolean} options.disableAnimations - Whether to disable animations on low-end devices
 * @param {boolean} options.reduceMotion - Whether to respect reduce motion preferences
 * @returns {Object} Optimization utilities and configuration
 *
 * @example
 * const {
 *   shouldVirtualize,
 *   shouldLazyLoad,
 *   areAnimationsEnabled,
 *   isVisible,
 *   elementRef
 * } = useLayoutOptimization();
 *
 * // Use with an intersection observer for lazy loading
 * <div ref={elementRef}>
 *   {isVisible && <HeavyComponent />}
 * </div>
 */
function useLayoutOptimization({ virtualize = true, lazyLoad = true, disableAnimations = true, reduceMotion = true } = {}) {
    // Check if user prefers reduced motion
    const prefersReducedMotion = (0, useMediaQuery_js_1.useMediaQuery)('(prefers-reduced-motion: reduce)');
    // Check if device is low-end
    const [isLowEndDevice, setIsLowEndDevice] = (0, react_1.useState)(false);
    // State for intersection observer (lazy loading)
    const [isVisible, setIsVisible] = (0, react_1.useState)(false);
    const elementRef = (0, react_1.useRef)(null);
    // Detect low-end devices
    (0, react_1.useEffect)(() => {
        if (typeof window !== 'undefined') {
            // Check for device memory API
            const memory = navigator.deviceMemory;
            const cpuCores = navigator.hardwareConcurrency;
            // Heuristic for low-end device: < 4GB RAM or < 4 CPU cores
            if ((memory !== undefined && memory < 4) || (cpuCores !== undefined && cpuCores < 4)) {
                setIsLowEndDevice(true);
            }
        }
    }, []);
    // Setup intersection observer for lazy loading
    (0, react_1.useEffect)(() => {
        if (!lazyLoad || !elementRef.current)
            return undefined;
        const observer = new IntersectionObserver(([entry]) => {
            setIsVisible(entry.isIntersecting);
        }, { rootMargin: '100px' });
        observer.observe(elementRef.current);
        return () => {
            if (elementRef.current) {
                observer.unobserve(elementRef.current);
            }
        };
    }, [lazyLoad, elementRef]);
    // Determine if animations should be enabled
    const areAnimationsEnabled = !((disableAnimations && isLowEndDevice) ||
        (reduceMotion && prefersReducedMotion));
    // Function to optimize list rendering
    const optimizeListRendering = (0, react_1.useCallback)((items, threshold = 100) => {
        if (!virtualize || !isLowEndDevice || items.length < threshold) {
            return items;
        }
        // Simple windowing - return visible items only
        // In a real implementation, this would be more sophisticated
        return items.slice(0, threshold);
    }, [virtualize, isLowEndDevice]);
    return {
        shouldVirtualize: virtualize && isLowEndDevice,
        shouldLazyLoad: lazyLoad,
        areAnimationsEnabled,
        isLowEndDevice,
        prefersReducedMotion,
        isVisible,
        elementRef,
        optimizeListRendering
    };
}
exports.default = useLayoutOptimization;
//# sourceMappingURL=useLayoutOptimization.js.map