@nil-/xit 0.4.4 → 0.4.6

package/components/layouts/Scrollable.svelte

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

package/components/layouts/Split.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">import Container from "./Container.svelte";
 import DividerOverlay from "../utilities/DividerOverlay.svelte";
-import {} from "svelte";
 import { create } from "../utilities/draggable.js";
 let {
   min = 2,

package/components/layouts/Split.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type Snippet } from "svelte";
+import type { Snippet } from "svelte";
 type Props = {
     min?: number;
     side_a: Snippet;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nil-/xit",
-  "version": "0.4.4",
+  "version": "0.4.6",
   "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/ReactiveValueLoader.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">import { onDestroy } from "svelte";
+import { xit } from "..";
+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);
+    if (frame.type == "boolean") {
+      data[index] = frame_data.values.boolean(frame.key, false);
+    } else if (frame.type == "double") {
+      data[index] = frame_data.values.double(frame.key, 0);
+    } else if (frame.type == "number") {
+      data[index] = frame_data.values.number(frame.key, 0);
+    } else if (frame.type == "string") {
+      data[index] = frame_data.values.string(frame.key, "");
+    } else if (frame.type == "buffer") {
+      data[index] = frame_data.values.buffer(frame.key, new Uint8Array());
+    } else if (frame.type == "json") {
+      data[index] = frame_data.values.json(frame.key, null, frame.codec);
+    }
+  }
+};
+onDestroy(() => {
+  unmounted = true;
+  unsubs.forEach((c) => c());
+});
+</script>
+
+{#if loaded_data != null}
+    {#await Promise.all(frames.map(load)) then _}
+        {@render loaded_data(data)}
+    {/await}
+{/if}

package/test/ReactiveValueLoader.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { Snippet } from "svelte";
+import { type CoDec } from "..";
+type FrameDetails = {
+    id: string;
+    key: string;
+    tag?: string;
+    type: "boolean" | "double" | "number" | "string" | "buffer";
+} | {
+    id: string;
+    key: string;
+    tag?: string;
+    type: "json";
+    codec: CoDec<any>;
+};
+type $$ComponentProps = {
+    loaded_data?: Snippet<[any[]]>;
+    frames: FrameDetails[];
+};
+declare const ReactiveValueLoader: import("svelte").Component<$$ComponentProps, {}, "">;
+type ReactiveValueLoader = ReturnType<typeof ReactiveValueLoader>;
+export default ReactiveValueLoader;

package/test/ReadOnlyValueLoader.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">import { onDestroy } from "svelte";
+import { xit } from "..";
+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);
+    if (frame.type == "boolean") {
+      unsubs.push(frame_data.values.boolean(frame.key, false).subscribe((v) => data[index] = v));
+    } else if (frame.type == "double") {
+      unsubs.push(frame_data.values.double(frame.key, 0).subscribe((v) => data[index] = v));
+    } else if (frame.type == "number") {
+      unsubs.push(frame_data.values.number(frame.key, 0).subscribe((v) => data[index] = v));
+    } else if (frame.type == "string") {
+      unsubs.push(frame_data.values.string(frame.key, "").subscribe((v) => data[index] = v));
+    } else if (frame.type == "buffer") {
+      unsubs.push(frame_data.values.buffer(frame.key, new Uint8Array()).subscribe((v) => data[index] = v));
+    } else if (frame.type == "json") {
+      unsubs.push(frame_data.values.json(frame.key, null, frame.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 _}
+        {@render loaded_data(data)}
+    {/await}
+{/if}

package/test/ReadOnlyValueLoader.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { Snippet } from "svelte";
+import { type CoDec } from "..";
+type FrameDetails = {
+    id: string;
+    key: string;
+    tag?: string;
+    type: "boolean" | "double" | "number" | "string" | "buffer";
+} | {
+    id: string;
+    key: string;
+    tag?: string;
+    type: "json";
+    codec: CoDec<any>;
+};
+type $$ComponentProps = {
+    loaded_data?: Snippet<[any[]]>;
+    frames: FrameDetails[];
+};
+declare const ReadOnlyValueLoader: import("svelte").Component<$$ComponentProps, {}, "">;
+type ReadOnlyValueLoader = ReturnType<typeof ReadOnlyValueLoader>;
+export default ReadOnlyValueLoader;