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	-	Dialog message text
type	'alert' | 'confirm' | 'banner'	'confirm'	Dialog type
icon	MultinaireIcons	-	Icon to display
destructive	boolean	false	Use destructive styling
buttonTitle	string	-	Primary button text
cancelButtonTitle	string	-	Cancel button text
isLoading	boolean	false	Show loading state
onPress	() => void	-	Primary button handler

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()}
/>