diff options
Diffstat (limited to '')
-rw-r--r-- | .changeset/dirty-planes-punch.md | 5 | ||||
-rw-r--r-- | packages/astro/src/@types/astro.ts | 10 |
2 files changed, 11 insertions, 4 deletions
diff --git a/.changeset/dirty-planes-punch.md b/.changeset/dirty-planes-punch.md new file mode 100644 index 000000000..1c2ff17d2 --- /dev/null +++ b/.changeset/dirty-planes-punch.md @@ -0,0 +1,5 @@ +--- +"astro": patch +--- + +Fixes minor type issues in actions component example diff --git a/packages/astro/src/@types/astro.ts b/packages/astro/src/@types/astro.ts index b595f2b58..bad3b3cb7 100644 --- a/packages/astro/src/@types/astro.ts +++ b/packages/astro/src/@types/astro.ts @@ -1776,12 +1776,14 @@ export interface AstroUserConfig { * }; * ``` * - * Then, call an action from your client components using the `actions` object from `astro:actions`. You can pass a type-safe object when using JSON, or a [FormData](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest_API/Using_FormData_Objects) object when using `accept: 'form'` in your action definition: + * Then, call an action from your client components using the `actions` object from `astro:actions`. You can pass a type-safe object when using JSON, or a [FormData](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest_API/Using_FormData_Objects) object when using `accept: 'form'` in your action definition. + * + * This example calls the `like` and `comment` actions from a React component: * * ```tsx "actions" * // src/components/blog.tsx * import { actions } from "astro:actions"; - * import { useState } from "preact/hooks"; + * import { useState } from "react"; * * export function Like({ postId }: { postId: string }) { * const [likes, setLikes] = useState(0); @@ -1802,13 +1804,13 @@ export interface AstroUserConfig { * <form * onSubmit={async (e) => { * e.preventDefault(); - * const formData = new FormData(e.target); + * const formData = new FormData(e.target as HTMLFormElement); * const result = await actions.blog.comment(formData); * // handle result * }} * > * <input type="hidden" name="postId" value={postId} /> - * <label for="author">Author</label> + * <label htmlFor="author">Author</label> * <input id="author" type="text" name="author" /> * <textarea rows={10} name="body"></textarea> * <button type="submit">Post</button> |