@findify/mjs/lib/decorators/watchIsMobile.js

Findify widgets

"use strict";

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

var _throttle2 = require("lodash/throttle");

var _throttle3 = _interopRequireDefault(_throttle2);

var _withState2 = require("recompose/withState");

var _withState3 = _interopRequireDefault(_withState2);

var _lifecycle2 = require("recompose/lifecycle");

var _lifecycle3 = _interopRequireDefault(_lifecycle2);

var _compose2 = require("recompose/compose");

var _compose3 = _interopRequireDefault(_compose2);

var _windowEventListener = require("../helpers/windowEventListener");

var _windowEventListener2 = _interopRequireDefault(_windowEventListener);

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

var events = ['resize'];
/**
 *  Listen for window resize and compare it to mobileBreakpoint from config
 */

exports.default = function (config) {
  var checkIsMobile = function checkIsMobile() {
    return config.isMobile !== void 0 ? config.isMobile : window.innerWidth <= config.mobileBreakpoint;
  };

  var handler = function handler(getProps) {
    return (0, _throttle3.default)(function () {
      var isMobile = checkIsMobile();
      var props = getProps();
      if (isMobile === props.isMobile) return;
      return props.setIsMobile(isMobile);
    }, 500);
  };

  return (0, _compose3.default)((0, _withState3.default)('isMobile', 'setIsMobile', checkIsMobile()), (0, _lifecycle3.default)({
    componentWillMount: function componentWillMount() {
      var _this = this;

      this.handler = handler(function () {
        return _this.props;
      });

      _windowEventListener2.default.on(events, this.handler);
    },
    componentWillUnmount: function componentWillUnmount() {
      _windowEventListener2.default.off(events, this.handler);
    }
  }));
};