A lightweight React hook for capturing high-quality images using the native camera app on mobile browsers.
npm install tectonic_cameraA minimal React hook for capturing high-quality photos using the native device camera (no live preview).
Developers have full control over UI, styling, and state management.
---
- Opens the native camera app (front or back)
- No fixed UI → you control buttons and styling
- Get the image as a File for storing in state, uploading, etc.
- Works on mobile browsers (desktop falls back to file picker)
- Zero dependencies, lightweight
---
``bash`
npm install tectonic_cameraUsage
`tsx
import { useState } from "react"
import { useTectonicCamera } from "tectonic_camera"
function App() {
const [photo, setPhoto] = useState
const { openCamera, CameraInput } = useTectonicCamera({
captureMode: "environment", // "user" (front), "environment" (rear), or undefined
onCapture: (file) => setPhoto(file)
})
return (
{/ Developer controls buttons /}
{photo && (
API
useTectonicCamera(options)
$3
- captureMode?: "user" | "environment"
Which camera to open (defaults to "environment").
- onCapture: (file: File) => void
Callback when a photo is taken.$3
- openCamera: () => void → Call this to trigger the camera
- CameraInput: React.FC → Hidden ` element (must be rendered once)