refactor: replace SVG component with useSVG composable for improved SVG handling

- Updated `SVGDemo.vue` to utilize the new `UseSVG` component from `@Tresjs/cientos`, enhancing the way SVGs are loaded and displayed in TresJS scenes.
- Modified the component list to reflect the change from `SVG` to `useSVG`, ensuring consistency in documentation and usage.
- Removed the outdated `svg.md` guide and created a new `use-svg.md` guide to document the `useSVG` composable, providing comprehensive usage instructions and examples.
- Added new demo components in the playground to showcase the capabilities of the `useSVG` composable, improving the developer experience and demonstrating advanced use cases.
- Updated the router to include new routes for the `useSVG` functionality, ensuring easy navigation to the new features.

Author: alvarosabu

docs/.vitepress/theme/components/SVGDemo.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { OrbitControls, SVG } from '@tresjs/cientos'
+import { OrbitControls, UseSVG } from '@tresjs/cientos'
 import { TresCanvas } from '@tresjs/core'
 
 const svgURL = 'https://raw.githubusercontent.com/'
@@ -10,7 +10,7 @@ const svgURL = 'https://raw.githubusercontent.com/'
   <TresCanvas clear-color="#333">
     <OrbitControls />
     <Suspense>
-      <SVG
+      <UseSVG
         :src="svgURL"
         :position="[-0.4, 1, 0]"
         :scale="0.01"

docs/component-list/components.ts

@@ -57,7 +57,7 @@ export default [
       { text: 'useFBX', link: '/guide/loaders/use-fbx' },
       { text: 'FBXModel', link: '/guide/loaders/fbx-model' },
       { text: 'useVideoTexture', link: '/guide/loaders/use-video-texture' },
-      { text: 'SVG', link: '/guide/loaders/svg' },
+      { text: 'useSVG', link: '/guide/loaders/use-svg' },
     ],
   },
   {