# gds-dropdown - React

## Import

```typescript
import { GdsDropdown } from '@sebgroup/green-core/react'
```

## Usage

Use the component as a React JSX element:

```tsx
<GdsDropdown>
  <GdsOption>...</GdsOption>
  <GdsMenuHeading>...</GdsMenuHeading>
</GdsDropdown>
```

## Event Handling

Events are handled using React event handler props. Event names are converted from kebab-case to camelCase with an "on" prefix:

| Web Component Event | React Handler Prop | Handler Example |
|---------------------|--------------------|-----------------|
| `change` | `onChange` | `onChange={handler}` |
| `input` | `onInput` | `onInput={handler}` |
| `gds-ui-state` | `onGdsUiState` | `onGdsUiState={handler}` |
| `gds-filter-input` | `onGdsFilterInput` | `onGdsFilterInput={handler}` |
| `gds-input-cleared` | `onGdsInputCleared` | `onGdsInputCleared={handler}` |