> ## Documentation Index
> Fetch the complete documentation index at: https://bkey.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Layout & containers

> ActivitySectionCard, SectionHeader, InfoCard, and CustomAppBar.

## ActivitySectionCard & SectionHeader

A card-shaped container with a structured header, a scrollable content area, and an optional footer. Designed for activity feeds, dashboards, and any sectioned list.

```dart theme={null}
ActivitySectionCard(
  header: const SectionHeader(
    title: 'Recent activity',
    trailing: Text('View all'),
  ),
  child: Padding(
    padding: const EdgeInsets.all(16),
    child: Text('Section content here'),
  ),
  footer: const Divider(),
)
```

### SectionHeader props

| Prop       | Type      | Description                                            |
| ---------- | --------- | ------------------------------------------------------ |
| `title`    | `String`  | Section title shown on the left.                       |
| `trailing` | `Widget?` | Optional widget on the right (e.g. a "View all" link). |

### ActivitySectionCard props

| Prop     | Type            | Description                              |
| -------- | --------------- | ---------------------------------------- |
| `header` | `SectionHeader` | The card's header.                       |
| `child`  | `Widget`        | Main body content.                       |
| `footer` | `Widget?`       | Optional widget rendered below the body. |

***

## InfoCard

An inline informational, warning, or tip card. Use it to surface contextual information without blocking the main flow.

```dart theme={null}
InfoCard(
  title: 'In review',
  message: 'Your KYC is being reviewed. We'll notify you once complete.',
  icon: Icons.info_outline,
)
```

| Prop      | Type        | Default | Description               |
| --------- | ----------- | ------- | ------------------------- |
| `message` | `String`    | —       | Main body text.           |
| `title`   | `String?`   | `null`  | Optional bold title line. |
| `icon`    | `IconData?` | `null`  | Optional leading icon.    |

***

## CustomAppBar

A `PreferredSizeWidget` app bar styled to the BMONI design system.

```dart theme={null}
Scaffold(
  appBar: CustomAppBar(
    title: 'Settings',
    showBackButton: true,
    actions: [
      IconButton(
        onPressed: () {},
        icon: const Icon(Icons.help_outline),
      ),
    ],
  ),
)
```

| Prop             | Type                   | Default | Description                   |
| ---------------- | ---------------------- | ------- | ----------------------------- |
| `title`          | `String`               | —       | Title text.                   |
| `showBackButton` | `bool`                 | `true`  | Shows the back chevron.       |
| `actions`        | `List<Widget>?`        | `null`  | Trailing action widgets.      |
| `bottom`         | `PreferredSizeWidget?` | `null`  | Optional `TabBar` or similar. |