Configuration and presets

ViewerConfig

ViewerConfig is the complete runtime state for transforms, pivot, camera, scene, lighting, embedded animation, diagnostics, and immersive sequence.

interface ViewerConfig {
  model: ModelTransformConfig
  pivot: PivotConfig
  camera: CameraConfig
  scene: SceneConfig
  lights: LightConfig
  animation: AnimationConfig
  visualization: VisualizationConfig
  sequence: SequenceConfig
  gizmoMode: 'translate' | 'rotate' | 'scale'
  showGizmo: boolean
}

Deep partial input

Most configuration props accept DeepPartial<ViewerConfig>, so a caller can override only the needed values:

<ModelLabViewer
  src="/models/product.glb"
  config={{
    camera: { fov: 32 },
    scene: { background: '#f7f7f5', floor: false },
  }}
/>

Use createViewerConfig() when you need a complete, independently mutable object:

const config = createViewerConfig({
  camera: { fov: 32 },
})

Exported preset

A full export wraps the viewer config and material overrides:

interface ViewerExportPayload {
  schema: '3d-model-lab/v2'
  asset: { name: string; fileBytes: number }
  viewer: ViewerConfig
  materials: MaterialOverride[]
}

Validate unknown JSON before rendering it:

const preset = parseViewerPreset(JSON.parse(rawText))

Precedence

When both preset and config are supplied, config wins. When sequence is supplied, it replaces the sequence found in the merged viewer configuration.