# commandKeys

> Arrow-key and Enter navigation for a Command root already paired with `commandFilter(model)`: arrow keys move `model`'s active match across the visible items, mirrored onto `aria-selected` and `aria-activedescendant`; Enter clicks whatever control the active item nests.

```ts
import { commandKeys } from "@sdxc/ui/mixins";
```

Adds ArrowDown/ArrowUp/Enter navigation to a Command root already paired
with `commandFilter(model)`, mirroring the active match onto
`aria-selected` and `aria-activedescendant`, and activating it on Enter.

## Signature

```ts
commandKeys(model: FilterModel): MixinDescriptor<HTMLElement>
```

## Parameters

| Parameter | Type | Description |
| --- | --- | --- |
| `model` | `FilterModel` | The same `FilterModel` instance passed to `commandFilter()`. |

## Examples

```tsx
let model = new FilterModel();
<Command mix={[commandFilter(model), commandKeys(model)]}>
	<Command.Input />
	<Command.Item id="home" value="Home">
		<a href="/">Home</a>
	</Command.Item>
	<Command.Item id="settings" value="Settings">
		<a href="/settings">Settings</a>
	</Command.Item>
	<Command.Empty>No matches</Command.Empty>
</Command>
```