form icon indicating copy to clipboard operation
form copied to clipboard

Broken types using HOC withForm since version 1.0.4.

Open gapurov opened this issue 9 months ago • 0 comments

Describe the bug

This component is used in various forms with different fields, so it does not receive any default values.

Everything worked fine until version 1.0.4, and the types were working or, at least, not throwing errors. However, since this PR:1253, the form prop shows type errors.

Is there a way to work around this issue so that type inference works even without passing default values?

import { withCustomForm } from './form-context';

export const Navigation = withCustomForm({
  props: {
    className: '',
  },
  render: function Render({ form, className }) {
    return (
      <div className={className}>
        <button type="button" onClick={() => {}}>
          Some Button
        </button>

        <form.AppForm>
          <form.SubmitButton>Submit Button</form.SubmitButton>
        </form.AppForm>
      </div>
    );
  },
});

Your minimal, reproducible example

https://stackblitz.com/edit/stackblitz-starters-djjzzgfn?file=app%2Fnavigation.tsx

Steps to reproduce

In the StackBlitz example, you can see the type error.

Image Image

Expected behavior

As a user, I expect the withForm HOC to infer types or, at least, not throw any errors, even without defaultValues.

How often does this bug happen?

None

Screenshots or Videos

No response

Platform

  • MacOs, latest Chrome Browser

TanStack Form adapter

react-form

TanStack Form version

1.0.5

TypeScript version

No response

Additional context

No response

gapurov avatar Mar 15 '25 17:03 gapurov