Svelte
Use FlowDrop as a native Svelte 5 component.
FlowDrop is built with Svelte 5, so in a Svelte app you use its components directly — no mount API needed.
1. Install
npm install @flowdrop/flowdrop @iconify/svelte @xyflow/svelte2. Drop in the editor
<script>
import { App } from '@flowdrop/flowdrop/editor';
import { createEndpointConfig } from '@flowdrop/flowdrop/core';
import '@flowdrop/flowdrop/styles';
const endpointConfig = createEndpointConfig('/api/flowdrop');
</script>
<App
{endpointConfig}
onAfterSave={async (workflow) => console.log('Saved:', workflow.id)}
/>SvelteKit
FlowDrop is browser-only. In SvelteKit, guard the editor so it never renders during SSR:
<script>
import { browser } from '$app/environment';
import { App } from '@flowdrop/flowdrop/editor';
import { createEndpointConfig } from '@flowdrop/flowdrop/core';
import '@flowdrop/flowdrop/styles';
const endpointConfig = createEndpointConfig('/api/flowdrop');
</script>
{#if browser}
<App {endpointConfig} />
{/if}FlowDrop needs a backend.
It serves nodes and stores workflows. Point endpointConfig at your API, or
run a ready-made server.