@nil-/xit 0.4.4 → 0.4.5

package/components/layouts/Scrollable.svelte

@@ -2,7 +2,7 @@
 </script>
 
 <div>
-    {@render children()}
+    {@render children?.()}
 </div>
 
 <style>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nil-/xit",
-  "version": "0.4.4",
+  "version": "0.4.5",
   "peerDependencies": {
     "svelte": "^5.7.1"
   },
@@ -19,6 +19,10 @@
       "types": "./test/Main.svelte.d.ts",
       "svelte": "./test/Main.svelte"
     },
+    "./test/ReadOnlyValueLoader.svelte": {
+      "types": "./test/ReadOnlyValueLoader.svelte.d.ts",
+      "svelte": "./test/ReadOnlyValueLoader.svelte"
+    },
     "./components/layouts/Container.svelte": {
       "types": "./components/layouts/Container.svelte.d.ts",
       "svelte": "./components/layouts/Container.svelte"

package/test/Main.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">import TestFrame from "./Frame.svelte";
 import Split from "../components/layouts/Split.svelte";
 import Scrollable from "../components/layouts/Scrollable.svelte";
-import { codec } from "$xit/codec.js";
+import { config } from "$xit/config.js";
 let selected = $state(-1);
 </script>
 
@@ -25,7 +25,7 @@ let selected = $state(-1);
     </Scrollable>
 {/snippet}
 
-<TestFrame decoder={codec.decode} {selected}>
+<TestFrame decoder={config.codec.decode} {selected}>
     {#snippet load({ tags, inputs, outputs })}
         <Scrollable>
             <Split vertical offset={200}>

package/test/ReadOnlyValueLoader.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">import { onDestroy } from "svelte";
+import { xit } from "../";
+import { config } from "$xit/config.js";
+const { loaded_data, frames } = $props();
+const { load_frame_data } = xit();
+let unmounted = false;
+const unsubs = [];
+let data = $state(frames.map((v) => null));
+const load = async (frame, index) => {
+  const frame_data = await load_frame_data(frame.id, frame.tag);
+  if (unmounted) {
+    frame_data.unsub();
+  } else {
+    unsubs.push(frame_data.unsub);
+    unsubs.push(frame_data.values.json(config.key, null, config.codec).subscribe((v) => data[index] = v));
+  }
+};
+onDestroy(() => {
+  unmounted = true;
+  unsubs.forEach((c) => c());
+});
+</script>
+
+{#if loaded_data != null}
+    {#await Promise.all(frames.map(load)) then frame_data}
+        {@render loaded_data(data)}
+    {/await}
+{/if}

package/test/ReadOnlyValueLoader.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Snippet } from "svelte";
+type $$ComponentProps = {
+    loaded_data?: Snippet<[any[]]>;
+    frames: {
+        id: string;
+        tag?: string;
+    }[];
+};
+declare const ReadOnlyValueLoader: import("svelte").Component<$$ComponentProps, {}, "">;
+type ReadOnlyValueLoader = ReturnType<typeof ReadOnlyValueLoader>;
+export default ReadOnlyValueLoader;