added basic composite pattern to load the ui dynamically via json

src/lib/components/Composite.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+	import components from '$lib/components.ts';
+	export let componentsData = [];
+	export let name = '';
+
+	async function getComponent(componentName) {
+		if (components[componentName]) return components[componentName];
+		if (componentName === 'Composite') {
+			const module = await import('$lib/components/Composite.svelte');
+			return module.default;
+		}
+		return null;
+	}
+</script>
+
+{#each componentsData as component (component.id)}
+	{#await getComponent(component.componentName) then Component}
+		{#if Component}
+			<svelte:component
+				this={Component}
+				name={component.name}
+				componentsData={component.components}
+			/>
+		{:else}
+			<p>Component {component.componentName} not found.</p>
+		{/if}
+	{/await}
+{/each}
+
+<p>Composite: {name}</p>