# Code coverage report for src/components/features/python-runner/TerminalInput.tsx

# All files / src/components/features/python-runner TerminalInput.tsx

100% Statements 52/52
100% Branches 7/7
100% Functions 2/2
100% Lines 52/52

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    531x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    177x
    177x
    177x
    177x
    177x
    177x
    177x
    177x
    73x
    42x
    42x
    177x
    177x
    177x
    33x
    33x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
    144x
     import { useEffect, useRef } from 'react'
    import { motion } from 'framer-motion'
    import { Input } from '@/components/ui/input'

    interface TerminalInputProps {
      waitingForInput: boolean
      inputValue: string
      onInputChange: (value: string) => void
      onSubmit: (e: React.FormEvent) => void
    }

    export function TerminalInput({
      waitingForInput,
      inputValue,
      onInputChange,
      onSubmit
    }: TerminalInputProps) {
      const inputRef = useRef<HTMLInputElement>(null)

      useEffect(() => {
        if (waitingForInput && inputRef.current) {
          inputRef.current.focus()
        }
      }, [waitingForInput])

      if (!waitingForInput) {
        return null
      }

      return (
        <motion.form
          onSubmit={onSubmit}
          initial={{ opacity: 0 }}
          animate={{ opacity: 1 }}
          className="flex items-center gap-2 mt-2"
          data-testid="terminal-input-form"
        >
          <span className="text-primary font-bold" aria-hidden="true">{'>'}</span>
          <Input
            ref={inputRef}
            type="text"
            value={inputValue}
            onChange={(e) => onInputChange(e.target.value)}
            className="flex-1 font-mono bg-background border-accent/50 focus:border-accent"
            placeholder="Enter input..."
            disabled={!waitingForInput}
            data-testid="terminal-input"
            aria-label="Terminal input"
          />
        </motion.form>
      )
    }