fix(playgrounds): add the InputMenu autocomplete-mode row both are missing

.sync/log/2799fa6f2b25ce3eb15e050f3ef7c57d0d9a2fdb.md

@@ -60,13 +60,15 @@ Deliberately narrower than upstream in three places, two of which are right:
   contents (`autocomplete` → `mode="autocomplete"`) and kept the name, which
   keeps `name: 'input-menu-autocomplete-example'` in the docs page valid. Still
   the current state: the file is `InputMenuAutocompleteExample.vue` on `main`.
-- **Playground line dropped, and this one is a gap.** Upstream added
+- **Playground line dropped — a real gap, closed later.** Upstream added
   `<UInputMenu placeholder="Autocomplete" mode="autocomplete" … />` to
   `playgrounds/nuxt/app/pages/components/input-menu.vue`. Nothing equivalent was
-  added here, and re-checking at the time of writing, neither
-  `playgrounds/nuxt` nor `playgrounds/demo` has an autocomplete-mode row for
-  InputMenu. Small, but real: it is the only place the mode can be exercised by
-  hand, and the omission was not recorded anywhere until now.
+  added here, and when this log was first written neither `playgrounds/nuxt` nor
+  `playgrounds/demo` had an autocomplete-mode row for InputMenu — small, but the
+  only place the mode could be exercised by hand, and recorded nowhere until this
+  backfill turned it up. **Fixed on 2026-08-31 (#520):** both playgrounds now
+  carry the row, backed by its own `valueAutocomplete` ref, because in this mode
+  `modelValue` is the input text rather than a selected item.
 
 The native-attribute half of the change was ported and covered:
 

playgrounds/demo/app/pages/components/input-menu.vue

@@ -34,6 +34,9 @@ const items = ref(['Prospecting', 'Qualifying', 'Presenting', 'Negotiating', 'Cl
 const itemsSimple = ref(['Prospecting', 'Qualifying', 'Presenting', 'Negotiating', 'Closed'])
 const valueForAdd = ref('Prospecting')
 const valueMultiple = ref(['Prospecting', 'Presenting'])
+// `mode="autocomplete"` makes modelValue the input text rather than a selected
+// item, so this one is a string where the rows above hold items.
+const valueAutocomplete = ref('')
 
 // #342 is only visible with labels long enough to want more room than the field
 // has. happy-dom does no layout, so no snapshot can show this — the check is a
@@ -234,6 +237,16 @@ const itemsObj = ref([
         v-bind="{ ...singleAttrs, ...props }"
         class="w-full"
       />
+      <B24InputMenu
+        v-model="valueAutocomplete"
+        :items="items"
+        mode="autocomplete"
+        name="some_value"
+        placeholder="Autocomplete"
+        aria-label="Autocomplete"
+        v-bind="{ ...singleAttrs, ...props }"
+        class="w-full"
+      />
       <B24InputMenu
         :icon="TaskListIcon"
         placeholder="Search virtualized..."

playgrounds/nuxt/app/pages/components/input-menu.vue

@@ -34,6 +34,9 @@ const items = ref(['Prospecting', 'Qualifying', 'Presenting', 'Negotiating', 'Cl
 const itemsSimple = ref(['Prospecting', 'Qualifying', 'Presenting', 'Negotiating', 'Closed'])
 const valueForAdd = ref('Prospecting')
 const valueMultiple = ref(['Prospecting', 'Presenting'])
+// `mode="autocomplete"` makes modelValue the input text rather than a selected
+// item, so this one is a string where the rows above hold items.
+const valueAutocomplete = ref('')
 
 function onCreate(item: string) {
   itemsSimple.value.unshift(item)
@@ -213,6 +216,16 @@ const itemsObj = ref([
         class="w-full"
         @create="onCreateMultiple"
       />
+      <B24InputMenu
+        v-model="valueAutocomplete"
+        :items="items"
+        mode="autocomplete"
+        name="some_value"
+        placeholder="Autocomplete"
+        aria-label="Autocomplete"
+        v-bind="{ ...singleAttrs, ...props }"
+        class="w-full"
+      />
       <B24InputMenu
         :icon="TaskListIcon"
         placeholder="Search virtualized..."