Skip to main content

v1.0.0 — First Stable Release

Release Date: April 6, 2026

🎉 The first stable release of react-webcam-pro — a community-maintained fork of react-camera-pro.


Why This Release Exists

The original react-camera-pro by Purple Technology has not been actively maintained for over 2 years. Many users reported critical issues — React 19 incompatibility, styled-components warnings, broken camera switching — with no fixes in sight.

react-webcam-pro picks up where react-camera-pro left off. This release addresses all known critical issues while maintaining full backward compatibility.


🎯 Highlights

React 19 Support

react-webcam-pro supports React 16.8, 17, 18, and 19. No special configuration needed — just install and use.

The peer dependency range has been widened from the restrictive ^18.3.1 to ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0.

Upstream issue: purple-technology/react-camera-pro#70

styled-components v6 Support

Both styled-components v5 and v6 are now supported. DOM warnings caused by passing non-standard props to HTML elements have been eliminated using transient props.

Previously, you would see warnings like:

Warning: React does not recognize the `mirrored` prop on a DOM element.
Warning: React does not recognize the `aspectRatio` prop on a DOM element.

These are now gone.

Upstream issue: purple-technology/react-camera-pro#48

Optional errorMessages

The errorMessages prop is now fully optional. In react-camera-pro, it was technically required, forcing users to pass all four error messages even when using the defaults.

Now you can:

// ✅ No errorMessages needed
<Camera ref={cameraRef} />

// ✅ Override just what you need
<Camera errorMessages={{ permissionDenied: 'Custom message' }} />

Upstream issue: purple-technology/react-camera-pro#63

className and style Props

You can now style the camera container directly:

<Camera
className="my-camera"
style={{ borderRadius: 12, overflow: 'hidden' }}
/>

Previously, there was no way to add classes or styles to the camera container without wrapping it in another element.

Upstream issue: purple-technology/react-camera-pro#47

Fixed Camera Switching with videoSourceDeviceId

When using facingMode="environment" with a specific videoSourceDeviceId, the component would previously ignore the device ID and use auto-detection instead. This is now fixed — explicit device ID always takes priority.

Upstream issues: purple-technology/react-camera-pro#62, purple-technology/react-camera-pro#69

Comprehensive Test Suite

This release includes 60+ unit tests covering:

  • All component props and defaults
  • All ref methods (takePhoto, switchCamera, getNumberOfCameras, toggleTorch)
  • Error handling scenarios
  • Backward compatibility with react-camera-pro usage patterns
  • DOM warning regression tests

Modern Toolchain

ToolBeforeAfter
TypeScript3.7.55.7
Rollup1.294.28
Build Pluginrollup-plugin-typescript2@rollup/plugin-typescript
TestsNoneJest 29 + React Testing Library 16

📦 New Exports

ExportDescription
CameraRefThe recommended type for the camera ref (useRef<CameraRef>)

🔄 Migration from react-camera-pro

Zero breaking changes. Just update the import:

- import { Camera, CameraType } from 'react-camera-pro';
+ import { Camera, CameraType } from 'react-webcam-pro';

See the full Migration Guide for details.


📝 Full List of Changes

Features

  • ✅ React 19 support (peer deps: ^16.8 || ^17 || ^18 || ^19)
  • ✅ styled-components v6 support (peer deps: ^5.0.0 || ^6.0.0)
  • errorMessages prop is now optional with sensible defaults
  • ✅ New className prop for CSS class styling
  • ✅ New style prop for inline styling
  • ✅ New CameraRef type export for proper ref typing
  • ✅ Comprehensive test suite (60+ tests)
  • ✅ Modern build toolchain (TypeScript 5, Rollup 4)

Bug Fixes

  • 🐛 Fixed DOM warnings from styled-components (transient props)
  • 🐛 Fixed videoSourceDeviceId being ignored in environment mode
  • 🐛 Removed deprecated navigator.getUserMedia fallbacks
  • 🐛 Fixed useEffect cleanup for mounted state tracking

Infrastructure

  • 🔧 Jest 29 + React Testing Library 16 test setup
  • 🔧 npm scripts: test, test:watch, test:coverage, test:ci, lint, format, typecheck
  • 🔧 Updated .gitignore for dist, coverage, .tgz files
  • 🔧 Updated LICENSE with fork attribution
  • 🔧 Comprehensive README with migration guide

🙏 Acknowledgements

This release is built on the foundation created by:

Thank you for building the foundation we're continuing to maintain.


Installation

npm install react-webcam-pro
yarn add react-webcam-pro
pnpm add react-webcam-pro