2019-11-21 13:29:10 +00:00
|
|
|
# SearchInput
|
2019-07-15 12:53:12 +00:00
|
|
|
|
|
|
|
SearchInput description
|
|
|
|
|
2019-11-21 13:29:10 +00:00
|
|
|
### Usage
|
2019-07-15 12:53:12 +00:00
|
|
|
|
|
|
|
```js
|
2021-02-25 21:19:45 +00:00
|
|
|
import SearchInput from "@appserver/components/search-input";
|
2019-07-15 12:53:12 +00:00
|
|
|
```
|
|
|
|
|
2019-11-21 13:29:10 +00:00
|
|
|
```jsx
|
|
|
|
<SearchInput
|
|
|
|
isNeedFilter={true}
|
|
|
|
getFilterData={() => [
|
|
|
|
{
|
|
|
|
key: "filter-example",
|
|
|
|
group: "filter-example",
|
|
|
|
label: "example group",
|
2020-10-16 13:16:01 +00:00
|
|
|
isHeader: true,
|
2019-11-21 13:29:10 +00:00
|
|
|
},
|
2020-10-16 13:16:01 +00:00
|
|
|
{ key: "filter-example-test", group: "filter-example", label: "Test" },
|
2019-11-21 13:29:10 +00:00
|
|
|
]}
|
2020-10-16 13:16:01 +00:00
|
|
|
onSearchClick={(result) => {
|
2019-11-21 13:29:10 +00:00
|
|
|
console.log(result);
|
|
|
|
}}
|
2020-10-16 13:16:01 +00:00
|
|
|
onChangeFilter={(result) => {
|
2019-11-21 13:29:10 +00:00
|
|
|
console.log(result);
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
```
|
2019-07-15 12:53:12 +00:00
|
|
|
|
2019-11-21 13:29:10 +00:00
|
|
|
### Properties
|
|
|
|
|
2019-12-03 13:15:16 +00:00
|
|
|
| Props | Type | Required | Values | Default | Description |
|
|
|
|
| -------------------- | :------------: | :------: | :-----------------------------: | :-----: | ------------------------------------------------------------------------------------------------------ |
|
|
|
|
| `className` | `string` | - | - | - | Accepts class |
|
|
|
|
| `id` | `string` | - | - | - | Used as HTML `id` property |
|
|
|
|
| `isDisabled` | `bool` | - | - | `false` | Indicates that the field cannot be used (e.g not authorized, or changes not saved) |
|
|
|
|
| `isNeedFilter` | `bool` | - | - | `false` | Determines if filter is needed |
|
|
|
|
| `onChange` | `func` | - | - | - | Called with the new value. Required when input is not read only. Parent should pass it back as `value` |
|
|
|
|
| `placeholder` | `string` | - | - | - | Placeholder text for the input |
|
|
|
|
| `scale` | `bool` | - | - | - | Indicates the input field has scale |
|
|
|
|
| `selectedFilterData` | `array` | - | - | - | Selected filter data |
|
|
|
|
| `size` | `string` | - | `base`, `middle`, `big`, `huge` | `base` | Supported size of the input fields. |
|
|
|
|
| `style` | `obj`, `array` | - | - | - | Accepts css style |
|
|
|
|
| `value` | `string` | - | - | - | Value of the input |
|