CameraTag's Photo Booth

This react component allows you to embed a CameraTag <Photobooth> in your React app.

Initialize A Recorder

Below is an example of how to load a <Photobooth> in your app.

import Photobooth from "@cameratag/react_photobooth";

export default function App() {
  return <Photobooth appUuid='a-6793d070-dbac-013b-f57a-529b7d4fe95c' id='myBooth'/>
}

Call Methods / Observe Events

If you want to call methods on the <Photobooth> from our JS API you can pass a function into the onInit prop and the function will be passed a handle to the newly initialized <Photobooth>.

import Photobooth from "@cameratag/react_photobooth";

export default function App() {

  // grab a handle for the JS API
  function getHandle(myBooth) {
    // you can call then call API methods or observe events
    myBooth.takePicture();
    myBooth.observe("photoTaken", ()=>{
      console.log("Looking good!");
    });
  }

  return <Photobooth onInit={getHandle} appUuid='a-6793d070-dbac-013b-f57a-529b7d4fe95c' id='myBooth'/>
}