Does sv5ui support SvelteKit 3 and Mochi?

[asphum]

Hi, and thanks for building sv5ui!

I'm planning to use it in a project built on SvelteKit 3.0, and I have a couple of questions:

Does sv5ui officially support SvelteKit 3.0? If so, which version of sv5ui should I use? If not, is support on the roadmap?
Does sv5ui work with Mochi? Are there any known issues or required configuration?

If there are any known breaking changes or workarounds for SvelteKit 3, I'd be glad to hear about them. I'm also happy to help test or report issues if that would be useful.

Thanks again!

[ndlabdev]

Hi @asphum, thanks for the kind words and for asking!

SvelteKit 3

sv5ui is a plain Svelte 5 component library, not a SvelteKit library. It has no dependency on @sveltejs/kit at runtime (no $app/* imports, and Kit is not a peer dependency). The only framework-level peer requirements are:

• svelte ^5.0.0
• tailwindcss ^4.0.0

So the SvelteKit 3 breaking changes (removal of $app/stores, base/assets from $app/paths, Node 22 / TS 6 floor, etc.) don't touch sv5ui itself. You should be able to use the latest sv5ui (currently 2.8.0) with SvelteKit 3.

To be transparent: Kit 3 is still a release candidate, and I haven't run the docs site or test suite against it yet (they're on Kit 2 / Vite 7 for now). The part most likely to need attention is the toolchain, since Kit 3 requires Vite 8 (Rolldown), so make sure @tailwindcss/vite and your other Vite plugins are on versions that support Vite 8. I plan to move the repo to Kit 3 once it goes stable.

Mochi

Same story: since sv5ui only needs Svelte 5 + Tailwind CSS v4, it isn't tied to any meta-framework. I haven't tested it with Mochi, so there's no official support or known config yet. A few things to keep in mind:

• Islands: most sv5ui components are interactive (built on bits-ui, floating-ui, embla, vaul-svelte, svelte-sonner). In a server-first setup like Mochi, anything that needs to open, toggle, or respond to input (Modal, Popover, Select, Tabs, Toast, Carousel, etc.) has to be rendered inside an island. Purely presentational components (Badge, Card, Avatar...) should be fine as static HTML.
• Styles: you need Tailwind CSS v4 in your build pipeline, then @import 'sv5ui/theme.css'; in your main CSS file, as described in the README.
• Color mode: dark mode relies on <ModeWatcher /> from mode-watcher, which runs on the client, so it should also live in an island (or a client entry) on every page.

If you try either setup, I'd really appreciate it if you could open an issue with anything that breaks (a minimal repro would be perfect). That would help me a lot in making support official. Thanks again!