# @acorex/components/combo-box

A minimal, accessible combo box component for selecting one or more values from a list, built on top of `@angular/aria/combobox`.

## Usage

```ts
import { AXComboBoxComponent, AXComboBoxItem } from '@acorex/components/combo-box';

const items: AXComboBoxItem[] = [
  { id: 'apple', text: 'Apple', value: 1 },
  { id: 'banana', text: 'Banana', value: 2 },
];
```

```html
<ax-combo-box [items]="items" [(ngModel)]="selected" placeholder="Select a fruit"></ax-combo-box>

<!-- Multi-select: model value is an array -->
<ax-combo-box [items]="items" [multiple]="true" [(ngModel)]="selectedValues" placeholder="Select fruits"></ax-combo-box>
```

Value binding uses the signal `value` model (`FormValueControl`) — prefer `[(ngModel)]` (or `[(value)]` / signal forms). No `ControlValueAccessor`.

- `id`: used for typeahead filtering and list identity
- `text`: shown in the list and trigger/input
- `value`: written when the item is selected (`string | number`)
- `multiple`: when `true`, select multiple items (chips in the trigger; model is an array)
- `searchable="true"` (default): a text input with typeahead filtering on `id`
- `searchable="false"`: a select-like, read-only trigger
- `adaptivityEnabled="true"` (default): on small screens the list opens as a bottom actionsheet instead of a dropdown; set `false` to always use the anchored dropdown
- `caption`: title shown in the actionsheet header (falls back to `placeholder`)
- `alternate`: when `true`, list rows use alternating background colors for easier scanning
- `look`: the same editor-container look schemes as other editors like `ax-text-box`
- `ax-prefix` / `ax-suffix`: project decorators into the editor container, same as `ax-text-box`