@kiwicom/orbit-components/lib/utils/mediaQuery/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.getBreakpointWidth = void 0;

var _styledComponents = require("styled-components");

var _consts = require("./consts");

const TOKEN = {
  mediumMobile: "widthBreakpointMediumMobile",
  largeMobile: "widthBreakpointLargeMobile",
  tablet: "widthBreakpointTablet",
  desktop: "widthBreakpointDesktop",
  largeDesktop: "widthBreakpointLargeDesktop"
};

const getBreakpointWidth = (name, theme, pure) => {
  // $FlowFixMe not sure how to solve this aspect of overloading functions 🤷‍♂️
  return pure ? theme.orbit[TOKEN[name]] : `(min-width: ${theme.orbit[TOKEN[name]]}px)`;
}; // https://davidwalsh.name/flow-object-values


exports.getBreakpointWidth = getBreakpointWidth;
const devices = [...Object.values(_consts.QUERIES)];
const mediaQueries = devices.reduce((acc, device) => {
  acc[device] = style => (0, _styledComponents.css)(["@media ", "{", ";}"], ({
    theme
  }) => getBreakpointWidth(device, theme), style);

  return acc;
}, {});
var _default = mediaQueries;
exports.default = _default;