woocommerce/plugins/woocommerce-admin/docs/components/packages/search-list-control.md

`SearchListControl` (component)
===============================

Component to display a searchable, selectable list of items.

Props
-----

### `className`

- Type: String
- Default: null

Additional CSS classes.

### `isHierarchical`

- Type: Boolean
- Default: null

Whether the list of items is hierarchical or not. If true, each list item is expected to
have a parent property.

### `isLoading`

- Type: Boolean
- Default: null

Whether the list of items is still loading.

### `isSingle`

- Type: Boolean
- Default: null

Restrict selections to one item.

### `list`

- Type: Array
  - id: Number
  - name: String
- Default: null

A complete list of item objects, each with id, name properties. This is displayed as a
clickable/keyboard-able list, and possibly filtered by the search term (searches name).

### `messages`

- Type: Object
  - clear: String - A more detailed label for the "Clear all" button, read to screen reader users.
  - list: String - Label for the list of selectable items, only read to screen reader users.
  - noItems: String - Message to display when the list is empty (implies nothing loaded from the server
or parent component).
  - noResults: String - Message to display when no matching results are found. %s is the search term.
  - search: String - Label for the search input
  - selected: Function - Label for the selected items. This is actually a function, so that we can pass
through the count of currently selected items.
  - updated: String - Label indicating that search results have changed, read to screen reader users.
- Default: null

Messages displayed or read to the user. Configure these to reflect your object type.
See `defaultMessages` above for examples.

### `onChange`

- **Required**
- Type: Function
- Default: null

Callback fired when selected items change, whether added, cleared, or removed.
Passed an array of item objects (as passed in via props.list).

### `onSearch`

- Type: Function
- Default: null

Callback fired when the search field is used.

### `renderItem`

- Type: Function
- Default: null

Callback to render each item in the selection list, allows any custom object-type rendering.

### `selected`

- **Required**
- Type: Array
- Default: null

The list of currently selected items.

### `search`

- Type: String
- Default: null


### `setState`

- Type: Function
- Default: null


### `debouncedSpeak`

- Type: Function
- Default: null


### `instanceId`

- Type: Number
- Default: null


`SearchListItem` (component)
============================



Props
-----

### `className`

- Type: String
- Default: null

Additional CSS classes.

### `countLabel`

- Type: ReactNode
- Default: null

Label to display if `showCount` is set to true. If undefined, it will use `item.count`.

### `depth`

- Type: Number
- Default: `0`

Depth, non-zero if the list is hierarchical.

### `item`

- Type: Object
- Default: null

Current item to display.

### `isSelected`

- Type: Boolean
- Default: null

Whether this item is selected.

### `isSingle`

- Type: Boolean
- Default: null

Whether this should only display a single item (controls radio vs checkbox icon).

### `onSelect`

- Type: Function
- Default: null

Callback for selecting the item.

### `search`

- Type: String
- Default: `''`

Search string, used to highlight the substring in the item name.

### `showCount`

- Type: Boolean
- Default: `false`

Toggles the "count" bubble on/off.