@nil-/xit 0.4.0 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/bundler.js +49 -49
- package/package.json +1 -1
- package/test/Main.svelte +63 -0
- package/test/Main.svelte.d.ts +3 -0
package/package.json
CHANGED
package/test/Main.svelte
ADDED
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
<script lang="ts">import TestFrame from "./Frame.svelte";
|
|
2
|
+
import Split from "../components/layouts/Split.svelte";
|
|
3
|
+
import Scrollable from "../components/layouts/Scrollable.svelte";
|
|
4
|
+
import { codec } from "$xit/codec.js";
|
|
5
|
+
import {} from "../index";
|
|
6
|
+
let selected = $state(-1);
|
|
7
|
+
</script>
|
|
8
|
+
|
|
9
|
+
{#snippet combo(tags: string[])}
|
|
10
|
+
<div class="combo">
|
|
11
|
+
<select bind:value={selected}>
|
|
12
|
+
{#each tags as id, i}
|
|
13
|
+
<option value={i}>{id}</option>
|
|
14
|
+
{/each}
|
|
15
|
+
</select>
|
|
16
|
+
</div>
|
|
17
|
+
{/snippet}
|
|
18
|
+
|
|
19
|
+
{#snippet side(actions: { name: string; action: Action<HTMLElement> }[])}
|
|
20
|
+
<Scrollable>
|
|
21
|
+
<div class="items">
|
|
22
|
+
{#each actions as { action }}
|
|
23
|
+
<div style:display="contents" use:action></div>
|
|
24
|
+
{/each}
|
|
25
|
+
</div>
|
|
26
|
+
</Scrollable>
|
|
27
|
+
{/snippet}
|
|
28
|
+
|
|
29
|
+
<TestFrame decoder={codec.decode} {selected}>
|
|
30
|
+
{#snippet load({ tags, inputs, outputs })}
|
|
31
|
+
<Scrollable>
|
|
32
|
+
<Split vertical offset={200}>
|
|
33
|
+
{#snippet side_a()}
|
|
34
|
+
{@render side(outputs)}
|
|
35
|
+
{/snippet}
|
|
36
|
+
{#snippet side_b()}
|
|
37
|
+
{@render combo(tags)}
|
|
38
|
+
{@render side(inputs)}
|
|
39
|
+
{/snippet}
|
|
40
|
+
</Split>
|
|
41
|
+
</Scrollable>
|
|
42
|
+
{/snippet}
|
|
43
|
+
</TestFrame>
|
|
44
|
+
|
|
45
|
+
<style>
|
|
46
|
+
.items {
|
|
47
|
+
height: 100%;
|
|
48
|
+
display: flex;
|
|
49
|
+
flex-direction: column;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.combo {
|
|
53
|
+
padding-inline: 10px;
|
|
54
|
+
padding-bottom: 4px;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.combo > select {
|
|
58
|
+
width: 100%;
|
|
59
|
+
padding: 0px;
|
|
60
|
+
margin: 0px;
|
|
61
|
+
box-sizing: border-box;
|
|
62
|
+
}
|
|
63
|
+
</style>
|