@reach/utils - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

es/index.js

 var checkedPkgs = {};
 
-export var checkStyles = function checkStyles(pkg) {
-  // only check once per package
-  if (checkedPkgs[pkg]) return;
-  checkedPkgs[pkg] = true;
+var checkStyles = function checkStyles() {};
 
-  if (parseInt(window.getComputedStyle(document.body).getPropertyValue("--reach-" + pkg), 10) !== 1) {
-    console.warn("@reach/" + pkg + " styles not found. If you are using a bundler like webpack or parcel include this in the entry file of your app before any of your own styles:\n\n    import \"@reach/" + pkg + "/styles.css\";\n\n  Otherwise you'll need to include them some other way:\n\n    <link rel=\"stylesheet\" type=\"text/css\" href=\"node_modules/@reach/" + pkg + "/styles.css\" />\n\n  For more information visit https://ui.reach.tech/styling.\n  ");
-  }
-};
+if (process.env.NODE_ENV !== "production") {
+  checkStyles = function checkStyles(pkg) {
+    // only check once per package
+    if (checkedPkgs[pkg]) return;
+    checkedPkgs[pkg] = true;
 
+    if (parseInt(window.getComputedStyle(document.body).getPropertyValue("--reach-" + pkg), 10) !== 1) {
+      console.warn("@reach/" + pkg + " styles not found. If you are using a bundler like webpack or parcel include this in the entry file of your app before any of your own styles:\n\n    import \"@reach/" + pkg + "/styles.css\";\n\n  Otherwise you'll need to include them some other way:\n\n    <link rel=\"stylesheet\" type=\"text/css\" href=\"node_modules/@reach/" + pkg + "/styles.css\" />\n\n  For more information visit https://ui.reach.tech/styling.\n  ");
+    }
+  };
+}
+
+export { checkStyles };
+
 export var wrapEvent = function wrapEvent(handler, cb) {
@@ -14,0 +20,0 @@ return function (event) {

index.js

@@ -6,12 +6,17 @@ "use strict";
 
-var checkStyles = exports.checkStyles = function checkStyles(pkg) {
-  // only check once per package
-  if (checkedPkgs[pkg]) return;
-  checkedPkgs[pkg] = true;
+var checkStyles = function checkStyles() {};
 
-  if (parseInt(window.getComputedStyle(document.body).getPropertyValue("--reach-" + pkg), 10) !== 1) {
-    console.warn("@reach/" + pkg + " styles not found. If you are using a bundler like webpack or parcel include this in the entry file of your app before any of your own styles:\n\n    import \"@reach/" + pkg + "/styles.css\";\n\n  Otherwise you'll need to include them some other way:\n\n    <link rel=\"stylesheet\" type=\"text/css\" href=\"node_modules/@reach/" + pkg + "/styles.css\" />\n\n  For more information visit https://ui.reach.tech/styling.\n  ");
-  }
-};
+if (process.env.NODE_ENV !== "production") {
+  exports.checkStyles = checkStyles = function checkStyles(pkg) {
+    // only check once per package
+    if (checkedPkgs[pkg]) return;
+    checkedPkgs[pkg] = true;
 
+    if (parseInt(window.getComputedStyle(document.body).getPropertyValue("--reach-" + pkg), 10) !== 1) {
+      console.warn("@reach/" + pkg + " styles not found. If you are using a bundler like webpack or parcel include this in the entry file of your app before any of your own styles:\n\n    import \"@reach/" + pkg + "/styles.css\";\n\n  Otherwise you'll need to include them some other way:\n\n    <link rel=\"stylesheet\" type=\"text/css\" href=\"node_modules/@reach/" + pkg + "/styles.css\" />\n\n  For more information visit https://ui.reach.tech/styling.\n  ");
+    }
+  };
+}
+
+exports.checkStyles = checkStyles;
 var wrapEvent = exports.wrapEvent = function wrapEvent(handler, cb) {
@@ -18,0 +23,0 @@ return function (event) {

package.json

 {
   "name": "@reach/utils",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Internal, shared utilities for Reach UI.",
@@ -5,0 +5,0 @@ "main": "index.js",

src/index.js

 let checkedPkgs = {};
 
-export let checkStyles = pkg => {
-  // only check once per package
-  if (checkedPkgs[pkg]) return;
-  checkedPkgs[pkg] = true;
+let checkStyles = () => {};
 
-  if (
-    parseInt(
-      window.getComputedStyle(document.body).getPropertyValue(`--reach-${pkg}`),
-      10
-    ) !== 1
-  ) {
-    console.warn(
-      `@reach/${pkg} styles not found. If you are using a bundler like webpack or parcel include this in the entry file of your app before any of your own styles:
+if (__DEV__) {
+  checkStyles = pkg => {
+    // only check once per package
+    if (checkedPkgs[pkg]) return;
+    checkedPkgs[pkg] = true;
 
+    if (
+      parseInt(
+        window
+          .getComputedStyle(document.body)
+          .getPropertyValue(`--reach-${pkg}`),
+        10
+      ) !== 1
+    ) {
+      console.warn(
+        `@reach/${pkg} styles not found. If you are using a bundler like webpack or parcel include this in the entry file of your app before any of your own styles:
+
     import "@reach/${pkg}/styles.css";
@@ -25,6 +30,9 @@
   `
-    );
-  }
-};
+      );
+    }
+  };
+}
 
+export { checkStyles };
+
 export let wrapEvent = (handler, cb) => event => {
@@ -31,0 +39,0 @@ handler && handler(event);

No alert changes

Improved metrics

Total package byte prevSize

9299

increased by180.6%

Number of package files

7

increased by75%

Lines of code

184

increased by192.06%

No dependency changes