@dcl-regenesislabs/opendcl 0.1.3-22336215175.commit-94dca45 → 0.1.3-22336575051.commit-c88f897

package/README.md

@@ -28,7 +28,7 @@ The result: **more creators building more scenes, faster.**
 - **Branded header** — on startup, displays a block-character "Decentraland" ASCII art banner with version and working directory. Falls back to a compact text header on narrow terminals
 - **Multi-provider LLM support** — works with Claude, OpenAI, Google, Ollama (free/local), OpenRouter, and more
 - **Scene-aware** — automatically detects your project's `scene.json`, SDK version, and entry points
-- **18 built-in skills** — scaffolding, 3D models, interactivity, UI, animations, multiplayer, authoritative server, audio/video, deployment (Genesis City & Worlds), optimization, smart items, camera control, lighting, player/avatar, NFT/blockchain, advanced rendering, advanced input
+- **19 built-in skills** — scaffolding, 3D models, interactivity, UI, animations, multiplayer, authoritative server, audio/video, deployment (Genesis City & Worlds), optimization, smart items, camera control, lighting, player/avatar, NFT/blockchain, advanced rendering, advanced input, scene runtime
 - **Integrated commands** — `/init` to scaffold, `/preview` to launch the dev server, `/tasks` to manage running processes, `/review` to audit code
 - **TypeScript validation** — catches type errors immediately after writing code
 - **Free asset catalogs** — 2,700+ Creator Hub 3D models, 900+ CC0-licensed models, and 50 audio files the agent proactively suggests when building scenes
@@ -126,6 +126,7 @@ OpenDCL loads domain-specific skills on demand based on what you're asking:
 | `nft-blockchain` | Display NFTs, wallet checks, smart contracts |
 | `advanced-rendering` | Billboards, 3D text, materials, transparency |
 | `advanced-input` | Cursor state, movement restriction, WASD patterns |
+| `scene-runtime` | Async tasks, fetch, timers, realm info, restricted actions, testing |
 
 ## How It Works
 
@@ -134,7 +135,7 @@ OpenDCL is built on [pi-coding-agent](https://github.com/badlogic/pi-mono), the
 - **System prompt** with SDK7 architecture knowledge (ECS, QuickJS sandbox, parcel constraints)
 - **Extensions** that detect your project, inject context, validate TypeScript, and provide slash commands
 - **Skills** with detailed guides for every common scene development task
-- **Reference docs** (87KB SDK reference, component tables, code examples, 3D asset and audio catalogs)
+- **Reference docs** (SDK cheat sheet, component tables, 3D asset and audio catalogs)
 
 The agent has full access to standard coding tools (read, write, edit, bash, grep, find) and uses them to understand and modify your scene code.
 

package/context/sdk7-cheat-sheet.md

@@ -0,0 +1,161 @@
+# SDK7 Cheat Sheet
+
+Quick reference for Decentraland SDK7 fundamentals. For detailed API usage, see the relevant skill.
+
+## Imports
+
+```typescript
+import { engine, Entity, Transform, GltfContainer, MeshRenderer, MeshCollider,
+  Material, AudioSource, VideoPlayer, TextShape, Animator, Tween, TweenSequence,
+  Billboard, VisibilityComponent, PointerEvents, Raycast, RaycastResult,
+  AvatarAttach, AvatarModifierArea, NftShape, CameraModeArea, VirtualCamera,
+  pointerEventsSystem, tweenSystem, inputSystem, raycastSystem,
+  InputAction, ColliderLayer, AvatarAnchorPointType, CameraType,
+  syncEntity, parentEntity, removeEntityWithChildren,
+  executeTask, Schemas } from '@dcl/sdk/ecs'
+import { Vector3, Quaternion, Color3, Color4, Matrix } from '@dcl/sdk/math'
+import ReactEcs, { ReactEcsRenderer, UiEntity, Label, Button, Input, Dropdown } from '@dcl/sdk/react-ecs'
+import { movePlayerTo, teleportTo, triggerEmote, changeRealm,
+  openExternalUrl, openNftDialog, triggerSceneEmote,
+  copyToClipboard } from '~system/RestrictedActions'
+import { getSceneInformation, getRealm, readFile } from '~system/Runtime'
+import { getWorldTime, getExplorerInformation } from '~system/EnvironmentApi'
+import { signedFetch, getHeaders } from '~system/SignedFetch'
+import { getPlayer } from '@dcl/sdk/src/players'
+```
+
+## ECS Core
+
+```typescript
+// Entities
+const entity = engine.addEntity()
+engine.removeEntity(entity)
+removeEntityWithChildren(engine, entity)
+
+// Components — CRUD
+Transform.create(entity, { position: Vector3.create(8, 1, 8) })
+const t = Transform.get(entity)           // read-only, throws if missing
+const t = Transform.getMutable(entity)     // mutable reference
+const t = Transform.getOrNull(entity)      // read-only, returns null if missing
+Transform.has(entity)                      // boolean
+Transform.deleteFrom(entity)               // remove component
+Transform.createOrReplace(entity, { ... }) // upsert
+
+// Systems
+engine.addSystem((dt: number) => { /* runs every frame */ })
+engine.addSystem(mySystem, priority)       // higher priority = runs first
+engine.removeSystem(mySystem)
+
+// Queries
+for (const [entity, transform, mesh] of engine.getEntitiesWith(Transform, MeshRenderer)) {
+  // iterate entities that have both components
+}
+```
+
+## Custom Components
+
+```typescript
+const MyComponent = engine.defineComponent('game::MyComponent', {
+  score: Schemas.Int,
+  label: Schemas.String,
+  active: Schemas.Boolean,
+  speed: Schemas.Float,
+  position: Schemas.Vector3,
+  color: Schemas.Color4,
+  items: Schemas.Array(Schemas.String),
+  data: Schemas.Map({ key: Schemas.String }),
+  opt: Schemas.Optional(Schemas.Int),
+  kind: Schemas.EnumNumber<MyEnum>(MyEnum, MyEnum.Default),
+  choice: Schemas.OneOf({ str: Schemas.String, num: Schemas.Int }),
+  timestamp: Schemas.Int64,  // use Int64 for Date.now() values
+})
+```
+
+## Reserved Entities
+
+```typescript
+engine.PlayerEntity   // the local player
+engine.CameraEntity   // the camera
+engine.RootEntity     // scene root (parent of all top-level entities)
+```
+
+## Math Utilities
+
+```typescript
+// Vector3
+Vector3.create(x, y, z)
+Vector3.add(a, b)        Vector3.subtract(a, b)
+Vector3.scale(v, n)      Vector3.normalize(v)
+Vector3.distance(a, b)   Vector3.lerp(a, b, t)
+Vector3.rotate(v, q)     Vector3.Zero()  Vector3.One()  Vector3.Up()
+
+// Quaternion
+Quaternion.fromEulerDegrees(x, y, z)
+Quaternion.fromAngleAxis(degrees, axis)
+Quaternion.lookRotation(forward, up?)
+Quaternion.multiply(a, b)
+Quaternion.toEulerAngles(q)
+Quaternion.slerp(a, b, t)
+Quaternion.Zero()  Quaternion.Identity()
+
+// Color
+Color3.create(r, g, b)          // 0-1 range
+Color4.create(r, g, b, a)       // 0-1 range
+Color4.Red() .Green() .Blue() .White() .Black() .Yellow() .Gray() .Purple()
+```
+
+## ColliderLayer Enum
+
+```typescript
+ColliderLayer.CL_NONE        // no collision
+ColliderLayer.CL_POINTER     // responds to pointer events / raycasts
+ColliderLayer.CL_PHYSICS     // blocks player movement
+ColliderLayer.CL_CUSTOM1 … CL_CUSTOM8  // user-defined layers
+```
+
+## scene.json Schema
+
+```json
+{
+  "ecs7": true,
+  "runtimeVersion": "7",
+  "display": { "title": "Scene Title", "description": "...", "navmapThumbnail": "thumbnail.png" },
+  "scene": { "parcels": ["0,0", "1,0"], "base": "0,0" },
+  "main": "bin/index.js",
+  "contact": { "name": "Author", "email": "email@example.com" },
+  "tags": ["game", "art"],
+  "spawnPoints": [
+    { "name": "spawn1", "default": true, "position": { "x": [1, 5], "y": [0, 0], "z": [2, 4] }, "cameraTarget": { "x": 8, "y": 1, "z": 8 } }
+  ],
+  "requiredPermissions": [
+    "ALLOW_TO_MOVE_PLAYER_INSIDE_SCENE",
+    "ALLOW_TO_TRIGGER_AVATAR_EMOTE",
+    "ALLOW_MEDIA_HOSTNAMES"
+  ],
+  "allowedMediaHostnames": ["video.example.com"],
+  "featureToggles": { "voiceChat": "enabled" },
+  "worldConfiguration": {
+    "name": "my-world.dcl.eth",
+    "skyboxConfig": { "fixedHour": 14.0 }
+  }
+}
+```
+
+## Scene Limits (by parcel count)
+
+| Parcels | Entities | Triangles | Textures (MB) | Materials | Bodies | Height (m) |
+|---------|----------|-----------|---------------|-----------|--------|------------|
+| 1       | 512      | 10,000    | 10            | 20        | 64     | 20         |
+| 2       | 1,024    | 10,000    | 10            | 20        | 64     | 20         |
+| 4       | 2,048    | 20,000    | 20            | 40        | 128    | 40         |
+| 9       | 4,096    | 40,000    | 40            | 80        | 256    | 40         |
+| 16      | 4,096    | 40,000    | 40            | 80        | 256    | 40         |
+
+## Runtime Restrictions
+
+- **Sandboxed QuickJS** — no Node.js APIs (`fs`, `http`, `path`, `process`)
+- **setTimeout/setInterval** — supported (runtime polyfill)
+- **fetch** — supported (plain and signed)
+- **WebSocket** — supported
+- **Entry point** — `export function main() {}` in `src/index.ts`
+- **All coordinates** — in meters, Y is up, origin at southwest corner of base parcel

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcl-regenesislabs/opendcl",
-  "version": "0.1.3-22336215175.commit-94dca45",
+  "version": "0.1.3-22336575051.commit-c88f897",
   "description": "AI coding assistant for Decentraland SDK7 scene development",
   "type": "module",
   "bin": {
@@ -66,5 +66,5 @@
     "prompts/",
     "context/"
   ],
-  "commit": "94dca4521a7916dddf82d5ce3883c0c853b93c2a"
+  "commit": "c88f897269368599d19ce4323a89cc4889e58ec3"
 }

package/prompts/system.md

@@ -9,7 +9,7 @@ You are **OpenDCL**, an AI coding assistant specialized in Decentraland SDK7 sce
 - You help creators build interactive 3D scenes for Decentraland using SDK7.
 - You are beginner-friendly: always explain what you're doing and why.
 - You are precise about SDK7 APIs and never invent components or functions that don't exist.
-- When unsure, read the context files in the `context/` directory for accurate SDK7 reference.
+- When unsure, read the `context/sdk7-cheat-sheet.md` for quick SDK7 reference, or rely on the relevant skill for detailed API docs.
 
 ## Decentraland SDK7 Fundamentals
 
@@ -96,8 +96,7 @@ scene-project/
 ### Empty Folder (No scene.json)
 1. Ask the user what they want to build.
 2. **Use the `init` tool first** — this uses the official SDK scaffolding to create scene.json, package.json, tsconfig.json, and src/index.ts with the correct, up-to-date configuration, and installs dependencies. Never create these files manually.
-3. After init completes, customize `scene.json` (title, description, parcels) and `src/index.ts` (scene code) based on what the user wants.
-4. Use the `preview` tool to start the preview server.
+3. After init completes, customize `scene.json` (title, description, parcels) and add the first element to `src/index.ts`. Then offer next steps — don't build the entire scene at once.
 
 ### Existing Scene
 1. Read scene.json and src/index.ts to understand the project.
@@ -110,7 +109,7 @@ scene-project/
 - For 3D models, use `GltfContainer.create(entity, { src: 'models/myModel.glb' })`.
 - `GltfContainer` only works with **local files** — never use external URLs for the `src` field. Always download models into the scene's `models/` directory first.
 - Place `.glb` files in a `models/` directory, textures in `images/`.
-- After writing TypeScript, use the `preview` tool to start the preview server.
+- Don't start the preview server automatically after writing code. The user will type `/preview` when ready.
 - **Proactively suggest 3D assets**: When building a scene, always check both asset catalogs for free models that match the user's theme:
   - `context/open-source-3d-assets.md` — 991 CC0 models from Polygonal Mind (nature, medieval, cyberpunk, sci-fi, etc.)
   - `context/asset-packs-catalog.md` — 2,700+ models from the official Decentraland Creator Hub (furniture, structures, decorations, etc.)
@@ -126,3 +125,9 @@ You have these Decentraland-specific tools — **use them directly** when the us
 
 The user can also type these as `/init`, `/preview`, `/deploy`, `/tasks` slash commands directly.
 Additional user-only commands: `/review`, `/explain`, `/setup`, `/setup-ollama`
+
+## Pacing
+
+**New scenes (no scene.json):** Work one step at a time. Scaffold first, then add one thing (a model, a piece of interactivity, a UI element). After each step, briefly say what you did and offer 2-3 concrete next steps as a numbered list. Don't combine unrelated changes in one response. If the user asks for something complex ("build a medieval tavern"), break it into steps and do the first one.
+
+**Existing scenes:** Do exactly what the user asks — one focused change per response. Don't pile on extras the user didn't request (e.g., if they ask to add a door, don't also add furniture, lighting, and a UI). Keep each response to one logical change unless the user explicitly asks for more.

package/skills/add-3d-models/SKILL.md

@@ -128,6 +128,23 @@ curl -o models/tree.glb "https://raw.githubusercontent.com/ToxSam/cc0-models-Pol
 
 > **Important**: `GltfContainer` only works with **local files**. Never use external URLs for the model `src` field. Always download models into `models/` first.
 
+### Checking Model Load State
+
+Use `GltfContainerLoadingState` to check if a model has finished loading:
+
+```typescript
+import { GltfContainer, GltfContainerLoadingState, LoadingState } from '@dcl/sdk/ecs'
+
+engine.addSystem(() => {
+  const state = GltfContainerLoadingState.getOrNull(modelEntity)
+  if (state && state.currentState === LoadingState.FINISHED) {
+    console.log('Model loaded successfully')
+  } else if (state && state.currentState === LoadingState.FINISHED_WITH_ERROR) {
+    console.log('Model failed to load')
+  }
+})
+```
+
 ## Model Best Practices
 
 - Keep models under 50MB per file for good loading times

package/skills/add-interactivity/SKILL.md

@@ -186,6 +186,33 @@ pointerEventsSystem.onPointerDown(
 )
 ```
 
+### Raycast System Helpers
+
+Use `raycastSystem` for convenient raycasting without manual component management:
+
+```typescript
+import { raycastSystem, RaycastQueryType, ColliderLayer } from '@dcl/sdk/ecs'
+
+// Register a continuous local-direction raycast
+raycastSystem.registerLocalDirectionRaycast(
+  { entity: myEntity, opts: { queryType: RaycastQueryType.RQT_HIT_FIRST, direction: Vector3.Forward(), maxDistance: 16, collisionMask: ColliderLayer.CL_POINTER } },
+  (result) => {
+    if (result.hits.length > 0) {
+      console.log('Hit:', result.hits[0].entityId)
+    }
+  }
+)
+
+// Register a global-direction raycast
+raycastSystem.registerGlobalDirectionRaycast(
+  { entity: myEntity, opts: { queryType: RaycastQueryType.RQT_HIT_FIRST, direction: Vector3.Down(), maxDistance: 20 } },
+  (result) => { /* handle hits */ }
+)
+
+// Remove raycast from entity
+raycastSystem.removeRaycasterEntity(myEntity)
+```
+
 ## Best Practices
 
 - Always set `maxDistance` on pointer events (8-16m is typical)

package/skills/advanced-input/SKILL.md

@@ -235,4 +235,3 @@ engine.addSystem(actionBarSystem)
 - WASD keys (`IA_FORWARD`, etc.) also control player movement — polling them reads the movement state but doesn't override it
 
 For basic pointer events and click handlers, see the `add-interactivity` skill.
-For component field details, see `context/components-reference.md`.

package/skills/advanced-rendering/SKILL.md

@@ -50,8 +50,7 @@ Transform.create(label, { position: Vector3.create(8, 3, 8) })
 TextShape.create(label, {
   text: 'Hello World!',
   fontSize: 24,
-  fontWeight: 'bold',
-  color: Color4.White(),
+  textColor: Color4.White(),
   outlineColor: Color4.Black(),
   outlineWidth: 0.1,
   textAlign: TextAlignMode.TAM_MIDDLE_CENTER
@@ -83,7 +82,7 @@ Transform.create(floatingLabel, { position: Vector3.create(8, 4, 8) })
 TextShape.create(floatingLabel, {
   text: 'NPC Name',
   fontSize: 16,
-  color: Color4.White(),
+  textColor: Color4.White(),
   outlineColor: Color4.Black(),
   outlineWidth: 0.08,
   textAlign: TextAlignMode.TAM_BOTTOM_CENTER
@@ -213,6 +212,52 @@ function lodSystem() {
 engine.addSystem(lodSystem)
 ```
 
+### Per-Node Material Overrides (GltfNodeModifiers)
+
+Override materials on specific nodes within a GLTF model without modifying the model file:
+
+```typescript
+import { GltfNode, GltfNodeState } from '@dcl/sdk/ecs'
+
+// Hide a specific node in a model
+GltfNode.create(entity, { path: 'RootNode/Armor', visible: false })
+
+// Override a node's material
+GltfNode.create(entity, {
+  path: 'RootNode/Helmet',
+  materialOverride: Material.Texture.Common({ src: 'images/custom-skin.png' })
+})
+```
+
+### Avatar Texture
+
+Generate a texture from a player's avatar:
+
+```typescript
+Material.setPbrMaterial(portraitFrame, {
+  texture: Material.Texture.Avatar({ userId: '0x...' })
+})
+```
+
+### Texture Modes
+
+Control how textures are filtered and wrapped:
+
+```typescript
+import { TextureFilterMode, TextureWrapMode } from '@dcl/sdk/ecs'
+
+Material.setPbrMaterial(entity, {
+  texture: Material.Texture.Common({
+    src: 'images/pixel-art.png',
+    filterMode: TextureFilterMode.TFM_POINT,    // crisp pixels (no smoothing)
+    wrapMode: TextureWrapMode.TWM_REPEAT        // tile the texture
+  })
+})
+```
+
+Filter modes: `TFM_POINT` (pixelated), `TFM_BILINEAR` (smooth), `TFM_TRILINEAR` (smoothest).
+Wrap modes: `TWM_REPEAT` (tile), `TWM_CLAMP` (stretch edges), `TWM_MIRROR` (mirror tile).
+
 ## Best Practices
 
 - Use `BillboardMode.BM_Y` instead of `BM_ALL` — looks more natural and renders faster
@@ -222,5 +267,3 @@ engine.addSystem(lodSystem)
 - `MTM_ALPHA_TEST` is cheaper than `MTM_ALPHA_BLEND` — use cutout when smooth transparency isn't needed
 - Combine Billboard + TextShape for floating name labels above NPCs or objects
 - Use VisibilityComponent for LOD systems instead of removing/re-adding entities
-
-For more component details, see `context/components-reference.md`.

package/skills/animations-tweens/SKILL.md

@@ -163,6 +163,72 @@ function spinSystem(dt: number) {
 engine.addSystem(spinSystem)
 ```
 
+### Tween Helper Methods
+
+Use shorthand helpers instead of creating Tween components manually:
+
+```typescript
+import { Tween, EasingFunction } from '@dcl/sdk/ecs'
+
+// Move
+Tween.createOrReplace(entity, Tween.setMove(
+  Vector3.create(0, 1, 0), Vector3.create(0, 3, 0),
+  { duration: 1500, easingFunction: EasingFunction.EF_EASEINBOUNCE }
+))
+
+// Rotate
+Tween.createOrReplace(entity, Tween.setRotate(
+  Quaternion.fromEulerDegrees(0, 0, 0), Quaternion.fromEulerDegrees(0, 180, 0),
+  { duration: 2000, easingFunction: EasingFunction.EF_EASEOUTQUAD }
+))
+
+// Scale
+Tween.createOrReplace(entity, Tween.setScale(
+  Vector3.One(), Vector3.create(2, 2, 2),
+  { duration: 1000, easingFunction: EasingFunction.EF_LINEAR }
+))
+```
+
+### Yoyo Loop Mode
+
+`TL_YOYO` reverses the tween at each end instead of restarting:
+
+```typescript
+TweenSequence.create(entity, {
+  sequence: [{ duration: 1000, ... }],
+  loop: TweenLoop.TL_YOYO
+})
+```
+
+### Detecting Tween Completion
+
+Use `tweenSystem.tweenCompleted()` to check if a tween finished this frame:
+
+```typescript
+engine.addSystem(() => {
+  if (tweenSystem.tweenCompleted(entity)) {
+    console.log('Tween finished on', entity)
+  }
+})
+```
+
+### Animator Extras
+
+Additional `Animator` features:
+
+```typescript
+// Get a specific clip to modify
+const clip = Animator.getClip(entity, 'Walk')
+
+// shouldReset: restart animation from beginning when re-triggered
+Animator.playSingleAnimation(entity, 'Attack', true) // resets to start
+
+// weight: blend between animations (0.0 to 1.0)
+const anim = Animator.getMutable(entity)
+anim.states[0].weight = 0.5  // blend walk at 50%
+anim.states[1].weight = 0.5  // blend idle at 50%
+```
+
 ## Best Practices
 
 - Use Tweens for simple A-to-B animations (doors, platforms, UI elements)

package/skills/audio-video/SKILL.md

@@ -227,6 +227,68 @@ AudioSource.create(entity, { audioClipUrl: 'sounds/ambient_1.mp3', playing: true
 
 > **Important**: `AudioSource` only works with **local files**. Never use external URLs for the `audioClipUrl` field. Always download audio into `sounds/` first.
 
+### Video State Polling
+
+Check video playback state programmatically:
+
+```typescript
+import { videoEventsSystem, VideoState } from '@dcl/sdk/ecs'
+
+engine.addSystem(() => {
+  const state = videoEventsSystem.getVideoState(videoEntity)
+  if (state) {
+    console.log('Video state:', state.state) // VideoState.VS_PLAYING, VS_PAUSED, etc.
+    console.log('Current time:', state.currentOffset)
+  }
+})
+```
+
+### Audio Playback Events
+
+Use the `AudioEvent` component to detect audio state changes:
+
+```typescript
+import { AudioEvent } from '@dcl/sdk/ecs'
+
+engine.addSystem(() => {
+  const event = AudioEvent.getOrNull(audioEntity)
+  if (event) {
+    console.log('Audio state:', event.state) // playing, paused, finished
+  }
+})
+```
+
+### Permission for External Media
+
+External audio/video URLs require the `ALLOW_MEDIA_HOSTNAMES` permission in scene.json:
+
+```json
+{
+  "requiredPermissions": ["ALLOW_MEDIA_HOSTNAMES"],
+  "allowedMediaHostnames": ["stream.example.com", "cdn.example.com"]
+}
+```
+
+### Multiple Video Surfaces
+
+Share one VideoPlayer across multiple screens by referencing the same `videoPlayerEntity`:
+
+```typescript
+Material.setPbrMaterial(screen1, {
+  texture: Material.Texture.Video({ videoPlayerEntity: videoEntity })
+})
+Material.setPbrMaterial(screen2, {
+  texture: Material.Texture.Video({ videoPlayerEntity: videoEntity })
+})
+```
+
+### Video Limits & Tips
+
+- **Simultaneous videos**: 1 in preview, 5 in Explorer, 10 max across the scene
+- **Distance-based control**: Pause video when player is far away to save bandwidth
+- **Supported formats**: `.mp4` (H.264), `.webm`, HLS (`.m3u8`) for live streaming
+- **Live streaming**: Use HLS (`.m3u8`) URLs — most reliable across clients
+
 ## Important Notes
 
 - Audio files must be in the project's directory (relative paths from project root)

package/skills/authoritative-server/SKILL.md

@@ -7,7 +7,7 @@ description: Build multiplayer scenes with a headless authoritative server that
 
 Build multiplayer Decentraland scenes where a **headless server** controls game state, validates changes, and prevents cheating. The same codebase runs on both server and client, with the server having full authority.
 
-Before reading this skill, read `{baseDir}/../../context/sdk7-complete-reference.md` for general SDK7 knowledge. For basic CRDT multiplayer (no server), see the `multiplayer-sync` skill instead.
+For basic CRDT multiplayer (no server), see the `multiplayer-sync` skill instead.
 
 ## Setup
 
@@ -315,7 +315,7 @@ Put synced components and messages in `shared/` so both server and client import
 - **Log prefixes**: Use `[Server]` and `[Client]` prefixes in `console.log()` to distinguish server and client output in the terminal.
 - **Stale CRDT files**: If you see "Outside of the bounds of written data" errors, delete `main.crdt` and `main1.crdt` files and restart.
 - **Storage inspection**: Check `node_modules/@dcl/sdk-commands/.runtime-data/server-storage.json` to inspect persisted data during local development.
-- **No setTimeout/setInterval**: The DCL runtime does not support these. Use `engine.addSystem()` with a timer variable instead.
+- **Timers**: `setTimeout`/`setInterval` are available via runtime polyfill. For game logic, prefer `engine.addSystem()` with a delta-time accumulator to stay in sync with the frame loop.
 - **Entity sync issues**: Verify you call `syncEntity(entity, [componentIds])` with the correct component IDs (`MyComponent.componentId`).
 
 ## Important Notes
@@ -324,6 +324,6 @@ Put synced components and messages in `shared/` so both server and client import
 - **Room readiness**: Clients must wait for `RealmInfo.get(engine.RootEntity).isConnectedSceneRoom` before sending messages.
 - **Custom vs built-in validation**: Custom components use global `validateBeforeChange((value) => ...)`. Built-in components (Transform, GltfContainer) use per-entity `validateBeforeChange(entity, (value) => ...)`.
 - **Single codebase**: Both server and client run the same `index.ts` entry point. Use `isServer()` to branch.
-- **No Node.js APIs**: The DCL runtime uses sandboxed QuickJS — no `fs`, `http`, `setTimeout`, etc. Use SDK-provided APIs (Storage, EnvVar, engine systems) instead.
+- **No Node.js APIs**: The DCL runtime uses sandboxed QuickJS — no `fs`, `http`, etc. `setTimeout`/`setInterval` are supported. Use SDK-provided APIs (Storage, EnvVar, engine systems) for server-side operations.
 - **SDK branch**: The auth-server pattern requires `@dcl/sdk@auth-server`, not the standard `@dcl/sdk` package.
 - For basic CRDT multiplayer without a server, see the `multiplayer-sync` skill.

package/skills/build-ui/SKILL.md

@@ -227,6 +227,76 @@ const HealthBar = () => (
 />
 ```
 
+### Screen Dimensions
+
+Read screen size via `UiCanvasInformation`:
+
+```typescript
+import { UiCanvasInformation } from '@dcl/sdk/ecs'
+
+engine.addSystem(() => {
+  const canvas = UiCanvasInformation.getOrNull(engine.RootEntity)
+  if (canvas) {
+    console.log('Screen:', canvas.width, 'x', canvas.height)
+  }
+})
+```
+
+### Nine-Slice Textures
+
+Use `textureSlices` for scalable UI backgrounds (buttons, panels) that don't stretch corners:
+
+```tsx
+<UiEntity
+  uiTransform={{ width: 200, height: 100 }}
+  uiBackground={{
+    textureMode: 'nine-slices',
+    texture: { src: 'images/panel.png' },
+    textureSlices: { top: 0.1, bottom: 0.1, left: 0.1, right: 0.1 }
+  }}
+/>
+```
+
+### Hover Events
+
+Respond to mouse enter/leave for hover effects:
+
+```tsx
+<UiEntity
+  uiTransform={{ width: 100, height: 40 }}
+  onMouseEnter={() => { isHovered = true }}
+  onMouseLeave={() => { isHovered = false }}
+  uiBackground={{ color: isHovered ? Color4.White() : Color4.Gray() }}
+/>
+```
+
+### Flex Wrap
+
+Allow UI children to wrap to the next line:
+
+```tsx
+<UiEntity uiTransform={{ flexWrap: 'wrap', width: 300 }}>
+  {items.map(item => (
+    <UiEntity key={item.id} uiTransform={{ width: 80, height: 80, margin: 4 }} />
+  ))}
+</UiEntity>
+```
+
+### Dropdown Extras
+
+The `Dropdown` component supports additional props:
+
+```tsx
+<Dropdown
+  options={['Option A', 'Option B', 'Option C']}
+  selectedIndex={selectedIdx}
+  onChange={(idx) => { selectedIdx = idx }}
+  fontSize={14}
+  color={Color4.White()}
+  disabled={false}
+/>
+```
+
 ## Important Notes
 
 - React hooks (`useState`, `useEffect`, etc.) are **NOT** available — use module-level variables

package/skills/camera-control/SKILL.md

@@ -206,5 +206,3 @@ engine.addSystem(followNpcCamera)
 - Read camera state via `engine.CameraEntity` — never try to write to it directly
 - For look-at detection, combine camera position with raycasting (see `add-interactivity` skill)
 - Camera control is read-only outside of VirtualCamera and CameraModeArea — you cannot directly move the player's camera
-
-For component field details, see `context/components-reference.md`.