Scroll Float added in text animation section

Signed-off-by: zubairrafi <walleeva2018@gmail.com>

src/constants/Categories.ts

@@ -19,6 +19,7 @@ export const CATEGORIES = [
       'Falling Text',
       'Text Cursor',
       'Decrypted Text',
+      'Scroll Float'
     ]
   },
   {

src/constants/Components.ts

@@ -23,6 +23,7 @@ const textAnimations = {
   'falling-text': () => import("../demo/TextAnimations/FallingTextDemo.vue"),
   'text-cursor': () => import("../demo/TextAnimations/TextCursorDemo.vue"),
   'decrypted-text': () => import("../demo/TextAnimations/DecryptedTextDemo.vue"),
+  'scroll-float': () => import("../demo/TextAnimations/ScrollFloatDemo.vue"),
 };
 
 const components = {

src/constants/code/Components/scrollFloatCode.ts

@@ -0,0 +1,25 @@
+import code from '@content/TextAnimations/ScrollFloat/ScrollFloat.vue?raw'
+import type { CodeObject } from '../../../types/code'
+
+export const scrollFloatCode: CodeObject = {
+  cli: `npx jsrepo add https://vue-bits.dev/ui/Components/ProfileCard`,
+  usage: `<template>
+  <ScrollFloat
+    :children="scrollText"
+    :animation-duration="animationDuration"
+    :ease="ease"
+    :scroll-start="scrollStart"
+    :scroll-end="scrollEnd"
+    :stagger="stagger"
+    :container-class-name="containerClassName"
+    :text-class-name="textClassName"
+    :scroll-container-ref="{ current: containerRef }"
+    :key="rerenderKey"
+  />
+</template>
+
+<script setup lang="ts">
+  import ScrollFloat from "./ScrollFloat.vue";
+</script>`,
+  code
+}