---
title: Market Details
sidebarTitle: Market Details
description: "Interactive preview for AGG market detail surfaces"
---

> **For AI agents:** the complete documentation index is at [llms.txt](/llms.txt). Append `.md` to any page URL for its markdown version.

import { StorybookEmbed } from "/snippets/storybook-embed.jsx";

# Market Details

`MarketDetails` renders live chart, orderbook, and venue-level market detail content for a selected
market. The Storybook preview uses the list wrapper that hosts the same card surface in context.

Use Storybook as the source of truth for tabs, data states, and interaction details.

## Import

```tsx
import "@agg-build/ui/styles.css";
import { MarketDetails } from "@agg-build/ui/events";
```

Requires `<AggProvider>` from `@agg-build/hooks`.

## Preview

<StorybookEmbed
  storyId="components-market-details-list--default"
  title="Market Details"
  height={980}
/>