Variable: Interactable
const
Interactable:Component
<{ }>
Defined in: packages/core/src/input/state-tags.ts:36
Marks an entity as eligible for XR/UI pointer interaction.
Remarks
- The InputSystem discovers all entities with
Interactable
and, when XR visibility is Visible, registers their Object3D roots as raycast targets (computing BVHs for meshes to accelerate intersection tests). - When a pointer enters/leaves or presses/releases on the entity, the system adds/removes the transient tags Hovered and Pressed so other systems can react declaratively without manual event wiring.
- Add this tag to the root Object3D of your UI/interactive object. Children are implicitly covered because the InputSystem registers the whole subtree.
Example
ts
export class HighlightSystem extends createSystem({ items: { required: [Interactable] } }) {
update() {
this.queries.items.entities.forEach(e => {
e.object3D.visible = !e.hasComponent(Pressed);
e.object3D.material.emissiveIntensity = e.hasComponent(Hovered) ? 1.0 : 0.0;
});
}
}