import React, { useState } from 'react';
import styles from './TextInputBlock.module.css';
import { TextInputBlock as TextInputBlockType } from '../../types/blocks';

interface TextInputBlockProps {
  block: TextInputBlockType;
  visible: boolean;
  onTextChange?: (text: string) => void;
}

// eslint-disable-next-line @typescript-eslint/no-unused-vars
const TextInputBlock: React.FC<TextInputBlockProps> = ({ block, visible, onTextChange }) => {
  const [text, setText] = useState('');

  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
    const newText = e.target.value;
    setText(newText);
    onTextChange?.(newText);
  };

  return (
    <div className={`${styles.container} ${visible ? styles.visible : ''}`}>
      <textarea
        className={styles.input}
        placeholder="Опишите, какой стикер вы хотите получить..."
        rows={3}
        value={text}
        onChange={handleChange}
      />
    </div>
  );
};

export default TextInputBlock;
