MultinaireDialog

Confirmation and alert dialog with multiple types and customizable actions.

Basic Usage

import { MultinaireDialog } from '@multinaire/multinaire-design';

<MultinaireDialog
  message="Are you sure you want to delete this item?"
  buttonTitle="Delete"
  cancelButtonTitle="Cancel"
  onPress={() => handleDelete()}
/>

Props

Prop	Type	Default	Description
message	string	—	Main body message of the dialog
type	'alert' | 'confirm' | 'banner'	'confirm'	Visual style of the dialog
icon	IconName	—	Icon displayed at the top of the dialog
destructive	boolean	false	Render the primary action button with a destructive (error) style
buttonTitle	string	—	Label for the primary action button
cancelButtonTitle	string	—	Label for the cancel button (used when type="confirm")
isLoading	boolean	false	Show a loading state inside the dialog
onPress	() => void	—	Callback invoked when the primary action button is pressed

Examples

Alert Dialog

<MultinaireDialog
  type="alert"
  icon="AlertCircle"
  message="Your session has expired. Please log in again."
  buttonTitle="OK"
  onPress={() => navigation.navigate('Login')}
/>

Confirmation Dialog

<MultinaireDialog
  type="confirm"
  message="Are you sure you want to save these changes?"
  buttonTitle="Save"
  cancelButtonTitle="Cancel"
  onPress={() => saveChanges()}
/>

Destructive Confirmation

<MultinaireDialog
  type="confirm"
  destructive
  icon="Trash"
  message="This action cannot be undone. Are you sure you want to delete this item?"
  buttonTitle="Delete"
  cancelButtonTitle="Cancel"
  onPress={() => deleteItem()}
/>

Banner Dialog

<MultinaireDialog
  type="banner"
  icon="Gift"
  message="You've earned a reward! Tap to claim your prize."
  buttonTitle="Claim Now"
  onPress={() => claimReward()}
/>

With Loading State

<MultinaireDialog
  message="Confirm your purchase?"
  buttonTitle="Buy Now"
  cancelButtonTitle="Cancel"
  isLoading={isPurchasing}
  onPress={() => completePurchase()}
/>

Sign Out Confirmation

<MultinaireDialog
  type="confirm"
  icon="Logout"
  message="Are you sure you want to sign out?"
  buttonTitle="Sign Out"
  cancelButtonTitle="Cancel"
  onPress={() => signOut()}
/>