chore: add gif and audio preview to examples

examples/App.tsx

@@ -1,4 +1,5 @@
 import React, { useState } from 'react'
+import { AudioPlayer } from '../src/components/AudioPlayer'
 import { VideoPlayer } from '../src/components/VideoPlayer'
 import type { SubtitleTrack } from '../src/types'
 import './App.css'
@@ -11,6 +12,8 @@ function App() {
   // Demo video URLs (you can replace with your own)
   const demoVideoUrl = '/player/ses.mp4'
   const demoPoster = '/player/poster.svg'
+  const demoGifUrl = 'https://upload.wikimedia.org/wikipedia/commons/2/2c/Rotating_earth_%28large%29.gif'
+  const demoAudioUrl = 'https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3'
 
   const demoSubtitles: SubtitleTrack[] = [
     {
@@ -90,6 +93,48 @@ function App() {
           </div>
         </div>
 
+        <div className="media-test-section">
+          <h2>GIF ve Ses Önizleme</h2>
+          <p className="media-test-subtitle">
+            Yeni medya tiplerinin player içinde nasıl göründüğünü burada test edebilirsiniz.
+          </p>
+
+          <div className="media-test-grid">
+            <article className="media-test-card">
+              <h3>🖼️ Animated Image (GIF)</h3>
+              <p>VideoPlayer, GIF kaynaklarını otomatik algılayıp minimal görüntü modunda açar.</p>
+              <div className="media-test-player media-test-player-gif">
+                <VideoPlayer
+                  src={demoGifUrl}
+                  aspectRatio="1:1"
+                  theme={{
+                    primaryColor: '#ef4444',
+                    accentColor: '#dc2626',
+                  }}
+                />
+              </div>
+            </article>
+
+            <article className="media-test-card">
+              <h3>🎧 Audio Player (.mp3)</h3>
+              <p>MP3/WAV gibi ses dosyaları için ayrı AudioPlayer görünümü.</p>
+              <div className="media-test-player media-test-player-audio">
+                <AudioPlayer
+                  src={demoAudioUrl}
+                  title="SoundHelix Demo Track"
+                  subtitle="AudioPlayer test görünümü"
+                  artwork={demoPoster}
+                  playbackRates={[0.75, 1, 1.25, 1.5, 2]}
+                  theme={{
+                    primaryColor: '#ef4444',
+                    accentColor: '#dc2626',
+                  }}
+                />
+              </div>
+            </article>
+          </div>
+        </div>
+
         <div className="features-section">
           <h2>Features</h2>
           <div className="features-grid">