@nil-/xit 0.3.0 → 0.4.1

package/assets/index.js

@@ -312,7 +312,7 @@ class P {
     return i;
   }
 }
-class k {
+class y {
   /**
    * Create a FlatBufferBuilder.
    */
@@ -363,7 +363,7 @@ class k {
     const i = ~(this.bb.capacity() - this.space + e) + 1 & t - 1;
     for (; this.space < i + t + e; ) {
       const a = this.bb.capacity();
-      this.bb = k.growByteBuffer(this.bb), this.space += this.bb.capacity() - a;
+      this.bb = y.growByteBuffer(this.bb), this.space += this.bb.capacity() - a;
     }
     this.pad(i);
   }
@@ -748,7 +748,7 @@ class Ct {
     return N.createFileInfo(t, e, i);
   }
 }
-class A {
+class R {
   constructor() {
     n(this, "bb", null);
     n(this, "bb_pos", 0);
@@ -757,39 +757,46 @@ class A {
     return this.bb_pos = t, this.bb = e, this;
   }
   static getRootAsFrameCache(t, e) {
-    return (e || new A()).__init(t.readInt32(t.position()) + t.position(), t);
+    return (e || new R()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   static getSizePrefixedRootAsFrameCache(t, e) {
-    return t.setPosition(t.position() + f), (e || new A()).__init(t.readInt32(t.position()) + t.position(), t);
+    return t.setPosition(t.position() + f), (e || new R()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   id(t) {
     const e = this.bb.__offset(this.bb_pos, 4);
     return e ? this.bb.__string(this.bb_pos + e, t) : null;
   }
-  content(t) {
+  target(t) {
     const e = this.bb.__offset(this.bb_pos, 6);
     return e ? this.bb.__string(this.bb_pos + e, t) : null;
   }
+  content(t) {
+    const e = this.bb.__offset(this.bb_pos, 8);
+    return e ? this.bb.__string(this.bb_pos + e, t) : null;
+  }
   files(t, e) {
-    const i = this.bb.__offset(this.bb_pos, 8);
+    const i = this.bb.__offset(this.bb_pos, 10);
     return i ? (e || new N()).__init(this.bb.__indirect(this.bb.__vector(this.bb_pos + i) + t * 4), this.bb) : null;
   }
   filesLength() {
-    const t = this.bb.__offset(this.bb_pos, 8);
+    const t = this.bb.__offset(this.bb_pos, 10);
     return t ? this.bb.__vector_len(this.bb_pos + t) : 0;
   }
   static startFrameCache(t) {
-    t.startObject(3);
+    t.startObject(4);
   }
   static addId(t, e) {
     t.addFieldOffset(0, e, 0);
   }
-  static addContent(t, e) {
+  static addTarget(t, e) {
     t.addFieldOffset(1, e, 0);
   }
-  static addFiles(t, e) {
+  static addContent(t, e) {
     t.addFieldOffset(2, e, 0);
   }
+  static addFiles(t, e) {
+    t.addFieldOffset(3, e, 0);
+  }
   static createFilesVector(t, e) {
     t.startVector(4, e.length, 4);
     for (let i = e.length - 1; i >= 0; i--)
@@ -801,28 +808,29 @@ class A {
   }
   static endFrameCache(t) {
     const e = t.endObject();
-    return t.requiredField(e, 4), t.requiredField(e, 6), t.requiredField(e, 8), e;
+    return t.requiredField(e, 4), t.requiredField(e, 6), t.requiredField(e, 8), t.requiredField(e, 10), e;
   }
-  static createFrameCache(t, e, i, a) {
-    return A.startFrameCache(t), A.addId(t, e), A.addContent(t, i), A.addFiles(t, a), A.endFrameCache(t);
+  static createFrameCache(t, e, i, a, r) {
+    return R.startFrameCache(t), R.addId(t, e), R.addTarget(t, i), R.addContent(t, a), R.addFiles(t, r), R.endFrameCache(t);
   }
   unpack() {
-    return new Bt(this.id(), this.content(), this.bb.createObjList(this.files.bind(this), this.filesLength()));
+    return new Bt(this.id(), this.target(), this.content(), this.bb.createObjList(this.files.bind(this), this.filesLength()));
   }
   unpackTo(t) {
-    t.id = this.id(), t.content = this.content(), t.files = this.bb.createObjList(this.files.bind(this), this.filesLength());
+    t.id = this.id(), t.target = this.target(), t.content = this.content(), t.files = this.bb.createObjList(this.files.bind(this), this.filesLength());
   }
 }
 class Bt {
-  constructor(t = null, e = null, i = []) {
+  constructor(t = null, e = null, i = null, a = []) {
     n(this, "id");
+    n(this, "target");
     n(this, "content");
     n(this, "files");
-    this.id = t, this.content = e, this.files = i;
+    this.id = t, this.target = e, this.content = i, this.files = a;
   }
   pack(t) {
-    const e = this.id !== null ? t.createString(this.id) : 0, i = this.content !== null ? t.createString(this.content) : 0, a = A.createFilesVector(t, t.createObjectOffsetList(this.files));
-    return A.createFrameCache(t, e, i, a);
+    const e = this.id !== null ? t.createString(this.id) : 0, i = this.target !== null ? t.createString(this.target) : 0, a = this.content !== null ? t.createString(this.content) : 0, r = R.createFilesVector(t, t.createObjectOffsetList(this.files));
+    return R.createFrameCache(t, e, i, a, r);
   }
 }
 var _;
@@ -1414,7 +1422,7 @@ class Gt {
     return X.createTaggedSignalRequest(t, e, i);
   }
 }
-class R {
+class T {
   constructor() {
     n(this, "bb", null);
     n(this, "bb_pos", 0);
@@ -1423,10 +1431,10 @@ class R {
     return this.bb_pos = t, this.bb = e, this;
   }
   static getRootAsTaggedSignalResponse(t, e) {
-    return (e || new R()).__init(t.readInt32(t.position()) + t.position(), t);
+    return (e || new T()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   static getSizePrefixedRootAsTaggedSignalResponse(t, e) {
-    return t.setPosition(t.position() + f), (e || new R()).__init(t.readInt32(t.position()) + t.position(), t);
+    return t.setPosition(t.position() + f), (e || new T()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   id(t) {
     const e = this.bb.__offset(this.bb_pos, 4);
@@ -1470,7 +1478,7 @@ class R {
     return t.requiredField(e, 4), t.requiredField(e, 6), t.requiredField(e, 8), e;
   }
   static createTaggedSignalResponse(t, e, i, a) {
-    return R.startTaggedSignalResponse(t), R.addId(t, e), R.addTag(t, i), R.addSignals(t, a), R.endTaggedSignalResponse(t);
+    return T.startTaggedSignalResponse(t), T.addId(t, e), T.addTag(t, i), T.addSignals(t, a), T.endTaggedSignalResponse(t);
   }
   unpack() {
     return new ce(this.id(), this.tag(), this.bb.createObjList(this.signals.bind(this), this.signalsLength()));
@@ -1487,8 +1495,8 @@ class ce {
     this.id = t, this.tag = e, this.signals = i;
   }
   pack(t) {
-    const e = this.id !== null ? t.createString(this.id) : 0, i = this.tag !== null ? t.createString(this.tag) : 0, a = R.createSignalsVector(t, t.createObjectOffsetList(this.signals));
-    return R.createTaggedSignalResponse(t, e, i, a);
+    const e = this.id !== null ? t.createString(this.id) : 0, i = this.tag !== null ? t.createString(this.tag) : 0, a = T.createSignalsVector(t, t.createObjectOffsetList(this.signals));
+    return T.createTaggedSignalResponse(t, e, i, a);
   }
 }
 class $ {
@@ -1617,7 +1625,7 @@ class Ht {
     return S.createValue(t, e, this.valueType, i);
   }
 }
-class T {
+class k {
   constructor() {
     n(this, "bb", null);
     n(this, "bb_pos", 0);
@@ -1626,10 +1634,10 @@ class T {
     return this.bb_pos = t, this.bb = e, this;
   }
   static getRootAsTaggedValueResponse(t, e) {
-    return (e || new T()).__init(t.readInt32(t.position()) + t.position(), t);
+    return (e || new k()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   static getSizePrefixedRootAsTaggedValueResponse(t, e) {
-    return t.setPosition(t.position() + f), (e || new T()).__init(t.readInt32(t.position()) + t.position(), t);
+    return t.setPosition(t.position() + f), (e || new k()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   id(t) {
     const e = this.bb.__offset(this.bb_pos, 4);
@@ -1673,7 +1681,7 @@ class T {
     return t.requiredField(e, 4), t.requiredField(e, 6), t.requiredField(e, 8), e;
   }
   static createTaggedValueResponse(t, e, i, a) {
-    return T.startTaggedValueResponse(t), T.addId(t, e), T.addTag(t, i), T.addValues(t, a), T.endTaggedValueResponse(t);
+    return k.startTaggedValueResponse(t), k.addId(t, e), k.addTag(t, i), k.addValues(t, a), k.endTaggedValueResponse(t);
   }
   unpack() {
     return new ue(this.id(), this.tag(), this.bb.createObjList(this.values.bind(this), this.valuesLength()));
@@ -1690,8 +1698,8 @@ class ue {
     this.id = t, this.tag = e, this.values = i;
   }
   pack(t) {
-    const e = this.id !== null ? t.createString(this.id) : 0, i = this.tag !== null ? t.createString(this.tag) : 0, a = T.createValuesVector(t, t.createObjectOffsetList(this.values));
-    return T.createTaggedValueResponse(t, e, i, a);
+    const e = this.id !== null ? t.createString(this.id) : 0, i = this.tag !== null ? t.createString(this.tag) : 0, a = k.createValuesVector(t, t.createObjectOffsetList(this.values));
+    return k.createTaggedValueResponse(t, e, i, a);
   }
 }
 class D {
@@ -1851,7 +1859,7 @@ class Rt {
     return it.createUniqueFrameSubscribe(t, e);
   }
 }
-class y {
+class A {
   constructor() {
     n(this, "bb", null);
     n(this, "bb_pos", 0);
@@ -1860,10 +1868,10 @@ class y {
     return this.bb_pos = t, this.bb = e, this;
   }
   static getRootAsUniqueSignalNotify(t, e) {
-    return (e || new y()).__init(t.readInt32(t.position()) + t.position(), t);
+    return (e || new A()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   static getSizePrefixedRootAsUniqueSignalNotify(t, e) {
-    return t.setPosition(t.position() + f), (e || new y()).__init(t.readInt32(t.position()) + t.position(), t);
+    return t.setPosition(t.position() + f), (e || new A()).__init(t.readInt32(t.position()) + t.position(), t);
   }
   frameId(t) {
     const e = this.bb.__offset(this.bb_pos, 4);
@@ -1901,7 +1909,7 @@ class y {
     return t.requiredField(e, 4), t.requiredField(e, 6), e;
   }
   static createUniqueSignalNotify(t, e, i, a, r) {
-    return y.startUniqueSignalNotify(t), y.addFrameId(t, e), y.addSignalId(t, i), y.addValueType(t, a), y.addValue(t, r), y.endUniqueSignalNotify(t);
+    return A.startUniqueSignalNotify(t), A.addFrameId(t, e), A.addSignalId(t, i), A.addValueType(t, a), A.addValue(t, r), A.endUniqueSignalNotify(t);
   }
   unpack() {
     return new Zt(this.frameId(), this.signalId(), this.valueType(), (() => {
@@ -1926,7 +1934,7 @@ class Zt {
   }
   pack(t) {
     const e = this.frameId !== null ? t.createString(this.frameId) : 0, i = this.signalId !== null ? t.createString(this.signalId) : 0, a = t.createObjectOffset(this.value);
-    return y.createUniqueSignalNotify(t, e, i, this.valueType, a);
+    return A.createUniqueSignalNotify(t, e, i, this.valueType, a);
   }
 }
 class nt {
@@ -2227,8 +2235,9 @@ const _e = async (s) => new Promise((t, e) => {
   }), i.addEventListener("message", async (a) => {
     if (a.data.ok) {
       if (a.data.files) {
-        const r = new k(), o = new Bt(
+        const r = new y(), o = new Bt(
           s.id,
+          a.data.target,
           a.data.code,
           a.data.files.map((h) => new Ct(h.target, h.metadata))
         );
@@ -2277,12 +2286,12 @@ const _e = async (s) => new Promise((t, e) => {
     e,
     t != null ? _.Client_Tagged_Value_Request : _.Client_Unique_Value_Request,
     (() => {
-      const c = new k(), d = t != null ? new Wt(s, t) : new $t(s);
+      const c = new y(), d = t != null ? new Wt(s, t) : new $t(s);
       return c.finish(d.pack(c)), c.asUint8Array();
     })(),
     t != null ? (c, d) => {
       if (c === _.Server_Tagged_Value_Response) {
-        const b = T.getRootAsTaggedValueResponse(
+        const b = k.getRootAsTaggedValueResponse(
           new P(d)
         );
         if (b.id() === s && t === b.tag())
@@ -2311,7 +2320,7 @@ const _e = async (s) => new Promise((t, e) => {
     O.subscribe((V) => {
       if (V == null || o)
         return;
-      const m = new k(), p = t != null ? new Yt(s, t) : new Jt(s);
+      const m = new y(), p = t != null ? new Yt(s, t) : new Jt(s);
       p.value = new Ht(
         b,
         F,
@@ -2363,13 +2372,13 @@ const _e = async (s) => new Promise((t, e) => {
     e,
     t != null ? _.Client_Tagged_Signal_Request : _.Client_Unique_Signal_Request,
     (() => {
-      const h = new k(), c = t != null ? new Gt(s, t) : new Xt(s);
+      const h = new y(), c = t != null ? new Gt(s, t) : new Xt(s);
       return h.finish(c.pack(h)), h.asUint8Array();
     })(),
     (h, c) => {
       if (t != null) {
         if (h === _.Server_Tagged_Signal_Response)
-          return R.getRootAsTaggedSignalResponse(new P(c));
+          return T.getRootAsTaggedSignalResponse(new P(c));
       } else if (h === _.Server_Unique_Signal_Response)
         return C.getRootAsUniqueSignalResponse(new P(c));
     }
@@ -2384,7 +2393,7 @@ const _e = async (s) => new Promise((t, e) => {
   for (let h = 0; h < o; ++h) {
     const c = a.signals(h), { id: d, type: b } = { id: c.id(), type: c.type() };
     r[b].set(d, (F) => {
-      const O = new k(), V = b, m = Kt(V, F), p = t != null ? new Dt(s, t, d, V, m) : new Zt(s, d, V, m);
+      const O = new y(), V = b, m = Kt(V, F), p = t != null ? new Dt(s, t, d, V, m) : new Zt(s, d, V, m);
       O.finish(p.pack(O));
       const I = t != null ? _.Client_Tagged_Signal_Notify : _.Client_Unique_Signal_Notify;
       i.publish(dt([ht(I), O.asUint8Array()]));
@@ -2450,12 +2459,12 @@ const _e = async (s) => new Promise((t, e) => {
     p
   ), { action: O } = await d(F);
   o.on_connect(() => {
-    const p = new k(), I = e != null ? new qt(t, e) : new Rt(t);
+    const p = new y(), I = e != null ? new qt(t, e) : new Rt(t);
     p.finish(I.pack(p));
     const G = e != null ? _.Client_Tagged_Frame_Subscribe : _.Client_Unique_Frame_Subscribe;
     o.publish(dt([ht(G), p.asUint8Array()]));
   }), o.start();
-  const V = new k(), m = e != null ? new Ot(t, e) : new Ut(t);
+  const V = new y(), m = e != null ? new Ot(t, e) : new Ut(t);
   return V.finish(m.pack(V)), St(
     s,
     e != null ? _.Client_Tagged_Frame_Loaded : _.Client_Unique_Frame_Loaded,
@@ -2465,12 +2474,12 @@ const _e = async (s) => new Promise((t, e) => {
     I.set("nil.xit", {
       values: te(h),
       signals: ee(c),
-      frame_ui: a,
-      frame: r,
       resub: () => o.start(),
       unsub: () => o.stop(),
       id: t,
-      tag: e
+      tag: e,
+      load_frame_ui: a,
+      load_frame_data: r
     });
     const { destroy: G } = O(p, I);
     return {
@@ -2489,12 +2498,12 @@ const _e = async (s) => new Promise((t, e) => {
     Mt({ id: t, tag: e ?? null, host: s, service: i })
   ]);
   i.on_connect(() => {
-    const d = new k(), b = e != null ? new qt(t, e) : new Rt(t);
+    const d = new y(), b = e != null ? new qt(t, e) : new Rt(t);
     d.finish(b.pack(d));
     const F = e != null ? _.Client_Tagged_Frame_Subscribe : _.Client_Unique_Frame_Subscribe;
     i.publish(dt([ht(F), d.asUint8Array()]));
   }), i.start();
-  const o = new k(), h = e != null ? new Ot(t, e) : new Ut(t);
+  const o = new y(), h = e != null ? new Ot(t, e) : new Ut(t);
   o.finish(h.pack(o));
   const c = e != null ? _.Client_Tagged_Frame_Loaded : _.Client_Unique_Frame_Loaded;
   return St(s, c, o.asUint8Array()), {

package/index.d.ts

@@ -36,12 +36,12 @@ export type Frame = {
 export type Context = {
     values: Values;
     signals: Signals;
-    frame_ui: (f: string, tag?: string) => Promise<Action<HTMLElement>>;
-    frame: (f: string, tag?: string) => Promise<Frame>;
     resub: () => void;
     unsub: () => void;
     id: string;
     tag: string | null;
+    load_frame_ui: (f: string, tag?: string) => Promise<Action<HTMLElement>>;
+    load_frame_data: (f: string, tag?: string) => Promise<Frame>;
 };
 export declare const json_string: {
     encode: (o: any) => Uint8Array<ArrayBufferLike>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nil-/xit",
-  "version": "0.3.0",
+  "version": "0.4.1",
   "peerDependencies": {
     "svelte": "^5.7.1"
   },

package/test/Frame.svelte

@@ -5,9 +5,9 @@ let {
   selected = -1,
   load
 } = $props();
-let { signals, values, frame, frame_ui } = xit();
+let { signals, values, load_frame_data, load_frame_ui } = xit();
 const frame_info = async (tag, decoder2) => {
-  const { values: values2, unsub } = await frame("frame_info", tag);
+  const { values: values2, unsub } = await load_frame_data("frame_info", tag);
   const load2 = async (key) => {
     const v = values2.json(key, [], {
       decode: decoder2,
@@ -22,9 +22,13 @@ const frame_info = async (tag, decoder2) => {
           return;
         }
         if (mark === "T") {
-          return frame_ui(frame_id, tag);
+          return load_frame_ui(frame_id, tag).then((f) => {
+            return { name: frame_id, action: f };
+          });
         } else if (mark === "U") {
-          return frame_ui(frame_id);
+          return load_frame_ui(frame_id).then((f) => {
+            return { name: frame_id, action: f };
+          });
         }
       }).filter((v2) => v2 != null)
     );
@@ -38,21 +42,17 @@ const tags = values.json("tags", [], {
   encode: () => new Uint8Array()
 });
 const finalize = signals.string("finalize");
-let a_inputs = $state(null);
-let a_outputs = $state(null);
-let title = $state("");
-const update = (v) => {
-  a_inputs = null;
-  a_outputs = null;
+let a_inputs = $state([]);
+let a_outputs = $state([]);
+let title = $derived(selected > $tags.length ? "" : $tags[selected]);
+const update = async (v) => {
+  a_inputs = [];
+  a_outputs = [];
   const t = $tags;
   if (0 <= v && v < t.length) {
-    frame_info(t[v], decoder).then(({ inputs, outputs }) => {
-      a_inputs = inputs;
-      a_outputs = outputs;
-    });
-    title = t[selected];
-  } else {
-    title = "";
+    const { inputs, outputs } = await frame_info(t[v], decoder);
+    a_inputs = inputs;
+    a_outputs = outputs;
   }
 };
 $effect(() => {
@@ -75,4 +75,4 @@ $effect(() => {
     }}
 />
 
-{@render load($tags.sort(), { inputs: a_inputs, outputs: a_outputs })}
+{@render load({ tags: $tags.sort(), inputs: a_inputs, outputs: a_outputs })}

package/test/Frame.svelte.d.ts

@@ -1,13 +1,17 @@
 import type { Snippet } from "svelte";
 import type { CoDec, Action } from "../index";
+type ActionItem = {
+    name: string;
+    action: Action<HTMLElement>;
+};
 type $$ComponentProps = {
     decoder: CoDec<any>["decode"];
     selected?: number;
     load: Snippet<[
-        string[],
         {
-            inputs: Action<HTMLElement>[] | null;
-            outputs: Action<HTMLElement>[] | null;
+            tags: string[];
+            inputs: ActionItem[];
+            outputs: ActionItem[];
         }
     ]>;
 };

package/test/Main.svelte

@@ -0,0 +1,63 @@
+<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 {} from "../index";
+let selected = $state(-1);
+</script>
+
+{#snippet combo(tags: string[])}
+    <div class="combo">
+        <select bind:value={selected}>
+            {#each tags as id, i}
+                <option value={i}>{id}</option>
+            {/each}
+        </select>
+    </div>
+{/snippet}
+
+{#snippet side(actions: { name: string; action: Action<HTMLElement> }[])}
+    <Scrollable>
+        <div class="items">
+            {#each actions as { action }}
+                <div style:display="contents" use:action></div>
+            {/each}
+        </div>
+    </Scrollable>
+{/snippet}
+
+<TestFrame decoder={codec.decode} {selected}>
+    {#snippet load({ tags, inputs, outputs })}
+        <Scrollable>
+            <Split vertical offset={200}>
+                {#snippet side_a()}
+                    {@render side(outputs)}
+                {/snippet}
+                {#snippet side_b()}
+                    {@render combo(tags)}
+                    {@render side(inputs)}
+                {/snippet}
+            </Split>
+        </Scrollable>
+    {/snippet}
+</TestFrame>
+
+<style>
+    .items {
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+    }
+
+    .combo {
+        padding-inline: 10px;
+        padding-bottom: 4px;
+    }
+
+    .combo > select {
+        width: 100%;
+        padding: 0px;
+        margin: 0px;
+        box-sizing: border-box;
+    }
+</style>

package/test/Main.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Main: import("svelte").Component<Record<string, never>, {}, "">;
+type Main = ReturnType<typeof Main>;
+export default Main;