@mitodl/smoot-design 0.0.0-7bc0c0f

package/dist/esm/utils/useDevCheckStable.js

@@ -0,0 +1,26 @@
+import { useEffect, useRef } from "react";
+/**
+ * Emits `console.error` if two subsequent values of `jsonSerializable` serialize
+ * to the same thing but are different references.
+ *
+ * This hook does NOT run in production.
+ */
+const useDevCheckStable = (jsonSerializable, msg = "The value has changed. This may cause unnecessary re-renders") => {
+    if (process.env.NODE_ENV !== "production") {
+        /**
+         * Calling hooks conditionally based on env vars is not really a problem.
+         * In a given environment, the hook will always run or always not run.
+         */
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const valRef = useRef(jsonSerializable);
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        useEffect(() => {
+            const sameJson = JSON.stringify(valRef.current) === JSON.stringify(jsonSerializable);
+            const differentRefs = valRef.current !== jsonSerializable;
+            if (!sameJson || differentRefs) {
+                console.error(`useDevCheckStable: ${msg}`, valRef.current, jsonSerializable);
+            }
+        }, [jsonSerializable, msg]);
+    }
+};
+export { useDevCheckStable };

package/dist/esm/utils/useInterval.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Calls a function at a specified interval.
+ *
+ * Based on https://overreacted.io/making-setinterval-declarative-with-react-hooks/
+ */
+declare const useInterval: (callback: () => void, delay: number | null) => void;
+export { useInterval };

package/dist/esm/utils/useInterval.js

@@ -0,0 +1,22 @@
+import { useRef, useEffect } from "react";
+/**
+ * Calls a function at a specified interval.
+ *
+ * Based on https://overreacted.io/making-setinterval-declarative-with-react-hooks/
+ */
+const useInterval = (callback, delay) => {
+    const savedCallback = useRef(null);
+    useEffect(() => {
+        savedCallback.current = callback;
+    }, [callback]);
+    useEffect(() => {
+        if (delay !== null) {
+            const id = setInterval(() => { var _a; return (_a = savedCallback.current) === null || _a === void 0 ? void 0 : _a.call(savedCallback); }, delay);
+            return () => clearInterval(id);
+        }
+        else {
+            return () => { };
+        }
+    }, [delay]);
+};
+export { useInterval };