@mova-ui/react 0.1.0

package/dist/ui/loading/morphing-ring.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const MorphingRing: () => React.JSX.Element;

package/dist/ui/loading/morphing-shape.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const MorphingShape: () => React.JSX.Element;

package/dist/ui/loading/newtons-cradle.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const NewtonsCradle: () => React.JSX.Element;

package/dist/ui/loading/offset-rings.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const OffsetRings: () => React.JSX.Element;

package/dist/ui/loading/orbiting-circles.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const OrbitingCircles: () => React.JSX.Element;

package/dist/ui/loading/orbiting-dot.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const OrbitingDot: () => React.JSX.Element;

package/dist/ui/loading/origami-shape.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const OrigamiShape: () => React.JSX.Element;

package/dist/ui/loading/pendulum.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const Pendulum: () => React.JSX.Element;

package/dist/ui/loading/pulsating-dots.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const PulsatingDots: () => React.JSX.Element;

package/dist/ui/loading/pulse-dot.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const PulseDot: () => React.JSX.Element;

package/dist/ui/loading/pulse-dots.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const PulseDots: () => React.JSX.Element;

package/dist/ui/loading/pulse-square.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const PulseSquare: () => React.JSX.Element;

package/dist/ui/loading/pulse.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface PulseProps {
+    size?: number;
+    color?: string;
+    className?: string;
+}
+export declare function Pulse({ size, color, className, }: PulseProps): React.JSX.Element;
+export {};

package/dist/ui/loading/pumping-heart.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const PumpingHeart: () => React.JSX.Element;

package/dist/ui/loading/radar-sweep.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const RadarSweep: ({ theme }: {
+    theme?: "light" | "dark";
+}) => React.JSX.Element;

package/dist/ui/loading/ring-sweep.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const RingSweep: () => React.JSX.Element;

package/dist/ui/loading/ripple-effect.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const RippleEffect: () => React.JSX.Element;

package/dist/ui/loading/rotating-cross.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const RotatingCross: () => React.JSX.Element;

package/dist/ui/loading/rotating-triangle.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const RotatingTriangle: () => React.JSX.Element;

package/dist/ui/loading/shape-shift-grid.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ShapeShiftGrid: () => React.JSX.Element;

package/dist/ui/loading/shimmer-line.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ShimmerLine: () => React.JSX.Element;

package/dist/ui/loading/siri-wave.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SiriWave: () => React.JSX.Element;

package/dist/ui/loading/skeleton-loader.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SkeletonLoader: () => React.JSX.Element;

package/dist/ui/loading/skeleton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface SkeletonProps {
+    className?: string;
+    shimmerColor?: 'light' | 'dark';
+}
+export declare function Skeleton({ className, shimmerColor, }: SkeletonProps): React.JSX.Element;
+export {};

package/dist/ui/loading/sliding-bars.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SlidingBars: () => React.JSX.Element;

package/dist/ui/loading/smooth-dot-shift.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SmoothDotShift: () => React.JSX.Element;

package/dist/ui/loading/smooth-ring.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SmoothRing: () => React.JSX.Element;

package/dist/ui/loading/smooth-rounded-square.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SmoothRoundedSquare: () => React.JSX.Element;

package/dist/ui/loading/spinning-squares.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SpinningSquares: () => React.JSX.Element;

package/dist/ui/loading/spiral-spinner.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SpiralSpinner: () => React.JSX.Element;

package/dist/ui/loading/spring-bars.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SpringBars: () => React.JSX.Element;

package/dist/ui/loading/spring-dot-matrix.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SpringDotMatrix: () => React.JSX.Element;

package/dist/ui/loading/spring-hexagon.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SpringHexagon: () => React.JSX.Element;

package/dist/ui/loading/spring-ring-expand.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SpringRingExpand: () => React.JSX.Element;

package/dist/ui/loading/spring-text-pop.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SpringTextPop: () => React.JSX.Element;

package/dist/ui/loading/square-accordion.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SquareAccordion: () => React.JSX.Element;

package/dist/ui/loading/square-grid.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SquareGrid: () => React.JSX.Element;

package/dist/ui/loading/square-snake.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SquareSnake: () => React.JSX.Element;

package/dist/ui/loading/square-spinner.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SquareSpinner: () => React.JSX.Element;

package/dist/ui/loading/stacked-bar-pulse.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const StackedBarPulse: () => React.JSX.Element;

package/dist/ui/loading/swapping-dots.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SwappingDots: () => React.JSX.Element;

package/dist/ui/loading/swirling-spinner.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SwirlingSpinner: () => React.JSX.Element;

package/dist/ui/loading/symmetric-wave.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SymmetricWave: () => React.JSX.Element;

package/dist/ui/loading/terminal-loader.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TerminalLoader: () => React.JSX.Element;

package/dist/ui/loading/text-blink.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TextBlink: () => React.JSX.Element;

package/dist/ui/loading/text-dots.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TextDots: () => React.JSX.Element;

package/dist/ui/loading/text-morph.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TextMorph: () => React.JSX.Element;

package/dist/ui/loading/text-shimmer-wave.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TextShimmerWave: () => React.JSX.Element;

package/dist/ui/loading/text-shimmer.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TextShimmer: () => React.JSX.Element;

package/dist/ui/loading/trailing-dots.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TrailingDots: () => React.JSX.Element;

package/dist/ui/loading/triple-dot-spinner.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TripleDotSpinner: () => React.JSX.Element;

package/dist/ui/loading/twin-orbit.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TwinOrbit: () => React.JSX.Element;

package/dist/ui/loading/typing-indicator.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TypingIndicator: () => React.JSX.Element;

package/dist/ui/loading/typing.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const Typing: () => React.JSX.Element;

package/dist/ui/loading/wandering-cube.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const WanderingCube: () => React.JSX.Element;

package/dist/ui/loading/watch-spinner.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const WatchSpinner: () => React.JSX.Element;

package/dist/ui/loading/wave-dots.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const WaveDots: () => React.JSX.Element;

package/dist/ui/loading/wave-physics-loader.d.ts

@@ -0,0 +1,3 @@
+export declare function WavePhysicsLoader({ theme }: {
+    theme?: 'light' | 'dark';
+}): import("react").JSX.Element;

package/dist/ui/loading/waveform-loader.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const WaveformLoader: () => React.JSX.Element;

package/dist/ui/loading/zig-zag-pulse.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ZigZagPulse: () => React.JSX.Element;

package/dist/ui/scroll/progress-indicator.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface ProgressIndicatorProps {
+    color?: string;
+    height?: number;
+    className?: string;
+}
+export declare function ProgressIndicator({ color, height, className, }: ProgressIndicatorProps): React.JSX.Element;
+export {};

package/dist/ui/scroll/scroll-reveal.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface ScrollRevealProps {
+    children: React.ReactNode;
+    duration?: number;
+    yOffset?: number;
+    xOffset?: number;
+    scale?: number;
+    className?: string;
+}
+export declare function ScrollReveal({ children, duration, yOffset, xOffset, scale, className, }: ScrollRevealProps): React.JSX.Element;
+export {};

package/dist/ui/scroll/sticky-reveal.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface StickyRevealProps {
+    content: {
+        title: string;
+        description: string;
+        content?: React.ReactNode;
+    }[];
+    className?: string;
+}
+export declare function StickyReveal({ content, className, }: StickyRevealProps): React.JSX.Element;
+export {};

package/dist/ui/text/blur-text.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface BlurTextProps {
+    text: string;
+    duration?: number;
+    staggerDelay?: number;
+    initialBlur?: string;
+    className?: string;
+}
+export declare function BlurText({ text, duration, staggerDelay, initialBlur, className, }: BlurTextProps): React.JSX.Element;
+export {};

package/dist/ui/text/character-stagger.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface CharacterStaggerProps {
+    text: string;
+    duration?: number;
+    staggerDelay?: number;
+    yOffset?: number;
+    className?: string;
+}
+export declare function CharacterStagger({ text, duration, staggerDelay, yOffset, className, }: CharacterStaggerProps): React.JSX.Element;
+export {};

package/dist/ui/text/text-reveal.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface TextRevealProps {
+    text: string;
+    duration?: number;
+    staggerDelay?: number;
+    className?: string;
+}
+export declare function TextReveal({ text, duration, staggerDelay, className, }: TextRevealProps): React.JSX.Element;
+export {};

package/dist/ui/text/word-reveal.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface WordRevealProps {
+    text: string;
+    duration?: number;
+    staggerDelay?: number;
+    className?: string;
+}
+export declare function WordReveal({ text, duration, staggerDelay, className, }: WordRevealProps): React.JSX.Element;
+export {};

package/dist/ui/toggles/classic-toggle.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ClassicToggle: () => React.JSX.Element;

package/dist/ui/transitions/page-transition.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export type TransitionType = 'double-stairs' | 'shutter-stairs' | 'split-stairs' | 'horizontal-split' | 'vertical-split' | 'slash' | 'lattice' | 'curtain-shred' | 'pixel' | 'pixel-wave' | 'pixel-spiral' | 'vortex' | 'cross-fade' | 'expand-grow' | 'push-slide' | 'pop-over' | 'depth-forward' | 'liquid-wave';
+export interface PageTransitionProps {
+    type?: TransitionType;
+    isVisible: boolean;
+    onComplete?: () => void;
+    className?: string;
+}
+export declare const PageTransition: React.FC<PageTransitionProps>;

package/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@mova-ui/react",
+  "version": "0.1.0",
+  "description": "Mova — Make interfaces feel alive. React motion components and an offline source CLI.",
+  "private": false,
+  "type": "module",
+  "license": "MIT",
+  "homepage": "https://mova.zeeland.studio",
+  "keywords": ["react", "animation", "motion", "components", "mova"],
+  "engines": { "node": ">=20" },
+  "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org/" },
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": { "types": "./dist/index.d.ts", "import": "./dist/index.js" },
+    "./styles.css": "./dist/styles.css",
+    "./package.json": "./package.json"
+  },
+  "bin": { "mova": "./bin/mova.mjs" },
+  "files": ["dist/**/*.js", "dist/**/*.d.ts", "dist/styles.css", "bin/mova.mjs", "registry/*.json", "LICENSE", "README.md"],
+  "sideEffects": ["**/*.css"],
+  "scripts": { "build": "node scripts/build.mjs", "prepack": "npm run build" },
+  "peerDependencies": { "react": "^18.2.0 || ^19.0.0", "react-dom": "^18.2.0 || ^19.0.0" },
+  "dependencies": { "framer-motion": "^12.23.24", "clsx": "^2.1.1", "tailwind-merge": "^3.3.0" },
+  "devDependencies": { "@tailwindcss/cli": "^4.1.14", "tailwindcss": "^4.1.14", "@types/react": "^19.0.0", "@types/react-dom": "^19.0.0", "typescript": "~5.8.2", "esbuild": "^0.25.0", "react": "^19.0.1", "react-dom": "^19.0.1" }
+}

package/registry/accordion-loader.json

@@ -0,0 +1,8 @@
+{
+  "id": "accordion-loader",
+  "file": "accordion-loader.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AccordionLoader = () => {\n  return (\n    <div className=\"flex flex-col space-y-1.5 w-10 h-10 justify-center\">\n      {[0, 1, 2, 3].map((i) => (\n        <motion.div\n          key={i}\n          className=\"w-full h-1 bg-zinc-800 dark:bg-white rounded-full origin-left\"\n          animate={{ scaleX: [1, 0.2, 1] }}\n          transition={{ duration: 1.5, repeat: Infinity, ease: \"easeInOut\", delay: i * 0.15 }}\n        />\n      ))}\n    </div>\n  );\n};\n"
+}

package/registry/app-icon-load.json

@@ -0,0 +1,8 @@
+{
+  "id": "app-icon-load",
+  "file": "app-icon-load.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppIconLoad = () => (\n  <div className=\"relative w-12 h-12 bg-zinc-200 dark:bg-zinc-800 rounded-[12px] flex items-center justify-center overflow-hidden\">\n    <svg className=\"w-8 h-8 absolute\" viewBox=\"0 0 50 50\">\n      <circle\n        cx=\"25\" cy=\"25\" r=\"20\"\n        className=\"stroke-zinc-300 dark:stroke-zinc-700 fill-none\"\n        strokeWidth=\"4\"\n      />\n      <motion.circle\n        cx=\"25\" cy=\"25\" r=\"20\"\n        className=\"stroke-zinc-800 dark:stroke-white fill-none\"\n        strokeWidth=\"4\"\n        strokeDasharray=\"125\"\n        animate={{ strokeDashoffset: [125, 0] }}\n        transition={{ duration: 2, repeat: Infinity, ease: \"easeInOut\" }}\n        style={{ rotate: -90, transformOrigin: 'center' }}\n      />\n    </svg>\n  </div>\n);\n"
+}

package/registry/apple-breathe.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-breathe",
+  "file": "apple-breathe.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppleBreathe = () => {\n  return (\n    <div className=\"relative flex items-center justify-center w-12 h-12\">\n      {[0, 60, 120, 180, 240, 300].map((angle, idx) => {\n        // Alternating color teal-blue palette\n        const bgClass = idx % 2 === 0 \n          ? 'bg-teal-400/35 dark:bg-teal-400/40' \n          : 'bg-cyan-400/35 dark:bg-cyan-400/40';\n        return (\n          <motion.div\n            key={angle}\n            className={`absolute w-3.5 h-3.5 rounded-full ${bgClass}`}\n            style={{ transformOrigin: 'center' }}\n            animate={{\n              scale: [1, 1.75, 1],\n              x: [0, Math.cos(angle * Math.PI / 180) * 11, 0],\n              y: [0, Math.sin(angle * Math.PI / 180) * 11, 0]\n            }}\n            transition={{\n              duration: 3.6,\n              repeat: Infinity,\n              ease: \"easeInOut\"\n            }}\n          />\n        );\n      })}\n    </div>\n  );\n};\n"
+}

package/registry/apple-equalizer.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-equalizer",
+  "file": "apple-equalizer.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppleEqualizer = () => (\n  <div className=\"flex space-x-1 h-8 items-end\">\n    {[0,1,2,3].map(i => (\n      <motion.div\n        key={i}\n        className=\"w-1.5 bg-zinc-800 dark:bg-white rounded-t-sm\"\n        animate={{ height: ['20%', '100%', '20%'] }}\n        transition={{ duration: 0.8, repeat: Infinity, delay: Math.random() * 0.5, ease: \"circInOut\" }}\n      />\n    ))}\n  </div>\n);\n"
+}

package/registry/apple-icon-morph.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-icon-morph",
+  "file": "apple-icon-morph.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppleIconMorph = () => (\n  <motion.div\n    className=\"w-8 h-8 bg-zinc-800 dark:bg-white\"\n    animate={{\n      borderRadius: [\"20%\", \"50%\", \"50%\", \"20%\"],\n      rotate: [0, 90, 180, 270]\n    }}\n    transition={{ duration: 2, repeat: Infinity, ease: \"easeInOut\" }}\n  />\n);\n"
+}

package/registry/apple-pulse-dots.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-pulse-dots",
+  "file": "apple-pulse-dots.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const ApplePulseDots = () => (\n  <div className=\"flex space-x-2\">\n    {[0, 1, 2].map(i => (\n      <motion.div\n        key={i}\n        className=\"w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full\"\n        animate={{ scale: [0.5, 1, 0.5], opacity: [0.3, 1, 0.3] }}\n        transition={{ duration: 1.2, repeat: Infinity, delay: i * 0.15, ease: \"easeInOut\" }}\n      />\n    ))}\n  </div>\n);\n"
+}

package/registry/apple-scale-pulse.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-scale-pulse",
+  "file": "apple-scale-pulse.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppleScalePulse = () => (\n  <div className=\"relative w-12 h-12 flex items-center justify-center\">\n    <motion.div\n      className=\"absolute w-full h-full bg-zinc-200 dark:bg-zinc-800 rounded-full\"\n      animate={{ scale: [0, 1], opacity: [1, 0] }}\n      transition={{ duration: 1.5, repeat: Infinity, ease: \"easeOut\" }}\n    />\n    <motion.div\n      className=\"absolute w-full h-full bg-zinc-200 dark:bg-zinc-800 rounded-full\"\n      animate={{ scale: [0, 1], opacity: [1, 0] }}\n      transition={{ duration: 1.5, repeat: Infinity, delay: 0.5, ease: \"easeOut\" }}\n    />\n    <div className=\"w-3 h-3 bg-zinc-800 dark:bg-white rounded-full z-10\" />\n  </div>\n);\n"
+}

package/registry/apple-sound-wave.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-sound-wave",
+  "file": "apple-sound-wave.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppleSoundWave = () => (\n  <div className=\"flex space-x-1 h-8 items-center\">\n    {[1, 2, 3, 2, 1].map((val, i) => (\n      <motion.div\n        key={i}\n        className=\"w-1 bg-zinc-800 dark:bg-white rounded-full\"\n        animate={{ height: [4, val * 8, 4] }}\n        transition={{ duration: 1, repeat: Infinity, delay: i * 0.1, ease: \"easeInOut\" }}\n      />\n    ))}\n  </div>\n);\n"
+}

package/registry/apple-text-reveal.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-text-reveal",
+  "file": "apple-text-reveal.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppleTextReveal = () => (\n  <div className=\"font-medium text-lg text-zinc-900 dark:text-white overflow-hidden h-6 relative\">\n    <motion.div\n      animate={{ y: [\"100%\", \"0%\", \"-100%\"] }}\n      transition={{ duration: 2, repeat: Infinity, ease: \"easeInOut\" }}\n    >\n      Loading\n    </motion.div>\n  </div>\n);\n"
+}

package/registry/apple-unlock.json

@@ -0,0 +1,8 @@
+{
+  "id": "apple-unlock",
+  "file": "apple-unlock.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const AppleUnlock = ({ theme = 'light' }: { theme?: 'light' | 'dark' }) => {\n  const isDark = theme === 'dark';\n  return (\n    <div className=\"relative font-medium text-sm tracking-wide select-none\">\n      <span className=\"text-zinc-400 dark:text-zinc-600\">\n        Slide to unlock\n      </span>\n      <motion.div\n        className=\"absolute inset-0 text-zinc-950 dark:text-white bg-clip-text text-transparent bg-gradient-to-r from-transparent via-current to-transparent\"\n        style={{\n          backgroundSize: \"200% 100%\",\n        }}\n        animate={{ backgroundPosition: [\"200% 0\", \"-200% 0\"] }}\n        transition={{ duration: 2.2, repeat: Infinity, ease: \"linear\" }}\n      >\n        Slide to unlock\n      </motion.div>\n    </div>\n  );\n};\n"
+}

package/registry/arc-tracer.json

@@ -0,0 +1,8 @@
+{
+  "id": "arc-tracer",
+  "file": "arc-tracer.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const ArcTracer = () => {\n  return (\n    <svg className=\"w-10 h-10\" viewBox=\"0 0 50 50\">\n      <circle cx=\"25\" cy=\"25\" r=\"20\" className=\"stroke-zinc-200 dark:stroke-zinc-800 fill-none\" strokeWidth=\"4\" />\n      <motion.circle\n        cx=\"25\"\n        cy=\"25\"\n        r=\"20\"\n        className=\"stroke-zinc-800 dark:stroke-white fill-none\"\n        strokeWidth=\"4\"\n        strokeLinecap=\"round\"\n        strokeDasharray=\"125\"\n        animate={{ strokeDashoffset: [125, 0, -125] }}\n        transition={{ duration: 2, repeat: Infinity, ease: \"easeInOut\" }}\n      />\n    </svg>\n  );\n};\n"
+}

package/registry/bar-cascade.json

@@ -0,0 +1,8 @@
+{
+  "id": "bar-cascade",
+  "file": "bar-cascade.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const BarCascade = () => {\n  return (\n    <div className=\"flex space-x-1 items-center h-8\">\n      {[0, 1, 2, 3, 4].map((i) => (\n        <motion.div\n          key={i}\n          className=\"w-1.5 bg-zinc-800 dark:bg-white rounded-full\"\n          animate={{ height: [\"8px\", \"24px\", \"8px\"] }}\n          transition={{ duration: 1, repeat: Infinity, delay: i * 0.1, ease: \"easeInOut\" }}\n        />\n      ))}\n    </div>\n  );\n};\n"
+}

package/registry/bar-sweep.json

@@ -0,0 +1,8 @@
+{
+  "id": "bar-sweep",
+  "file": "bar-sweep.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const BarSweep = () => {\n  return (\n    <div className=\"w-12 h-6 border-2 border-zinc-800 dark:border-zinc-700 rounded-full p-1 relative flex items-center overflow-hidden\">\n      <motion.div\n        className=\"w-4 h-4 bg-zinc-800 dark:bg-white rounded-full absolute\"\n        animate={{ x: [0, 24, 0] }}\n        transition={{ duration: 1.5, repeat: Infinity, ease: \"easeInOut\" }}\n      />\n    </div>\n  );\n};\n"
+}

package/registry/blur-text.json

@@ -0,0 +1,8 @@
+{
+  "id": "blur-text",
+  "file": "blur-text.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion, type Variants } from 'framer-motion';\n\ninterface BlurTextProps {\n  text: string;\n  duration?: number;\n  staggerDelay?: number;\n  initialBlur?: string;\n  className?: string;\n}\n\nexport function BlurText({\n  text,\n  duration = 0.5,\n  staggerDelay = 0.02,\n  initialBlur = '8px',\n  className = '',\n}: BlurTextProps) {\n  const characters = Array.from(text);\n\n  const containerVariants: Variants = {\n    hidden: { opacity: 0 },\n    visible: {\n      opacity: 1,\n      transition: {\n        staggerChildren: staggerDelay,\n      },\n    },\n  };\n\n  const charVariants: Variants = {\n    hidden: { opacity: 0, filter: `blur(${initialBlur})` },\n    visible: {\n      opacity: 1,\n      filter: 'blur(0px)',\n      transition: {\n        duration,\n        ease: 'easeOut',\n      },\n    },\n  };\n\n  return (\n    <motion.div\n      variants={containerVariants}\n      initial=\"hidden\"\n      whileInView=\"visible\"\n      viewport={{ once: true, margin: '-10%' }}\n      className={`inline-block ${className}`}\n    >\n      {characters.map((char, index) => (\n        <motion.span\n          key={index}\n          variants={charVariants}\n          className=\"inline-block whitespace-pre\"\n        >\n          {char}\n        </motion.span>\n      ))}\n    </motion.div>\n  );\n}\n"
+}

package/registry/bobbing-dots.json

@@ -0,0 +1,8 @@
+{
+  "id": "bobbing-dots",
+  "file": "bobbing-dots.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const BobbingDots = () => {\n  return (\n    <div className=\"flex space-x-2\">\n      {[0, 1, 2].map((i) => (\n        <motion.div\n          key={i}\n          className=\"w-3 h-3 bg-zinc-800 dark:bg-white rounded-full\"\n          animate={{ y: [0, -10, 0] }}\n          transition={{ duration: 1.2, repeat: Infinity, delay: i * 0.15, ease: \"easeInOut\" }}\n        />\n      ))}\n    </div>\n  );\n};\n"
+}

package/registry/bounce-dots.json

@@ -0,0 +1,8 @@
+{
+  "id": "bounce-dots",
+  "file": "bounce-dots.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const BounceDots = () => {\n  return (\n    <div className=\"flex space-x-1.5\">\n      {[0, 1, 2].map((i) => (\n        <motion.div\n          key={i}\n          className=\"w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full\"\n          animate={{ y: [0, -8, 0] }}\n          transition={{\n            duration: 0.6,\n            repeat: Infinity,\n            delay: i * 0.1,\n            ease: \"easeInOut\",\n          }}\n        />\n      ))}\n    </div>\n  );\n};\n"
+}

package/registry/bouncing-bars.json

@@ -0,0 +1,8 @@
+{
+  "id": "bouncing-bars",
+  "file": "bouncing-bars.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const BouncingBars = () => {\n  return (\n    <div className=\"flex space-x-1.5 h-8 items-center\">\n      {[0, 1, 2].map((i) => (\n        <motion.div\n          key={i}\n          className=\"w-1.5 h-8 bg-zinc-800 dark:bg-white rounded-full\"\n          animate={{ scaleY: [0.3, 1, 0.3] }}\n          transition={{ duration: 1, repeat: Infinity, delay: i * 0.2, ease: \"easeInOut\" }}\n        />\n      ))}\n    </div>\n  );\n};\n"
+}

package/registry/bouncing-dots.json

@@ -0,0 +1,8 @@
+{
+  "id": "bouncing-dots",
+  "file": "bouncing-dots.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const BouncingDots = () => {\n  return (\n    <div className=\"flex space-x-2 h-12 items-end pb-2 border-b-2 border-zinc-200 dark:border-zinc-800 w-16 justify-center relative\">\n      {[0, 1, 2].map((i) => (\n        <motion.div\n          key={i}\n          className=\"w-3 h-3 bg-zinc-800 dark:bg-white rounded-full absolute bottom-2\"\n          style={{ left: `${(i * 14) + 10}px` }}\n          animate={{ y: [0, -20, 0], scaleY: [0.8, 1.1, 0.8] }}\n          transition={{ duration: 0.8, repeat: Infinity, delay: i * 0.1, ease: \"easeInOut\" }}\n        />\n      ))}\n    </div>\n  );\n};\n"
+}

package/registry/bouncing-lines.json

@@ -0,0 +1,8 @@
+{
+  "id": "bouncing-lines",
+  "file": "bouncing-lines.tsx",
+  "dependencies": [
+    "framer-motion"
+  ],
+  "content": "\"use client\";\nimport React from 'react';\nimport { motion } from 'framer-motion';\n\nexport const BouncingLines = () => {\n  return (\n    <div className=\"flex flex-col space-y-1.5 w-8\">\n      {[0, 1, 2].map((i) => (\n        <motion.div\n          key={i}\n          className=\"w-full h-1.5 bg-zinc-800 dark:bg-white rounded-full origin-left\"\n          animate={{ scaleX: [0.3, 1, 0.3] }}\n          transition={{ duration: 1, repeat: Infinity, delay: i * 0.2, ease: \"easeInOut\" }}\n        />\n      ))}\n    </div>\n  );\n};\n"
+}