motion icon indicating copy to clipboard operation
motion copied to clipboard

Svelte 5 Wrapper Support

Open epavanello opened this issue 1 year ago • 6 comments

Is your feature request related to a problem? Please describe.

Now that vanilla JS APIs are available, it would be great to have native support for Svelte 5.

Describe the solution you'd like

An official Svelte 5 wrapper that integrates smoothly with the Runes API.

Describe alternatives you've considered

Using vanilla Motion.dev in Svelte projects, but it lacks reactivity and feels less integrated.

Additional context

Svelte’s reactive model could pair well with Motion.dev, enhancing the developer experience.

epavanello avatar Nov 18 '24 08:11 epavanello

I just created a repo to experiment with the possibility of wrapping motion apis in svelte https://github.com/epavanello/motion-svelte

epavanello avatar Nov 18 '24 23:11 epavanello

Since youre asking for Svelte support, might as well ask for

  1. Vue
  2. Solid
  3. Angular
  4. Preact
  5. Lit
  6. Yada yada

Nope @mattgperry, please let the community create wrappers themselves so you can focus on the React and Vanilla APIs <3

GLHF! This is gonna be a mess to maintain tbf.

targetlucked69 avatar Nov 19 '24 19:11 targetlucked69

I just completed a first minimal build with ssr and runes support. I will push the changes to the repo and the npm package soon

epavanello avatar Nov 19 '24 20:11 epavanello

Here the first demo and the repo

https://motion-svelte.vercel.app/ https://github.com/epavanello/motion-svelte

epavanello avatar Nov 19 '24 22:11 epavanello

@epavanello great work! Will use it on my end, and see if I can improve the component some what. You may consider creating a community package for the time being!

TGlide avatar Nov 25 '24 12:11 TGlide

Thank you so much for the kind words and support, @TGlide! 🙏 I really appreciate it.

I’ve just published the package, and it’s now installable via: npm i motion-svelte

Feel free to give it a try and let me know if you have any suggestions or improvements. Looking forward to your feedback! 🚀

epavanello avatar Nov 25 '24 13:11 epavanello