Claude: Focus the input field automatically

This commit is contained in:
Alessandro Pignotti 2024-12-19 16:38:47 +01:00
parent b5443fa60f
commit daa54dc03c

View File

@ -53,6 +53,10 @@
return false; return false;
return msg.content[0].type == "tool_result"; return msg.content[0].type == "tool_result";
} }
function autoFocus(node)
{
node.focus();
}
</script> </script>
<h1 class="text-lg font-bold">Claude AI Integration</h1> <h1 class="text-lg font-bold">Claude AI Integration</h1>
<p>WebVM is integrated with Claude by Anthropic AI. You can prompt the AI to control the system.</p> <p>WebVM is integrated with Claude by Anthropic AI. You can prompt the AI to control the system.</p>
@ -71,7 +75,7 @@
</div> </div>
</div> </div>
{#if $apiState == "KEY_REQUIRED"} {#if $apiState == "KEY_REQUIRED"}
<textarea class="bg-neutral-700 p-2 rounded-md placeholder-gray-400 resize-none shrink-0" placeholder="Insert your Claude API Key" rows="1" on:keydown={handleKeyEnter} on:input={handleResize}/> <textarea class="bg-neutral-700 p-2 rounded-md placeholder-gray-400 resize-none shrink-0" placeholder="Insert your Claude API Key" rows="1" on:keydown={handleKeyEnter} on:input={handleResize} use:autoFocus/>
{:else} {:else}
<textarea class="bg-neutral-700 p-2 rounded-md placeholder-gray-400 resize-none shrink-0" placeholder="Prompt..." rows="1" on:keydown={handleMessage} on:input={handleResize} bind:value={$currentMessage}/> <textarea class="bg-neutral-700 p-2 rounded-md placeholder-gray-400 resize-none shrink-0" placeholder="Prompt..." rows="1" on:keydown={handleMessage} on:input={handleResize} bind:value={$currentMessage} use:autoFocus/>
{/if} {/if}