@heycar-uikit/core/pagination/esm/hooks/useBreakpoint.hook.js

The React UI library from HeyCar

import { a as __assign } from '../tslib.es6-56356891.js';
import { useState, useEffect } from 'react';

var BREAKPOINTS = {
    'breakpoint-mobile': 767,
    'breakpoint-tablet': 768,
    'breakpoint-tablet-s': 768,
    'breakpoint-tablet-l': 1024,
    'breakpoint-desktop': 1280,
    'breakpoint-desktop-s': 1280,
    'breakpoint-desktop-m': 1366,
    'breakpoint-desktop-l': 1440,
};

var RESETTED_BREAKPOINTS = {
    isMobile: false,
    isTablet: false,
    isDesktop: false,
    isTabletS: false,
    isTabletL: false,
    isDesktopS: false,
    isDesktopM: false,
    isDesktopL: false,
};
function useBreakpoint() {
    var _a = useState(0), width = _a[0], setWidth = _a[1];
    var _b = useState(__assign(__assign({}, RESETTED_BREAKPOINTS), { isMobile: true })), breakpoints = _b[0], setBreakpoints = _b[1];
    useEffect(function () {
        var updateBreakpoint = function () {
            setWidth(window.innerWidth);
            // Desktop
            if (window.innerWidth >= BREAKPOINTS['breakpoint-desktop']) {
                if (window.innerWidth >= BREAKPOINTS['breakpoint-desktop-s'] &&
                    window.innerWidth < BREAKPOINTS['breakpoint-desktop-m']) {
                    setBreakpoints(__assign(__assign({}, RESETTED_BREAKPOINTS), { isDesktop: true, isDesktopS: true }));
                }
                if (window.innerWidth >= BREAKPOINTS['breakpoint-desktop-m'] &&
                    window.innerWidth < BREAKPOINTS['breakpoint-desktop-l']) {
                    setBreakpoints(__assign(__assign({}, RESETTED_BREAKPOINTS), { isDesktop: true, isDesktopM: true }));
                }
                if (window.innerWidth >= BREAKPOINTS['breakpoint-desktop-l']) {
                    setBreakpoints(__assign(__assign({}, RESETTED_BREAKPOINTS), { isDesktop: true, isDesktopL: true }));
                }
            }
            // Tablet
            if (window.innerWidth >= BREAKPOINTS['breakpoint-tablet'] &&
                window.innerWidth < BREAKPOINTS['breakpoint-desktop']) {
                if (window.innerWidth >= BREAKPOINTS['breakpoint-tablet-s'] &&
                    window.innerWidth < BREAKPOINTS['breakpoint-tablet-l']) {
                    setBreakpoints(__assign(__assign({}, RESETTED_BREAKPOINTS), { isTablet: true, isTabletS: true }));
                }
                if (window.innerWidth >= BREAKPOINTS['breakpoint-tablet-l']) {
                    setBreakpoints(__assign(__assign({}, RESETTED_BREAKPOINTS), { isTablet: true, isTabletL: true }));
                }
            }
            // Mobile
            if (window.innerWidth < BREAKPOINTS['breakpoint-mobile']) {
                setBreakpoints(__assign(__assign({}, RESETTED_BREAKPOINTS), { isMobile: true }));
            }
        };
        updateBreakpoint();
        window.addEventListener('resize', updateBreakpoint);
        return function () { return window.removeEventListener('resize', updateBreakpoint); };
    }, []);
    return { breakpoints: breakpoints, width: width };
}

export { RESETTED_BREAKPOINTS, useBreakpoint as default };