Getting Started

Getting Started

PeekDialog adds a peekDialog modifier to any view. Bind some state, describe the content, and it handles presentation and dismissal.

There are two ways to drive a single dialog. For a queue of notifications, see Stacking (iOS).

---

Boolean binding

Same idea as .sheet(isPresented:):

struct ContentView: View {
    @State private var showDialog = false

    var body: some View {
        Button("Show") { showDialog = true }
            .peekDialog(isPresented: $showDialog, dismissDelay: .medium) {
                HStack {
                    Image(systemName: "checkmark.circle.fill")
                        .foregroundColor(.green)
                    Text("Done")
                    Spacer()
                }
                .padding()
            }
    }
}

---

Optional item binding

The dialog appears when the optional becomes non-nil, and the value is passed into the content closure:

struct ContentView: View {
    @State private var errorMessage: String?

    var body: some View {
        Button("Fail") { errorMessage = "Network request failed" }
            .peekDialog(with: $errorMessage, dismissDelay: .long) { message in
                HStack {
                    Image(systemName: "exclamationmark.triangle.fill")
                        .foregroundColor(.red)
                    Text(message)
                    Spacer()
                }
                .padding()
            }
    }
}

---

How dismissal works

A dialog goes away when:

1. its dismissDelay elapses → Duration and Placement
2. the user swipes it away → Swipe to Dismiss
3. the binding is cleared (false / nil)

Optional onDismiss callback:

.peekDialog(with: $errorMessage, onDismiss: {
    print("dismissed")
}) { message in
    Text(message).padding()
}

---

Next

Topic	Guide
Delays & position	Duration and Placement
Lock swipe	Swipe to Dismiss
Multiple notifications	Stacking
Look & feel	Styling · Custom Styles
Silent failures	Common Mistakes