Merge branch 'release/2.1.0'

Author: wimpyprogrammer

.babelrc

@@ -1,11 +1,10 @@
 {
-  "plugins": ["transform-object-rest-spread"],
-  "presets": ["es2015", "react"],
+  "presets": ["@babel/preset-env", "@babel/preset-react"],
 
   "env": {
     "test": {
       "plugins": [
-        ["istanbul", { "exclude": ["**/*.spec.js"] }]
+        ["istanbul", { "exclude": ["**/*.spec.js", "src/helpers/throttle.js"] }]
       ]
     }
   }

.browserslistrc

@@ -0,0 +1,3 @@
+last 1 version
+not dead
+> 0.2%

.npmrc

@@ -0,0 +1 @@
+package-lock=false

.publishrc

@@ -1,6 +1,6 @@
 {
   "validations": {
-    "vulnerableDependencies": true,
+    "vulnerableDependencies": false,
     "uncommittedChanges": true,
     "untrackedFiles": true,
     "sensitiveData": true,

karma-ci.conf.js

@@ -1,4 +1,4 @@
 /* eslint import/no-extraneous-dependencies: ["error", {"devDependencies": true}] */
-require('babel-register');
+require('@babel/register');
 
 module.exports = require('./karma-ci.conf.babel').default;

karma-common.conf.js

@@ -29,6 +29,7 @@ module.exports = (
 			resolve: {
 				alias: {
 					'react/addons': `${__dirname}/node_modules/react/dist/react-with-addons.js`,
+					sinon$: `${__dirname}/node_modules/sinon/lib/sinon.js`,
 				},
 			},
 
@@ -38,7 +39,6 @@ module.exports = (
 						test: /\.js$/,
 						include: [
 							`${__dirname}/src/`,
-							`${__dirname}/node_modules/sinon/`,
 						],
 						use: {
 							loader: 'babel-loader',

karma-local.conf.js

@@ -1,4 +1,4 @@
 /* eslint import/no-extraneous-dependencies: ["error", {"devDependencies": true}] */
-require('babel-register');
+require('@babel/register');
 
 module.exports = require('./karma-local.conf.babel').default;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-responsive-breakpoints",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "A higher-order React component to translate CSS breakpoints into properties",
   "main": "lib/index.js",
   "files": [
@@ -30,51 +30,45 @@
     "url": "https://github.com/wimpyprogrammer/react-responsive-breakpoints/issues"
   },
   "homepage": "https://github.com/wimpyprogrammer/react-responsive-breakpoints#readme",
-  "dependencies": {
-    "lodash.noop": "^3.0.1",
-    "lodash.reduce": "^4.6.0",
-    "lodash.throttle": "^4.1.1"
-  },
   "devDependencies": {
+    "@babel/cli": "^7.2.3",
+    "@babel/core": "^7.2.2",
+    "@babel/preset-env": "^7.2.0",
+    "@babel/preset-react": "^7.0.0",
+    "@babel/register": "^7.0.0",
     "airbnb-js-shims": "^2.1.0",
-    "babel-cli": "^6.26.0",
-    "babel-core": "^6.0.0",
-    "babel-loader": "^7.1.2",
+    "babel-loader": "^8.0.4",
     "babel-plugin-istanbul": "^4.1.5",
-    "babel-plugin-transform-object-rest-spread": "^6.26.0",
-    "babel-preset-es2015": "^6.24.1",
-    "babel-preset-react": "^6.24.1",
-    "babel-register": "^6.26.0",
     "chai": "^4.1.2",
     "codecov": "^3.0.1",
     "cross-env": "^5.0.5",
     "dirty-chai": "^2.0.1",
-    "enzyme": "^3.5.0",
-    "enzyme-adapter-react-16": "^1.3.0",
-    "enzyme-adapter-react-helper": "^1.3.0",
+    "enzyme": "^3.8.0",
+    "enzyme-adapter-react-16": "^1.7.1",
+    "enzyme-adapter-react-helper": "^1.3.1",
     "eslint": "^5.3.0",
     "eslint-config-airbnb": "^17.1.0",
     "eslint-plugin-import": "^2.14.0",
     "eslint-plugin-jsx-a11y": "^6.1.1",
     "eslint-plugin-react": "^7.11.1",
-    "karma": "^3.0.0",
+    "karma": "^3.1.4",
     "karma-coverage": "^1.1.1",
     "karma-mocha": "^1.3.0",
     "karma-mocha-reporter": "^2.2.4",
     "karma-sauce-launcher": "^1.2.0",
     "karma-viewport": "^1.0.0",
-    "karma-webpack": "^3.0.0",
+    "karma-webpack": "^3.0.5",
     "lodash.merge": "^4.6.0",
     "lodash.once": "^4.1.1",
     "mocha": "^5.0.0",
-    "publish-please": "^3.2.0",
+    "publish-please": "^5.4.3",
     "react": "*",
     "react-dom": "*",
     "react-test-renderer": "*",
     "rimraf": "^2.6.2",
     "sinon": "^6.0.1",
     "sinon-chai": "^3.2.0",
-    "webpack": "^4.16.5"
+    "webpack": "^4.27.1"
   },
   "peerDependencies": {
     "react": "*"

src/helpers/throttle.js

@@ -0,0 +1,101 @@
+// A stripped-down version of lodash throttle from
+// https://github.com/lodash/lodash/blob/0843bd4/lodash.js#L10898-L10914
+
+export default function throttle(func, wait) {
+	let lastArgs;
+	let lastThis;
+	let result;
+	let timerId;
+	let lastCallTime;
+
+	function invokeFunc() {
+		const args = lastArgs;
+		const thisArg = lastThis;
+
+		lastArgs = undefined;
+		lastThis = undefined;
+		result = func.apply(thisArg, args);
+		return result;
+	}
+
+	function trailingEdge() {
+		timerId = undefined;
+
+		// Only invoke if we have `lastArgs` which means `func` has been
+		// debounced at least once.
+		if (lastArgs) {
+			return invokeFunc();
+		}
+		lastArgs = undefined;
+		lastThis = undefined;
+		return result;
+	}
+
+	function shouldInvoke(time) {
+		const timeSinceLastCall = time - lastCallTime;
+
+		// Either this is the first call, activity has stopped and we're at the
+		// trailing edge, the system time has gone backwards and we're treating
+		// it as the trailing edge, or we've hit the `maxWait` limit.
+		return (lastCallTime === undefined
+			|| (timeSinceLastCall >= wait)
+			|| (timeSinceLastCall < 0));
+	}
+
+	function remainingWait(time) {
+		const timeSinceLastCall = time - lastCallTime;
+		const timeWaiting = wait - timeSinceLastCall;
+
+		return timeWaiting;
+	}
+
+	// eslint-disable-next-line consistent-return
+	function timerExpired() {
+		const time = Date.now();
+		if (shouldInvoke(time)) {
+			return trailingEdge();
+		}
+		// Restart the timer.
+		timerId = setTimeout(timerExpired, remainingWait(time));
+	}
+
+	function leadingEdge() {
+		// Reset any `maxWait` timer.
+		// Start the timer for the trailing edge.
+		timerId = setTimeout(timerExpired, wait);
+		// Invoke the leading edge.
+		return invokeFunc();
+	}
+
+	function cancel() {
+		if (timerId !== undefined) {
+			clearTimeout(timerId);
+		}
+		lastArgs = undefined;
+		lastCallTime = undefined;
+		lastThis = undefined;
+		timerId = undefined;
+	}
+
+	function debounced() {
+		const time = Date.now();
+		const isInvoking = shouldInvoke(time);
+
+		// eslint-disable-next-line prefer-rest-params
+		lastArgs = arguments;
+		lastThis = this;
+		lastCallTime = time;
+
+		if (isInvoking) {
+			if (timerId === undefined) {
+				return leadingEdge();
+			}
+		}
+		if (timerId === undefined) {
+			timerId = setTimeout(timerExpired, wait);
+		}
+		return result;
+	}
+	debounced.cancel = cancel;
+	return debounced;
+}

src/withBreakpointsCustom.js

@@ -1,16 +1,18 @@
 /* eslint-env browser */
 import React, { Component } from 'react';
-import noop from 'lodash.noop';
-import reduce from 'lodash.reduce';
-import throttle from 'lodash.throttle';
+import throttle from './helpers/throttle';
+
+function noop() {}
 
 function isVisible(markerEl) {
 	return !!markerEl && window.getComputedStyle(markerEl).display !== 'none';
 }
 
 export default (options, InnerComponent) => {
 	function calculateBreakpoints() {
-		return reduce(options.breakpoints, (breakpoints, { prop, selector }) => {
+		const breakpointConfig = options.breakpoints || [];
+
+		return breakpointConfig.reduce((breakpoints, { prop, selector }) => {
 			const markerEl = document.querySelector(selector);
 			return { ...breakpoints, [prop]: isVisible(markerEl) };
 		}, {});