Socket
Socket
Sign inDemoInstall

react-camera-media-stream

Package Overview
Dependencies
453
Maintainers
1
Versions
26
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    react-camera-media-stream

React Camera Media Stream component


Version published
Weekly downloads
40
increased by100%
Maintainers
1
Created
Weekly downloads
 

Readme

Source

React Camera MediaStream

NPM JavaScript Style Guide

Camera component for React.

Note: Browsers will throw an error if the page is loaded from insecure origin. I.e. Use https.

Installation

npm install --save react-camera-media-stream

Documentation

PropsTypeDefaultDetails
maxint1920max width or height picture
namePicturestring""name added on left corner picture
imageCompressionfloat0.8quality of picture (0 to 1)
isConfirmbooleanfalseconfirmation after take picture
onTakePicturefunctionclick take picture
onErrorfunctionon error
modelstring""model on first plan camera
marginModelint40margin model
isFullscreenbooleanfalseview in fullscreen (not all navigator are compatible)
onClosefunctionclick close view camera
isTextModebooleanfalsebutton text / button icon
textCancelstring"Cancel"text for button cancel
textPicturestring"Take picture"text for button take picture
textTorchstring"Enable torch"text for button enable/disable torch (not all navigator are compatible)
textAgainstring"Retake"text for button again
textConfirmstring"Confirm"text for button confirm

Getting started

Import Component and style

import { RCamera } from  'react-camera-media-stream'
import  'react-camera-media-stream/dist/index.css'

Render Component

<RCamera
  model={require('./images/model.png')}
  isConfirm={false}
  onTakePicture={(data) =>  console.log(data)}
  onError={() => {}}
  onClose={() => setTest(false)}
  isFullscreen={true}
  namePicture="test"
  isTorch={true}
/>

License

MIT © noah-lnt

FAQs

Last updated on 14 Mar 2024

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc