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.

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.

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.

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.