Component

Alert

A light, frosted confirmation dialog centered on screen. Title and message stack above a horizontal row of actions. Destructive labels render in red.

Standalone

alert.tsx

const { alert, dismiss, show } = useNativeAlert();

show({
  title: "Delete card?",
  message: "This cannot be undone.",
  buttons: [
    { label: "Cancel", kind: "cancel" },
    { label: "Delete", kind: "destructive" },
  ],
});

<NativeAlert alert={alert} onDismiss={dismiss} />

Example

Destructive confirmation with Cancel on the left and Remove on the right in the horizontal action row.

alert-example.tsx

const { alert, dismiss, show } = useNativeAlert();

show({
  title: "Remove Chase Bank?",
  message: "You'll need to re-link this item to use it again.",
  buttons: [
    { label: "Cancel", kind: "cancel" },
    { label: "Remove", kind: "destructive" },
  ],
});

<NativeAlert alert={alert} onDismiss={dismiss} />

Capabilities

Prop	Type	Description
alertrequired	NativeAlertOptions \| null	-
onDismissrequired	() => void	-