# Dialog

### Overview

The Dialog view presents modal content in a styled overlay, typically used for important alerts or user interactions requiring attention.

The `dialog` modifier allows you to present a Material Design styled alert dialog from any SwiftUI view. You can configure the dialog with a title, message, and actions, including primary and optional secondary buttons.&#x20;

To use the `dialog` modifier, apply it to any View with the required parameters.

### Modifiers

Present a simple dialog with a title and message.

```swift
dialog(
    isPresented: Binding<Bool>,
    titleKey: String,
    message: String
)
```

Present an dialog with a title, message, and a primary button.

```swift
dialog(
    isPresented: Binding<Bool>,
    titleKey: String,
    message: String,
    primaryActionKey: String,
    primaryAction: @escaping () -> Void
)
```

Present an dialog with a title, message, and both primary and secondary buttons.

```swift
dialog(
    isPresented: Binding<Bool>,
    titleKey: String,
    message: String,
    primaryActionKey: String,
    primaryAction: @escaping () -> Void,
    secondaryActionKey: String?,
    secondaryAction: (() -> Void)?
)
```

### Parameters

<table><thead><tr><th width="237">Property</th><th>Description</th></tr></thead><tbody><tr><td><code>isPresented</code></td><td>A <code>Binding&#x3C;Bool></code> to control the presentation of the dialog.</td></tr><tr><td><code>titleKey</code></td><td>A <code>String</code> representing the title of the dialog.</td></tr><tr><td><code>message</code></td><td>A <code>String</code> for the dialog message.</td></tr><tr><td><code>primaryActionKey</code></td><td>A <code>String</code> for the title of the primary action button.</td></tr><tr><td><code>primaryAction</code></td><td>A closure to execute when the primary button is tapped.</td></tr><tr><td><code>secondaryActionKey</code></td><td>An optional <code>String</code> for the title of the secondary action button.</td></tr><tr><td><code>secondaryAction</code></td><td>An optional closure to execute when the secondary button is tapped.</td></tr></tbody></table>

### Example

Displays a basic dialog with a title and message.

```swift
@State private var showSimpleDialog = false

var body: some View {
    Container {
        Switch("Show Simple Dialog", isOn: $showSimpleDialog)
    }
    .dialog(
        isPresented: $showSimpleDialog,
        titleKey: "Simple Dialog",
        message: "This is a simple dialog with a title and message."
    )
}
```

<figure><picture><source srcset="/files/VcwTTp24uyno34yzBSDX" media="(prefers-color-scheme: dark)"><img src="/files/MCZbH5kVo9gnRlcEA4tv" alt=""></picture><figcaption></figcaption></figure>

Displays a dialog with a title, message, and a primary action button.

```swift
@State private var showPrimaryActionDialog = false

var body: some View {
    Container {
        Switch("Dialog with Primary Action", isOn: $showPrimaryActionDialog)
    }
    .dialog(
        isPresented: $showPrimaryActionDialog,
        titleKey: "Primary Action Dialog",
        message: "This dialog includes a primary action button.",
        primaryActionKey: "OK",
        primaryAction: {
            Void()
        }
    )
}
```

<figure><picture><source srcset="/files/FO0lvcoWJYIHew7aAYff" media="(prefers-color-scheme: dark)"><img src="/files/O73LhrfrY8LQ6xes0r8e" alt=""></picture><figcaption></figcaption></figure>

Displays a dialog with title, message, and both primary and secondary action buttons.

```swift
@State private var showFullDialog = false

var body: some View {
    Container {
        Switch("Show Full Dialog", isOn: $showFullDialog)
    }
    .dialog(
        isPresented: $showFullDialog,
        titleKey: "Full Dialog",
        message: "This dialog includes both primary and secondary action buttons.",
        primaryActionKey: "Confirm",
        primaryAction: {
            print("Primary action confirmed")
        },
        secondaryActionKey: "Cancel",
        secondaryAction: {
            Void()
        }
    )
}
```

<div align="center"><figure><picture><source srcset="/files/C4r7OzIGL1GeY9rlq4Eu" media="(prefers-color-scheme: dark)"><img src="/files/BmZZCEbrXvL8VSIMyw2y" alt=""></picture><figcaption></figcaption></figure></div>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://swift-packages.gitbook.io/materialuikit/components/dialog.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
