import { useIntl } from "react-intl"

import BookingFlowInput from "../../../../BookingFlowInput"

import type { RegisterOptions } from "react-hook-form"

export function MembershipNumberInput({
  registerOptions,
  label,
  className,
  disabled,
}: {
  registerOptions?: RegisterOptions
  label?: string
  className?: string
  disabled?: boolean
}) {
  const intl = useIntl()

  return (
    <BookingFlowInput
      label={
        label ||
        intl.formatMessage({
          id: "common.membershipId",
          defaultMessage: "Membership ID",
        })
      }
      name="membershipNo"
      type="tel"
      registerOptions={registerOptions}
      className={className}
      disabled={disabled}
    />
  )
}