Merge branch 'xyflow' into svelte-flow-fix-hidden

examples/svelte/src/routes/+layout.server.ts

@@ -2,7 +2,7 @@ import { redirect } from '@sveltejs/kit';
 
 /** @type {import('./$types').LayoutServerLoad} */
 export function load({ route }) {
-  if (route.id === '/') {
-    throw redirect(307, '/overview');
-  }
+	if (route.id === '/') {
+		throw redirect(307, '/examples/overview');
+	}
 }

examples/svelte/src/routes/examples/+layout.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { Header } from '../components/Header';
+	import { Header } from '$components/Header';
 </script>
 
 <div class="app">

examples/svelte/src/routes/examples/+page.svelte

@@ -0,0 +1 @@
+<div>this redirects to /overview</div>

examples/svelte/src/routes/tests/generic/[topic]/[example]/+page.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	import { SvelteFlowProvider } from '@xyflow/svelte';
+
+	import Flow from './Flow.svelte';
+
+	export let data: { flowConfig: FlowConfig };
+</script>
+
+<SvelteFlowProvider>
+	<Flow flowConfig={data.flowConfig} />
+</SvelteFlowProvider>

examples/svelte/src/routes/tests/generic/[topic]/[example]/+page.ts

@@ -0,0 +1,19 @@
+import { error } from '@sveltejs/kit';
+
+const flowConfigs = import.meta.glob<FlowConfig>('/src/generic-tests/**/*.ts', {
+	eager: true,
+	import: 'default'
+});
+
+/** @type {import('./$types').PageLoad} */
+export function load({ params }) {
+	const flowConfig = flowConfigs[`/src/generic-tests/${params.topic}/${params.example}.ts`];
+
+	if (!flowConfig) {
+		throw error(404, 'Not found');
+	}
+
+	return {
+		flowConfig
+	};
+}

examples/svelte/src/routes/tests/generic/[topic]/[example]/Flow.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { writable } from 'svelte/store';
+	import { SvelteFlow } from '@xyflow/svelte';
+
+	import '@xyflow/svelte/dist/style.css';
+
+	export let flowConfig: FlowConfig;
+
+	// Create writables here so it is easier to create test cases
+	const nodes = writable(flowConfig.flowProps.nodes);
+	const edges = writable(flowConfig.flowProps.edges);
+
+	const props = { ...flowConfig.flowProps, nodes, edges };
+</script>
+
+<SvelteFlow {...props} />