"use client" import { useEffect, useMemo, useState, type ReactElement } from "react" import { TerminalIcon } from "lucide-react" import { GoTerminal } from "react-icons/go" type TerminalStep = { text: string bold?: boolean } type TerminalProps = { command: string steps: TerminalStep[] pulseInterval?: number showLocalhost?: boolean hostBarTitle?: string hostMessage?: string } function MacControls() { return ( <>

) } function LocalHost({ title, message }: { title: string; message: string }) { return (

{title}

{message}

) } const Terminal = ({ command, steps, pulseInterval = 100, showLocalhost = true, hostBarTitle = "localhost:3000", hostMessage = "New App Created!", }: TerminalProps) => { const typingLen = useMemo(() => command.length, [command]) const revealLen = useMemo(() => steps.length, [steps]) const finalCount = typingLen + revealLen + 1 const [counter, setCounter] = useState(finalCount) useEffect(() => { const interval = setInterval(() => { setCounter((prev) => (prev >= finalCount ? prev : prev + 1)) }, pulseInterval) return () => clearInterval(interval) }, [pulseInterval, finalCount]) const elements: ReactElement[] = [] const typedChars = Math.min(counter, typingLen) const isTyping = counter < typingLen elements.push( {command.substring(0, typedChars)} {isTyping && (

)} ) if (!isTyping) { const shownSteps = Math.min(revealLen, counter - typingLen) if (shownSteps > 0) { elements.push( ) } for (let i = 0; i < shownSteps; i++) { const step = steps[i] elements.push( {step.text} ) } } const revealComplete = counter > typingLen + revealLen return (

{ if (counter >= finalCount) { setCounter(0) } }} > {showLocalhost && revealComplete && ( )}

) } export default Terminal

terminal

Instalação

Dependências