# Slope chart

Before and after on two axes: lines draw in, rank moves sit beside each value, and switching datasets slides every line to its new slope.

- ID: `slope-chart`
- Import: `animui/slope-chart`
- Category: Data
- Runtime exports: `SlopeChart`, `default`
- Declaration: `types/free/components/slope-chart.d.ts`
- Type provenance: emitted-original-typescript
- Related: line-chart, bar-chart, radar-chart, streamgraph, sortable-data-table

```tsx
import { SlopeChart } from 'animui/slope-chart';
```

This import example is not a complete render recipe: read the declaration below and its local references for required props, data, callbacks and provider context. Use `animui info slope-chart` to resolve the local declaration graph. Global setup is in `llms.txt`.

```ts
export { SlopeChart, default } from '../registry/components/slope-chart/slope-chart.js';
export type { SlopeChartProps, SlopeItem } from '../registry/components/slope-chart/slope-chart.js';
```