Sheets & overlays

BMoniBottomSheet, BMoniTitledBottomSheet, BMoniOptionsBottomSheet, SelectorBottomSheet, and SearchableSelectorBottomSheet.

BMoniBottomSheet.show

The base utility for presenting any content as a bottom sheet. Returns the value the child pops with.

final String? result = await BMoniBottomSheet.show<String>(
  context: context,
  child: const BMoniTitledBottomSheet(
    title: 'Choose an option',
    children: [/* ... */],
  ),
);

---

BMoniTitledBottomSheet

A bottom sheet with a drag handle, a centred title, and a scrollable children list.

BMoniTitledBottomSheet(
  title: 'Choose action',
  children: [
    ListTile(title: const Text('Option A'), onTap: () => Navigator.pop(context, 'A')),
    ListTile(title: const Text('Option B'), onTap: () => Navigator.pop(context, 'B')),
  ],
)

---

BMoniOptionsBottomSheet

A pre-built options menu. Each option has an SVG icon, a title, and an onTap callback.

BMoniOptionsBottomSheet(
  title: 'More actions',
  options: [
    BMoniBottomSheetOption(
      icon: 'assets/svgs/edit.svg',
      title: 'Edit',
      onTap: () => Navigator.pop(context),
    ),
    BMoniBottomSheetOption(
      icon: 'assets/svgs/delete.svg',
      title: 'Delete',
      onTap: () => Navigator.pop(context),
    ),
  ],
)

BMoniBottomSheetOption props

Prop	Type	Description
icon	String	Asset path to an SVG icon.
title	String	Label shown next to the icon.
onTap	VoidCallback	Called when the option is tapped.

---

SelectorBottomSheet<T>

A generic, scrollable list selector with an optional icon per item.

final Currency? picked = await BMoniBottomSheet.show<Currency>(
  context: context,
  child: SelectorBottomSheet<Currency>(
    items: currencies,
    selected: currentCurrency,
    title: 'Choose currency',
    label: (c) => c.name,
    value: (c) => c.code,
    icon: (c) => c.flagAsset,
    showIcon: true,
  ),
);

Prop	Type	Description
items	List<T>	All selectable items.
selected	T?	The currently selected item.
title	String	Sheet title.
label	String Function(T)	Returns the display label for an item.
value	String Function(T)	Returns the value key for an item (used for equality).
icon	String? Function(T)?	Returns an optional SVG asset path for an item.
showIcon	bool	Whether to show the icon column.

---

SearchableSelectorBottomSheet<T>

Same as SelectorBottomSheet but with a search bar at the top that filters items client-side.

SearchableSelectorBottomSheet<Country>(
  items: countries,
  selected: currentCountry,
  title: 'Choose country',
  label: (c) => c.name,
  value: (c) => c.code,
  icon: (c) => c.flagAsset,
  showIcon: true,
)