styled-breakpoints - npm Package Compare versions

Comparing version 0.0.1-alpha.3 to 0.0.1-alpha.4

dist/styled-breakpoints.common.js

@@ -59,3 +59,3 @@ 'use strict';
 var _templateObject2 = _taggedTemplateLiteralLoose(['\n    @media screen and (max-width: ', ') {\n      ', ';\n    }\n  '], ['\n    @media screen and (max-width: ', ') {\n      ', ';\n    }\n  ']);
-var _templateObject3 = _taggedTemplateLiteralLoose(['\n      @media screen and (max-width: ', ') and (min-width: ', ') {\n        ', ';\n      }\n    '], ['\n      @media screen and (max-width: ', ') and (min-width: ', ') {\n        ', ';\n      }\n    ']);
+var _templateObject3 = _taggedTemplateLiteralLoose(['\n      @media screen and (min-width: ', ') and (max-width: ', ') {\n        ', ';\n      }\n    '], ['\n      @media screen and (min-width: ', ') and (max-width: ', ') {\n        ', ';\n      }\n    ']);
 var _templateObject4 = _taggedTemplateLiteralLoose(['\n          @media (max-width: ', ') {\n            ', ';\n          }\n        '], ['\n          @media (max-width: ', ') {\n            ', ';\n          }\n        ']);
@@ -140,9 +140,4 @@ var _templateObject5 = _taggedTemplateLiteralLoose(['\n          @media (min-width: ', ') {\n            ', ';\n          }\n        '], ['\n          @media (min-width: ', ') {\n            ', ';\n          }\n        ']);
   var between = function between(firstBreakpoint, secondBreakpoint) {
-    var namesOfBreakpoins = Object.keys(breakpoints);
-    var currentPosition = namesOfBreakpoins.indexOf('' + secondBreakpoint);
-    var nextBreak = currentPosition < namesOfBreakpoins.length - 1 ? currentPosition + 1 : currentPosition;
-    var upperBreakName = namesOfBreakpoins['' + nextBreak];
-
     return function () {
-      return styledComponents.css(_templateObject3, _getSizeFromUpperBreakpoint(upperBreakName, breakpoints), _getSizeFromBreakpoint(firstBreakpoint, breakpoints), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject3, _getSizeFromBreakpoint(firstBreakpoint, breakpoints), _getSizeFromUpperBreakpoint(secondBreakpoint, breakpoints), styledComponents.css.apply(undefined, arguments));
     };
@@ -149,0 +144,0 @@ };

dist/styled-breakpoints.es.js

@@ -55,3 +55,3 @@ import { css } from 'styled-components';
 var _templateObject2 = _taggedTemplateLiteralLoose(['\n    @media screen and (max-width: ', ') {\n      ', ';\n    }\n  '], ['\n    @media screen and (max-width: ', ') {\n      ', ';\n    }\n  ']);
-var _templateObject3 = _taggedTemplateLiteralLoose(['\n      @media screen and (max-width: ', ') and (min-width: ', ') {\n        ', ';\n      }\n    '], ['\n      @media screen and (max-width: ', ') and (min-width: ', ') {\n        ', ';\n      }\n    ']);
+var _templateObject3 = _taggedTemplateLiteralLoose(['\n      @media screen and (min-width: ', ') and (max-width: ', ') {\n        ', ';\n      }\n    '], ['\n      @media screen and (min-width: ', ') and (max-width: ', ') {\n        ', ';\n      }\n    ']);
 var _templateObject4 = _taggedTemplateLiteralLoose(['\n          @media (max-width: ', ') {\n            ', ';\n          }\n        '], ['\n          @media (max-width: ', ') {\n            ', ';\n          }\n        ']);
@@ -136,9 +136,4 @@ var _templateObject5 = _taggedTemplateLiteralLoose(['\n          @media (min-width: ', ') {\n            ', ';\n          }\n        '], ['\n          @media (min-width: ', ') {\n            ', ';\n          }\n        ']);
   var between = function between(firstBreakpoint, secondBreakpoint) {
-    var namesOfBreakpoins = Object.keys(breakpoints);
-    var currentPosition = namesOfBreakpoins.indexOf('' + secondBreakpoint);
-    var nextBreak = currentPosition < namesOfBreakpoins.length - 1 ? currentPosition + 1 : currentPosition;
-    var upperBreakName = namesOfBreakpoins['' + nextBreak];
-
     return function () {
-      return css(_templateObject3, _getSizeFromUpperBreakpoint(upperBreakName, breakpoints), _getSizeFromBreakpoint(firstBreakpoint, breakpoints), css.apply(undefined, arguments));
+      return css(_templateObject3, _getSizeFromBreakpoint(firstBreakpoint, breakpoints), _getSizeFromUpperBreakpoint(secondBreakpoint, breakpoints), css.apply(undefined, arguments));
     };
@@ -145,0 +140,0 @@ };

dist/styled-breakpoints.umd.js

@@ -1,2 +0,2 @@
-!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("styled-components")):"function"==typeof define&&define.amd?define(["exports","styled-components"],e):e(n["styled-breakpoints"]={},n.styledComponents)}(this,function(n,e){"use strict";function t(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,t=arguments[2],r={};for(var i in n){var o=n[i];String(o).includes("px")?r[i]=+parseInt(o,10)/e+t:r[i]=o}return r}function r(n,e){return n.raw=e,n}var i=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},o=r(["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "]),a=r(["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "]),d=r(["\n      @media screen and (max-width: ",") and (min-width: ",") {\n        ",";\n      }\n    "],["\n      @media screen and (max-width: ",") and (min-width: ",") {\n        ",";\n      }\n    "]),s=r(["\n          @media (max-width: ",") {\n            ",";\n          }\n        "],["\n          @media (max-width: ",") {\n            ",";\n          }\n        "]),c=r(["\n          @media (min-width: ",") {\n            ",";\n          }\n        "],["\n          @media (min-width: ",") {\n            ",";\n          }\n        "]),l={mobile:"576px",tablet:"768px",desktop:"992px",lgDesktop:"1200px"},u=function(n,e){var t=Object.keys(e),r=t.indexOf(n);return t[""+(r<t.length-1?r+1:r)]},p=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null,r=u(n,e);return e[n]?t=parseFloat(e[r])-.02+"px":parseInt(n,10)?t=""+(Number(n)-.02):(console.error("styled-breakpoints: No valid breakpoint or size specified for media."),t="0"),t},f=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null;return e[n]?t=e[n]:parseInt(n,10)?t=n:(console.error("styled-breakpoints: No valid breakpoint or size specified for media."),t="0"),t},m=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:l,t=Object.keys(n).reduce(function(t,r){var i=n[r];return t.to[r]=function(){return console.warn("styled-breakpoints: Use media.below('"+r+"') instead of old media.to."+r+" (Probably we'll deprecate it)"),e.css(s,i,e.css.apply(void 0,arguments))},t.from[r]=function(){return console.warn("styled-breakpoints: Use media.above('"+r+"') instead of old media.from."+r+" (Probably we'll deprecate it)"),e.css(c,i,e.css.apply(void 0,arguments))},t},{to:{},from:{}});return i({},t,{below:function(t){return function(){return e.css(a,f(t,n),e.css.apply(void 0,arguments))}},above:function(t){return function(){return e.css(o,f(t,n),e.css.apply(void 0,arguments))}},between:function(t,r){var i=Object.keys(n),o=i.indexOf(""+r),a=i[""+(o<i.length-1?o+1:o)];return function(){return e.css(d,p(a,n),f(t,n),e.css.apply(void 0,arguments))}}})},v=m();n.toEm=function(n){return t(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,"em")},n.toRem=function(n){return t(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,"rem")},n.defaultBreakpoints=l,n._getSizeFromBreakpoint=f,n.generateMedia=m,n.default=v,Object.defineProperty(n,"__esModule",{value:!0})});
+!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("styled-components")):"function"==typeof define&&define.amd?define(["exports","styled-components"],e):e(n["styled-breakpoints"]={},n.styledComponents)}(this,function(n,e){"use strict";function t(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,t=arguments[2],r={};for(var i in n){var o=n[i];String(o).includes("px")?r[i]=+parseInt(o,10)/e+t:r[i]=o}return r}function r(n,e){return n.raw=e,n}var i=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},o=r(["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "]),a=r(["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "]),d=r(["\n      @media screen and (min-width: ",") and (max-width: ",") {\n        ",";\n      }\n    "],["\n      @media screen and (min-width: ",") and (max-width: ",") {\n        ",";\n      }\n    "]),s=r(["\n          @media (max-width: ",") {\n            ",";\n          }\n        "],["\n          @media (max-width: ",") {\n            ",";\n          }\n        "]),c=r(["\n          @media (min-width: ",") {\n            ",";\n          }\n        "],["\n          @media (min-width: ",") {\n            ",";\n          }\n        "]),l={mobile:"576px",tablet:"768px",desktop:"992px",lgDesktop:"1200px"},u=function(n,e){var t=Object.keys(e),r=t.indexOf(n);return t[""+(r<t.length-1?r+1:r)]},p=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null,r=u(n,e);return e[n]?t=parseFloat(e[r])-.02+"px":parseInt(n,10)?t=""+(Number(n)-.02):(console.error("styled-breakpoints: No valid breakpoint or size specified for media."),t="0"),t},f=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null;return e[n]?t=e[n]:parseInt(n,10)?t=n:(console.error("styled-breakpoints: No valid breakpoint or size specified for media."),t="0"),t},m=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:l,t=Object.keys(n).reduce(function(t,r){var i=n[r];return t.to[r]=function(){return console.warn("styled-breakpoints: Use media.below('"+r+"') instead of old media.to."+r+" (Probably we'll deprecate it)"),e.css(s,i,e.css.apply(void 0,arguments))},t.from[r]=function(){return console.warn("styled-breakpoints: Use media.above('"+r+"') instead of old media.from."+r+" (Probably we'll deprecate it)"),e.css(c,i,e.css.apply(void 0,arguments))},t},{to:{},from:{}});return i({},t,{below:function(t){return function(){return e.css(a,f(t,n),e.css.apply(void 0,arguments))}},above:function(t){return function(){return e.css(o,f(t,n),e.css.apply(void 0,arguments))}},between:function(t,r){return function(){return e.css(d,f(t,n),p(r,n),e.css.apply(void 0,arguments))}}})},v=m();n.toEm=function(n){return t(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,"em")},n.toRem=function(n){return t(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,"rem")},n.defaultBreakpoints=l,n._getSizeFromBreakpoint=f,n.generateMedia=m,n.default=v,Object.defineProperty(n,"__esModule",{value:!0})});
 //# sourceMappingURL=styled-breakpoints.umd.js.map

package.json

 {
   "name": "styled-breakpoints",
-  "version": "0.0.1-alpha.3",
+  "version": "0.0.1-alpha.4",
   "description": "",
@@ -5,0 +5,0 @@ "main": "dist/styled-breakpoints.common.js",

src/index.js

@@ -87,17 +87,9 @@ import { css } from 'styled-components';
   const between = (firstBreakpoint, secondBreakpoint) => {
-    const namesOfBreakpoins = Object.keys(breakpoints);
-    const currentPosition = namesOfBreakpoins.indexOf(`${secondBreakpoint}`);
-    const nextBreak =
-      currentPosition < namesOfBreakpoins.length - 1
-        ? currentPosition + 1
-        : currentPosition;
-    const upperBreakName = namesOfBreakpoins[`${nextBreak}`];
-
     return (...args) => css`
-      @media screen and (max-width: ${_getSizeFromUpperBreakpoint(
-          upperBreakName,
-          breakpoints,
-        )}) and (min-width: ${_getSizeFromBreakpoint(
+      @media screen and (min-width: ${_getSizeFromBreakpoint(
           firstBreakpoint,
           breakpoints,
+        )}) and (max-width: ${_getSizeFromUpperBreakpoint(
+          secondBreakpoint,
+          breakpoints,
         )}) {
@@ -104,0 +96,0 @@ ${css(...args)};

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

48706

decreased by-4.95%

Lines of code

459

decreased by-3.16%

No dependency changes