Skip to content

v3.3.0 — Segments

Choose a tag to compare

@brandtnewlabs brandtnewlabs released this 09 Jun 16:58
· 25 commits to main since this release

Segments — scrub-focus session segmentation

Adds segments?: ChartSegment[] to the single-series LiveChart for Robinhood-style session segmentation (pre-market / regular / after-hours, overnight windows).

At rest the line is one uniform color; while scrubbing — or when a segment is active — the focused segment (under the scrub line, or the active one) keeps the base color and every other segment is de-emphasized by recoloring the line stroke itself (an alpha-reduced color fades the line; no overlay panel). New exported type: ChartSegment. Single-series only.

Added

  • mutedColor / mutedColors — the de-emphasis color (solid, or a ≥2-stop gradient) used when a segment is not the focused one.
  • active — force-focus a segment without scrubbing.
  • recolorLine (default true) — set false to opt a segment out of the dimming entirely (it still draws its divider/label).
  • divider + label (with labelPosition / dividerColor) — a dashed edge marker and caption; the label shows only with the divider.
  • All colors default to the chart palette, so a bare { from, to } segment works without setting any color.

Fully backward-compatible — no changes required to existing code.

npm install react-native-livechart@3.3.0

Full changelog: https://github.com/brandtnewlabs/react-native-livechart/blob/main/CHANGELOG.md