npm - reflexive - Versions diffs - 0.1.0 - Mend

reflexive 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (29) hide show

package/CLAUDE.md +77 -0
package/FAILURES.md +245 -0
package/README.md +264 -0
package/Screenshot 2026-01-22 at 6.31.27/342/200/257AM.png +0 -0
package/dashboard.html +620 -0
package/demo-ai-features.js +571 -0
package/demo-app.js +210 -0
package/demo-inject.js +212 -0
package/demo-instrumented.js +272 -0
package/docs/BREAKPOINT-AUDIT.md +293 -0
package/docs/GENESIS.md +110 -0
package/docs/HN-LAUNCH-PLAN-V2.md +631 -0
package/docs/HN-LAUNCH-PLAN.md +492 -0
package/docs/TODO.md +69 -0
package/docs/V8-INSPECTOR-RESEARCH.md +1231 -0
package/logo-carbon.png +0 -0
package/logo0.jpg +0 -0
package/logo1.jpg +0 -0
package/logo2.jpg +0 -0
package/new-ui-template.html +435 -0
package/one-shot.js +1109 -0
package/package.json +47 -0
package/play-story.sh +10 -0
package/src/demo-inject.js +3 -0
package/src/inject.cjs +474 -0
package/src/reflexive.js +6214 -0
package/story-game-reflexive.js +1246 -0
package/story-game-web.js +1030 -0
package/story-mystery-1769171430377.js +162 -0

package/logo-carbon.png ADDED Viewed

Binary file

package/logo0.jpg ADDED Viewed

Binary file

package/logo1.jpg ADDED Viewed

Binary file

package/logo2.jpg ADDED Viewed

Binary file

package/new-ui-template.html ADDED Viewed

@@ -0,0 +1,435 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Reflexive Nexus</title>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
+  <style>
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+    body {
+      font-family: 'Courier New', monospace;
+      background: #000;
+      min-height: 100vh;
+      overflow-x: hidden;
+      color: #fff;
+    }
+    #canvas-container {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      z-index: 0;
+    }
+    .content {
+      position: relative;
+      z-index: 1;
+      max-width: 900px;
+      margin: 0 auto;
+      padding: 40px 20px;
+    }
+    h1 {
+      text-align: center;
+      font-size: 3em;
+      margin-bottom: 10px;
+      text-shadow: 0 0 20px rgba(255, 255, 255, 0.5), 0 0 40px rgba(100, 200, 255, 0.3);
+      animation: glow 2s ease-in-out infinite alternate;
+    }
+    @keyframes glow {
+      from { text-shadow: 0 0 20px rgba(255, 255, 255, 0.5), 0 0 40px rgba(100, 200, 255, 0.3); }
+      to { text-shadow: 0 0 30px rgba(255, 255, 255, 0.8), 0 0 60px rgba(100, 200, 255, 0.6); }
+    }
+    .theme {
+      text-align: center;
+      font-style: italic;
+      opacity: 0.8;
+      margin-bottom: 30px;
+      font-size: 1.1em;
+    }
+    #story-text {
+      font-size: 1.3em;
+      line-height: 1.9;
+      margin: 30px 0;
+      padding: 30px;
+      background: rgba(0, 0, 0, 0.7);
+      border: 2px solid rgba(100, 200, 255, 0.3);
+      border-radius: 15px;
+      min-height: 200px;
+      box-shadow: 0 0 30px rgba(100, 200, 255, 0.2);
+      backdrop-filter: blur(10px);
+      transition: all 0.5s ease;
+    }
+    .quality-bar {
+      margin: 20px 0;
+      padding: 20px;
+      background: rgba(0, 0, 0, 0.7);
+      border: 2px solid rgba(100, 200, 255, 0.3);
+      border-radius: 15px;
+      backdrop-filter: blur(10px);
+    }
+    .quality-fill {
+      height: 25px;
+      background: linear-gradient(90deg, #00ff88 0%, #00ffff 50%, #0088ff 100%);
+      border-radius: 12px;
+      transition: width 0.8s ease;
+      box-shadow: 0 0 20px rgba(0, 255, 200, 0.5);
+    }
+    .stats {
+      display: flex;
+      justify-content: space-around;
+      margin-top: 15px;
+      font-size: 1em;
+      font-weight: bold;
+    }
+    .chat-box {
+      margin: 25px 0;
+      padding: 25px;
+      background: rgba(0, 0, 0, 0.8);
+      border: 2px solid rgba(100, 200, 255, 0.5);
+      border-radius: 15px;
+      box-shadow: 0 0 30px rgba(100, 200, 255, 0.3);
+      backdrop-filter: blur(10px);
+    }
+    .chat-input {
+      width: 100%;
+      padding: 15px;
+      font-size: 1.1em;
+      background: rgba(0, 0, 0, 0.6);
+      border: 2px solid rgba(100, 200, 255, 0.4);
+      border-radius: 10px;
+      color: #fff;
+      font-family: 'Courier New', monospace;
+    }
+    .chat-input:focus {
+      outline: none;
+      border-color: rgba(100, 200, 255, 0.8);
+      box-shadow: 0 0 20px rgba(100, 200, 255, 0.4);
+    }
+    .chat-input::placeholder {
+      color: rgba(255, 255, 255, 0.4);
+    }
+    .chat-send-btn {
+      margin-top: 12px;
+      padding: 15px 35px;
+      background: linear-gradient(135deg, #00ff88 0%, #00ffff 100%);
+      border: none;
+      border-radius: 10px;
+      color: #000;
+      font-size: 1.1em;
+      font-weight: bold;
+      cursor: pointer;
+      transition: all 0.3s ease;
+      font-family: 'Courier New', monospace;
+    }
+    .chat-send-btn:hover {
+      transform: translateY(-3px);
+      box-shadow: 0 0 30px rgba(0, 255, 200, 0.6);
+    }
+    .divider {
+      margin: 25px 0;
+      text-align: center;
+      color: rgba(100, 200, 255, 0.6);
+      font-style: italic;
+      font-size: 1.1em;
+    }
+    .choice-btn {
+      display: block;
+      width: 100%;
+      padding: 20px;
+      margin: 15px 0;
+      font-size: 1.2em;
+      background: linear-gradient(135deg, rgba(0, 255, 136, 0.2) 0%, rgba(0, 200, 255, 0.2) 100%);
+      border: 2px solid rgba(0, 255, 200, 0.4);
+      border-radius: 12px;
+      color: #fff;
+      cursor: pointer;
+      transition: all 0.3s ease;
+      text-align: left;
+      font-family: 'Courier New', monospace;
+      backdrop-filter: blur(5px);
+    }
+    .choice-btn:hover {
+      background: linear-gradient(135deg, rgba(0, 255, 136, 0.4) 0%, rgba(0, 200, 255, 0.4) 100%);
+      transform: translateX(15px);
+      box-shadow: 0 0 30px rgba(0, 255, 200, 0.4);
+      border-color: rgba(0, 255, 200, 0.8);
+    }
+    #start-btn {
+      display: block;
+      margin: 50px auto;
+      padding: 25px 50px;
+      font-size: 1.5em;
+      background: linear-gradient(135deg, #00ff88 0%, #00ffff 100%);
+      border: none;
+      border-radius: 15px;
+      color: #000;
+      font-weight: bold;
+      cursor: pointer;
+      transition: all 0.3s ease;
+      font-family: 'Courier New', monospace;
+    }
+    #start-btn:hover {
+      transform: scale(1.1);
+      box-shadow: 0 0 50px rgba(0, 255, 200, 0.8);
+    }
+    .hidden { display: none; }
+  </style>
+</head>
+<body>
+  <div id="canvas-container"></div>
+  <div class="content">
+    <h1>⚡ REFLEXIVE NEXUS ⚡</h1>
+    <p class="theme">THEME_PLACEHOLDER</p>
+    <div id="start-screen">
+      <button id="start-btn">► INITIATE SEQUENCE</button>
+    </div>
+    <div id="game-screen" class="hidden">
+      <div id="story-text"></div>
+      <div class="quality-bar">
+        <div class="quality-fill" id="quality-bar" style="width: 50%"></div>
+        <div class="stats">
+          <span>⚡ QUALITY: <span id="quality-pct">50%</span></span>
+          <span>📍 SCENE: <span id="scene-count">0</span></span>
+          <span>💫 FLOW: <span id="engagement">50%</span></span>
+        </div>
+      </div>
+      <div class="chat-box">
+        <input type="text" id="chat-input" class="chat-input" placeholder="► Enter command..." />
+        <button id="chat-send" class="chat-send-btn">⚡ EXECUTE</button>
+      </div>
+      <div class="divider">— SUGGESTED ACTIONS —</div>
+      <div class="choices" id="choices-container"></div>
+    </div>
+  </div>
+  <script>
+    // Three.js scene setup
+    let scene, camera, renderer, particles;
+    let particleSystem;
+    let currentMood = 'neutral';
+    function initThree() {
+      scene = new THREE.Scene();
+      camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
+      camera.position.z = 50;
+      renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });
+      renderer.setSize(window.innerWidth, window.innerHeight);
+      document.getElementById('canvas-container').appendChild(renderer.domElement);
+      // Create particle system
+      const particleCount = 2000;
+      const geometry = new THREE.BufferGeometry();
+      const positions = new Float32Array(particleCount * 3);
+      const colors = new Float32Array(particleCount * 3);
+      const sizes = new Float32Array(particleCount);
+      for (let i = 0; i < particleCount; i++) {
+        positions[i * 3] = (Math.random() - 0.5) * 100;
+        positions[i * 3 + 1] = (Math.random() - 0.5) * 100;
+        positions[i * 3 + 2] = (Math.random() - 0.5) * 100;
+        colors[i * 3] = 0.2 + Math.random() * 0.8;
+        colors[i * 3 + 1] = 0.5 + Math.random() * 0.5;
+        colors[i * 3 + 2] = 1.0;
+        sizes[i] = Math.random() * 2;
+      }
+      geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3));
+      geometry.setAttribute('color', new THREE.BufferAttribute(colors, 3));
+      geometry.setAttribute('size', new THREE.BufferAttribute(sizes, 1));
+      const material = new THREE.ShaderMaterial({
+        uniforms: {
+          time: { value: 0 },
+          mood: { value: 0.5 }
+        },
+        vertexShader: `
+          attribute float size;
+          attribute vec3 color;
+          varying vec3 vColor;
+          uniform float time;
+          uniform float mood;
+          void main() {
+            vColor = color;
+            vec3 pos = position;
+            pos.x += sin(time * 0.5 + position.y * 0.01) * mood * 3.0;
+            pos.y += cos(time * 0.3 + position.x * 0.01) * mood * 3.0;
+            pos.z += sin(time * 0.4 + position.x * 0.01) * mood * 2.0;
+            vec4 mvPosition = modelViewMatrix * vec4(pos, 1.0);
+            gl_PointSize = size * (300.0 / -mvPosition.z) * (0.5 + mood);
+            gl_Position = projectionMatrix * mvPosition;
+          }
+        `,
+        fragmentShader: `
+          varying vec3 vColor;
+          uniform float mood;
+          void main() {
+            vec2 center = gl_PointCoord - vec2(0.5);
+            float dist = length(center);
+            if (dist > 0.5) discard;
+            float alpha = 1.0 - (dist * 2.0);
+            alpha *= (0.3 + mood * 0.7);
+            gl_FragColor = vec4(vColor, alpha);
+          }
+        `,
+        transparent: true,
+        vertexColors: true,
+        blending: THREE.AdditiveBlending,
+        depthTest: false
+      });
+      particleSystem = new THREE.Points(geometry, material);
+      scene.add(particleSystem);
+      animate();
+    }
+    function animate() {
+      requestAnimationFrame(animate);
+      const time = Date.now() * 0.001;
+      particleSystem.material.uniforms.time.value = time;
+      particleSystem.rotation.x += 0.0005;
+      particleSystem.rotation.y += 0.001;
+      renderer.render(scene, camera);
+    }
+    function setParticleMood(quality, engagement) {
+      const mood = (quality + engagement) / 2;
+      particleSystem.material.uniforms.mood.value = mood;
+      // Update colors based on quality
+      const colors = particleSystem.geometry.attributes.color;
+      for (let i = 0; i < colors.count; i++) {
+        if (mood > 0.7) {
+          colors.array[i * 3] = 0.0 + Math.random() * 0.3;
+          colors.array[i * 3 + 1] = 1.0;
+          colors.array[i * 3 + 2] = 0.5 + Math.random() * 0.5;
+        } else if (mood < 0.3) {
+          colors.array[i * 3] = 1.0;
+          colors.array[i * 3 + 1] = 0.0 + Math.random() * 0.3;
+          colors.array[i * 3 + 2] = 0.0 + Math.random() * 0.3;
+        } else {
+          colors.array[i * 3] = 0.2 + Math.random() * 0.5;
+          colors.array[i * 3 + 1] = 0.5 + Math.random() * 0.5;
+          colors.array[i * 3 + 2] = 1.0;
+        }
+      }
+      colors.needsUpdate = true;
+    }
+    window.addEventListener('resize', () => {
+      camera.aspect = window.innerWidth / window.innerHeight;
+      camera.updateProjectionMatrix();
+      renderer.setSize(window.innerWidth, window.innerHeight);
+    });
+    initThree();
+    // Game logic
+    let sessionId = null;
+    document.getElementById('start-btn').addEventListener('click', async () => {
+      const response = await fetch('/api/start', { method: 'POST' });
+      const data = await response.json();
+      sessionId = data.sessionId;
+      document.getElementById('start-screen').classList.add('hidden');
+      document.getElementById('game-screen').classList.remove('hidden');
+      displayGameState(data.state);
+    });
+    async function makeChoice(choiceIndex) {
+      const response = await fetch('/api/choice', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ sessionId, choiceIndex })
+      });
+      const data = await response.json();
+      displayGameState(data.state);
+    }
+    async function sendCustomPrompt(prompt) {
+      const response = await fetch('/api/prompt', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ sessionId, prompt })
+      });
+      const data = await response.json();
+      displayGameState(data.state);
+    }
+    document.getElementById('chat-send').addEventListener('click', () => {
+      const input = document.getElementById('chat-input');
+      const prompt = input.value.trim();
+      if (prompt) {
+        sendCustomPrompt(prompt);
+        input.value = '';
+      }
+    });
+    document.getElementById('chat-input').addEventListener('keypress', (e) => {
+      if (e.key === 'Enter') {
+        const prompt = e.target.value.trim();
+        if (prompt) {
+          sendCustomPrompt(prompt);
+          e.target.value = '';
+        }
+      }
+    });
+    function displayGameState(state) {
+      const storyText = document.getElementById('story-text');
+      storyText.textContent = state.text;
+      // Animate text appearance
+      storyText.style.opacity = '0';
+      setTimeout(() => { storyText.style.opacity = '1'; }, 50);
+      const choicesContainer = document.getElementById('choices-container');
+      choicesContainer.innerHTML = '';
+      if (state.choices.length === 0) {
+        choicesContainer.innerHTML = '<p style="text-align: center; font-size: 1.5em;">◉ SEQUENCE COMPLETE ◉</p>';
+        return;
+      }
+      state.choices.forEach((choice, index) => {
+        const btn = document.createElement('button');
+        btn.className = 'choice-btn';
+        btn.textContent = '▸ ' + choice.text;
+        btn.addEventListener('click', () => makeChoice(index));
+        choicesContainer.appendChild(btn);
+      });
+      if (state.quality !== undefined) {
+        const qualityPct = Math.round(state.quality * 100);
+        document.getElementById('quality-bar').style.width = qualityPct + '%';
+        document.getElementById('quality-pct').textContent = qualityPct + '%';
+        document.getElementById('scene-count').textContent = state.sceneCount || 0;
+        document.getElementById('engagement').textContent = Math.round((state.engagement || 0.5) * 100) + '%';
+        // Update particle effects based on quality
+        setParticleMood(state.quality, state.engagement || 0.5);
+      }
+    }
+  </script>
+</body>
+</html>