[focus] call focus() as well for android

src/lib/components/diary/MealCard.svelte

@@ -24,6 +24,16 @@
   let presetOpen = $state(false);
   let presetName = $state("");
 
+  let presetNameInput = $state<HTMLInputElement | null>(null);
+  let renameNameInput = $state<HTMLInputElement | null>(null);
+
+  $effect(() => {
+    if (presetOpen) setTimeout(() => presetNameInput?.focus(), 50);
+  });
+  $effect(() => {
+    if (renameOpen) setTimeout(() => renameNameInput?.focus(), 50);
+  });
+
   function openRename() {
     renameName = meal.name;
     renameOpen = true;
@@ -244,6 +254,7 @@
     <div>
       <label class="block text-sm text-zinc-400 mb-1.5">Preset name</label>
       <input
+        bind:this={presetNameInput}
         type="text"
         bind:value={presetName}
         required
@@ -268,6 +279,7 @@
 >
   <form onsubmit={handleRename} class="space-y-4">
     <input
+      bind:this={renameNameInput}
       type="text"
       bind:value={renameName}
       required

src/lib/components/ui/CommandPalette.svelte

@@ -35,6 +35,7 @@
     if (open) {
       query = "";
       selectedIdx = 0;
+      setTimeout(() => inputEl?.focus(), 50);
     }
   });
 

src/routes/(app)/diary/[date]/add-entry/+page.svelte

@@ -36,6 +36,11 @@
 
   let gramsInput = $state<HTMLInputElement | null>(null);
 
+  $effect(() => {
+    if (!selectedProduct) setTimeout(() => searchInput?.focus(), 50);
+    else setTimeout(() => gramsInput?.focus(), 50);
+  });
+
   function handleSearch(value: string) {
     q = value;
     clearTimeout(debounceTimer);

src/routes/(app)/diary/[date]/add-meal/+page.svelte

@@ -24,6 +24,13 @@
   let presetTimer: ReturnType<typeof setTimeout>;
   let submitting = $state(false);
   let error = $state("");
+  let mealNameInput = $state<HTMLInputElement | null>(null);
+  let presetQInput = $state<HTMLInputElement | null>(null);
+
+  $effect(() => {
+    if (tab === "new") setTimeout(() => mealNameInput?.focus(), 50);
+    else setTimeout(() => presetQInput?.focus(), 50);
+  });
 
   function handlePresetSearch(v: string) {
     presetQ = v;
@@ -93,6 +100,7 @@
             >Meal name <span class="text-zinc-600">(optional)</span></label
           >
           <input
+            bind:this={mealNameInput}
             id="meal-name"
             type="text"
             bind:value={mealName}
@@ -117,6 +125,7 @@
       <!-- Preset search -->
       <div class="px-4 py-3 border-b border-zinc-800">
         <input
+          bind:this={presetQInput}
           type="search"
           placeholder="Search presets…"
           value={presetQ}

src/routes/(app)/diary/[date]/edit-entry/[entry_id]/+page.svelte

@@ -32,6 +32,10 @@
 
   let gramsInput = $state<HTMLInputElement | null>(null);
 
+  $effect(() => {
+    setTimeout(() => gramsInput?.focus(), 50);
+  });
+
   const preview = $derived(
     entry
       ? {

src/routes/(app)/presets/+page.svelte

@@ -73,6 +73,11 @@
   let creating = $state<boolean>(false);
   let creatingName = $state("");
   let creatingSaving = $state(false);
+  let creatingNameInput = $state<HTMLInputElement | null>(null);
+
+  $effect(() => {
+    if (creating) setTimeout(() => creatingNameInput?.focus(), 50);
+  });
 
   async function handleCreate() {
     creatingSaving = true;
@@ -105,6 +110,11 @@
   let renamePreset_: Preset | null = $state(null);
   let renameName = $state("");
   let renaming = $state(false);
+  let renameNameInput = $state<HTMLInputElement | null>(null);
+
+  $effect(() => {
+    if (renamePreset_) setTimeout(() => renameNameInput?.focus(), 50);
+  });
 
   function openRename(preset: Preset) {
     renamePreset_ = preset;
@@ -132,6 +142,10 @@
   let editSaving = $state(false);
   let editGramsInput = $state<HTMLInputElement | null>(null);
 
+  $effect(() => {
+    if (editingEntry) setTimeout(() => editGramsInput?.focus(), 50);
+  });
+
   function openEditEntry(presetId: number, entry: PresetEntry) {
     editingEntry = { presetId, entry };
     editGrams = entry.grams;
@@ -169,6 +183,14 @@
   let addGrams = $state(100);
   let addSaving = $state(false);
   let addGramsInput = $state<HTMLInputElement | null>(null);
+  let productQInput = $state<HTMLInputElement | null>(null);
+
+  $effect(() => {
+    if (addEntryPresetId !== null && selectedProduct === null)
+      setTimeout(() => productQInput?.focus(), 50);
+    else if (selectedProduct !== null)
+      setTimeout(() => addGramsInput?.focus(), 50);
+  });
 
   function openAddEntry(presetId: number) {
     addEntryPresetId = presetId;
@@ -490,6 +512,7 @@
 >
   <form onsubmit={handleCreate} class="space-y-4">
     <input
+      bind:this={creatingNameInput}
       type="text"
       bind:value={creatingName}
       required
@@ -514,6 +537,7 @@
 >
   <form onsubmit={handleRename} class="space-y-4">
     <input
+      bind:this={renameNameInput}
       type="text"
       bind:value={renameName}
       required
@@ -597,6 +621,7 @@
       <!-- Product search -->
       <div class="space-y-3">
         <input
+          bind:this={productQInput}
           type="search"
           placeholder="Search foods…"
           value={productQ}

src/routes/(app)/products/new/+page.svelte

@@ -11,6 +11,11 @@
   let fiber = $state(0);
   let submitting = $state(false);
   let error = $state("");
+  let nameInput = $state<HTMLInputElement | null>(null);
+
+  $effect(() => {
+    setTimeout(() => nameInput?.focus(), 50);
+  });
 
   // calories = protein×4 + carb×4 + fat×9 + fiber×2
   const calories = $derived(
@@ -48,6 +53,7 @@
       <div>
         <label for="name" class="block text-sm text-zinc-400 mb-2">Name</label>
         <input
+          bind:this={nameInput}
           id="name"
           type="text"
           bind:value={name}