I have a component defined as follows:

// Form.Container.tsx

export default function MyForm(props: IFormProps): JSX.Element {
  /*
    some crazy logic here
  */
  return (
    <Form<{initialValues: RFFFormProps['initialValues'] }> initialValues={{ name: 'John Doe' }}>
      <FormField type="text" name="name" />
      {/* more FormField components here */}
    </Form>

  )
}

I'm fairly new with Typescript but I've been able to get a hold on the concepts since I have some background on C#. I am trying to propagate the types through the child components. What I mean is that I want to be able to make FormField props values to be enforced depending on what Form.initialValues prop receives. For example, I want FormField.name to only accept the key values that Form.initialValues receives (in this case, name can only receive a value of "name" since it's the only key in initialValues). Is there a way to do that or is it something that Typescript doesn't allow?