react-webcam - npm Package Compare versions

Comparing version 4.0.3 to 4.1.0

dist/react-webcam.d.ts

@@ -5,2 +5,3 @@ import * as React from "react";
     audioConstraints?: MediaStreamConstraints["audio"];
+    forceScreenshotSourceSize?: boolean;
     imageSmoothing: boolean;
@@ -23,2 +24,3 @@ mirrored?: boolean;
         audio: boolean;
+        forceScreenshotSourceSize: boolean;
         imageSmoothing: boolean;
@@ -33,3 +35,3 @@ mirrored: boolean;
     static userMediaRequested: boolean;
-    canvas: HTMLCanvasElement;
+    canvas: HTMLCanvasElement | null;
     ctx: CanvasRenderingContext2D | null;
@@ -36,0 +38,0 @@ stream: MediaStream;

dist/react-webcam.js

@@ -181,2 +181,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
         var _this = _super.call(this, props) || this;
+        _this.canvas = null;
         _this.ctx = null;
@@ -205,6 +206,15 @@ _this.state = {
         }
-        if (JSON.stringify(nextProps.audioConstraints) !==
-            JSON.stringify(props.audioConstraints) ||
-            JSON.stringify(nextProps.videoConstraints) !==
-                JSON.stringify(props.videoConstraints)) {
+        var audioConstraintsChanged = JSON.stringify(nextProps.audioConstraints) !==
+            JSON.stringify(props.audioConstraints);
+        var videoConstraintsChanged = JSON.stringify(nextProps.videoConstraints) !==
+            JSON.stringify(props.videoConstraints);
+        var minScreenshotWidthChanged = nextProps.minScreenshotWidth !== props.minScreenshotWidth;
+        var minScreenshotHeightChanged = nextProps.minScreenshotHeight !== props.minScreenshotHeight;
+        if (videoConstraintsChanged ||
+            minScreenshotWidthChanged ||
+            minScreenshotHeightChanged) {
+            this.canvas = null;
+            this.ctx = null;
+        }
+        if (audioConstraintsChanged || videoConstraintsChanged) {
             this.requestUserMedia();
@@ -247,18 +257,21 @@ }
         if (!this.ctx) {
-            var canvas_1 = document.createElement("canvas");
-            var aspectRatio = this.video.videoWidth / this.video.videoHeight;
-            var canvasWidth = props.minScreenshotWidth || this.video.clientWidth;
-            var canvasHeight = canvasWidth / aspectRatio;
-            if (props.minScreenshotHeight &&
-                canvasHeight < props.minScreenshotHeight) {
-                canvasHeight = props.minScreenshotHeight;
-                canvasWidth = canvasHeight * aspectRatio;
+            var canvasWidth = this.video.videoWidth;
+            var canvasHeight = this.video.videoHeight;
+            if (!this.props.forceScreenshotSourceSize) {
+                var aspectRatio = canvasWidth / canvasHeight;
+                canvasWidth = props.minScreenshotWidth || this.video.clientWidth;
+                canvasHeight = canvasWidth / aspectRatio;
+                if (props.minScreenshotHeight &&
+                    canvasHeight < props.minScreenshotHeight) {
+                    canvasHeight = props.minScreenshotHeight;
+                    canvasWidth = canvasHeight * aspectRatio;
+                }
             }
-            canvas_1.width = canvasWidth;
-            canvas_1.height = canvasHeight;
-            this.canvas = canvas_1;
-            this.ctx = canvas_1.getContext("2d");
+            this.canvas = document.createElement("canvas");
+            this.canvas.width = canvasWidth;
+            this.canvas.height = canvasHeight;
+            this.ctx = this.canvas.getContext("2d");
         }
         var _b = this, ctx = _b.ctx, canvas = _b.canvas;
-        if (ctx) {
+        if (ctx && canvas) {
             // mirror the screenshot
@@ -370,3 +383,3 @@ if (props.mirrored) {
         var _a = this, state = _a.state, props = _a.props;
-        var audio = props.audio, onUserMedia = props.onUserMedia, onUserMediaError = props.onUserMediaError, screenshotFormat = props.screenshotFormat, screenshotQuality = props.screenshotQuality, minScreenshotWidth = props.minScreenshotWidth, minScreenshotHeight = props.minScreenshotHeight, audioConstraints = props.audioConstraints, videoConstraints = props.videoConstraints, imageSmoothing = props.imageSmoothing, mirrored = props.mirrored, _b = props.style, style = _b === void 0 ? {} : _b, rest = __rest(props, ["audio", "onUserMedia", "onUserMediaError", "screenshotFormat", "screenshotQuality", "minScreenshotWidth", "minScreenshotHeight", "audioConstraints", "videoConstraints", "imageSmoothing", "mirrored", "style"]);
+        var audio = props.audio, forceScreenshotSourceSize = props.forceScreenshotSourceSize, onUserMedia = props.onUserMedia, onUserMediaError = props.onUserMediaError, screenshotFormat = props.screenshotFormat, screenshotQuality = props.screenshotQuality, minScreenshotWidth = props.minScreenshotWidth, minScreenshotHeight = props.minScreenshotHeight, audioConstraints = props.audioConstraints, videoConstraints = props.videoConstraints, imageSmoothing = props.imageSmoothing, mirrored = props.mirrored, _b = props.style, style = _b === void 0 ? {} : _b, rest = __rest(props, ["audio", "forceScreenshotSourceSize", "onUserMedia", "onUserMediaError", "screenshotFormat", "screenshotQuality", "minScreenshotWidth", "minScreenshotHeight", "audioConstraints", "videoConstraints", "imageSmoothing", "mirrored", "style"]);
         var videoStyle = mirrored ? __assign(__assign({}, style), { transform: (style.transform || "") + " scaleX(-1)" }) : style;
@@ -379,2 +392,3 @@ return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("video", __assign({ autoPlay: true, src: state.src, muted: audio, playsInline: true, ref: function (ref) {
         audio: true,
+        forceScreenshotSourceSize: false,
         imageSmoothing: true,
@@ -381,0 +395,0 @@ mirrored: false,

dist/react-webcam.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.Webcam=t(require("react")):e.Webcam=t(e.React)}(this,function(e){return function(e){var t={};function r(i){if(t[i])return t[i].exports;var n=t[i]={i:i,l:!1,exports:{}};return e[i].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,i){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(r.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(i,n,function(t){return e[t]}.bind(null,n));return i},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=1)}([function(t,r){t.exports=e},function(e,t,r){"use strict";r.r(t);var i,n=r(0),o=(i=function(e,t){return(i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r])})(e,t)},function(e,t){function r(){this.constructor=e}i(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}),s=function(){return(s=Object.assign||function(e){for(var t,r=1,i=arguments.length;r<i;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e}).apply(this,arguments)},a=function(e,t){var r={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&t.indexOf(i)<0&&(r[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(i=Object.getOwnPropertySymbols(e);n<i.length;n++)t.indexOf(i[n])<0&&Object.prototype.propertyIsEnumerable.call(e,i[n])&&(r[i[n]]=e[i[n]])}return r};function d(){return!(!navigator.mediaDevices||!navigator.mediaDevices.getUserMedia)}void 0===navigator.mediaDevices&&(navigator.mediaDevices={}),void 0===navigator.mediaDevices.getUserMedia&&(navigator.mediaDevices.getUserMedia=function(e){var t=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;return t?new Promise(function(r,i){t.call(navigator,e,r,i)}):Promise.reject(new Error("getUserMedia is not implemented in this browser"))});var c=function(e){function t(t){var r=e.call(this,t)||this;return r.ctx=null,r.state={hasUserMedia:!1},r}return o(t,e),t.prototype.componentDidMount=function(){var e=this.state,r=this.props;d()?(t.mountedInstances.push(this),e.hasUserMedia||t.userMediaRequested||this.requestUserMedia()):r.onUserMediaError("getUserMedia not supported")},t.prototype.componentDidUpdate=function(e){var t=this.props;d()?JSON.stringify(e.audioConstraints)===JSON.stringify(t.audioConstraints)&&JSON.stringify(e.videoConstraints)===JSON.stringify(t.videoConstraints)||this.requestUserMedia():t.onUserMediaError("getUserMedia not supported")},t.prototype.componentWillUnmount=function(){var e=this.state,r=t.mountedInstances.indexOf(this);t.mountedInstances.splice(r,1),t.userMediaRequested=!1,0===t.mountedInstances.length&&e.hasUserMedia&&(this.stream.getVideoTracks&&this.stream.getAudioTracks?(this.stream.getVideoTracks().map(function(e){return e.stop()}),this.stream.getAudioTracks().map(function(e){return e.stop()})):this.stream.stop(),e.src&&window.URL.revokeObjectURL(e.src))},t.prototype.getScreenshot=function(){var e=this.state,t=this.props;if(!e.hasUserMedia)return null;var r=this.getCanvas();return r&&r.toDataURL(t.screenshotFormat,t.screenshotQuality)},t.prototype.getCanvas=function(){var e=this.state,t=this.props;if(!this.video)return null;if(!e.hasUserMedia||!this.video.videoHeight)return null;if(!this.ctx){var r=document.createElement("canvas"),i=this.video.videoWidth/this.video.videoHeight,n=t.minScreenshotWidth||this.video.clientWidth,o=n/i;t.minScreenshotHeight&&o<t.minScreenshotHeight&&(n=(o=t.minScreenshotHeight)*i),r.width=n,r.height=o,this.canvas=r,this.ctx=r.getContext("2d")}var s=this.ctx,a=this.canvas;return s&&(t.mirrored&&(s.translate(a.width,0),s.scale(-1,1)),s.imageSmoothingEnabled=t.imageSmoothing,s.drawImage(this.video,0,0,a.width,a.height),t.mirrored&&(s.scale(-1,1),s.translate(-a.width,0))),a},t.prototype.requestUserMedia=function(){var e=this.props,r=function(r,i){var n={video:void 0===i||i};e.audio&&(n.audio=void 0===r||r),navigator.mediaDevices.getUserMedia(n).then(function(e){t.mountedInstances.forEach(function(t){return t.handleUserMedia(null,e)})}).catch(function(e){t.mountedInstances.forEach(function(t){return t.handleUserMedia(e)})})};if("mediaDevices"in navigator)r(e.audioConstraints,e.videoConstraints);else{var i=function(e){return{optional:[{sourceId:e}]}},n=function(e){var t=e.deviceId;return"string"==typeof t?t:Array.isArray(t)&&t.length>0?t[0]:"object"==typeof t&&t.ideal?t.ideal:null};MediaStreamTrack.getSources(function(t){var o=null,s=null;t.forEach(function(e){"audio"===e.kind?o=e.id:"video"===e.kind&&(s=e.id)});var a=n(e.audioConstraints);a&&(o=a);var d=n(e.videoConstraints);d&&(s=d),r(i(o),i(s))})}t.userMediaRequested=!0},t.prototype.handleUserMedia=function(e,t){var r=this.props;if(e||!t)return this.setState({hasUserMedia:!1}),void r.onUserMediaError(e);this.stream=t;try{this.video&&(this.video.srcObject=t),this.setState({hasUserMedia:!0})}catch(e){this.setState({hasUserMedia:!0,src:window.URL.createObjectURL(t)})}r.onUserMedia()},t.prototype.render=function(){var e=this,t=this.state,r=this.props,i=r.audio,o=(r.onUserMedia,r.onUserMediaError,r.screenshotFormat,r.screenshotQuality,r.minScreenshotWidth,r.minScreenshotHeight,r.audioConstraints,r.videoConstraints,r.imageSmoothing,r.mirrored),d=r.style,c=void 0===d?{}:d,u=a(r,["audio","onUserMedia","onUserMediaError","screenshotFormat","screenshotQuality","minScreenshotWidth","minScreenshotHeight","audioConstraints","videoConstraints","imageSmoothing","mirrored","style"]),h=o?s(s({},c),{transform:(c.transform||"")+" scaleX(-1)"}):c;return n.createElement("video",s({autoPlay:!0,src:t.src,muted:i,playsInline:!0,ref:function(t){e.video=t},style:h},u))},t.defaultProps={audio:!0,imageSmoothing:!0,mirrored:!1,onUserMedia:function(){},onUserMediaError:function(){},screenshotFormat:"image/webp",screenshotQuality:.92},t.mountedInstances=[],t.userMediaRequested=!1,t}(n.Component);t.default=c}]).default});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.Webcam=t(require("react")):e.Webcam=t(e.React)}(this,function(e){return function(e){var t={};function r(i){if(t[i])return t[i].exports;var n=t[i]={i:i,l:!1,exports:{}};return e[i].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,i){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(r.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(i,n,function(t){return e[t]}.bind(null,n));return i},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=1)}([function(t,r){t.exports=e},function(e,t,r){"use strict";r.r(t);var i,n=r(0),o=(i=function(e,t){return(i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r])})(e,t)},function(e,t){function r(){this.constructor=e}i(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}),s=function(){return(s=Object.assign||function(e){for(var t,r=1,i=arguments.length;r<i;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e}).apply(this,arguments)},a=function(e,t){var r={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&t.indexOf(i)<0&&(r[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(i=Object.getOwnPropertySymbols(e);n<i.length;n++)t.indexOf(i[n])<0&&Object.prototype.propertyIsEnumerable.call(e,i[n])&&(r[i[n]]=e[i[n]])}return r};function c(){return!(!navigator.mediaDevices||!navigator.mediaDevices.getUserMedia)}void 0===navigator.mediaDevices&&(navigator.mediaDevices={}),void 0===navigator.mediaDevices.getUserMedia&&(navigator.mediaDevices.getUserMedia=function(e){var t=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;return t?new Promise(function(r,i){t.call(navigator,e,r,i)}):Promise.reject(new Error("getUserMedia is not implemented in this browser"))});var d=function(e){function t(t){var r=e.call(this,t)||this;return r.canvas=null,r.ctx=null,r.state={hasUserMedia:!1},r}return o(t,e),t.prototype.componentDidMount=function(){var e=this.state,r=this.props;c()?(t.mountedInstances.push(this),e.hasUserMedia||t.userMediaRequested||this.requestUserMedia()):r.onUserMediaError("getUserMedia not supported")},t.prototype.componentDidUpdate=function(e){var t=this.props;if(c()){var r=JSON.stringify(e.audioConstraints)!==JSON.stringify(t.audioConstraints),i=JSON.stringify(e.videoConstraints)!==JSON.stringify(t.videoConstraints),n=e.minScreenshotWidth!==t.minScreenshotWidth,o=e.minScreenshotHeight!==t.minScreenshotHeight;(i||n||o)&&(this.canvas=null,this.ctx=null),(r||i)&&this.requestUserMedia()}else t.onUserMediaError("getUserMedia not supported")},t.prototype.componentWillUnmount=function(){var e=this.state,r=t.mountedInstances.indexOf(this);t.mountedInstances.splice(r,1),t.userMediaRequested=!1,0===t.mountedInstances.length&&e.hasUserMedia&&(this.stream.getVideoTracks&&this.stream.getAudioTracks?(this.stream.getVideoTracks().map(function(e){return e.stop()}),this.stream.getAudioTracks().map(function(e){return e.stop()})):this.stream.stop(),e.src&&window.URL.revokeObjectURL(e.src))},t.prototype.getScreenshot=function(){var e=this.state,t=this.props;if(!e.hasUserMedia)return null;var r=this.getCanvas();return r&&r.toDataURL(t.screenshotFormat,t.screenshotQuality)},t.prototype.getCanvas=function(){var e=this.state,t=this.props;if(!this.video)return null;if(!e.hasUserMedia||!this.video.videoHeight)return null;if(!this.ctx){var r=this.video.videoWidth,i=this.video.videoHeight;if(!this.props.forceScreenshotSourceSize){var n=r/i;i=(r=t.minScreenshotWidth||this.video.clientWidth)/n,t.minScreenshotHeight&&i<t.minScreenshotHeight&&(r=(i=t.minScreenshotHeight)*n)}this.canvas=document.createElement("canvas"),this.canvas.width=r,this.canvas.height=i,this.ctx=this.canvas.getContext("2d")}var o=this.ctx,s=this.canvas;return o&&s&&(t.mirrored&&(o.translate(s.width,0),o.scale(-1,1)),o.imageSmoothingEnabled=t.imageSmoothing,o.drawImage(this.video,0,0,s.width,s.height),t.mirrored&&(o.scale(-1,1),o.translate(-s.width,0))),s},t.prototype.requestUserMedia=function(){var e=this.props,r=function(r,i){var n={video:void 0===i||i};e.audio&&(n.audio=void 0===r||r),navigator.mediaDevices.getUserMedia(n).then(function(e){t.mountedInstances.forEach(function(t){return t.handleUserMedia(null,e)})}).catch(function(e){t.mountedInstances.forEach(function(t){return t.handleUserMedia(e)})})};if("mediaDevices"in navigator)r(e.audioConstraints,e.videoConstraints);else{var i=function(e){return{optional:[{sourceId:e}]}},n=function(e){var t=e.deviceId;return"string"==typeof t?t:Array.isArray(t)&&t.length>0?t[0]:"object"==typeof t&&t.ideal?t.ideal:null};MediaStreamTrack.getSources(function(t){var o=null,s=null;t.forEach(function(e){"audio"===e.kind?o=e.id:"video"===e.kind&&(s=e.id)});var a=n(e.audioConstraints);a&&(o=a);var c=n(e.videoConstraints);c&&(s=c),r(i(o),i(s))})}t.userMediaRequested=!0},t.prototype.handleUserMedia=function(e,t){var r=this.props;if(e||!t)return this.setState({hasUserMedia:!1}),void r.onUserMediaError(e);this.stream=t;try{this.video&&(this.video.srcObject=t),this.setState({hasUserMedia:!0})}catch(e){this.setState({hasUserMedia:!0,src:window.URL.createObjectURL(t)})}r.onUserMedia()},t.prototype.render=function(){var e=this,t=this.state,r=this.props,i=r.audio,o=(r.forceScreenshotSourceSize,r.onUserMedia,r.onUserMediaError,r.screenshotFormat,r.screenshotQuality,r.minScreenshotWidth,r.minScreenshotHeight,r.audioConstraints,r.videoConstraints,r.imageSmoothing,r.mirrored),c=r.style,d=void 0===c?{}:c,u=a(r,["audio","forceScreenshotSourceSize","onUserMedia","onUserMediaError","screenshotFormat","screenshotQuality","minScreenshotWidth","minScreenshotHeight","audioConstraints","videoConstraints","imageSmoothing","mirrored","style"]),h=o?s(s({},d),{transform:(d.transform||"")+" scaleX(-1)"}):d;return n.createElement("video",s({autoPlay:!0,src:t.src,muted:i,playsInline:!0,ref:function(t){e.video=t},style:h},u))},t.defaultProps={audio:!0,forceScreenshotSourceSize:!1,imageSmoothing:!0,mirrored:!1,onUserMedia:function(){},onUserMediaError:function(){},screenshotFormat:"image/webp",screenshotQuality:.92},t.mountedInstances=[],t.userMediaRequested=!1,t}(n.Component);t.default=d}]).default});
 //# sourceMappingURL=react-webcam.min.js.map

package.json

 {
   "name": "react-webcam",
-  "version": "4.0.3",
+  "version": "4.1.0",
   "description": "React webcam component",
@@ -5,0 +5,0 @@ "main": "dist/react-webcam.js",

README.md

@@ -36,15 +36,16 @@ # react-webcam
 
-| prop                | type     | default      | notes                                                                                   |
-| -----------------   | -------- | ------------ | --------------------------------------------------------------------------------------- |
-| audio               | boolean  | true         | enable/disable audio                                                                    |
-| audioConstraints    | object   |              | MediaStreamConstraint(s) for the audio                                                  |
-| imageSmoothing      | boolean  | true         | pixel smoothing of the screenshot taken                                                 å|
-| mirrored            | boolean  | false        | show camera preview and get the screenshot mirrored                                     |
-| minScreenshotHeight | number   |              | min height of screenshot                                                                |
-| minScreenshotWidth  | number   |              | min width of screenshot                                                                 |
-| onUserMedia         | function | noop         | callback for when component receives a media stream                                     |
-| onUserMediaError    | function | noop         | callback for when component can't receive a media stream with MediaStreamError param    |
-| screenshotFormat    | string   | 'image/webp' | format of screenshot                                                                    |
-| screenshotQuality   | number   | 0.92         | quality of screenshot(0 to 1)                                                           |
-| videoConstraints    | object   |              | MediaStreamConstraints(s) for the video                                                 |
+| prop                      | type     | default      | notes                                                                                   |
+| ------------------------- | -------- | ------------ | --------------------------------------------------------------------------------------- |
+| audio                     | boolean  | true         | enable/disable audio                                                                    |
+| audioConstraints          | object   |              | MediaStreamConstraint(s) for the audio                                                  |
+| forceScreenshotSourceSize | boolean  | false        | uses size of underlying source video stream (and thus ignores other size related props) |
+| imageSmoothing            | boolean  | true         | pixel smoothing of the screenshot taken                                                 |
+| mirrored                  | boolean  | false        | show camera preview and get the screenshot mirrored                                     |
+| minScreenshotHeight       | number   |              | min height of screenshot                                                                |
+| minScreenshotWidth        | number   |              | min width of screenshot                                                                 |
+| onUserMedia               | function | noop         | callback for when component receives a media stream                                     |
+| onUserMediaError          | function | noop         | callback for when component can't receive a media stream with MediaStreamError param    |
+| screenshotFormat          | string   | 'image/webp' | format of screenshot                                                                    |
+| screenshotQuality         | number   | 0.92         | quality of screenshot(0 to 1)                                                           |
+| videoConstraints          | object   |              | MediaStreamConstraints(s) for the video                                                 |
 
@@ -51,0 +52,0 @@ ### Methods

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

155138

increased by2.66%

Lines of code

678

increased by2.57%

Number of lines in readme file

137

increased by0.74%

No dependency changes