Focus is unreachable from tick labels, and point-less marks cannot match `states`
Nobody has claimed this yet.
Assessment
- Difficulty
- 5/5
- Estimated time
- Over a week
- Newbie friendliness
- 45/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Active
- Tech stack
- typescript
- Domain
- data-visualization
Research direction
Start with dist/types.d.ts and the ChartAxisTickLabelContext and ChartAxisTickLabelOptions definitions, then inspect dist/mark-state.js and applyStateStyle's handling of output kinds and point lookup. Done means focus can drive tick-label opacity from package state and point-less area fills can match states by series key without requiring chart-definition rebuilds.
Written by the indexing model from the issue text.
Description
Version: @tanstack/charts 0.16.0. Two related gaps; both end up forcing a rebuild of the whole chart definition on pointer move.
(a) tickLabels.opacity cannot see focus.
ChartAxisTickLabelContext carries geometry only:
// dist/types.d.ts
export interface ChartAxisTickLabelContext<TValue extends ChartValue = ChartValue> {
value: TValue;
index: number;
position: number;
bandwidth: number;
}
and ChartAxisTickLabelValue resolves over exactly that context. A common effect — fade the axis tick labels the crosshair pill is currently covering — is therefore not expressible from package state. The workaround is to thread the pointer position into the definition and recompute opacity from it, which means opacity becomes a fresh closure on every pointer move, the ChartDefinition is a new object each time, and the definition memo misses. Five chart families in our port do this today (line, area, candlestick, scatter, bar) purely because the effect has nowhere else to live.
Would it be possible for the tick-label context to carry the current focus (or for focus to sit alongside opacity in ChartAxisTickLabelOptions), so the fade resolves as a pure function of package state?
(b) Point-less marks cannot participate in states.
applyStateStyle switches on the output kind and handles dot, rect and label:
// dist/mark-state.js
switch (output.kind) {
case "dot": ...
case "rect": ...
case "label": ...
}
and state matching resolves through point lookup. An area fill emits no ChartPoints, so it can never match a state — which means "dim every other series' fill while one series is focused", the standard multi-series area hover, cannot be written in the spec at all. We dropped that behaviour from our composed chart rather than reach into the DOM for it.
Would it be possible to make point-less marks matchable by series key, so a fill can take part in states without emitting points it does not have?
- Dominant language
- TypeScript
- Stars
- 749
- Forks
- 45
- Avg merge
- 1d 18h
- Merged PRs (30d)
- 26
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from TanStack/charts
-
A datum that renders as several leaves cannot be stated once: `states` on a group is never resolved Open
Difficulty 4/5 3-5 days Newbie friendliness 48/100
-
Difficulty 4/5 3-5 days Newbie friendliness 55/100
-
Difficulty 5/5 Over a week Newbie friendliness 38/100
-
Difficulty 4/5 3-5 days Newbie friendliness 52/100
-
Difficulty 3/5 1-2 days Newbie friendliness 72/100
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
Eynzof/Hermes-CN-Desktop#610 ·
-
bug clawsweeper:linked-pr-open clawsweeper:needs-live-repro clawsweeper:no-new-fix-pr impact:message-loss issue-rating: 🐚 platinum hermit P2 regression
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
-
enhancement
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
-
calcite-components needs triage refactor
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
Esri/calcite-design-system#15203 ·
-
Difficulty 1/5 Under an hour Newbie friendliness 78/100
fullcalendar/fullcalendar#8106 ·