[EuiSelectable] Migrate from class to function component
- Dominant language
- TypeScript
- Stars
- 6.4k
- Forks
- 911
- Avg merge
- 2d 11h
- Merged PRs (30d)
- 65
Description
`EuiSelectable` provides a searchable, accessible list with single or multi-select support. Used for site-wide search, option pickers, and the `EuiSelectableTemplateSitewide` pattern.
- **File:** `components/selectable/selectable.tsx`
- **Class size:** 408 lines
- **State:** Constructor-initialized (search value, options, active option index)
- **Lifecycle:** `getDerivedStateFromProps`, `componentDidUpdate`
**Migration notes:**
Complex component with `getDerivedStateFromProps` syncing options from props. Should be migrated together with `EuiSelectableList`. Search, selection, and keyboard navigation logic are intricate.
**Acceptance criteria:**
- [ ] Convert to function component with hooks
- [ ] Migrate together with `EuiSelectableList`
- [ ] Carefully handle `getDerivedStateFromProps` → state sync
- [ ] Maintain search, selection, keyboard navigation
- [ ] All existing tests pass
Contributor guide
Assessment
This issue has not been assessed yet.