Pull-Down Menu

// Pull-Down Menu · syxUI · https://syxui.dev/components/menu-pulldown
// Free in any project. Keep this line and credit syxUI where a person can read it.

import SwiftUI

let mnBlue = Color(red: 0.0, green: 0.47, blue: 1.0)
let mnRed = Color(red: 0.90, green: 0.24, blue: 0.28)

func menuCard<C: View>(_ w: CGFloat, @ViewBuilder _ c: () -> C) -> some View {
    c().frame(width: w).background(Color(.systemBackground), in: RoundedRectangle(cornerRadius: 14, style: .continuous)).overlay(RoundedRectangle(cornerRadius: 14, style: .continuous).stroke(Color.primary.opacity(0.07), lineWidth: 1)).shadow(color: .black.opacity(0.06), radius: 14, y: 5)
}

func menuRow(_ label: String, _ icon: String, destructive: Bool = false, disabled: Bool = false) -> some View {
    HStack { Text(label).font(.system(size: 15)); Spacer(); Image(systemName: icon).font(.system(size: 15)) }.foregroundStyle(destructive ? mnRed : (disabled ? Color.secondary.opacity(0.4) : Color.primary)).padding(.horizontal, 14).padding(.vertical, 11)
}

struct MenuPulldown: View { var body: some View { VStack(alignment: .leading, spacing: 6) { HStack(spacing: 6) { Text("Options").font(.system(size: 15, weight: .medium)); Image(systemName: "chevron.down").font(.system(size: 12, weight: .semibold)) }.foregroundStyle(mnBlue).padding(.horizontal, 14).padding(.vertical, 9).background(mnBlue.opacity(0.1), in: Capsule()); menuCard(230) { VStack(spacing: 0) { menuRow("Rename", "pencil"); Divider(); menuRow("Duplicate", "plus.square.on.square"); Divider(); menuRow("Move to…", "folder"); Divider(); menuRow("Delete", "trash", destructive: true) } } }.frame(width: 240) } }