## Overview

`NoteTrayIndex` is a server-rendered zudo-react component for listing the flat items in a note tray. It is globally available in MDX with no import or hydration directive.

The examples below use the showcase Blog tray.

## Numbered Index

The default `index` style emphasizes stable, zero-padded ranks and includes each item's description. The whole row is the link, not only the title. Hovering or focusing a row lights the rules above and below it and underlines its text; the rank remains the row marker.

[Dynamic content unavailable in text export]

```mdx
<NoteTrayIndex category="blog" style="index" />
```

## Cards

The `cards` style gives each item more space and includes tags when tag navigation is enabled. As with `CategoryNav`, the framed card is the link, while tag chips inside the frame remain separate links. When `showDate` is set, the date appears in a column at the right edge of the card on wide viewports and after the title on narrow viewports.

[Dynamic content unavailable in text export]

```mdx
<NoteTrayIndex category="blog" style="cards" showDate />
```

## Timeline

The `timeline` style groups a dated tray by month. Each item shows the day number as a marker on the rail and starts with the title. The timeline never shows `updated`, and it throws a build error when used with an undated tray.

[Dynamic content unavailable in text export]

```mdx
<NoteTrayIndex category="blog" style="timeline" />
```

## Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `category` | string | Current containing tray | Tray slug to list, such as `"blog"` |
| `style` | `"index" \| "cards" \| "timeline"` | `"index"` | Listing presentation |
| `showDate` | boolean | `false` | Shows `date` and `updated` in the index and card styles; the timeline always shows the date (created) only |
| `lang` | `Locale` | auto-detected | Overrides the content locale |

Items follow the tray's `category_sort_order`. An empty tray, an unknown category, or a category that is not a note tray renders nothing.

See [Note Trays](https://zudo-doc.takazudomodular.com/docs/guides/note-tray) for declaration fields, ordering, validation, and limitations.

## Source

The MDX wrapper ships from `@takazudo/zudo-doc/note-tray-index` and the presentational component from `@takazudo/zudo-doc/nav-indexing`. Package-owned routes register it automatically.