docs: update intent-button.md

[KirillSBarsukov]

Added a working example for insert, remove and reorder intents.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 45695aa

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[pkg-pr-new]

Open in Stackblitz

More templates

• @conform-example/chakra-ui
• @conform-example/headless-ui
• @conform-example/nextjs
• @conform-example/material-ui
• @conform-example/radix-ui
• @conform-example/react-router
• @conform-example/remix
• @conform-example/shadcn-ui

@conform-to/validitystate

pnpm add https://pkg.pr.new/@conform-to/validitystate@761

@conform-to/dom

pnpm add https://pkg.pr.new/@conform-to/dom@761

@conform-to/react

pnpm add https://pkg.pr.new/@conform-to/react@761

@conform-to/yup

pnpm add https://pkg.pr.new/@conform-to/yup@761

@conform-to/zod

pnpm add https://pkg.pr.new/@conform-to/zod@761

commit: 45695aa

[edmundhung]

Hi @KirillSBarsukov, sorry for the confusing example in the docs. If you need to update the value of a field, the minimal setup as of v1.1.5 would be <input key={task.key} name={task.name} defaultValue={task.initialValue} /> and so your changes using getInputProps does fix the issue you had with the form intents.

Having said that, the situation is a bit different with our newly released v1.2.0. As it is no longer required to pass a key to the input element. The defaultValue is also optional depending on your usecases. The original example is now working as expected without any changes! Please give it a try and let me know if you run into any other problems :)

[KirillSBarsukov]

Hello @edmundhung , sorry for the late response. I have updated my Conform version to 1.2.2 and can confirm that the example works as expected — almost. I found that the "Add Task" button does not create a new record unless we provide the onSubmit property to the form or destructure the result of the getFormProps helper function. My most recent commit includes the onSubmit property.

I also included a basic schema to make the code snippet fully functional when copy-pasted. I created this demo for you to try.

[edmundhung]

The change looks right to me! Thanks a lot and sorry for all the confusions.

[edmundhung]

One little request, can you help applying the same change on the ja docs? You can find it here https://github.com/edmundhung/conform/blob/main/docs/ja/intent-button.md

This is pure code change so we don't need to worry about translations. Thanks again :)

[KirillSBarsukov]

@edmundhung no worries, it is all good. Updated JP documentation.

[edmundhung]

Thank you!