doc site update

Author: felixtrz

.gitignore

@@ -84,3 +84,4 @@ example-local-build/**/public/ui/
 
 # Auto generated version files
 **/version.ts
+**/version.js

docs/.vitepress/config.ts

@@ -22,12 +22,29 @@ function loadTypedocSidebar() {
 export default defineConfig({
   // Build static site even if some cross-package API links are unresolved in early builds
   ignoreDeadLinks: true,
-  // base: '/immersive-web-sdk/',
   lang: 'en-US',
   title: 'Immersive Web SDK',
   description:
     'WebXR framework with ECS, input, locomotion, spatial UI, and tools.',
 
+  head: [
+    [
+      'script',
+      {
+        async: '',
+        src: 'https://www.googletagmanager.com/gtag/js?id=G-V03QDNGKY3',
+      },
+    ],
+    [
+      'script',
+      {},
+      `window.dataLayer = window.dataLayer || [];
+function gtag(){dataLayer.push(arguments);}
+gtag('js', new Date());
+gtag('config', 'G-V03QDNGKY3');`,
+    ],
+  ],
+
   themeConfig: {
     logo: {
       light: '/logo-light.svg',
@@ -126,7 +143,6 @@ export default defineConfig({
             { text: 'System', link: '/concepts/ecs/systems' },
             { text: 'Queries', link: '/concepts/ecs/queries' },
             { text: 'Lifecycle', link: '/concepts/ecs/lifecycle' },
-            { text: 'Config & Signals', link: '/concepts/ecs/config-signals' },
             { text: 'Patterns & Tips', link: '/concepts/ecs/patterns' },
             { text: 'Architecture', link: '/concepts/ecs/architecture' },
           ],
@@ -139,7 +155,6 @@ export default defineConfig({
               text: 'Interop: ECS ↔ Three.js',
               link: '/concepts/three-basics/interop-ecs-three',
             },
-            { text: 'Scene Graph', link: '/concepts/three-basics/scene-graph' },
             {
               text: 'Transforms & 3D Math',
               link: '/concepts/three-basics/transforms-math',
@@ -148,22 +163,6 @@ export default defineConfig({
               text: 'Meshes, Geometry & Materials',
               link: '/concepts/three-basics/meshes-geometry-materials',
             },
-            {
-              text: 'Cameras & Projections',
-              link: '/concepts/three-basics/cameras',
-            },
-            {
-              text: 'Lights & Environment',
-              link: '/concepts/three-basics/lights-environment',
-            },
-            {
-              text: 'Raycasting & Input',
-              link: '/concepts/three-basics/raycasting-input',
-            },
-            {
-              text: 'Rendering & Performance',
-              link: '/concepts/three-basics/rendering-performance',
-            },
           ],
         },
         {

docs/concepts/ecs/config-signals.md

@@ -23,11 +23,16 @@ const persistent = world.createTransformEntity(undefined, { persistent: true });
 ## Object3D Attachment
 
 ```ts
-const o = new (await import('@iwsdk/core')).Object3D();
-const withMesh = world.createTransformEntity(o);
+import { Mesh, BoxGeometry, MeshStandardMaterial } from '@iwsdk/core';
+
+const geometry = new BoxGeometry(1, 1, 1);
+const material = new MeshStandardMaterial({ color: 0x00ff00 });
+const mesh = new Mesh(geometry, material);
+
+const entity = world.createTransformEntity(mesh);
 ```
 
-`createTransformEntity` ensures `object3D` is detached when the entity is released.
+`createTransformEntity` is the recommended way to attach Three.js objects to entities. It ensures `object3D` is properly managed and detached when the entity is released.
 
 ## Component Operations
 

docs/concepts/ecs/entity.md

@@ -13,7 +13,6 @@ This is a practical, from‑zero introduction to Entity‑Component‑System (EC
   - [System](/concepts/ecs/systems)
   - [Queries](/concepts/ecs/queries)
   - [Lifecycle](/concepts/ecs/lifecycle)
-  - [Config & Signals](/concepts/ecs/config-signals)
   - [Patterns & Tips](/concepts/ecs/patterns)
 
 IWSDK’s ECS is powered by the elics runtime. IWSDK layers WebXR, Three.js scene ownership, and convenient helpers on top, but the core mental model is the same.
@@ -45,7 +44,6 @@ IWSDK’s ECS is powered by the elics runtime. IWSDK layers WebXR, Three.js scen
 
 - [Queries](/concepts/ecs/queries): live, efficient sets of entities that update automatically as components change. Support complex filtering with value predicates.
 - [Lifecycle](/concepts/ecs/lifecycle): understand when things happen — world boot sequence, system initialization, per-frame execution order, and cleanup.
-- [Config & Signals](/concepts/ecs/config-signals): reactive configuration that allows runtime tuning of system behavior from UI or debugging tools.
 - [Patterns & Tips](/concepts/ecs/patterns): proven composition patterns, performance optimizations, and debugging techniques for production use.
 
 ## Quick start: a complete feature in ~40 lines
@@ -360,7 +358,6 @@ export class InteractiveGlowSystem extends createSystem(
 - [Component](/concepts/ecs/components) — schemas, enums, vectors, defaults.
 - [System](/concepts/ecs/systems) — queries, lifecycle, config, cleanup.
 - [Queries](/concepts/ecs/queries) — required/excluded, qualify/disqualify events.
-- [Config & Signals](/concepts/ecs/config-signals) — reactive tuning at runtime.
 - [Patterns & Tips](/concepts/ecs/patterns) — common patterns, pitfalls, and performance notes.
 - [Architecture](/concepts/ecs/architecture) — deep dive into performance, memory layout, and WebXR integration.
 

docs/concepts/ecs/index.md

@@ -57,11 +57,50 @@ export class MySystem extends createSystem(
 
 ## Config Signals
 
-Each config key is a `Signal<T>` at `this.config.key`. Use `.value` to set, `.peek()` to read without tracking, and `.subscribe()` to react.
+System config values are reactive signals powered by `@preact/signals`. Each config key is a `Signal<T>` at `this.config.key`.
 
 ```ts
-this.config.speed.value = 3;
-this.config.speed.subscribe((v) => console.log('now', v));
+export class CameraShake extends createSystem(
+  {},
+  {
+    intensity: { type: Types.Float32, default: 0 },
+    decayPerSecond: { type: Types.Float32, default: 1 },
+  },
+) {
+  update(dt: number) {
+    const i = this.config.intensity.peek();
+    if (i <= 0) return;
+    // apply random offset scaled by i
+    this.camera.position.x += (Math.random() - 0.5) * 0.01 * i;
+    this.config.intensity.value = Math.max(
+      0,
+      i - this.config.decayPerSecond.peek() * dt,
+    );
+  }
+}
+```
+
+### Reading vs Tracking
+
+- `.value` — set and track.
+- `.peek()` — read without tracking to avoid incidental subscriptions.
+- `.subscribe(fn)` — run when the value changes.
+
+```ts
+const unsubscribe = this.config.intensity.subscribe((v) => console.log(v));
+// later
+unsubscribe();
+```
+
+### UI ↔ ECS Wiring
+
+Config signals are ideal for developer tools and UI controls:
+
+```ts
+// debugging slider
+document.getElementById('intensity')!.addEventListener('input', (e) => {
+  this.config.intensity.value = Number((e.target as HTMLInputElement).value);
+});
 ```
 
 ## Creating/Destroying Entities in Systems

docs/concepts/ecs/systems.md

@@ -48,44 +48,26 @@ Entity 12                      Object3D
 - [Transforms & 3D Math](/concepts/three-basics/transforms-math) — position, rotation, scale in 3D space
 - [Meshes, Geometry & Materials](/concepts/three-basics/meshes-geometry-materials) — the building blocks of 3D objects
 
-**Important Concepts:**
-
-- [Scene Graph](/concepts/three-basics/scene-graph) — how objects relate to each other in 3D hierarchies
-- [Cameras & Projections](/concepts/three-basics/cameras) — how 3D space appears on 2D screens
-- [Lights & Environment](/concepts/three-basics/lights-environment) — illuminating your 3D world
-
-**Advanced Topics:**
-
-- [Raycasting & Input](/concepts/three-basics/raycasting-input) — detecting what users point at or touch
-- [Rendering & Performance](/concepts/three-basics/rendering-performance) — keeping 90fps in VR/AR
-
 ## Quick Start: Your First 3D Object
 
 Here's how ECS and Three.js work together in IWSDK:
 
 ```ts
-import {
-  World,
-  Object3D,
-  BoxGeometry,
-  MeshStandardMaterial,
-} from '@iwsdk/core';
+import { World, Mesh, BoxGeometry, MeshStandardMaterial } from '@iwsdk/core';
 
 // 1) IWSDK creates renderer, scene, camera automatically
 const world = await World.create(container);
 
 // 2) Create a mesh using Three.js classes
 const geometry = new BoxGeometry(1, 1, 1);
 const material = new MeshStandardMaterial({ color: 0x00ff00 });
-const mesh = new Object3D();
-mesh.add(new Mesh(geometry, material));
+const mesh = new Mesh(geometry, material);
 
 // 3) Create an entity and attach the Three.js object
 const boxEntity = world.createTransformEntity(mesh);
 
-// 4) ECS data controls the Three.js visuals automatically
-const transform = boxEntity.getComponent(Transform)!;
-transform.position = [2, 1, 0]; // Box moves in 3D space
+// 4) Position the object in 3D space
+boxEntity.object3D.position.set(2, 1, 0);
 ```
 
 **What happened?**