@nodeject/ui-components
Version:
UI library for non-trivial components
46 lines (45 loc) • 2.68 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useMediaQueries = void 0;
var react_responsive_1 = require("react-responsive");
var widths = {
bigScreen: 1824,
laptopMaxWidth: 1280,
mobileLandscape: 480,
tabletMaxWidth: 1024,
tabletMinWidthLandscape: 992,
tabletMinWidthPortrait: 768,
};
var useMediaQueries = function () {
var isDesktop = react_responsive_1.useMediaQuery({ query: "(min-width: " + (widths.tabletMaxWidth + 1) + "px)" });
var isLaptop = react_responsive_1.useMediaQuery({ query: "(min-width: " + (widths.tabletMaxWidth + 1) + "px) and (max-width: " + widths.laptopMaxWidth + "px)" });
var isTabletLandscapeAtLeast = react_responsive_1.useMediaQuery({ query: "(min-width: " + widths.tabletMinWidthLandscape + "px)" });
var isTabletLandscape = react_responsive_1.useMediaQuery({ query: "(min-width: " + widths.tabletMinWidthLandscape + "px) and (max-width: " + widths.tabletMaxWidth + "px)" });
var isTabletPortrait = react_responsive_1.useMediaQuery({ query: "(min-width: " + widths.tabletMinWidthPortrait + "px) and (max-width: " + widths.tabletMaxWidth + "px)" });
var isMobileLandscape = react_responsive_1.useMediaQuery({ query: "(min-width: " + (widths.mobileLandscape + 1) + "px) and (max-width: " + (widths.tabletMinWidthPortrait - 1) + "px)" });
var isMobilePortrait = react_responsive_1.useMediaQuery({ query: "(max-width: " + widths.mobileLandscape + "px)" });
var isDesktopOrLaptop = isDesktop && isLaptop;
var isTablet = isTabletPortrait || isTabletLandscape;
var isMobile = isMobilePortrait || isMobileLandscape;
var isBigScreen = react_responsive_1.useMediaQuery({ query: "(min-device-width: " + widths.bigScreen + "px)" });
var isLandscape = react_responsive_1.useMediaQuery({ query: "(orientation: landscape)" });
var isPortrait = react_responsive_1.useMediaQuery({ query: "(orientation: portrait)" });
var isRetina = react_responsive_1.useMediaQuery({ query: "(min-resolution: 2dppx)" });
return {
isBigScreen: isBigScreen,
isDesktop: isDesktop,
isDesktopOrLaptop: isDesktopOrLaptop,
isLandscape: isLandscape,
isLaptop: isLaptop,
isMobile: isMobile,
isMobileLandscape: isMobileLandscape,
isMobilePortrait: isMobilePortrait,
isPortrait: isPortrait,
isRetina: isRetina,
isTablet: isTablet,
isTabletLandscape: isTabletLandscape,
isTabletLandscapeAtLeast: isTabletLandscapeAtLeast,
isTabletPortrait: isTabletPortrait
};
};
exports.useMediaQueries = useMediaQueries;