Components

All components must be rendered inside a React Three Fiber <Canvas>. They do not render visible geometry – they set up post-processing effects, focus handling, and camera controls.

---

<PhotoMode />

Description:
Root component for the photo mode. Enables post-processing effects and allows taking screenshots. Must be placed inside <Canvas>.

Props:

Prop	Description
enabledEffects	Enables or disables built-in post-processing effects. By default, all effects are active except <Bloom />.
disableEvents	Disables mouse and touch events on the canvas while photo mode is active.
children	Additional effects can be added as children of <PhotoMode />.
...props	Forwarded to <EffectComposer /> (e.g., multisampling, render priority).

---

<AutoFocus />

Description:
Handles automatic or manual focus in the scene.

Props:

Prop	Description
initialAutoFocus	Sets initial autoFocus state.
initialDOFEnabled	Sets initial DOFEnabled state.
initialAperture	Sets initial aperture value.
initialFocusDistance	Sets initial focusDistance value.

Behavior:

State	Behavior
DOFEnabled = false OR photoModeOn = false	Depth of Field is disabled.
DOFEnabled = true, autoFocus = false	Focus is set manually at a fixed distance.
DOFEnabled = true, autoFocus = true	Focus adjusts automatically based on scene depth.

---

<PhotoModeControls />

Description:
Provides orbit, pan, and zoom camera controls using CameraControls from @react-three/drei. Saves and restores camera state when photo mode is toggled.

Prop	Description
restoreOnClose	Controls whether the user's camera state is restored after leaving photo mode. Default: true
animate	Determines whether the camera zoom restoration should be animated. Default: true
...props	Forwarded to <CameraControls /> - CameraControlsProps from @react-three/drei