diff options
Diffstat (limited to 'ui/lib/components/MessageInput.svelte')
| -rw-r--r-- | ui/lib/components/MessageInput.svelte | 50 |
1 files changed, 30 insertions, 20 deletions
diff --git a/ui/lib/components/MessageInput.svelte b/ui/lib/components/MessageInput.svelte index 03ac7fa..7aac442 100644 --- a/ui/lib/components/MessageInput.svelte +++ b/ui/lib/components/MessageInput.svelte @@ -1,28 +1,38 @@ <script> - import { tick } from 'svelte'; - import { postToChannel } from '$lib/apiServer'; + import { tick } from 'svelte'; + import { postToChannel } from '$lib/apiServer'; - export let channel = null; - let input; - let value = ''; - let pending = false; + export let channel = null; + let input; + let value = ''; + let pending = false; - $: disabled = pending || (channel === null); + $: disabled = pending || channel === null; - async function handleSubmit() { - if (channel !== null) { - pending = true; - // TODO try/catch: - await postToChannel(channel, value); - pending = false; - value = ''; - await tick(); - input.focus(); - } - } + async function handleSubmit() { + if (channel !== null) { + pending = true; + // TODO try/catch: + await postToChannel(channel, value); + pending = false; + value = ''; + await tick(); + input.focus(); + } + } </script> <form on:submit|preventDefault={handleSubmit} class="flex flex-row flex-nowrap"> - <input bind:this={input} bind:value={value} disabled={disabled} type="search" class="flex-auto h-6 input rounded-r-none" /> - <button color="primary variant-filled-secondary" type="submit" class="flex-none w-6 h-6 btn-icon variant-filled rounded-l-none">»</button> + <input + bind:this={input} + bind:value + {disabled} + type="search" + class="flex-auto h-6 input rounded-r-none" + /> + <button + color="primary variant-filled-secondary" + type="submit" + class="flex-none w-6 h-6 btn-icon variant-filled rounded-l-none">»</button + > </form> |