Disabled state

<!--
  Кейс проверяет только закрытое состояние (см. docs/PORTING.md §5).

  Расхождение фреймворков: у Base UI `disabled` на корне каскадом
  отключает `AutocompleteInput`, даже если сам `Input` не получает проп
  явно (оригинал так и пишет — только `<Autocomplete disabled>`). У
  reka-ui `AutocompleteInput` собственный проп `disabled`, из контекста
  корня не наследуется (проверено по исходнику `AutocompleteInput.js`) —
  поэтому здесь он продублирован явно на `AutocompleteInput`, иначе
  инпут визуально не выглядел бы disabled.
-->

<script setup lang="ts">
import { Autocomplete, AutocompleteContent, AutocompleteEmpty, AutocompleteInput, AutocompleteItem, AutocompleteList } from "@/components/reui/autocomplete"

interface Item {
  id: string
  value: string
}

const items: Item[] = [
  { id: "t1", value: "feature" },
  { id: "t2", value: "fix" },
  { id: "t3", value: "bug" },
  { id: "t4", value: "docs" },
  { id: "t5", value: "internal" },
  { id: "t6", value: "mobile" },
  { id: "c-accordion", value: "component: accordion" },
  { id: "c-alert-dialog", value: "component: alert dialog" },
  { id: "c-autocomplete", value: "component: autocomplete" },
  { id: "c-avatar", value: "component: avatar" },
]
</script>

<template>
  <div class="w-full max-w-xs">
    <Autocomplete disabled>
      <AutocompleteInput placeholder="Search items" disabled />
      <AutocompleteContent>
        <AutocompleteEmpty>No items found.</AutocompleteEmpty>
        <AutocompleteList>
          <AutocompleteItem v-for="item in items" :key="item.id" :value="item.value">
            {{ item.value }}
          </AutocompleteItem>
        </AutocompleteList>
      </AutocompleteContent>
    </Autocomplete>
  </div>
</template>