feat(story): build procedural notebook animation

app/components/story/NotebookBrowser.tsx

@@ -142,6 +142,9 @@ export default function NotebookBrowser({
                 aria-controls={panelId}
                 aria-selected={isSelected}
                 className="notebook-tab"
+                data-cursor-clicking={
+                  isSelected && frame.cursorClicking ? "true" : "false"
+                }
                 id={tabId}
                 key={project.id}
                 onClick={() => onSelectTab(index)}
@@ -213,20 +216,20 @@ export default function NotebookBrowser({
                 unoptimized
               />
             ) : null}
-            {frame.cursorVisible ? (
-              <span
-                aria-hidden="true"
-                className={`notebook-cursor${frame.cursorClicking ? " is-clicking" : ""}`}
-                data-testid="notebook-cursor"
-                style={{
-                  left: `${frame.cursorX * 100}%`,
-                  top: `${frame.cursorY * 100}%`,
-                }}
-              />
-            ) : null}
           </div>
         </div>
       </div>
+      {frame.cursorVisible ? (
+        <span
+          aria-hidden="true"
+          className={`notebook-cursor${frame.cursorClicking ? " is-clicking" : ""}`}
+          data-testid="notebook-cursor"
+          style={{
+            left: `${frame.cursorX * 100}%`,
+            top: `${frame.cursorY * 100}%`,
+          }}
+        />
+      ) : null}
     </div>
   );
 }