Spaces:
Running
Running
File size: 1,404 Bytes
c1a1d02 54e01be af53b62 c1a1d02 54e01be c1a1d02 3d534f4 c1a1d02 54e01be c1a1d02 54e01be c1a1d02 54e01be c1a1d02 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 |
<script lang="ts">
import { getContext } from 'svelte';
import { type NodeProps, useSvelteFlow } from '@xyflow/svelte';
import LynxKiteNode from './LynxKiteNode.svelte';
type $$Props = NodeProps;
export let id: $$Props['id'];
export let data: $$Props['data'];
const { updateNodeData } = useSvelteFlow();
$: meta = getContext('LynxKiteFlow').getMeta(data.title);
$: metaParams = Object.fromEntries(meta.data.params.map((p) => [p.name, p]));
</script>
<LynxKiteNode {...$$props}>
{#each Object.entries(data.params) as [name, value]}
<div class="param">
<label>
{name}<br>
{#if metaParams[name].type.enum}
<select
value={value}
on:change={(evt) => updateNodeData(id, { params: { ...data.params, [name]: evt.currentTarget.value } })}
>
{#each metaParams[name].type.enum as option}
<option value={option}>{option}</option>
{/each}
</select>
{:else}
<input
value={value}
on:input={(evt) => updateNodeData(id, { params: { ...data.params, [name]: evt.currentTarget.value } })}
/>
{/if}
</label>
</div>
{/each}
</LynxKiteNode>
<style>
.param {
padding: 8px;
}
.param label {
font-size: 12px;
display: block;
}
.param input,
.param select {
width: calc(100% - 8px);
}
</style>
|