elastic / elastic/eui

[EuiRange] Migrate from class to function component

Open
#9,494 3 comments 0 reactions 0 assignees View on GitHub
help wanted low hanging fruit
Dominant language
TypeScript
Stars
6.4k
Forks
911
Avg merge
2d 11h
Merged PRs (30d)
65

Description

`EuiRange` provides a single-handle range slider with optional tooltip, ticks, levels, and input field.

- **File:** `components/form/range/range.tsx`
- **Class size:** 293 lines
- **State:** `id`, `isPopoverOpen`, `trackWidth`
- **Lifecycle:** None

**Migration notes:**

No lifecycle methods despite size. State is simple. Complexity is in the input/slider coordination and tooltip positioning. Should be migrated together with or before `EuiDualRange`.

**Acceptance criteria:**

- [ ] Convert to function component with hooks
- [ ] Maintain slider/input coordination
- [ ] All existing tests pass

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.