# HierarchyLegend

> Read-only legend of the open level's branches, pass it as the frame `footer`: below the drawing in narrow containers, above it from `@md`.

Source: https://ui.jcsoftdev.com/docs/components/hierarchy-legend

Read-only legend of the open level's branches, pass it as the frame
`footer`: below the drawing in narrow containers, above it from `@md`.

## Import

```ts
import { HierarchyLegend } from "@jcsoftdev/ui/charts";
```

Single-component entry points tree-shake to just this component: `@jcsoftdev/ui/charts/core`.

## Usage

```tsx
<HierarchyLegend focus={root} limit={8} />
```

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `focus` * | `HierarchyNode` |  |  |
| `limit` | `number` | `8` | Most items listed. |

`*` marks a required prop.

## Storybook stories

- [Default](/storybook/?path=/story/charts-primitives-hierarchylegend--default)
- [Drilled In](/storybook/?path=/story/charts-primitives-hierarchylegend--drilled-in)
- [Limited](/storybook/?path=/story/charts-primitives-hierarchylegend--limited)
- [Leaf](/storybook/?path=/story/charts-primitives-hierarchylegend--leaf)

## Source

`packages/ui/src/charts/core/hierarchy-chart.tsx`