@snap/react-camera-kit 0.1.0 → 0.2.0

package/README.md

@@ -1,8 +1,8 @@
 # @snap/react-camera-kit
 
-React Camera Kit for web applications.
+The official React wrapper for the [Camera Kit Web SDK](https://developers.snap.com/camera-kit/integrate-sdk/web/web-configuration). It provides declarative components and hooks that handle SDK bootstrapping, session lifecycle, media sources, and Lens management — so you can integrate Snap AR into React apps with minimal boilerplate.
 
-**[Live Demo](https://snapchat.github.io/react-camera-kit/)**
+**[Live Demo](https://snapchat.github.io/react-camera-kit/)** · **[Camera Kit Docs](https://developers.snap.com/camera-kit/integrate-sdk/web/guides/react-camera-kit)**
 
 ## Installation
 
@@ -10,107 +10,373 @@ React Camera Kit for web applications.
 npm install @snap/react-camera-kit @snap/camera-kit
 ```
 
-## Prerequisites
+### Requirements
 
-Before using this package, complete Camera Kit Web setup and obtain:
+- `@snap/camera-kit` `^1.13.0` (peer dependency)
+- `react` `>=16.8.0` and `react-dom` `>=16.8.0`
+- `rxjs` `>=7`
+- `https://` for deployed apps (`http://localhost` works for local development)
 
-- `apiToken`
-- `lensId`
-- `lensGroupId`
-- `https://` for deployed apps (`http://localhost` should works for local dev)
+You'll need a Camera Kit API token, Lens ID, and Lens Group ID from the [Snap Developer Portal](https://kit.snapchat.com/manage). See [Setting Up Accounts](https://developers.snap.com/camera-kit/getting-started/setting-up-accounts) if you're new to Camera Kit.
 
-Full setup guides:
+## Quick start
 
-- Camera Kit Web configuration: https://developers.snap.com/camera-kit/integrate-sdk/web/web-configuration
-- `@snap/camera-kit` docs: https://www.npmjs.com/package/@snap/camera-kit
+```tsx
+import { CameraKitProvider, LensPlayer } from "@snap/react-camera-kit";
 
-## Compatibility
+function App() {
+  return (
+    <CameraKitProvider apiToken="YOUR_API_TOKEN">
+      <LensPlayer lensId="YOUR_LENS_ID" lensGroupId="YOUR_LENS_GROUP_ID" />
+    </CameraKitProvider>
+  );
+}
+```
 
-- Requires `@snap/camera-kit` `^1.13.0`, because `1.13.0+` includes the SDK-side font bootstrap behavior needed by this package.
+That's it — `CameraKitProvider` initializes the SDK, and `LensPlayer` sets up the camera, applies the Lens, and renders the output canvas.
 
-## Usage
+## Components
 
-This package provides a simple API for integrating Camera Kit into React applications.
+### CameraKitProvider
 
-The simplest use case is:
+The root provider that initializes the Camera Kit SDK. All other components and hooks must be descendants of this provider.
 
 ```tsx
-<CameraKitProvider apiToken="YOUR_TOKEN">
-  <LensPlayer lensId="YOUR_LENS_ID" lensGroupId="YOUR_GROUP_ID" />
-</CameraKitProvider>
+import { CameraKitProvider, createConsoleLogger } from "@snap/react-camera-kit";
+
+<CameraKitProvider apiToken="YOUR_API_TOKEN" logger={createConsoleLogger()} logLevel="info">
+  {children}
+</CameraKitProvider>;
 ```
 
-if you need to render specific canvas with custom layout:
+| Prop                          | Type                                     | Default      | Description                                                   |
+| ----------------------------- | ---------------------------------------- | ------------ | ------------------------------------------------------------- |
+| `apiToken`                    | `string`                                 | **required** | Camera Kit API token                                          |
+| `logger`                      | `CameraKitLogger`                        | `noopLogger` | Logger instance — use `createConsoleLogger()` for development |
+| `logLevel`                    | `"debug" \| "info" \| "warn" \| "error"` | `"info"`     | Log verbosity                                                 |
+| `renderWhileTabHidden`        | `boolean`                                | `false`      | Continue rendering when the browser tab is hidden             |
+| `stabilityKey`                | `string \| number`                       | auto         | Manual control over when the SDK re-initializes               |
+| `extendContainer`             | `(container) => container`               | —            | Customize the SDK's DI container                              |
+| `createBootstrapEventHandler` | `MetricEventHandlerFactory`              | —            | Factory for tracking bootstrap success/failure                |
+
+### LensPlayer
+
+All-in-one component that handles source setup, Lens application, and playback. Defaults to the user's camera if no `source` is provided.
 
 ```tsx
-<CameraKitProvider apiToken="YOUR_TOKEN">
-  <LensPlayer lensId="YOUR_LENS_ID" lensGroupId="YOUR_GROUP_ID" canvasType="both">
-    <div>
-      <LiveCanvas />
-    </div>
+<LensPlayer lensId="YOUR_LENS_ID" lensGroupId="YOUR_LENS_GROUP_ID" className="camera-canvas" />
+```
+
+| Prop             | Type                    | Default              | Description                                                                                      |
+| ---------------- | ----------------------- | -------------------- | ------------------------------------------------------------------------------------------------ |
+| `lensId`         | `string`                | —                    | Lens to apply                                                                                    |
+| `lensGroupId`    | `string`                | —                    | Lens Group containing the Lens                                                                   |
+| `source`         | `SourceInput`           | `{ kind: "camera" }` | Media source (camera, video, or image)                                                           |
+| `outputSize`     | `OutputSize`            | —                    | Rendering canvas size                                                                            |
+| `lensLaunchData` | `LensLaunchData`        | —                    | Launch parameters passed to the Lens                                                             |
+| `lensReadyGuard` | `() => Promise<void>`   | —                    | Async guard called while Lens is loading (2s timeout)                                            |
+| `refreshTrigger` | `unknown`               | —                    | When this value changes, the Lens is removed and reapplied                                       |
+| `canvasType`     | `"live" \| "capture"`   | `"live"`             | Which canvas to render. For custom layouts, use `LiveCanvas`/`CaptureCanvas` as children instead |
+| `fpsLimit`       | `number`                | —                    | Maximum rendering framerate                                                                      |
+| `muted`          | `boolean`               | `false`              | Mute audio output                                                                                |
+| `screenRegions`  | `ScreenRegions`         | —                    | Screen regions for Lens-aware UI layout                                                          |
+| `onError`        | `(error, lens) => void` | —                    | Callback for playback errors                                                                     |
+| `className`      | `string`                | —                    | CSS class name                                                                                   |
+| `style`          | `CSSProperties`         | —                    | Inline styles                                                                                    |
+| `children`       | `ReactNode`             | —                    | Custom children (use with `LiveCanvas`/`CaptureCanvas`)                                          |
+
+### LiveCanvas / CaptureCanvas
+
+Render the live preview or capture canvas as children of `LensPlayer`:
+
+```tsx
+<LensPlayer lensId="YOUR_LENS_ID" lensGroupId="YOUR_LENS_GROUP_ID">
+  <div>
+    <LiveCanvas style={{ width: "100%" }} />
+  </div>
+  <div>
+    <CaptureCanvas style={{ width: "100%" }} />
+  </div>
+</LensPlayer>
+```
+
+Both accept `className` and `style` props.
+
+## Hooks
+
+### useCameraKit
+
+Access the full Camera Kit context — SDK status, source/Lens state, and imperative methods. Must be called within a `CameraKitProvider`.
+
+```tsx
+import { useCameraKit } from "@snap/react-camera-kit";
+
+function Controls() {
+  const { sdkStatus, lens, lenses, isMuted, toggleMuted, applyLens, removeLens, fetchLenses } = useCameraKit();
+
+  if (sdkStatus !== "ready") return <p>Loading SDK...</p>;
+
+  return (
     <div>
-      <CaptureCanvas />
+      <p>Lens: {lens.lensId ?? "None"}</p>
+      <button onClick={toggleMuted}>{isMuted ? "Unmute" : "Mute"}</button>
+      <button onClick={removeLens}>Remove Lens</button>
     </div>
-  </LensPlayer>
-</CameraKitProvider>
+  );
+}
+```
+
+**State properties:**
+
+| Property        | Type                                                      | Description                             |
+| --------------- | --------------------------------------------------------- | --------------------------------------- |
+| `sdkStatus`     | `"uninitialized" \| "initializing" \| "ready" \| "error"` | SDK initialization status               |
+| `sdkError`      | `Error \| undefined`                                      | Error from SDK initialization           |
+| `source`        | `CurrentSource`                                           | Current source status, input, and error |
+| `lens`          | `CurrentLens`                                             | Current Lens status, IDs, and error     |
+| `lenses`        | `Lens[]`                                                  | Array of loaded Lens objects            |
+| `liveCanvas`    | `HTMLCanvasElement \| undefined`                          | Live preview canvas element             |
+| `captureCanvas` | `HTMLCanvasElement \| undefined`                          | Capture canvas element                  |
+| `keyboard`      | `Keyboard \| undefined`                                   | Keyboard API for Lens keyboard requests |
+| `isMuted`       | `boolean`                                                 | Whether audio is muted                  |
+| `fpsLimit`      | `number \| undefined`                                     | Current FPS limit                       |
+| `screenRegions` | `ScreenRegions \| undefined`                              | Current screen regions                  |
+
+**Methods:**
+
+| Method                                                 | Description                                             |
+| ------------------------------------------------------ | ------------------------------------------------------- |
+| `applySource(input, size?)`                            | Apply a media source (camera, video, or image)          |
+| `removeSource()`                                       | Remove the current source                               |
+| `fetchLens(lensId, groupId)`                           | Load a single Lens (returns cached if already loaded)   |
+| `fetchLenses(groupId)`                                 | Load all Lenses in a group (accepts string or string[]) |
+| `applyLens(lensId, groupId, launchData?, readyGuard?)` | Apply a Lens by ID                                      |
+| `removeLens()`                                         | Remove the current Lens                                 |
+| `refreshLens()`                                        | Remove and reapply the current Lens                     |
+| `reinitialize()`                                       | Re-bootstrap the SDK (useful after errors)              |
+| `setMuted(muted)`                                      | Set the muted state                                     |
+| `toggleMuted()`                                        | Toggle audio mute                                       |
+| `setFPSLimit(fps)`                                     | Set maximum rendering FPS                               |
+| `setScreenRegions(regions)`                            | Set screen regions for Lens-aware layout                |
+
+### useApplyLens
+
+Declaratively apply a Lens — it updates automatically when parameters change.
+
+```tsx
+import { useApplyLens } from "@snap/react-camera-kit";
+
+useApplyLens("YOUR_LENS_ID", "YOUR_LENS_GROUP_ID");
 ```
 
-if you need to access lens status (assuming `CameraKitProvider` context):
+| Parameter        | Type                  | Description                          |
+| ---------------- | --------------------- | ------------------------------------ |
+| `lensId`         | `string \| undefined` | Lens ID — pass `undefined` to remove |
+| `lensGroupId`    | `string \| undefined` | Lens Group ID                        |
+| `lensLaunchData` | `LensLaunchData`      | Optional launch parameters           |
+| `lensReadyGuard` | `() => Promise<void>` | Optional async ready guard           |
+
+### useApplySource
+
+Declaratively apply a media source. Defaults to camera if no source is provided.
+
+```tsx
+import { useApplySource } from "@snap/react-camera-kit";
+
+// Video source with fixed output size
+useApplySource({ kind: "video", url: "/demo.mp4", autoplay: true }, { mode: "fixed", width: 720, height: 1280 });
+```
+
+| Parameter    | Type          | Default              | Description    |
+| ------------ | ------------- | -------------------- | -------------- |
+| `source`     | `SourceInput` | `{ kind: "camera" }` | Media source   |
+| `outputSize` | `OutputSize`  | —                    | Rendering size |
+
+### usePlaybackOptions
+
+Declaratively set playback options.
+
+```tsx
+import { usePlaybackOptions } from "@snap/react-camera-kit";
+
+usePlaybackOptions({
+  fpsLimit: 30,
+  muted: false,
+  onError: (error) => console.error("Playback error:", error),
+});
+```
+
+| Option          | Type                    | Description                    |
+| --------------- | ----------------------- | ------------------------------ |
+| `fpsLimit`      | `number`                | Maximum rendering FPS          |
+| `muted`         | `boolean`               | Mute audio                     |
+| `screenRegions` | `ScreenRegions`         | Screen regions for Lens layout |
+| `onError`       | `(error, lens) => void` | Playback error callback        |
+
+## Media sources
+
+Pass a `SourceInput` to `LensPlayer`'s `source` prop or to `useApplySource`:
+
+```tsx
+// Camera (default)
+{ kind: "camera" }
+{ kind: "camera", deviceId: "abc123", options: { cameraFacing: "environment" } }
+
+// Video
+{ kind: "video", url: "/demo.mp4", autoplay: true }
+
+// Image
+{ kind: "image", url: "/photo.jpg" }
+```
+
+### Camera source options
+
+| Option              | Type                      | Default                        | Description                   |
+| ------------------- | ------------------------- | ------------------------------ | ----------------------------- |
+| `cameraFacing`      | `"user" \| "environment"` | `"user"`                       | Front or back camera          |
+| `cameraConstraints` | `MediaTrackConstraints`   | `{ width: 1280, height: 720 }` | Camera resolution constraints |
+| `cameraRotation`    | `0 \| -90 \| 90 \| 180`   | `0`                            | Camera rotation               |
+| `fpsLimit`          | `number`                  | —                              | Max FPS for the source        |
+| `outputSize`        | `OutputSize`              | —                              | Rendering canvas size         |
+
+### Output size
+
+```tsx
+// Fixed resolution
+{ mode: "fixed", width: 720, height: 1280 }
+
+// Match input source resolution
+{ mode: "match-input" }
+```
+
+## Handling loading and error states
+
+Use `useCameraKit()` to track the status of the SDK, source, and Lens. Each progresses through `"none" → "loading" → "ready"` (or `"error"`):
 
 ```tsx
 function Preview() {
-  const { lens } = useCameraKit();
+  const { sdkStatus, sdkError, source, lens } = useCameraKit();
+
+  if (sdkStatus === "error") return <p>SDK failed: {sdkError?.message}</p>;
+  if (sdkStatus !== "ready") return <p>Initializing...</p>;
+  if (source.status === "loading") return <p>Setting up camera...</p>;
+  if (lens.status === "error") return <p>Lens error: {lens.error?.message}</p>;
+
   return (
-    <LensPlayer lensId="YOUR_LENS_ID" lensGroupId="YOUR_GROUP_ID">
-      {lens.status !== "ready" && lens.status !== "error" && <Spinner />}
-      {lens.status === "error" && <Error error={lens.error} />}
-      {lens.status === "ready" && <LiveCanvas />}
+    <LensPlayer lensId="YOUR_LENS_ID" lensGroupId="YOUR_LENS_GROUP_ID">
+      {lens.status !== "ready" && <div className="spinner" />}
+      <LiveCanvas />
     </LensPlayer>
   );
 }
 ```
 
-When you need full control (assuming `CameraKitProvider` context):
+### Frame Metrics
+
+Use `useLensFrameMetrics` to monitor lens rendering performance:
 
 ```tsx
-function Preview() {
-  const { sdkStatus, source, lens } = useCameraKit();
-  useApplySource({ kind: "video", url: "/demo.mp4" }, { mode: "fixed", width: 720, height: 1280 });
-  useApplyLens("123", "abc", launchData);
-  usePlaybackOptions({ onError: (error) => console.error(error) });
+import { useLensFrameMetrics } from "@snap/react-camera-kit";
 
-  if (sdkStatus !== "ready" || source.status !== "ready" || lens.status !== "ready") {
-    return <Spinner />;
-  }
-  return <CaptureCanvas className="rounded-xl" />;
+function PerformanceOverlay() {
+  const metrics = useLensFrameMetrics({ interval: 500 });
+
+  if (!metrics) return null;
+
+  return (
+    <div>
+      <p>FPS: {metrics.avgFps.toFixed(1)}</p>
+      <p>Frame time: {metrics.lensFrameProcessingTimeMsAvg.toFixed(1)}ms</p>
+    </div>
+  );
 }
 ```
 
-## Development
+The hook accepts:
 
-```bash
-# Install dependencies
-npm install
+- `interval` (required) — polling interval in milliseconds
+- `enabled` (optional, defaults to `true`) — set to `false` to disable measurement without unmounting
 
-# Build the package (ESM + CJS)
-npm run build
+## Full example: Lens switcher
 
-# Build in watch mode (for development)
-npm run watch
+```tsx
+import { CameraKitProvider, LensPlayer, LiveCanvas, useCameraKit } from "@snap/react-camera-kit";
+import { useEffect } from "react";
+
+const LENS_GROUP_ID = "YOUR_LENS_GROUP_ID";
+
+function LensSwitcher() {
+  const { sdkStatus, lenses, lens, fetchLenses, applyLens, isMuted, toggleMuted, reinitialize, sdkError } =
+    useCameraKit();
+
+  useEffect(() => {
+    if (sdkStatus === "ready") fetchLenses(LENS_GROUP_ID);
+  }, [sdkStatus]);
+
+  if (sdkStatus === "error") {
+    return (
+      <div>
+        <p>SDK error: {sdkError?.message}</p>
+        <button onClick={reinitialize}>Retry</button>
+      </div>
+    );
+  }
 
-# Type checking
-npm run typecheck
+  return (
+    <div>
+      <select value={lens.lensId ?? ""} onChange={(e) => applyLens(e.target.value, LENS_GROUP_ID)}>
+        <option value="" disabled>
+          Select a Lens
+        </option>
+        {lenses.map((l) => (
+          <option key={l.id} value={l.id}>
+            {l.name}
+          </option>
+        ))}
+      </select>
+      <button onClick={toggleMuted}>{isMuted ? "Unmute" : "Mute"}</button>
+
+      <LensPlayer lensId={lens.lensId} lensGroupId={LENS_GROUP_ID}>
+        <LiveCanvas style={{ width: "100%", maxWidth: 640 }} />
+      </LensPlayer>
+    </div>
+  );
+}
 
-# Run tests
-npm test
+export default function App() {
+  return (
+    <CameraKitProvider apiToken="YOUR_API_TOKEN">
+      <LensSwitcher />
+    </CameraKitProvider>
+  );
+}
+```
 
-# Clean dist folder
-npm run clean
+## Utilities
+
+| Export                   | Description                                         |
+| ------------------------ | --------------------------------------------------- |
+| `createConsoleLogger()`  | Returns a logger that prints to the browser console |
+| `createNoopLogger()`     | Returns a silent logger (default)                   |
+| `isCameraSource(source)` | Type guard for `CameraSourceInput`                  |
+| `isVideoSource(source)`  | Type guard for `VideoSourceInput`                   |
+| `isImageSource(source)`  | Type guard for `ImageSourceInput`                   |
+| `CameraRotationOptions`  | Valid rotation values: `[0, -90, 90, 180]`          |
+
+## Development
+
+```bash
+npm install           # Install dependencies
+npm run build         # Build ESM + CJS
+npm run watch         # Build in watch mode
+npm run typecheck     # Type checking
+npm test              # Run tests
+npm run clean         # Clean dist folder
 ```
 
-## Demo App
+### Demo app
 
-A Vite demo app is available at `demo`.
+A Vite demo app is available in `demo/`:
 
 ```bash
 npm run demo:install
@@ -120,7 +386,7 @@ npm run demo:dev
 
 ## Contributing
 
-We welcome contributions! Please see our [Contributing Guidelines](CONTRIBUTING.md) for details on how to get started.
+We welcome contributions! Please see our [Contributing Guidelines](CONTRIBUTING.md) for details.
 
 - [Code of Conduct](CODE_OF_CONDUCT.md)
 - [Security Policy](SECURITY.md)

package/dist/cjs/CameraKitProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CameraKitProvider.d.ts","sourceRoot":"","sources":["../../src/CameraKitProvider.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"CameraKitProvider.d.ts","sourceRoot":"","sources":["../../src/CameraKitProvider.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/CameraKitProvider.js

@@ -142,6 +142,9 @@ const CameraKitProvider = ({ extendContainer, stabilityKey, children, createBoot
     (0, react_1.useEffect)(() => {
         const abortController = new AbortController();
         const emit = eventFactoryRef.current?.();
+        // Clear stale lens cache — the old kit's lensRepository is no longer valid.
+        lensCache.current.clear();
+        setLenses([]);
         setCameraKitState({ status: "initializing" });
         emit?.({ kind: "bootstrap-attempt" });
         log.info("bootstrap_attempt");