import React from 'react';
import { useFormContext } from "react-hook-form";

type Props = {
    text: string;
    name: string;
    children?: JSX.Element[] | JSX.Element;
  }


export const Select: React.FC<Props> = ({text, name}) => {
    const { register } = useFormContext();
    return(
        <>
        <label htmlFor="country" className="block text-sm font-medium text-gray-700">
            {text}
        </label>
        <select
            {...register(name)}
                name={name}
                defaultValue={''}
                className="mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
            >
                <option value="" selected>-- Выбрать --</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
                <option value="7">7</option>
                <option value="8">8</option>
                <option value="9">9</option>
                <option value="10">10</option>
                <option value="11">11</option>
        </select>
    </>
    )
}