usePhoneInput#onChange to return ChangeEvent

[wingsofovnia]

Currently, usePhoneInput takes onChange callback that accepts parsed params (data: { phone: string; inputValue: string; country: ParsedCountry })).

It is however helpful to keep access to native event. For example, when wrapping an existing Input component already having an onChange callback, which accepts a native event, like Chakra UI:

import { InputProps as ChakraInputProps } from '@chakra-ui/react'

export const TelInput = forwardRef<HTMLInputElement, ChakraInputProps>(function TelInput(
  {
    defaultValue,
    onChange: userOnChange,
    ...inputProps
  },
  userRef,
) {
  const phoneInput = usePhoneInput({
    value: defaultValue?.toString(),
    onChange: (data) => {
      userOnChange?.(data.phone) // TS2345: Argument of type string is not assignable to parameter of type ChangeEvent<HTMLInputElement>
    },
  })
// ...
})

It would be great to extend data callback argument with an event field, which will have event propagated from handlePhoneValueChange.

Meanwhile, this works for selected use cases:

onChange: (data) => {
  userOnChange?.({ target: { value: data.phone } } as ChangeEvent<HTMLInputElement>)
},