sveltekit-superforms
sveltekit-superforms copied to clipboard
Integration with SvelteKit Remote Functions
Problem/Motivation
SvelteKit has introduced a new concept of "Remote Functions" (specifically the form type) as discussed in sveltejs/kit#13897. These functions aim to provide a type-safe, collocated, and progressively enhanced way to handle server-side data mutations, acting as a SvelteKit-native RPC layer.
Currently, Superforms excels at providing an excellent DX for forms, including validation, progressive enhancement, and data binding. However, with the release of remote functions, there's an opportunity to further streamline the server-side action handling within Superforms, potentially simplifying boilerplate and improving type inference for form actions.
Proposed Solution/Idea
Explore and design an integration strategy for Superforms to leverage SvelteKit's new remote functions, particularly the form type. This could involve:
- Dedicated Handler: Provide an API within Superforms that allows users to directly bind a Superform to a SvelteKit remote
formfunction, reducing the need for explicitactions.tsfiles or manualfetchcalls for mutations. - Enhanced Type Inference: By understanding the types exposed by remote functions, Superforms could potentially offer even more robust and automatic type inference for form data and responses.
- Simplified Mutation Logic: Abstract away some of the repetitive patterns in
+page.server.tsor+page.tsaction handling when remote functions are used for form submissions.
This integration could lead to an even more cohesive and "SvelteKit-native" feel for Superforms users, aligning with SvelteKit's evolving patterns for data handling.
Benefits
- Reduced Boilerplate: Simplify server-side form handling.
- Improved Type Safety: Leverage remote functions' strong typing.
- Enhanced Developer Experience: More intuitive and integrated approach to form mutations.
- Future-Proofing: Align Superforms with SvelteKit's direction for data mutations.
Relevant Links
- SvelteKit Remote Functions Discussion: https://github.com/sveltejs/kit/discussions/13897
I feel like many of us are stuck between Remote Functions and Superforms. We really want to start using Remote Functions but there is no way we can give up all of the features and functionality that Superforms (and Formsnap) provides.
I haven't dug into the source code yet...but I think as long as Remote Function form can return the same data structure as the existing implementation...it might not be that much work to implement 😬 It could also be a gross oversimplification on my part.
@ciscoheat would you be able to point to some parts of the code that you know would need to be updated so that others might be able to start working on this?
I understand, I haven't had much time over the summer to look at it, but it is a bit more complicated than just converting it. An early adopter of the library, very knowledgeable, has been trying it out and had some results that he commented on here, for example that the remote function command seems a better fit than form.
With both the Runes update and remote functions, I'm leaning towards a full rewrite for v3. The adapters needs to be separated to individual packages as well, and this separation could also be made for the SvelteKit parts, leading to a Svelte-only version, and of course a very welcome cleanup of the code. It's a big task though, months of development, so there needs to be a community effort, either by chipping in towards a larger stretch goal donation, or a team working on it.
Hi, the person who's been hacking away at it here, I've also done some more iterating and arrived at using the onSubmit event provided by Superforms rather than the the event on the form element itself. That is, for hacking support for it into the current version.
A full rewrite sounds interesting. I'm curious how a Svelte-only version would work.
- The remote functions and their TS types are a part of kit
- As for validation, you could use the built-in validator on the RF, but it doesn't provide issues if the validation fails.
It may also be a good idea to let this part of Remote Functions: form validation to finalize, as it might be something that a rewrite of Superforms could take advantage of.
PR here, for anyone interested: https://github.com/sveltejs/kit/pull/14383
Hi, the person who's been hacking away at it here, I've also done some more iterating and arrived at using the
onSubmitevent provided by Superforms rather than the the event on the form element itself. That is, for hacking support for it into the current version.
Here is the current logic I'm using to integrate the current version with remote functions for anyone interested https://gist.github.com/sillvva/6515b65d85075133de7c2e533b730e98