chore: apply formatting fixes and add missing newlines across docs and examples

Summary: apply formatting fixes and add missing newlines across docs and examples with pnpm run format

Reviewed By: zjm-meta

Differential Revision:
D89688995

Privacy Context Container: L1334777

fbshipit-source-id: 6c1d7c67445001dc361b8a79f008dea4209f45a8

Author: felixtrz

docs/concepts/ecs/entity.md

@@ -77,6 +77,7 @@ entity.dispose();
 
 ::: warning
 **Use with caution!** `dispose()` is destructive and will free GPU memory for:
+
 - All geometries attached to the entity's `object3D` and its children
 - All materials (including shared materials)
 - All textures referenced by those materials
@@ -86,12 +87,12 @@ If other entities share the same geometry, material, or texture, they will break
 
 ### When to use each
 
-| Scenario | Method |
-|----------|--------|
-| Removing an entity that uses shared/reusable assets | `destroy()` |
+| Scenario                                                   | Method      |
+| ---------------------------------------------------------- | ----------- |
+| Removing an entity that uses shared/reusable assets        | `destroy()` |
 | Removing an entity with unique, one-off geometry/materials | `dispose()` |
-| Level unloading with asset reuse | `destroy()` |
-| Full cleanup of procedurally generated content | `dispose()` |
+| Level unloading with asset reuse                           | `destroy()` |
+| Full cleanup of procedurally generated content             | `dispose()` |
 
 ### Example: Safe cleanup pattern
 

docs/concepts/grabbing/distance-grabbing.md

@@ -19,7 +19,7 @@ DistanceGrabHandle.update() called
   ↓
 Switch based on movementMode:
   ├─ MoveTowardsTarget → Step-based interpolation
-  ├─ MoveAtSource → Delta tracking  
+  ├─ MoveAtSource → Delta tracking
   ├─ MoveFromTarget → Direct ray mapping
   └─ RotateAtSource → Rotation-only mode
   ↓
@@ -40,7 +40,8 @@ const distance = pointerOrigin.distanceTo(position);
 
 if (distance > this.moveSpeed) {
   // Calculate step vector toward target
-  const step = pointerOrigin.sub(position)
+  const step = pointerOrigin
+    .sub(position)
     .normalize()
     .multiplyScalar(this.moveSpeed);
   position.add(step);
@@ -95,7 +96,7 @@ this.previousPointerOrigin.copy(current);
 - **Distance Independence**: Object depth doesn't affect lateral movement sensitivity
 - **Local Coordinate Response**: Movement feels natural in controller's reference frame
 
-#### Design Trade-offs  
+#### Design Trade-offs
 
 - **Naturalness vs Precision**: Feels intuitive but lacks absolute positioning
 - **Responsiveness vs Stability**: Immediate response but susceptible to hand jitter
@@ -147,11 +148,11 @@ Objects rotate in place without translation or scaling, using automatic constrai
 
 ```ts
 // Translation and scale automatically disabled
-translate: movementMode === MovementMode.RotateAtSource 
-  ? ('as-rotate' as const) 
+translate: movementMode === MovementMode.RotateAtSource
+  ? ('as-rotate' as const)
   : /* normal translate config */,
-scale: movementMode === MovementMode.RotateAtSource 
-  ? false 
+scale: movementMode === MovementMode.RotateAtSource
+  ? false
   : /* normal scale config */
 ```
 
@@ -215,14 +216,14 @@ The system captures initial transform state during handle creation:
 
 - **Magical/Fantasy**: MoveTowardsTarget for supernatural pull effects
 - **Technical/Precise**: MoveFromTarget for exact positioning
-- **Natural/Intuitive**: MoveAtSource for gesture-based manipulation  
+- **Natural/Intuitive**: MoveAtSource for gesture-based manipulation
 - **Constrained/Fixed**: RotateAtSource for orientation-only controls
 
 ### User Experience Goals
 
-- **Comfort First**: MoveTowardsTarget reduces motion sickness through predictable movement  
+- **Comfort First**: MoveTowardsTarget reduces motion sickness through predictable movement
 - **Control First**: MoveFromTarget provides maximum manipulation precision
 - **Natural First**: MoveAtSource feels most similar to direct hand movement
 - **Simplicity First**: RotateAtSource eliminates position complexity
 
-The system's flexibility allows mixing movement modes within the same application, with each object configured for its specific interaction requirements.
+The system's flexibility allows mixing movement modes within the same application, with each object configured for its specific interaction requirements.

docs/concepts/grabbing/index.md

@@ -7,7 +7,7 @@ title: Grabbing Overview
 Interactive object manipulation is foundational to immersive experiences. IWSDK provides a comprehensive grabbing system that enables natural, performant object interaction through three distinct manipulation patterns—each optimized for different use cases and comfort requirements.
 
 - **One-Hand Grabbing** — Direct single input manipulation for basic interactions
-- **Two-Hand Grabbing** — Dual-hand manipulation with scaling capabilities for precise control  
+- **Two-Hand Grabbing** — Dual-hand manipulation with scaling capabilities for precise control
 - **Distance Grabbing** — Ray-based remote manipulation with telekinetic-style interactions
 
 Under the hood, the system bridges IWSDK's ECS architecture with the `@pmndrs/handle` library, providing automatic handle lifecycle management, performance optimizations, and seamless integration with the input system.
@@ -37,7 +37,7 @@ The grabbing system operates through a unified `GrabSystem` that automatically c
 Entity with Grabbable Component
   ↓
 GrabSystem detects via queries
-  ↓  
+  ↓
 Creates HandleStore instance
   ↓
 Configures pointer events & constraints
@@ -59,16 +59,19 @@ The system uses reactive ECS queries to manage handle creation and cleanup:
 ## Core Design Principles
 
 ### Automatic Integration
+
 - The system discovers grabbable entities through ECS queries rather than manual registration
 - Handle creation, updates, and cleanup happen automatically based on component presence
 - Multi-pointer coordination (left/right hand sub-pointers) is enabled automatically when the system is active
 
 ### Constraint-Based Control
+
 - All transformation types (rotate, translate, scale) support per-axis min/max constraints
 - Specialized movement modes provide different manipulation semantics
 - Pointer event filtering prevents interaction conflicts
 
 ### Seamless Library Integration
+
 - Acts as a bridge between IWSDK's ECS and `@pmndrs/handle`'s imperative API
 - Translates component data into handle configurations automatically
 - Maintains separation of concerns between interaction logic and ECS lifecycle
@@ -94,23 +97,26 @@ World.create(document.getElementById('scene-container'), {
   entity.addComponent(OneHandGrabbable, {
     rotate: true,
     translate: true,
-    rotateMin: [-Math.PI/4, -Math.PI, -Math.PI/4],
-    rotateMax: [Math.PI/4, Math.PI, Math.PI/4],
+    rotateMin: [-Math.PI / 4, -Math.PI, -Math.PI / 4],
+    rotateMax: [Math.PI / 4, Math.PI, Math.PI / 4],
   });
 });
 ```
 
 ## When to Use Which Pattern
 
 ### One-Hand Grabbing
+
 - Direct manipulation with immediate response
 - Best for: tools, simple objects, quick interactions
 
-### Two-Hand Grabbing  
+### Two-Hand Grabbing
+
 - Advanced manipulation including scaling operations
 - Best for: resizable objects, precise positioning, complex manipulation
 
 ### Distance Grabbing
+
 - Remote manipulation with specialized movement algorithms
 - Best for: out-of-reach objects, magical interactions, telekinetic experiences
 
@@ -128,4 +134,4 @@ The grabbing system integrates with multiple IWSDK systems:
 ## Next Steps
 
 - [Interaction Types](/concepts/grabbing/interaction-types) — Understanding the three grabbing patterns
-- [Distance Grabbing](/concepts/grabbing/distance-grabbing) — Deep dive into movement modes and algorithms
+- [Distance Grabbing](/concepts/grabbing/distance-grabbing) — Deep dive into movement modes and algorithms

docs/concepts/grabbing/interaction-types.md

@@ -23,17 +23,21 @@ The system creates a standard `HandleStore` with constraints derived directly fr
 ```ts
 // Simplified handle creation from GrabSystem
 const handle = new HandleStore(object, () => ({
-  rotate: entity.getValue(OneHandGrabbable, 'rotate') ? {
-    x: [rotateMin[0], rotateMax[0]],
-    y: [rotateMin[1], rotateMax[1]], 
-    z: [rotateMin[2], rotateMax[2]]
-  } : false,
-  translate: entity.getValue(OneHandGrabbable, 'translate') ? {
-    x: [translateMin[0], translateMax[0]],
-    y: [translateMin[1], translateMax[1]],
-    z: [translateMin[2], translateMax[2]]
-  } : false,
-  multitouch: false  // Single pointer only
+  rotate: entity.getValue(OneHandGrabbable, 'rotate')
+    ? {
+        x: [rotateMin[0], rotateMax[0]],
+        y: [rotateMin[1], rotateMax[1]],
+        z: [rotateMin[2], rotateMax[2]],
+      }
+    : false,
+  translate: entity.getValue(OneHandGrabbable, 'translate')
+    ? {
+        x: [translateMin[0], translateMax[0]],
+        y: [translateMin[1], translateMax[1]],
+        z: [translateMin[2], translateMax[2]],
+      }
+    : false,
+  multitouch: false, // Single pointer only
 }));
 ```
 
@@ -65,7 +69,7 @@ Dual-input manipulation enabling advanced operations including scaling through m
 Two-hand grabbing uses the relationship between controllers to derive transformations:
 
 - **Translation**: Controlled by primary hand position
-- **Rotation**: Derived from the orientation relationship between hands  
+- **Rotation**: Derived from the orientation relationship between hands
 - **Scaling**: Based on the distance between controllers — closer hands reduce scale, farther hands increase scale
 
 ### Implementation Details
@@ -78,7 +82,7 @@ const handle = new HandleStore(object, () => ({
   translate: /* translation constraints */,
   scale: entity.getValue(TwoHandsGrabbable, 'scale') ? {
     x: [scaleMin[0], scaleMax[0]],
-    y: [scaleMin[1], scaleMax[1]], 
+    y: [scaleMin[1], scaleMax[1]],
     z: [scaleMin[2], scaleMax[2]]
   } : false,
   multitouch: true  // Enables dual-pointer processing
@@ -113,13 +117,15 @@ Ray-based remote manipulation with specialized movement algorithms for telekinet
 Distance grabbing implements four distinct movement algorithms:
 
 #### MoveTowardsTarget Algorithm
+
 ```ts
 // From DistanceGrabHandle.update()
 const pointerOrigin = p1.pointerWorldOrigin;
 const distance = pointerOrigin.distanceTo(position);
 
 if (distance > this.moveSpeed) {
-  const step = pointerOrigin.sub(position)
+  const step = pointerOrigin
+    .sub(position)
     .normalize()
     .multiplyScalar(this.moveSpeed);
   position.add(step);
@@ -130,7 +136,8 @@ if (distance > this.moveSpeed) {
 }
 ```
 
-#### MoveAtSource Algorithm  
+#### MoveAtSource Algorithm
+
 ```ts
 // Delta-based movement tracking
 const current = p1.pointerWorldOrigin;
@@ -142,6 +149,7 @@ this.previousPointerOrigin.copy(current);
 ```
 
 #### MoveFromTarget & RotateAtSource
+
 - **MoveFromTarget**: Direct 1:1 mapping with ray endpoint (delegates to standard handle)
 - **RotateAtSource**: Rotation-only mode with automatic translation/scale disabling
 
@@ -165,7 +173,7 @@ The `returnToOrigin` feature overrides the standard handle application:
 // From DistanceGrabHandle.apply()
 if (this.returnToOrigin && this.outputState?.last) {
   target.position.copy(this.initialTargetPosition);
-  target.quaternion.copy(this.initialTargetQuaternion); 
+  target.quaternion.copy(this.initialTargetQuaternion);
   target.scale.copy(this.initialTargetScale);
   return; // Skip standard handle application
 }
@@ -180,7 +188,7 @@ if (this.returnToOrigin && this.outputState?.last) {
 ### Best Use Cases
 
 - Out-of-reach objects in large environments
-- Magical or supernatural interaction themes  
+- Magical or supernatural interaction themes
 - Accessibility — reaching objects without physical movement
 - Telekinetic gameplay mechanics
 
@@ -189,7 +197,7 @@ if (this.returnToOrigin && this.outputState?.last) {
 ### Interaction Context
 
 - **Immediate objects**: Use direct grabbing (one/two-hand)
-- **Remote objects**: Use distance grabbing  
+- **Remote objects**: Use distance grabbing
 - **Resizable content**: Requires two-hand grabbing
 - **Tool-like objects**: Usually one-hand grabbing
 
@@ -201,4 +209,4 @@ Most applications combine multiple grabbing types:
 - **Workshop Environment**: Tools (one-hand), Workpieces (two-hand), Stored materials (distance)
 - **Gaming Context**: Weapons (one-hand), Interactive objects (two-hand), Magic items (distance)
 
-The system's automatic handle management makes it seamless to use different grabbing types on different objects within the same scene.
+The system's automatic handle management makes it seamless to use different grabbing types on different objects within the same scene.

docs/guides/10-spatial-ui-uikitml.md

@@ -64,9 +64,9 @@ import { compileUIKit } from '@iwsdk/vite-plugin-uikitml';
 export default defineConfig({
   plugins: [
     compileUIKit({
-      sourceDir: 'ui',           // Directory containing .uikitml files
-      outputDir: 'public/ui',    // Where compiled .json files are written
-      verbose: true,             // Enable build logging
+      sourceDir: 'ui', // Directory containing .uikitml files
+      outputDir: 'public/ui', // Where compiled .json files are written
+      verbose: true, // Enable build logging
     }),
   ],
 });
@@ -127,7 +127,7 @@ import * as horizonKit from '@pmndrs/uikit-horizon';
 World.create(document.getElementById('scene-container'), {
   features: {
     spatialUI: {
-      kits: [horizonKit]
+      kits: [horizonKit],
     },
   },
 });
@@ -144,7 +144,7 @@ import * as defaultKit from '@pmndrs/uikit-default';
 World.create(document.getElementById('scene-container'), {
   features: {
     spatialUI: {
-      kits: [horizonKit, defaultKit]
+      kits: [horizonKit, defaultKit],
     },
   },
 });
@@ -156,15 +156,19 @@ For large icon libraries like `@pmndrs/uikit-lucide` (which contains over 1000 i
 
 ```typescript
 import * as horizonKit from '@pmndrs/uikit-horizon';
-import { LogInIcon, RectangleGogglesIcon, SettingsIcon } from '@pmndrs/uikit-lucide';
+import {
+  LogInIcon,
+  RectangleGogglesIcon,
+  SettingsIcon,
+} from '@pmndrs/uikit-lucide';
 
 World.create(document.getElementById('scene-container'), {
   features: {
     spatialUI: {
       kits: [
         horizonKit,
-        { LogInIcon, RectangleGogglesIcon, SettingsIcon }  // Only these icons
-      ]
+        { LogInIcon, RectangleGogglesIcon, SettingsIcon }, // Only these icons
+      ],
     },
   },
 });
@@ -186,7 +190,7 @@ import { ColorSchemeType } from '@iwsdk/core';
 World.create(document.getElementById('scene-container'), {
   features: {
     spatialUI: {
-      preferredColorScheme: ColorSchemeType.Dark,  // Force dark mode
+      preferredColorScheme: ColorSchemeType.Dark, // Force dark mode
     },
   },
 });
@@ -203,7 +207,9 @@ World.create(document.getElementById('scene-container'), {
 You can dynamically change the color scheme after initialization:
 
 ```typescript
-const world = await World.create(container, { /* ... */ });
+const world = await World.create(container, {
+  /* ... */
+});
 const panelSystem = world.getSystem(PanelUISystem);
 
 // Switch to light mode
@@ -223,13 +229,13 @@ Use the `:dark` pseudo-selector to define styles that apply only in dark mode:
 ```html
 <style>
   .heading {
-    color: #272727;              /* Light mode color */
+    color: #272727; /* Light mode color */
     font-size: 24px;
     font-weight: 700;
   }
 
   .heading:dark {
-    color: rgba(255, 255, 255, 0.9);  /* Dark mode color */
+    color: rgba(255, 255, 255, 0.9); /* Dark mode color */
   }
 
   .panel {

docs/guides/11-scene-understanding.md

@@ -528,4 +528,3 @@ class MeshSystem extends createSystem({
   }
 }
 ```
-

docs/guides/12-physics.md

@@ -506,4 +506,3 @@ cd examples/physics
 pnpm install
 pnpm dev
 ```
-