diff --git a/resources/js/components/ui/TerminalSpinner.tsx b/resources/js/components/ui/TerminalSpinner.tsx new file mode 100644 index 0000000..98c5169 --- /dev/null +++ b/resources/js/components/ui/TerminalSpinner.tsx @@ -0,0 +1,57 @@ +import { useEffect, useState } from 'react'; + +interface TerminalSpinnerProps { + text?: string; + size?: 'sm' | 'md' | 'lg'; + fullScreen?: boolean; +} + +export default function TerminalSpinner({ + text = 'LOADING', + size = 'md', + fullScreen = false +}: TerminalSpinnerProps) { + const [dots, setDots] = useState(0); + + useEffect(() => { + const interval = setInterval(() => { + setDots(prev => (prev + 1) % 4); + }, 500); + + return () => clearInterval(interval); + }, []); + + const getDots = () => { + switch (dots) { + case 0: return ' '; + case 1: return '. '; + case 2: return '.. '; + case 3: return '...'; + default: return ' '; + } + }; + + const sizeClasses = { + sm: 'text-sm', + md: 'text-lg', + lg: 'text-xl' + }; + + const spinner = ( +