docs: convert "transitions-second" in "transitions.mdx" to AnimationE…

…ditor

packages/docs/docs/getting-started/transitions.mdx

@@ -46,21 +46,50 @@ Motion Canvas comes with a set of common transitions in a form of easy-to-use
 generators. To use them, `yield*` the transition generator at the beginning of
 the new scene:
 
-```tsx title="src/scenes/secondScene.tsx"
+```tsx editor
+import {Rect, Txt} from '@motion-canvas/2d/lib/components';
+import {makeScene2D} from '@motion-canvas/2d/lib/scenes';
+import {all, waitFor} from '@motion-canvas/core/lib/flow';
+import {slideTransition} from '@motion-canvas/core/lib/transitions';
+import {createRef} from '@motion-canvas/core/lib/utils';
+import {Direction} from '@motion-canvas/core/lib/types';
+
 export default makeScene2D(function* (view) {
-  // set up the scene:
-  view.add(/* your nodes here */);
+  const rect = createRef<Rect>();
+  const text = createRef<Txt>();
+
+  view.add(
+    <Rect
+      ref={rect}
+      width={'100%'}
+      height={'100%'}
+      fill={'lightcoral'}
+      layout
+      alignItems={'center'}
+      justifyContent={'center'}
+    >
+      <Txt
+        ref={text}
+        fontSize={160}
+        fontWeight={700}
+        fill={'#fff'}
+        fontFamily={'"JetBrains Mono", monospace'}
+      >
+        SECOND SCENE
+      </Txt>
+    </Rect>,
+  );
 
-  // perform a slide transition to the left:
   yield* slideTransition(Direction.Left);
 
-  // proceed with the animation
-  yield* waitFor(3);
+  yield* waitFor(0.4);
+  yield* all(
+    rect().fill('lightseagreen', 0.6),
+    text().text('FIRST SCENE', 0.6),
+  );
 });
 ```
 
-<AnimationPlayer small name={'transitions'} link={'transitions-second'} />
-
 :::caution
 
 Make sure to add nodes to the view before yielding the transition generator.

packages/examples/src/transitions.ts

@@ -1,8 +1,7 @@
 import {makeProject} from '@motion-canvas/core';
 
 import first from './scenes/transitions-first?scene';
-import second from './scenes/transitions-second?scene';
 
 export default makeProject({
-  scenes: [first, second],
+  scenes: [first],
 });