value binding from Form.Field is not properly narrowed from generic type

[fnimick]

Describe the bug

For some reason, using the same form object directly with FormPrimitive.Field from formsnap correctly narrows the type for the value prop, but using it with Form.Field from shadcn does not.

This works:

<FormPrimitive.Field {form} name="username" let:value>

(value is now the correct type of of the field from the form definition)

This does not:

<Form.Field {form} name="username" let:value>

(value is unknown)

Reproduction

https://stackblitz.com/edit/github-dsnve4?file=src%2Froutes%2F%2Bpage.svelte,src%2Froutes%2F%2Bpage.server.ts

It doesn't show inline, but run npm run check and the error will appear for the <Form.Field> case.

Logs

No response

System Info

System:
    OS: macOS 14.4.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 29.20 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.19.0 - ~/.asdf/installs/nodejs/18.19.0/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 10.2.3 - ~/.asdf/plugins/nodejs/shims/npm
  Browsers:
    Chrome: 123.0.6312.105
    Safari: 17.4.1
  npmPackages:
    @sveltejs/kit: ^2.5.0 => 2.5.0 
    bits-ui: ^0.21.2 => 0.21.2 
    formsnap: ^1.0.0 => 1.0.0 
    lucide-svelte: ^0.364.0 => 0.364.0 
    svelte: ^4.2.11 => 4.2.11 
    sveltekit-superforms: ^2.12.2 => 2.12.2

Severity

annoyance

[joleeee]

I don't know if its related but I'm having an issue where the form is validated locally, but since form data is sent as strings, the validation on the server fails because "123" is not a number

[huntabyte]

I don't know if its related but I'm having an issue where the form is validated locally, but since form data is sent as strings, the validation on the server fails because "123" is not a number

This is unrelated and an issue with your schema, you need to coerce it into a number.

Regarding the actual issue, I'll try to investigate and see why this is happening.