## FilterSimple

### Usage

```jsx
import { FilterSimple } from 'ui-components';

const locations = [
	{
		text: 'Country',
		options: [
			{
				text: 'United States',
				value: 'country-us'
			}
		]
	},
	{
		text: 'City',
		options: [
			{
				text: 'Austin',
				value: 'city-austin'
			},
			{
				text: 'Raleigh',
				value: 'city-raleigh'
			}
		]
	}
];

<FilterSimple
	title="Locations"
	options={locations}
	multiple
	onChange={(value) => {
		console.log(`Selected ${value.join(', ')}`);
	}}
/>
```

### Parameters

* `title` (required) is the title to display beside the filter
* `options` (required) is an array of filter options
	* `text` (required) is the title of the option
	* `value` is the option value (cannot be used with sub-`options`)
	* `options` is an array of sub-options, effectively making the parent option a header (cannot be used with `value`)
* `multiple` can be added to create a multi-select filter

### Events

* `onChange` is the callback handler
	* `value` is either an array of selected values, or a string containing one value (depends on `multiple` prop)

### Notes

* If an option has an `options` property, it becomes a header and cannot have a `value`