refactor: Update Video component and documentation

README.md

@@ -13,10 +13,6 @@ Features:
 - Particle Emitter
 - Audio System
 
-## Note: Performance Comparison with Pixi React
-
-CanvasEngine offers significant performance advantages over Pixi React. While Pixi React relies on React's detection cycles in addition to Pixi's traversal, which can be resource-intensive, CanvasEngine takes a more granular approach. It only updates the specific elements that have changed, resulting in more efficient rendering and better overall performance.
-
 ## Installation
 
 ```bash

docs/.vitepress/config.ts

@@ -81,6 +81,10 @@ const guideMenu = [
         text: "TilingSprite",
         link: "/components/tilling-sprite",
       },
+      {
+        text: "Video",
+        link: "/components/video",
+      },
     ],
   },
   {

docs/components/video.md

@@ -0,0 +1,25 @@
+# Use Video component
+
+```html
+<Video src="myvideo.mp4" play={true} />
+```
+
+## Props
+
+- `src`: string
+- `paused`: boolean
+- `loop`: boolean
+- `muted`: boolean
+
+- `loader`: {
+    - `onComplete`: (texture: Texture) => void;
+    - `onProgress`: (progress: number) => void;
+}
+
+
+## Events
+
+- `play`: () => void;
+- `pause`: () => void;
+- `ended`: () => void;
+- `progress`: (progress: number) => void;

packages/core/src/components/Video.ts

@@ -5,7 +5,7 @@ import { Sprite } from "./Sprite";
 import { effect, Signal, signal } from "@signe/reactive";
 
 interface VideoProps {
-    source: string;
+    src: string;
     paused?: boolean;
     loop?: boolean;
     muted?: boolean;
@@ -87,7 +87,7 @@ export function Video(props: VideoProps) {
 
     return h(Sprite, {
         ...props,
-        image: props.source,
+        image: props.src,
         loader: {
             onComplete: (texture) => {
                 const source = texture.source.resource