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

The React UI library from HeyCar

Object.defineProperty(exports, '__esModule', { value: true });

var tslib_es6 = require('../tslib.es6-dc6abeaa.js');
var React = require('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 = React.useState(0), width = _a[0], setWidth = _a[1];
    var _b = React.useState(tslib_es6.__assign(tslib_es6.__assign({}, RESETTED_BREAKPOINTS), { isMobile: true })), breakpoints = _b[0], setBreakpoints = _b[1];
    React.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(tslib_es6.__assign(tslib_es6.__assign({}, RESETTED_BREAKPOINTS), { isDesktop: true, isDesktopS: true }));
                }
                if (window.innerWidth >= BREAKPOINTS['breakpoint-desktop-m'] &&
                    window.innerWidth < BREAKPOINTS['breakpoint-desktop-l']) {
                    setBreakpoints(tslib_es6.__assign(tslib_es6.__assign({}, RESETTED_BREAKPOINTS), { isDesktop: true, isDesktopM: true }));
                }
                if (window.innerWidth >= BREAKPOINTS['breakpoint-desktop-l']) {
                    setBreakpoints(tslib_es6.__assign(tslib_es6.__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(tslib_es6.__assign(tslib_es6.__assign({}, RESETTED_BREAKPOINTS), { isTablet: true, isTabletS: true }));
                }
                if (window.innerWidth >= BREAKPOINTS['breakpoint-tablet-l']) {
                    setBreakpoints(tslib_es6.__assign(tslib_es6.__assign({}, RESETTED_BREAKPOINTS), { isTablet: true, isTabletL: true }));
                }
            }
            // Mobile
            if (window.innerWidth < BREAKPOINTS['breakpoint-mobile']) {
                setBreakpoints(tslib_es6.__assign(tslib_es6.__assign({}, RESETTED_BREAKPOINTS), { isMobile: true }));
            }
        };
        updateBreakpoint();
        window.addEventListener('resize', updateBreakpoint);
        return function () { return window.removeEventListener('resize', updateBreakpoint); };
    }, []);
    return { breakpoints: breakpoints, width: width };
}

exports.RESETTED_BREAKPOINTS = RESETTED_BREAKPOINTS;
exports["default"] = useBreakpoint;