# Sunburst

A hierarchy in rings: click a segment and every arc swings around it as the new centre, with a breadcrumb back and a rolling total.

- ID: `sunburst`
- Import: `animui/sunburst`
- Category: Data
- Runtime exports: `Sunburst`
- Declaration: `types/pro/sunburst.d.ts`
- Type provenance: reconstructed-from-docs-and-runtime
- Related: donut-chart, sankey-flow, tree-view

```tsx
import { Sunburst } from 'animui/sunburst';
```

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 sunburst` to resolve the local declaration graph. Global setup is in `llms.txt`.

```ts
/** Reconstructed from saved Arc documentation and runtime binding evidence; original TypeScript source was unavailable. */
import type { ComponentType, ReactNode, CSSProperties, Ref, ButtonHTMLAttributes, HTMLAttributes, ReactElement } from 'react';

export interface SunburstNode { id: string; label: string; value: number; color?: string; children?: SunburstNode[]; }
export interface SunburstProps {
  data: SunburstNode;
  label: string;
  formatValue?: (value: number) => string;
  depth?: number;
  size?: number;
  focus?: string;
  defaultFocus?: string;
  onFocusChange?: (id: string) => void;
  legend?: boolean;
  emptyLabel?: string;
  className?: string;
}

export declare const Sunburst: ComponentType<SunburstProps>;

export default Sunburst;
```