react-media-devices - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

lib/cjs/useMediaDevices.js

 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useMediaDevices = void 0;
 var react_1 = require("react");
+var use_deep_compare_effect_1 = __importDefault(require("use-deep-compare-effect"));
 var mediaDevices_1 = require("./utils/mediaDevices");
 var useMediaDevices = function (_a) {
-    var _b = _a === void 0 ? {} : _a, constraints = _b.constraints, _c = _b.verbose, verbose = _c === void 0 ? process.env.NODE_ENV !== "production" : _c;
+    var _b = _a === void 0 ? {} : _a, constraints = _b.constraints, _c = _b.onError, onError = _c === void 0 ? function () { } : _c;
     var _d = (0, react_1.useState)(null), mediaDevices = _d[0], setMediaDevices = _d[1];
+    var errorHandlerRef = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(function () {
+        errorHandlerRef.current = onError;
+    }, [onError]);
+    (0, use_deep_compare_effect_1.default)(function () {
         var ac = new AbortController();
+        console.log("effect");
         new Promise(function (resolve, reject) {
             ac.signal.addEventListener("abort", reject);
+            console.log(constraints);
             (0, mediaDevices_1.getMediaDevices)(constraints).then(resolve);
         })
             .then(function (devices) {
+            console.log(devices);
             setMediaDevices(devices);
         })
             .catch(function (error) {
+            var _a;
             if (error.type === "abort")
                 return;
-            if (verbose) {
-                console.error(error);
-            }
+            (_a = errorHandlerRef.current) === null || _a === void 0 ? void 0 : _a.call(errorHandlerRef, error);
         });
@@ -28,5 +38,5 @@ return function () {
         };
-    }, [verbose, constraints]);
+    }, [constraints]);
     return mediaDevices;
 };
 exports.useMediaDevices = useMediaDevices;

lib/esm/useMediaDevices.js

@@ -1,21 +0,28 @@
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
+import useDeepCompareEffect from "use-deep-compare-effect";
 import { getMediaDevices } from "./utils/mediaDevices";
 export var useMediaDevices = function (_a) {
-    var _b = _a === void 0 ? {} : _a, constraints = _b.constraints, _c = _b.verbose, verbose = _c === void 0 ? process.env.NODE_ENV !== "production" : _c;
+    var _b = _a === void 0 ? {} : _a, constraints = _b.constraints, _c = _b.onError, onError = _c === void 0 ? function () { } : _c;
     var _d = useState(null), mediaDevices = _d[0], setMediaDevices = _d[1];
+    var errorHandlerRef = useRef(null);
     useEffect(function () {
+        errorHandlerRef.current = onError;
+    }, [onError]);
+    useDeepCompareEffect(function () {
         var ac = new AbortController();
+        console.log("effect");
         new Promise(function (resolve, reject) {
             ac.signal.addEventListener("abort", reject);
+            console.log(constraints);
             getMediaDevices(constraints).then(resolve);
         })
             .then(function (devices) {
+            console.log(devices);
             setMediaDevices(devices);
         })
             .catch(function (error) {
+            var _a;
             if (error.type === "abort")
                 return;
-            if (verbose) {
-                console.error(error);
-            }
+            (_a = errorHandlerRef.current) === null || _a === void 0 ? void 0 : _a.call(errorHandlerRef, error);
         });
@@ -25,4 +32,4 @@ return function () {
         };
-    }, [verbose, constraints]);
+    }, [constraints]);
     return mediaDevices;
 };

lib/useMediaDevices.d.ts

 interface UseMediaDevicesOptions {
     constraints?: MediaStreamConstraints;
-    verbose?: boolean;
+    onError?: (error: Error) => void;
 }
-export declare const useMediaDevices: ({ constraints, verbose, }?: UseMediaDevicesOptions) => MediaDeviceInfo[] | null;
+export declare const useMediaDevices: ({ constraints, onError, }?: UseMediaDevicesOptions) => MediaDeviceInfo[] | null;
 export {};

package.json

 {
   "name": "react-media-devices",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "A custom hook to enumerate user media devices, using the MediaDevices API",
@@ -68,3 +68,6 @@ "main": "./lib/cjs/index.js",
     ]
+  },
+  "dependencies": {
+    "use-deep-compare-effect": "^1.8.1"
   }
 }

Fixed alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14470

increased by6.92%

Lines of code

245

increased by7.46%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dependency count

2

increased by100%

Dependency changes

• + Addeduse-deep-compare-effect@^1.8.1

• + Added@babel/runtime@7.24.5(transitive)

• + Addeddequal@2.0.3(transitive)

• + Addedregenerator-runtime@0.14.1(transitive)

• + Addeduse-deep-compare-effect@1.8.1(transitive)