import { Meta, Story, ArgsTable, Canvas } from "@storybook/addon-docs/blocks";
import ComboBox from "./";
import * as stories from "./combobox.stories.js";
# ComboBox
Custom combo box input
### Properties
### Base options
### Advanced options
```js
import ComboBox from "@appserver/components/combobox";
import NavLogoIcon from "../../../../../public/images/nav.logo.react.svg";
```
```js
const options = [
{
key: 1,
icon: "static/images/catalog.employee.react.svg", // optional item
label: "Option 1",
disabled: false, // optional item
onClick: clickFunction, // optional item
},
];
```
```jsx
console.log("selected", option)}
/>
```
Options have options:
- key - Item key, may be a string or a number
- label - Display text
- icon - Optional name of icon that will be displayed before label
- disabled - Make option disabled
- onClick - On click function
ComboBox perceives all property`s for positioning from DropDown!
If you need to display a custom list of options, you must use advancedOptions property. Like this:
```js
const advancedOptions = (
<>
>
);
```
```jsx
console.log("Selected option", option)}
selectedOption={{
key: 0,
label: "Select",
}}
isDisabled={false}
scaled={false}
size="content"
directionX="right"
>
```
To use Combobox as a toggle button, you must declare it according to the parameters:
```jsx
```