import { useState, useRef } from 'react';
import Input, { type CustomRef } from './Input';
import './App.css';

const App: React.FC = () => {
  const ref = useRef<CustomRef>(null);

  const [name, setName] = useState('');

  function handleClick() {
    setName(ref.current?.getUCValue() || '');
  }

  return (
    <div>
      <div>Hello {name}!</div>
      <Input label="Name: " ref={ref} />
      <button onClick={handleClick}>say hello</button>
    </div>
  );
};
export default App;

