zenno: make character selects searchable

Fixes #20.
This commit is contained in:
2026-06-16 13:37:59 -04:00
parent f8e7bfbec6
commit ad58edbfe1
4 changed files with 212 additions and 42 deletions
+3 -3
View File
@@ -17,10 +17,10 @@
characters = charas.filter((c) => convoMap.has(c.chara_id));
});
let charaID = $state(1001);
let chara: Character | undefined = $state();
let convo = $state(1);
const options = $derived(convoMap.get(charaID) ?? []);
const options = $derived(convoMap.get(chara?.chara_id ?? 0) ?? []);
const cur = $derived(options.find((c) => c.number === convo));
const cur1Name = $derived(cur?.chara_1 && names.get(cur.chara_1)?.en);
const cur2Name = $derived(cur?.chara_2 && names.get(cur.chara_2)?.en);
@@ -43,7 +43,7 @@
<div class="mx-auto mt-8 flex flex-col rounded-md text-center shadow-md ring md:max-w-xl md:flex-row">
<div class="m-4 flex-1 md:mt-3">
<label for="chara" class="hidden md:inline">Character</label>
<CharaPick id="chara" {characters} class="w-full" bind:value={charaID} required />
<CharaPick id="chara" {characters} class="w-full" bind:value={chara} required />
</div>
<div class="m-4 flex-1 md:mt-3">
<label for="convo" class="hidden md:inline">Conversation</label>