How to integrate RadixUI Themes controls with react-hook-form register()?

Question

There is not a single documented example in RadixUI documentation. I have tried logical path but values aren't updated on change. I want to use register() from react-hook-form and not Controller.

Are there any working examples that I can have a look?

import { useForm } from 'react-hook-form'; 
import { Flex, Text, Slider, Switch } from '@radix-ui/themes';

const MyComponent: FC<Props> = () => {

  const methods = useForm<MyFormData>({
    mode: 'onChange',
    defaultValues,
  });
  const { register, formState, handleSubmit, getValues } = methods;

  // no values get updated
  console.error('getValues', getValues());

  const { max, min, ...timeSliderRegister } = register('timeSlider', {
    onChange: (e) => {
      // console.error('e', e); // just for debugging
    },
  });

  return (
    <form>
      <Text as="label" size="2">
        <Flex gap="2">
          <Switch {...register('isHighlightOnTime')} defaultChecked /> Highlight based on
          time
        </Flex>
      </Text>
      <Slider {...timeSliderRegister} defaultValue={[50]} />
    </form>
  )
}