Initialize once in your root onMount. Works with Svelte 4 and Svelte 5 runes.
The vanilla SDK fits Svelte's no-virtual-DOM model perfectly. Boot it from your root component's onMount and the widget lives outside Svelte's reactivity entirely.
npm install @usero/sdk<script lang='ts'>
import { onMount } from 'svelte'
import { initUseroFeedbackWidget } from '@usero/sdk'
onMount(() => {
const widget = initUseroFeedbackWidget({ clientId: 'YOUR_CLIENT_ID' })
return () => widget.destroy()
})
</script>
<slot />Replace YOUR_CLIENT_ID with the id from your Usero dashboard.
Built for Svelte
The vanilla SDK is plain JavaScript. Svelte 4, Svelte 5 with runes, and SvelteKit all consume the same package.
The widget renders into its own DOM root, so component updates and store changes never trigger a widget re-render.
~12kb gzipped is small compared to typical Svelte page weights, and it is shared across every route.
Returning a teardown from onMount means hot reloads do not leak triggers into the DOM.
Productboard expects a full embed page. Usero is a 12kb script that sits on top of your existing UI.
Verify
Run your Vite dev server and open the app.
Confirm the feedback bubble appears bottom-right after the root component mounts.
Click it and check the panel opens over your Svelte UI.
Submit a test message and confirm it lands in your Usero inbox.
Reload a few times and watch the console for leaked triggers or errors.
Troubleshooting
initUseroFeedbackWidget needs the DOM, so call it inside onMount, which only runs in the browser. Do not call it at the top of the <script> block.
SvelteKit renders on the server first. Guard the init with import { browser } from '$app/environment' and only call it when browser is true, or follow the SvelteKit guide and mount it in +layout.svelte.
Return a teardown from onMount: return () => widget.destroy(). Hot module reload re-runs onMount, so without the cleanup each reload leaves an orphaned trigger in the DOM.
It is initialized in a page-level component rather than the root. Move it to your top-level App.svelte (or +layout.svelte under SvelteKit) so it survives navigation.
There is not one, and you do not need it. The vanilla function call inside onMount is the idiomatic path. Import initUseroFeedbackWidget from @usero/sdk.
FAQ
Yes. The widget does not interact with Svelte reactivity at all, so $state and runes are unaffected.
There is no Svelte-specific wrapper because the vanilla SDK is already idiomatic. One import, one function call.
Use the SvelteKit guide. For pure Svelte (vite-svelte) there is no SSR concern.
Yes. Pass a theme object with your brand colors when initializing.
Free tier. No credit card. Two-minute install. Cancel by deleting two lines of code.
Install guides