Completely updated React, fixed #11, (hopefully)

goTorrentWebUI/node_modules/material-ui/es/styles/createBreakpoints.js

@@ -1,18 +1,16 @@
-var _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; };
-
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
-
+import _extends from 'babel-runtime/helpers/extends';
+import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
 // Sorted ASC by size. That's important.
 // It can't be configured as it's used statically for propTypes.
 export const keys = ['xs', 'sm', 'md', 'lg', 'xl'];
 
 // Keep in mind that @media is inclusive by the CSS specification.
-
-
 export default function createBreakpoints(breakpoints) {
   const {
+    // The breakpoint **start** at this value.
+    // For instance with the first breakpoint xs: [xs, sm[.
     values = {
-      xs: 360,
+      xs: 0,
       sm: 600,
       md: 960,
       lg: 1280,
@@ -24,32 +22,34 @@ export default function createBreakpoints(breakpoints) {
         other = _objectWithoutProperties(breakpoints, ['values', 'unit', 'step']);
 
   function up(key) {
-    let value;
-    // min-width of xs starts at 0
-    if (key === 'xs') {
-      value = 0;
-    } else {
-      value = values[key] || key;
-    }
+    const value = typeof values[key] === 'number' ? values[key] : key;
     return `@media (min-width:${value}${unit})`;
   }
 
   function down(key) {
-    const value = values[key] || key;
+    const endIndex = keys.indexOf(key) + 1;
+    const upperbound = values[keys[endIndex]];
+
+    if (endIndex === keys.length) {
+      // xl down applies to all sizes
+      return up('xs');
+    }
+
+    const value = typeof upperbound === 'number' && endIndex > 0 ? upperbound : key;
     return `@media (max-width:${value - step / 100}${unit})`;
   }
 
   function between(start, end) {
-    const startIndex = keys.indexOf(start);
-    const endIndex = keys.indexOf(end);
-    return `@media (min-width:${values[keys[startIndex]]}${unit}) and ` + `(max-width:${values[keys[endIndex + 1]] - step / 100}${unit})`;
+    const endIndex = keys.indexOf(end) + 1;
+
+    if (endIndex === keys.length) {
+      return up(start);
+    }
+
+    return `@media (min-width:${values[start]}${unit}) and ` + `(max-width:${values[keys[endIndex]] - step / 100}${unit})`;
   }
 
   function only(key) {
-    const keyIndex = keys.indexOf(key);
-    if (keyIndex === keys.length - 1) {
-      return up(key);
-    }
     return between(key, key);
   }