Feedback/DSModal

DSModal

feedback

since 0.1.0

Centered overlay dialog with a header, scrollable content area, and footer actions. Blocks background interaction.

iOS 17+macOS 14+watchOS 10+tvOS 17+visionOS 1+

Purpose

Confirmation dialogs, forms requiring immediate attention, and multi-step mini-flows.

Interactive Reference

Live showroom

Need the full visual surface?

Screenshots do not scale well across every component, state, and variant. For the real interactive reference, import the package and launch DSShowcaseRoot().

Best for exploring:

variants, states, categories, and real app examples in one place.

Props

Prop	Type	Default	Description
isPresentedreq	Binding<Bool>	—	Controls visibility. Tapping the backdrop or the close button sets it to false.
title	String?	nil	Modal heading.
maxWidth	CGFloat	540	Maximum width of the panel.
contentreq	@ViewBuilder () -> Content	—	Modal body, including any action buttons.

Examples

Confirmation dialog

Put the modal in an overlay; actions go inside the content.

swift

.overlay {
    DSModal(isPresented: $showDelete, title: "Delete project?") {
        VStack(alignment: .leading, spacing: DSSpacing.lg) {
            DSText("This action cannot be undone.", style: .bodyMuted)
            HStack {
                DSButton("Cancel", variant: .ghost) { showDelete = false }
                DSButton("Delete", variant: .destructive) { viewModel.delete() }
            }
        }
        .padding(DSSpacing.lg)
    }
}

Form modal

Multi-field form with a narrower panel.

swift

DSModal(isPresented: $showAddTask, title: "New Task", maxWidth: 420) {
    VStack(alignment: .leading, spacing: DSSpacing.md) {
        DSTextField(label: "Title", text: $taskTitle)
        DSTextArea(label: "Description", text: $taskDescription)
        DSButton("Create", variant: .primary, isLoading: viewModel.isSaving) {
            viewModel.createTask()
        }
    }
    .padding(DSSpacing.lg)
}