styled-breakpoints - npm Package Compare versions

Comparing version 0.0.1-alpha.15 to 0.0.1-alpha.16

dist/styled-breakpoints.common.js

@@ -146,3 +146,3 @@ 'use strict';
     return function () {
-      return styledComponents.css(_templateObject2, _getNextBreakValue(breakpointValue, breakpoints), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject2, toEm(_getNextBreakValue(breakpointValue, breakpoints)), styledComponents.css.apply(undefined, arguments));
     };
@@ -153,3 +153,3 @@ };
     return function () {
-      return styledComponents.css(_templateObject3, _getBreakValue(breakpointValue, breakpoints), _getNextBreakValue(breakpointValue, breakpoints), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject3, toEm(_getBreakValue(breakpointValue, breakpoints)), toEm(_getNextBreakValue(breakpointValue, breakpoints)), styledComponents.css.apply(undefined, arguments));
     };
@@ -160,3 +160,3 @@ };
     return function () {
-      return styledComponents.css(_templateObject3, _getBreakValue(firstBreakpoint, breakpoints), _getNextBreakValue(secondBreakpoint, breakpoints), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject3, toEm(_getBreakValue(firstBreakpoint, breakpoints)), toEm(_getNextBreakValue(secondBreakpoint, breakpoints)), styledComponents.css.apply(undefined, arguments));
     };
@@ -163,0 +163,0 @@ };

dist/styled-breakpoints.es.js

@@ -142,3 +142,3 @@ import { css } from 'styled-components';
     return function () {
-      return css(_templateObject2, _getNextBreakValue(breakpointValue, breakpoints), css.apply(undefined, arguments));
+      return css(_templateObject2, toEm(_getNextBreakValue(breakpointValue, breakpoints)), css.apply(undefined, arguments));
     };
@@ -149,3 +149,3 @@ };
     return function () {
-      return css(_templateObject3, _getBreakValue(breakpointValue, breakpoints), _getNextBreakValue(breakpointValue, breakpoints), css.apply(undefined, arguments));
+      return css(_templateObject3, toEm(_getBreakValue(breakpointValue, breakpoints)), toEm(_getNextBreakValue(breakpointValue, breakpoints)), css.apply(undefined, arguments));
     };
@@ -156,3 +156,3 @@ };
     return function () {
-      return css(_templateObject3, _getBreakValue(firstBreakpoint, breakpoints), _getNextBreakValue(secondBreakpoint, breakpoints), css.apply(undefined, arguments));
+      return css(_templateObject3, toEm(_getBreakValue(firstBreakpoint, breakpoints)), toEm(_getNextBreakValue(secondBreakpoint, breakpoints)), css.apply(undefined, arguments));
     };
@@ -159,0 +159,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=r(["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "]),o=r(["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "]),a=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=function(n){return parseFloat(n)/16+"em"},d={mobile:"576px",tablet:"768px",desktop:"992px",lgDesktop:"1200px"},c=function(n,e){var t=Object.keys(e),r=t[t.length-2],i=t.indexOf(n);try{if(i<t.length-1)return t[""+(i+1)];throw new Error('"styled-breakpoints: '+n+'" is incorrect value. Use '+r+".")}catch(n){console.warn(n)}},u=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null;try{var r=c(n,e);if(e[n])t=parseFloat(e[r])-.02+"px";else{if(!parseInt(n,10))throw new Error("styled-breakpoints: "+n+" no valid breakpoint or size specified for media.");t=""+(Number(n)-.02)}}catch(n){console.warn(n)}return t},l=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null;try{if(e[n])t=e[n];else{if(!parseInt(n,10))throw new Error("styled-breakpoints: No valid breakpoint or size specified for media.");t=n}}catch(n){console.warn(n)}return t},f=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:d;return{below:function(t){return function(){return e.css(o,u(t,n),e.css.apply(void 0,arguments))}},above:function(t){return function(){return e.css(i,s(l(t,n)),e.css.apply(void 0,arguments))}},only:function(t){return function(){return e.css(a,l(t,n),u(t,n),e.css.apply(void 0,arguments))}},between:function(t,r){return function(){return e.css(a,l(t,n),u(r,n),e.css.apply(void 0,arguments))}}}},p=f();n.toRem=function(n){return t(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,"rem")},n.defaultBreakpoints=d,n._getBreakValue=l,n.generateMedia=f,n.default=p,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=r(["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (min-width: ",") {\n      ",";\n    }\n  "]),o=r(["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "],["\n    @media screen and (max-width: ",") {\n      ",";\n    }\n  "]),a=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=function(n){return parseFloat(n)/16+"em"},d={mobile:"576px",tablet:"768px",desktop:"992px",lgDesktop:"1200px"},c=function(n,e){var t=Object.keys(e),r=t[t.length-2],i=t.indexOf(n);try{if(i<t.length-1)return t[""+(i+1)];throw new Error('"styled-breakpoints: '+n+'" is incorrect value. Use '+r+".")}catch(n){console.warn(n)}},u=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null;try{var r=c(n,e);if(e[n])t=parseFloat(e[r])-.02+"px";else{if(!parseInt(n,10))throw new Error("styled-breakpoints: "+n+" no valid breakpoint or size specified for media.");t=""+(Number(n)-.02)}}catch(n){console.warn(n)}return t},l=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null;try{if(e[n])t=e[n];else{if(!parseInt(n,10))throw new Error("styled-breakpoints: No valid breakpoint or size specified for media.");t=n}}catch(n){console.warn(n)}return t},f=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:d;return{below:function(t){return function(){return e.css(o,s(u(t,n)),e.css.apply(void 0,arguments))}},above:function(t){return function(){return e.css(i,s(l(t,n)),e.css.apply(void 0,arguments))}},only:function(t){return function(){return e.css(a,s(l(t,n)),s(u(t,n)),e.css.apply(void 0,arguments))}},between:function(t,r){return function(){return e.css(a,s(l(t,n)),s(u(r,n)),e.css.apply(void 0,arguments))}}}},p=f();n.toRem=function(n){return t(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:16,"rem")},n.defaultBreakpoints=d,n._getBreakValue=l,n.generateMedia=f,n.default=p,Object.defineProperty(n,"__esModule",{value:!0})});
 //# sourceMappingURL=styled-breakpoints.umd.js.map

package.json

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

src/index.js

@@ -94,5 +94,4 @@ import { css } from 'styled-components';
   const below = breakpointValue => (...args) => css`
-    @media screen and (max-width: ${_getNextBreakValue(
-        breakpointValue,
-        breakpoints,
+    @media screen and (max-width: ${toEm(
+        _getNextBreakValue(breakpointValue, breakpoints),
       )}) {
@@ -104,6 +103,7 @@ ${css(...args)};
   const only = breakpointValue => (...args) => css`
-    @media screen and (min-width: ${_getBreakValue(
-        breakpointValue,
-        breakpoints,
-      )}) and (max-width: ${_getNextBreakValue(breakpointValue, breakpoints)}) {
+    @media screen and (min-width: ${toEm(
+        _getBreakValue(breakpointValue, breakpoints),
+      )}) and (max-width: ${toEm(
+        _getNextBreakValue(breakpointValue, breakpoints),
+      )}) {
       ${css(...args)};
@@ -114,8 +114,6 @@ }
   const between = (firstBreakpoint, secondBreakpoint) => (...args) => css`
-    @media screen and (min-width: ${_getBreakValue(
-        firstBreakpoint,
-        breakpoints,
-      )}) and (max-width: ${_getNextBreakValue(
-        secondBreakpoint,
-        breakpoints,
+    @media screen and (min-width: ${toEm(
+        _getBreakValue(firstBreakpoint, breakpoints),
+      )}) and (max-width: ${toEm(
+        _getNextBreakValue(secondBreakpoint, breakpoints),
       )}) {
@@ -122,0 +120,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

Improved metrics

Total package byte prevSize

45574

increased by0.67%

Worsened metrics

Lines of code

452

decreased by-0.44%

No dependency changes