Migrate ScrollVelocity component

src/constants/Categories.ts

@@ -25,7 +25,8 @@ export const CATEGORIES = [
       'Scroll Float',
       'Scroll Reveal',
       'Rotating Text',
-      'Glitch Text'
+      'Glitch Text',
+      'Scroll Velocity'
     ]
   },
   {

src/constants/Components.ts

@@ -37,6 +37,7 @@ const textAnimations = {
   'scroll-reveal': () => import("../demo/TextAnimations/ScrollRevealDemo.vue"),
   'rotating-text': () => import("../demo/TextAnimations/RotatingTextDemo.vue"),
   'glitch-text': () => import("../demo/TextAnimations/GlitchTextDemo.vue"),
+  'scroll-velocity': () => import("../demo/TextAnimations/ScrollVelocityDemo.vue"),
 };
 
 const components = {

src/constants/code/TextAnimations/scrollVelocityCode.ts

@@ -0,0 +1,24 @@
+import code from '@content/TextAnimations/ScrollVelocity/ScrollVelocity.vue?raw';
+import type { CodeObject } from '../../../types/code';
+
+export const scrollVelocity: CodeObject = {
+  cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/ScrollVelocity`,
+  installation: `npm install gsap`,
+  usage: `<template>
+  <ScrollVelocity
+    :texts="['Vue Bits', 'Scroll Down']"
+    :velocity="100"
+    :damping="50"
+    :stiffness="400"
+    :velocity-mapping="{ input: [0, 1000], output: [0, 5] }"
+    class-name="custom-scroll-text"
+    parallax-class-name="custom-parallax"
+    scroller-class-name="custom-scroller"
+  />
+</template>
+
+<script setup lang="ts">
+  import ScrollVelocity from "./ScrollVelocity.vue";
+</script>`,
+  code
+};