Migrated Balatro background component.

src/constants/Categories.ts

@@ -80,6 +80,7 @@ export const CATEGORIES = [
       'Hyperspeed',
       'Silk',
       'Lightning',
+      'Balatro',
       'Letter Glitch',
       'Particles',
       'Shape Blur',

src/constants/Components.ts

@@ -73,7 +73,8 @@ const backgrounds = {
   'beams': () => import('../demo/Backgrounds/BeamsDemo.vue'),
   'grid-motion': () => import('../demo/Backgrounds/GridMotionDemo.vue'),
   'hyperspeed': () => import('../demo/Backgrounds/HyperspeedDemo.vue'),
-  'shape-blur': () => import('../demo/Backgrounds/ShapeBlurDemo.vue')
+  'shape-blur': () => import('../demo/Backgrounds/ShapeBlurDemo.vue'),
+  'balatro': () => import('../demo/Backgrounds/BalatroDemo.vue')
 };
 
 export const componentMap = {

src/constants/code/Backgrounds/balatroCode.ts

@@ -0,0 +1,19 @@
+import code from '@content/Backgrounds/Balatro/Balatro.vue?raw';
+import type { CodeObject } from '../../../types/code';
+
+export const balatro: CodeObject = {
+  cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Balatro`,
+  installation: `npm install ogl`,
+  usage: `<template>
+    <Balatro
+    isRotate={false}
+    mouseInteraction={true}
+    pixelFilter={700}
+    />
+</template>
+
+<script setup lang="ts">
+    import Balatro from "./Balatro.vue";
+</script>`,
+  code
+};