defineThreeLayer

Read as Markdown

import { defineThreeLayer } from "@pibbl/three";

defineThreeLayer() builds on defineRenderLayer. It creates one transparent THREE.WebGLRenderer per mounted Pibbl component identity and passes that renderer through PibblThreeLayerContext.

The required create(context, initialProps) callback returns an application PibblThreeLayerResources object containing a THREE.Scene and THREE.Camera. The complete PibblThreeLayerDefinition supports optional update, resize, render, targets, pick, and dispose callbacks define the rest of the synchronous lifecycle. If render is omitted, the adapter renders the returned scene and camera directly.

Objects returned from targets() use PibblThreeTarget.

The returned Pibbl component accepts the definition’s props plus the ordinary render-layer style, event, focus, pointer, key, and missBehavior props. See the Three.js guide for the complete lifecycle and interaction model.

API details from source

Defines a Pibbl external layer using ordinary Three.js scenes and resources. Each mount owns one transparent renderer; dispose must release application-created resources, and animation uses Pibbl’s supplied frame and invalidation.

defineThreeLayer: <Props, Resources extends PibblThreeLayerResources>(definition: PibblThreeLayerDefinition<Props, Resources>) => PibblComponent<PibblRenderLayerProps<Props>>

Related API: defineThreeLayer, PibblThreeLayerResources, PibblThreeLayerDefinition, PibblComponent, PibblRenderLayerProps.

Parameters

• definition — Resource lifecycle, rendering overrides, targets, and picking configuration. See PibblThreeLayerDefinition .

Returns

A Pibbl component mounting a persistent Three.js scene boundary with an adapter-owned renderer.

See also

PibblThreeLayerDefinition

PibblThreeLayerResources

View source — packages/three/src/lib/define-three-layer.ts:45

Implementation guidance for agents

Read the External renderers and Three.js companion for ownership, adaptation, failure modes, and verification. Agent start provides the version-selection workflow.

Complete minimal examples

• Three.js scene layer: Mount a lit Three.js cube with Pibbl target clicks and raycast picking. Plain source

Documentation version

Documentation built with @pibbl/core 0.0.2, revision 2dccb19. ALPHA — NOT FOR PRODUCTION USE.