Modal
This element is an overlay above the app's content. It's great for showing prompts or informing users.
How to use it
import { Modal } from 'etta-ui';
<Modal
title="You have a lightning invoice on your clipboard"
message="Would you like to use this invoice for a transaction?"
actionButton={{
title: "Okay",
onPress: () => 0,
}}
cancelButton={{
title: "Cancel",
onPress: () => 0,
}}
/>;
Variations
One action button
Incoming on-chain transaction
To save on the currently high fees, these funds will become available in about 2-3 hours.
Okay
With cancel button
You have a lightning invoice on your clipboard
Would you like to use this invoice for a transaction?
Cancel
Okay
Props
Name | Type | Default | Description |
---|---|---|---|
title | string | Heading on the modal | |
message | string | Descriptive text below the heading on the modal | |
actionButton | {title: string , onPress: () => void } | Action button title and function to be carried out when pressed | |
cancelButton | {title: string , onPress: () => void } | Cancel button title and function to be carried out when pressed |
Playground
You can play with this component here. For best results, use Expo Go on your own device.