curls/dist/cjs/Breakpoint.js

💪 Responsive, expressive UI primitives for React written with Style Hooks and Emotion

'use strict'

exports.__esModule = true
exports.Breakpoint = exports.useBreakpoint = void 0

var _core = require('@style-hooks/core')

var _trieMemoize = _interopRequireDefault(require('trie-memoize'))

var _createRenderProp = _interopRequireDefault(require('./createRenderProp'))

var _useMediaQuery = _interopRequireDefault(require('./useMediaQuery'))

var _utils = require('./utils')

function _interopRequireDefault(obj) {
  return obj && obj.__esModule ? obj : {default: obj}
}

function _extends() {
  _extends =
    Object.assign ||
    function(target) {
      for (var i = 1; i < arguments.length; i++) {
        var source = arguments[i]
        for (var key in source) {
          if (Object.prototype.hasOwnProperty.call(source, key)) {
            target[key] = source[key]
          }
        }
      }
      return target
    }
  return _extends.apply(this, arguments)
}

const getSizes = (props, theme) => {
  let sizes = [],
    keys = (0, _utils.getBreakpointOrder)(theme.breakpoints),
    i = 0

  for (; i < keys.length; i++) {
    const key = keys[i]
    if (props[key] === true) sizes.push(key)
  }

  return sizes
}

const bpCache = new WeakMap()

const memoizedFindBreakpoints = (breakpoints, sizes) => {
  let pairs = bpCache.get(breakpoints),
    sizeKey = sizes.join(',')

  if (pairs !== void 0) {
    let pairKeys = Object.keys(pairs),
      i = 0

    for (; i < pairKeys.length; i++)
      if (sizeKey === pairKeys[i]) return pairs[pairKeys[i]]
  } else {
    pairs = {}
    bpCache.set(breakpoints, pairs)
  }

  const bps = [] // eslint-disable-next-line no-unused-vars

  for (let size in breakpoints)
    if (sizes.indexOf(size) > -1) bps.push(breakpoints[size])

  const value = [sizes, bps]
  pairs[sizeKey] = value
  return value
} // This is about enforcing immutability, not micro-optimizing

const findBreakpoints = (props, theme) =>
  memoizedFindBreakpoints(theme.breakpoints, getSizes(props, theme)) // This is about enforcing immutability, not micro-optimizing

const getMatches = (0, _trieMemoize.default)(
  [WeakMap, WeakMap],
  (sizes, rawMatches) => {
    let matches = {},
      i = 0

    for (; i < rawMatches.length; i++) matches[sizes[i]] = rawMatches[i]

    return matches
  }
)

function _ref() {
  return false
}

const getDefaultMatches = (theme, sizes, defaultMatches) => {
  function _ref2(size) {
    return defaultMatches.indexOf(size) > -1
  }

  if (defaultMatches === void 0) {
    return sizes.map(_ref)
  } else {
    if (typeof defaultMatches === 'function')
      defaultMatches = defaultMatches(theme)
    return sizes.map(_ref2)
  }
}

const useBreakpoint = props => {
    const theme = (0, _core.useTheme)(),
      [sizes, queries] = findBreakpoints(props, theme),
      defaultMatches = getDefaultMatches(theme, sizes, props.defaultMatches),
      state = (0, _useMediaQuery.default)(queries, defaultMatches)

    const out = _extends({}, state)

    out.matches = getMatches(sizes, state.matches)
    return out
  },
  Breakpoint = (0, _createRenderProp.default)(useBreakpoint)

exports.Breakpoint = Breakpoint
exports.useBreakpoint = useBreakpoint
if (process.env.NODE_ENV !== 'production') Breakpoint.displayName = 'Breakpoint'