Behaviors

What Are Behaviors?
Behaviors are reusable scripts that attach directly to existing Components in awe. They let you add extra logic (e.g. rotation, interaction) without creating new Components.

Minimal Behavior

Create a new script with:

import { ScriptBehavior } from '@oo/scripting'
 
export default class ExampleBehavior extends ScriptBehavior {}

To attach it, drag and drop onto a component or item in the list or select any Component in the Studio (World Items panel), click “+” → choose a Behavior

Note: You cannot delete a script if its Behavior is still attached to a scene object.

Adding Actions

For a simple rotation, add onUpdate:

onUpdate(dt: number) {
  this.host.rotation.y += 0.5 * dt;
}

this.host refers to the attached Component.
Behaviors support other lifecycle methods like onStart or onDispose.

Frontend Customization (Parameters)

Expose settings to the Studio UI using params:

import { ScriptBehavior, $Param as P } from '@oo/scripting'
 
export default class SpinBehavior extends ScriptBehavior {
  speed = P.Number(0.5);
 
  onUpdate(dt: number) {
    this.host.rotation.y += this.speed * dt
  }
}

Users can now adjust speed in the Inspector.

See all available param types (opens in a new tab)

Organizing UI with Folders

Use @Folder to group parameters:

import { ScriptBehavior, $Param as P, Folder } from '@oo/scripting'
 
export default class ExampleBehavior extends ScriptBehavior {
  @Folder("Rotation Settings")
  speed = P.Number(0.5, { step: 0.1 });
 
  @Folder("Extra")
  color = P.Color("#ffffff");
}

Config

You can add descriptive metadata:

static config = {
  title: "Spin Behavior",
  description: "Rotates the attached component",
  tip: "Adjust speed as desired",
}

Docs Companion

Check out a remixable Behavior example (opens in a new tab) to see code and settings in action.