styled-breakpoints - npm Package Compare versions

Comparing version 0.0.1-alpha.12 to 0.0.1-alpha.13

dist/styled-breakpoints.common.js

@@ -38,3 +38,7 @@ 'use strict';
  */
+function toEm(breakpoints) {
+  var ratio = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 16;
 
+  return toEmOrRem(breakpoints, ratio, 'em');
+}
 
@@ -58,7 +62,2 @@ /**
 
-var BROWSER_DEFAULT_FONT_SIZE = 16;
-var toEm = function toEm(inPx) {
-  return parseFloat(inPx) / BROWSER_DEFAULT_FONT_SIZE + 'em';
-};
-
 /**
@@ -142,3 +141,3 @@ * Default media breakpoints
     return function () {
-      return styledComponents.css(_templateObject, toEm(_getBreakValue(breakpointValue, breakpoints)), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject, _getBreakValue(breakpointValue, breakpoints), styledComponents.css.apply(undefined, arguments));
     };
@@ -149,3 +148,3 @@ };
     return function () {
-      return styledComponents.css(_templateObject2, toEm(_getNextBreakValue(breakpointValue, breakpoints)), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject2, _getNextBreakValue(breakpointValue, breakpoints), styledComponents.css.apply(undefined, arguments));
     };
@@ -156,3 +155,3 @@ };
     return function () {
-      return styledComponents.css(_templateObject3, toEm(_getBreakValue(breakpointValue, breakpoints)), toEm(_getNextBreakValue(breakpointValue, breakpoints)), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject3, _getBreakValue(breakpointValue, breakpoints), _getNextBreakValue(breakpointValue, breakpoints), styledComponents.css.apply(undefined, arguments));
     };
@@ -163,3 +162,3 @@ };
     return function () {
-      return styledComponents.css(_templateObject3, toEm(_getBreakValue(firstBreakpoint, breakpoints)), toEm(_getNextBreakValue(secondBreakpoint, breakpoints)), styledComponents.css.apply(undefined, arguments));
+      return styledComponents.css(_templateObject3, _getBreakValue(firstBreakpoint, breakpoints), _getNextBreakValue(secondBreakpoint, breakpoints), styledComponents.css.apply(undefined, arguments));
     };
@@ -182,2 +181,3 @@ };
 
+exports.toEm = toEm;
 exports.toRem = toRem;
@@ -184,0 +184,0 @@ exports.defaultBreakpoints = defaultBreakpoints;

dist/styled-breakpoints.es.js

@@ -34,3 +34,7 @@ import { css } from 'styled-components';
  */
+function toEm(breakpoints) {
+  var ratio = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 16;
 
+  return toEmOrRem(breakpoints, ratio, 'em');
+}
 
@@ -54,7 +58,2 @@ /**
 
-var BROWSER_DEFAULT_FONT_SIZE = 16;
-var toEm = function toEm(inPx) {
-  return parseFloat(inPx) / BROWSER_DEFAULT_FONT_SIZE + 'em';
-};
-
 /**
@@ -138,3 +137,3 @@ * Default media breakpoints
     return function () {
-      return css(_templateObject, toEm(_getBreakValue(breakpointValue, breakpoints)), css.apply(undefined, arguments));
+      return css(_templateObject, _getBreakValue(breakpointValue, breakpoints), css.apply(undefined, arguments));
     };
@@ -145,3 +144,3 @@ };
     return function () {
-      return css(_templateObject2, toEm(_getNextBreakValue(breakpointValue, breakpoints)), css.apply(undefined, arguments));
+      return css(_templateObject2, _getNextBreakValue(breakpointValue, breakpoints), css.apply(undefined, arguments));
     };
@@ -152,3 +151,3 @@ };
     return function () {
-      return css(_templateObject3, toEm(_getBreakValue(breakpointValue, breakpoints)), toEm(_getNextBreakValue(breakpointValue, breakpoints)), css.apply(undefined, arguments));
+      return css(_templateObject3, _getBreakValue(breakpointValue, breakpoints), _getNextBreakValue(breakpointValue, breakpoints), css.apply(undefined, arguments));
     };
@@ -159,3 +158,3 @@ };
     return function () {
-      return css(_templateObject3, toEm(_getBreakValue(firstBreakpoint, breakpoints)), toEm(_getNextBreakValue(secondBreakpoint, breakpoints)), css.apply(undefined, arguments));
+      return css(_templateObject3, _getBreakValue(firstBreakpoint, breakpoints), _getNextBreakValue(secondBreakpoint, breakpoints), css.apply(undefined, arguments));
     };
@@ -178,3 +177,3 @@ };
 
-export { toRem, defaultBreakpoints, _getBreakValue, generateMedia };export default index;
+export { toEm, toRem, defaultBreakpoints, _getBreakValue, generateMedia };export default index;
 //# sourceMappingURL=styled-breakpoints.es.js.map

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,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})});
+!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={mobile:"576px",tablet:"768px",desktop:"992px",lgDesktop:"1200px"},d=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)}},c=function(n){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},t=null;try{var r=d(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},u=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},l=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:s;return{below:function(t){return function(){return e.css(o,c(t,n),e.css.apply(void 0,arguments))}},above:function(t){return function(){return e.css(i,u(t,n),e.css.apply(void 0,arguments))}},only:function(t){return function(){return e.css(a,u(t,n),c(t,n),e.css.apply(void 0,arguments))}},between:function(t,r){return function(){return e.css(a,u(t,n),c(r,n),e.css.apply(void 0,arguments))}}}},f=l();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=s,n._getBreakValue=u,n.generateMedia=l,n.default=f,Object.defineProperty(n,"__esModule",{value:!0})});
 //# sourceMappingURL=styled-breakpoints.umd.js.map

package.json

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

src/index.js

 import { css } from 'styled-components';
-import { toRem } from './convertors';
+import { toEm, toRem } from './convertors';
 
-export { toRem };
+export { toEm, toRem };
 
-const BROWSER_DEFAULT_FONT_SIZE = 16;
-const toEm = inPx => `${parseFloat(inPx) / BROWSER_DEFAULT_FONT_SIZE}em`;
-
 /**
@@ -86,4 +83,5 @@ * Default media breakpoints
   const above = breakpointValue => (...args) => css`
-    @media screen and (min-width: ${toEm(
-        _getBreakValue(breakpointValue, breakpoints),
+    @media screen and (min-width: ${_getBreakValue(
+        breakpointValue,
+        breakpoints,
       )}) {
@@ -95,4 +93,5 @@ ${css(...args)};
   const below = breakpointValue => (...args) => css`
-    @media screen and (max-width: ${toEm(
-        _getNextBreakValue(breakpointValue, breakpoints),
+    @media screen and (max-width: ${_getNextBreakValue(
+        breakpointValue,
+        breakpoints,
       )}) {
@@ -104,7 +103,6 @@ ${css(...args)};
   const only = breakpointValue => (...args) => css`
-    @media screen and (min-width: ${toEm(
-        _getBreakValue(breakpointValue, breakpoints),
-      )}) and (max-width: ${toEm(
-        _getNextBreakValue(breakpointValue, breakpoints),
-      )}) {
+    @media screen and (min-width: ${_getBreakValue(
+        breakpointValue,
+        breakpoints,
+      )}) and (max-width: ${_getNextBreakValue(breakpointValue, breakpoints)}) {
       ${css(...args)};
@@ -115,6 +113,8 @@ }
   const between = (firstBreakpoint, secondBreakpoint) => (...args) => css`
-    @media screen and (min-width: ${toEm(
-        _getBreakValue(firstBreakpoint, breakpoints),
-      )}) and (max-width: ${toEm(
-        _getNextBreakValue(secondBreakpoint, breakpoints),
+    @media screen and (min-width: ${_getBreakValue(
+        firstBreakpoint,
+        breakpoints,
+      )}) and (max-width: ${_getNextBreakValue(
+        secondBreakpoint,
+        breakpoints,
       )}) {
@@ -121,0 +121,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

Lines of code

454

increased by0.44%

Worsened metrics

Total package byte prevSize

44898

decreased by-1.48%

No dependency changes