`Checkbox` component `checked` property showing a TypeError for passing a boolean value

[PlagueFPS]

react-hook-form version: 7.47.0 zod validation for field: z.boolean()

I followed the guide on implementing the checkbox directly from the component docs: https://ui.shadcn.com/docs/components/checkbox#form

I also noticed that the type for the checked property is CheckedState and when I went to look at the type it has a type definition of: boolean | "indeterminate"

I am passing a boolean value as it expects, but, the Checkbox component itself seems to have conflicting types with this since it tells me I can only pass in a string | number | string[] | readonly string[] | undefined

There are many ways I can get around this, but, it should not be showing a TypeError here.

[PlagueFPS]

Additional note: the property it's showing a TypeError for is the value property which I am not even using. This isn't that surprising though as I assume it maps the field.value property to the actual value property causing the error via the {...field}.

I am not sure if this intended behavior (I assume not since it's not in the documentation), but, for now I'm going with the easiest solution which is setting a value property along with the checked value and just coercing the boolean into a string.

Documentation and/or Types may need to be updated I'm not sure, but, please let me know if this is expected or not.

[headironc]

Maybe you need to provide an online demo that reproduces the bug

[PlagueFPS]

@headironc I don't think that would help as the TypeError doesn't prevent the functionality at all, it just fails to build when pushed to a hosting service when checking type validity.

[headironc]

No error found with my demo

[headironc]

Maybe you need this api reference

[eovandodev]

react-hook-form version: 7.47.0 zod validation for field: z.boolean()

I followed the guide on implementing the checkbox directly from the component docs: https://ui.shadcn.com/docs/components/checkbox#form

I also noticed that the type for the checked property is CheckedState and when I went to look at the type it has a type definition of: boolean | "indeterminate"

I am passing a boolean value as it expects, but, the Checkbox component itself seems to have conflicting types with this since it tells me I can only pass in a string | number | string[] | readonly string[] | undefined

There are many ways I can get around this, but, it should not be showing a TypeError here.

Don't spread props {...field}, instead just use the props that you require directly

[shadcn]

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.