blob: 4cb3536a359b2151a4970e76567a040bbab3ead0 (
plain)
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
|
<script lang="ts">
import type { InvokeMessage } from "@dispatch/ui-contract";
import type { SelectorFieldView } from "../logic/types";
let {
field,
surfaceId,
onInvoke,
}: { field: SelectorFieldView; surfaceId: string; onInvoke: (msg: InvokeMessage) => void } =
$props();
function handleChange(event: Event) {
const target = event.target as HTMLSelectElement;
onInvoke({
type: "invoke",
surfaceId,
actionId: field.action.actionId,
payload: target.value,
});
}
</script>
<label>
{field.label}
<select onchange={handleChange}>
{#each field.options as option (option.value)}
<option value={option.value} selected={option.value === field.value}>
{option.label}
</option>
{/each}
</select>
</label>
|
