import { FC } from 'react';
import { Controller, ControllerProps } from 'react-hook-form';

import NumberInputStepper, { NumberInputStepperProps } from '.';

type FormNumberInputStepperProps = {
  name: string;
  stepperProps: NumberInputStepperProps;
  rules?: ControllerProps['rules'];
};

const FormNumberInputStepper: FC<FormNumberInputStepperProps> = ({
  name,
  stepperProps,
  rules,
}) => {
  return (
    <Controller
      name={name}
      rules={rules}
      render={({ field: { value, onChange } }) => (
        <NumberInputStepper
          {...stepperProps}
          value={value}
          onChange={onChange}
        />
      )}
    />
  );
};

export default FormNumberInputStepper;