@vibes.diy/prompts 2.7.1 → 3.0.1

package/cli-footer.md

@@ -11,6 +11,8 @@
 
 - `npx vibes-diy push --instant-join` — deploy and auto-accept sharing so anyone with the link can use it
 - `npx vibes-diy push --app-slug other-name` — deploy to a different app slug instead of the directory name
+- `npx vibes-diy unpublish <vibe>` — take a deployed vibe down (reversible; code and data are kept)
+- `npx vibes-diy publish <vibe>` — make it live again, or promote a `--mode dev` draft to production
 - `npx vibes-diy login` — authenticate this device (run once before first push)
 - `npx vibes-diy mcp --help` — start an MCP server for AI agent data access (Claude Desktop / Cowork)
 - `npx vibes-diy help` — show all available commands

package/llms/three-js.md

@@ -117,8 +117,9 @@ texture.wrapT = THREE.RepeatWrapping;
 texture.repeat.set(2, 2);
 texture.flipY = false;
 
-// HDR textures
-const hdrLoader = new THREE.HDRLoader();
+// HDR textures (loaders live in addons, not the core THREE namespace)
+import { HDRLoader } from "three/addons/loaders/HDRLoader.js";
+const hdrLoader = new HDRLoader();
 const envMap = hdrLoader.load("environment.hdr");
 envMap.mapping = THREE.EquirectangularReflectionMapping;
 ```
@@ -1347,6 +1348,14 @@ export default function SkyGlider() {
     gameStateRef.current.keys[event.code] = false;
   }, []);
 
+  const handleResize = useCallback(() => {
+    const state = gameStateRef.current;
+    if (!state.camera || !state.renderer) return;
+    state.camera.aspect = window.innerWidth / window.innerHeight;
+    state.camera.updateProjectionMatrix();
+    state.renderer.setSize(window.innerWidth, window.innerHeight);
+  }, []);
+
   const updateGame = useCallback(() => {
     const state = gameStateRef.current;
     if (!state.gameRunning || !state.glider) return;
@@ -1430,12 +1439,29 @@ export default function SkyGlider() {
     initThreeJS();
     window.addEventListener("keydown", handleKeyDown);
     window.addEventListener("keyup", handleKeyUp);
+    window.addEventListener("resize", handleResize);
     return () => {
       window.removeEventListener("keydown", handleKeyDown);
       window.removeEventListener("keyup", handleKeyUp);
-      gameStateRef.current.gameRunning = false;
+      window.removeEventListener("resize", handleResize);
+      const state = gameStateRef.current;
+      state.gameRunning = false;
+      // Release GPU resources so remounts don't leak WebGL contexts
+      if (state.scene) {
+        state.scene.traverse((obj) => {
+          if (obj.geometry) obj.geometry.dispose();
+          if (obj.material) {
+            const materials = Array.isArray(obj.material) ? obj.material : [obj.material];
+            materials.forEach((material) => {
+              if (material.map) material.map.dispose(); // CanvasTextures, etc.
+              material.dispose();
+            });
+          }
+        });
+      }
+      if (state.renderer) state.renderer.dispose();
     };
-  }, [initThreeJS, handleKeyDown, handleKeyUp]);
+  }, [initThreeJS, handleKeyDown, handleKeyUp, handleResize]);
 
   return (
     <div className="relative h-screen w-full bg-sky-200">
@@ -1743,8 +1769,11 @@ export default function HalftoneArtStudio() {
 
     createObjects();
 
-    // Animation loop
+    // Animation loop — capture the id so cleanup can cancel it. Because this
+    // effect re-runs on every `parameters` change, an uncancelled loop would
+    // keep calling composer.render() on a disposed renderer.
     const clock = new THREE.Clock();
+    let animationId;
     const animate = () => {
       const delta = clock.getDelta();
       const elapsed = clock.getElapsedTime();
@@ -1763,7 +1792,7 @@ export default function HalftoneArtStudio() {
 
       controls.update();
       composer.render();
-      requestAnimationFrame(animate);
+      animationId = requestAnimationFrame(animate);
     };
 
     animate();
@@ -1780,6 +1809,17 @@ export default function HalftoneArtStudio() {
 
     return () => {
       window.removeEventListener("resize", handleResize);
+      cancelAnimationFrame(animationId);
+      controls.dispose();
+      // Dispose every geometry + material we created (ShaderMaterials included)
+      sceneRef.current.objects.forEach((obj) => {
+        obj.geometry.dispose();
+        const materials = Array.isArray(obj.material) ? obj.material : [obj.material];
+        materials.forEach((material) => material.dispose());
+      });
+      // Dispose post-processing passes + the composer's render targets
+      composer.passes.forEach((pass) => pass.dispose?.());
+      composer.dispose();
       renderer.dispose();
     };
   }, [parameters]);

package/llms/webxr.md

@@ -75,11 +75,19 @@ xrHelper.baseExperience.onStateChangedObservable.add((state) => {
 
 ### VR Button
 
-`createDefaultXRExperienceAsync` adds the "Enter VR" button automatically. To add it manually:
+`createDefaultXRExperienceAsync` adds the "Enter VR" button automatically. To use your own button instead, disable the default UI and drive the session yourself:
 
 ```javascript
-const vrButton = BABYLON.WebXRDefaultExperience.CreateAsync(scene, {
-  uiOptions: { sessionMode: "immersive-vr" },
+// Build the experience without the default Enter VR button. With
+// disableDefaultUI there's no UI to configure, so the session mode and
+// reference space are set on enterXRAsync below, not via uiOptions.
+const xrHelper = await scene.createDefaultXRExperienceAsync({
+  disableDefaultUI: true,
+});
+
+// ...then wire up your own DOM button to enter/exit the session
+document.getElementById("enter-vr").addEventListener("click", async () => {
+  await xrHelper.baseExperience.enterXRAsync("immersive-vr", "local-floor");
 });
 ```
 
@@ -540,7 +548,7 @@ export default function App() {
 
 ## Real-World Example 2: AR Passthrough — Tap to Place Glowing Orbs
 
-Tap a real-world surface to plant a pulsing orb anchored in place. Orb positions are stored in Fireproof so they survive page reload.
+Tap a real-world surface to plant a pulsing orb at the hit-test point. Orb positions are stored in Fireproof so they survive page reload. (Orbs are placed at the hit-test location, not world-locked to it — for true anchoring that survives device movement, wire in `WebXRAnchorSystem` as shown in the Anchors reference above.)
 
 On devices without AR support (desktop, unsupported browsers) the app automatically enters **fixture mode**: a background photo stands in for the passthrough feed, and mouse clicks place orbs via ray-picking. The 3D scene is identical in both modes — only the background source differs.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vibes.diy/prompts",
-  "version": "2.7.1",
+  "version": "3.0.1",
   "type": "module",
   "main": "./index.js",
   "description": "",
@@ -29,9 +29,9 @@
     "@fireproof/core-types-base": "~0.24.19",
     "@fireproof/core-types-protocols-cloud": "~0.24.19",
     "@fireproof/use-fireproof": "~0.24.19",
-    "@vibes.diy/call-ai-v2": "^2.7.1",
-    "@vibes.diy/identity": "^2.7.1",
-    "@vibes.diy/use-vibes-types": "^2.7.1",
+    "@vibes.diy/call-ai-v2": "^3.0.1",
+    "@vibes.diy/identity": "^3.0.1",
+    "@vibes.diy/use-vibes-types": "^3.0.1",
     "arktype": "~2.2.1",
     "json-schema-faker": "~0.6.2"
   },