@sriinnu/runic 1.0.0

package/Sources/Runic/Views/Menu/ProjectBudgetMenuView.swift

@@ -0,0 +1,220 @@
+import RunicCore
+import SwiftUI
+
+@MainActor
+struct ProjectBudgetMenuView: View {
+    fileprivate struct ProjectUsage: Identifiable {
+        let id: String
+        let projectName: String
+        let budget: ProjectBudgetStore.ProjectBudget
+        let spent: Double
+        let percentUsed: Double
+        let isOverBudget: Bool
+        let isNearLimit: Bool
+
+        var statusColor: Color {
+            if self.isOverBudget {
+                return Color(red: 0.94, green: 0.36, blue: 0.36) // Red
+            } else if self.isNearLimit {
+                return Color(red: 0.94, green: 0.74, blue: 0.26) // Yellow
+            } else {
+                return Color(red: 0.46, green: 0.75, blue: 0.36) // Green
+            }
+        }
+    }
+
+    private let projectSummaries: [UsageLedgerProjectSummary]
+    private let width: CGFloat
+    private let onOpenPreferences: () -> Void
+
+    @State private var hoveredProjectID: String?
+
+    init(
+        projectSummaries: [UsageLedgerProjectSummary],
+        width: CGFloat,
+        onOpenPreferences: @escaping () -> Void)
+    {
+        self.projectSummaries = projectSummaries
+        self.width = width
+        self.onOpenPreferences = onOpenPreferences
+    }
+
+    var body: some View {
+        let model = Self.makeModel(from: self.projectSummaries)
+        VStack(alignment: .leading, spacing: RunicSpacing.sm) {
+            HStack {
+                Text("Project Budgets")
+                    .font(.headline)
+                    .fontWeight(.semibold)
+                Spacer()
+                Button {
+                    self.onOpenPreferences()
+                } label: {
+                    HStack(spacing: RunicSpacing.xxs) {
+                        Image(systemName: "gearshape")
+                            .font(.caption)
+                        Text("Configure")
+                            .font(.caption)
+                    }
+                }
+                .buttonStyle(.plain)
+                .foregroundStyle(.blue)
+            }
+
+            if model.isEmpty {
+                VStack(alignment: .leading, spacing: RunicSpacing.xs) {
+                    Text("No budgets configured.")
+                        .font(.footnote)
+                        .foregroundStyle(.secondary)
+                    Button {
+                        self.onOpenPreferences()
+                    } label: {
+                        Text("Set up budgets in Preferences")
+                            .font(.caption)
+                    }
+                    .buttonStyle(.plain)
+                    .foregroundStyle(.blue)
+                }
+            } else {
+                VStack(alignment: .leading, spacing: RunicSpacing.xs) {
+                    ForEach(model) { project in
+                        ProjectBudgetRow(
+                            project: project,
+                            isHovered: self.hoveredProjectID == project.id)
+                            .onHover { hovering in
+                                self.hoveredProjectID = hovering ? project.id : nil
+                            }
+                    }
+                }
+
+                // Summary
+                let overBudget = model.filter { $0.isOverBudget }.count
+                let nearLimit = model.filter { $0.isNearLimit && !$0.isOverBudget }.count
+                if overBudget > 0 || nearLimit > 0 {
+                    Divider()
+                        .padding(.vertical, RunicSpacing.xxs)
+
+                    VStack(alignment: .leading, spacing: RunicSpacing.xxs) {
+                        if overBudget > 0 {
+                            HStack(spacing: RunicSpacing.xxs) {
+                                Image(systemName: "exclamationmark.triangle.fill")
+                                    .font(.caption2)
+                                    .foregroundStyle(Color(red: 0.94, green: 0.36, blue: 0.36))
+                                Text("\(overBudget) project\(overBudget == 1 ? "" : "s") over budget")
+                                    .font(.caption)
+                                    .foregroundStyle(.secondary)
+                            }
+                        }
+                        if nearLimit > 0 {
+                            HStack(spacing: RunicSpacing.xxs) {
+                                Image(systemName: "exclamationmark.circle.fill")
+                                    .font(.caption2)
+                                    .foregroundStyle(Color(red: 0.94, green: 0.74, blue: 0.26))
+                                Text("\(nearLimit) project\(nearLimit == 1 ? "" : "s") near limit")
+                                    .font(.caption)
+                                    .foregroundStyle(.secondary)
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        .padding(.horizontal, MenuCardMetrics.horizontalPadding)
+        .padding(.vertical, RunicSpacing.xs)
+        .frame(minWidth: self.width, maxWidth: .infinity, alignment: .leading)
+    }
+
+    private static func makeModel(from summaries: [UsageLedgerProjectSummary]) -> [ProjectUsage] {
+        let budgets = ProjectBudgetStore.getAllBudgets()
+
+        var result: [ProjectUsage] = []
+
+        for budget in budgets where budget.enabled {
+            let projectID = budget.projectID
+            let summary = summaries.first { $0.projectID == projectID }
+            let spent = summary?.totals.costUSD ?? 0.0
+            let percentUsed = budget.monthlyLimit > 0 ? (spent / budget.monthlyLimit) * 100 : 0
+            let isOverBudget = percentUsed > 100
+            let isNearLimit = percentUsed >= (budget.alertThreshold * 100)
+
+            result.append(ProjectUsage(
+                id: projectID,
+                projectName: budget.projectName ?? projectID,
+                budget: budget,
+                spent: spent,
+                percentUsed: min(100, percentUsed),
+                isOverBudget: isOverBudget,
+                isNearLimit: isNearLimit))
+        }
+
+        return result.sorted { lhs, rhs in
+            if lhs.isOverBudget != rhs.isOverBudget {
+                return lhs.isOverBudget
+            }
+            if lhs.isNearLimit != rhs.isNearLimit {
+                return lhs.isNearLimit
+            }
+            return lhs.percentUsed > rhs.percentUsed
+        }
+    }
+}
+
+private struct ProjectBudgetRow: View {
+    let project: ProjectBudgetMenuView.ProjectUsage
+    let isHovered: Bool
+    @Environment(\.menuItemHighlighted) private var isHighlighted
+
+    var body: some View {
+        VStack(alignment: .leading, spacing: RunicSpacing.xxs) {
+            HStack(alignment: .firstTextBaseline) {
+                Text(project.projectName)
+                    .font(.body)
+                    .fontWeight(.medium)
+                    .lineLimit(1)
+                Spacer()
+                Text(self.budgetText)
+                    .font(.caption)
+                    .foregroundStyle(MenuHighlightStyle.secondary(self.isHighlighted))
+            }
+
+            UsageProgressBar(
+                percent: project.percentUsed,
+                tint: project.statusColor,
+                accessibilityLabel: "Budget usage")
+
+            HStack(alignment: .firstTextBaseline) {
+                Text(String(format: "%.0f%%", project.percentUsed))
+                    .font(.caption)
+                    .foregroundStyle(self.statusTextColor)
+                Spacer()
+                if project.isOverBudget {
+                    Text("Over budget")
+                        .font(.caption)
+                        .foregroundStyle(Color(red: 0.94, green: 0.36, blue: 0.36))
+                        .fontWeight(.medium)
+                } else if project.isNearLimit {
+                    Text("Near limit")
+                        .font(.caption)
+                        .foregroundStyle(Color(red: 0.94, green: 0.74, blue: 0.26))
+                        .fontWeight(.medium)
+                }
+            }
+        }
+        .padding(RunicSpacing.xs)
+        .background {
+            RoundedRectangle(cornerRadius: RunicCornerRadius.sm, style: .continuous)
+                .fill(self.isHovered ? Color(nsColor: .separatorColor).opacity(0.15) : Color.clear)
+        }
+    }
+
+    private var budgetText: String {
+        "\(UsageFormatter.usdString(project.spent)) / \(UsageFormatter.usdString(project.budget.monthlyLimit))"
+    }
+
+    private var statusTextColor: Color {
+        if self.isHighlighted {
+            return MenuHighlightStyle.selectionText
+        }
+        return project.statusColor
+    }
+}

package/Sources/Runic/Views/Menu/ProviderTabBarView.swift

@@ -0,0 +1,88 @@
+import AppKit
+import RunicCore
+import SwiftUI
+
+/// Horizontal provider tab bar at the top of the menu dropdown — inspired by CodexBar.
+/// Uses actual provider brand icons (SVG) with brand colors from the descriptor registry.
+@MainActor
+struct ProviderTabBarView: View {
+    struct TabItem: Identifiable {
+        let id: String
+        let label: String
+        let icon: NSImage?
+        let provider: UsageProvider?
+        let isSelected: Bool
+        let brandColor: Color
+    }
+
+    let tabs: [TabItem]
+    let width: CGFloat
+    let onSelect: (UsageProvider?) -> Void
+
+    var body: some View {
+        ScrollView(.horizontal, showsIndicators: false) {
+            HStack(spacing: RunicSpacing.compact) {
+                ForEach(self.tabs) { tab in
+                    Button {
+                        self.onSelect(tab.provider)
+                    } label: {
+                        HStack(spacing: RunicSpacing.xxs) {
+                            if let nsImage = tab.icon {
+                                Image(nsImage: nsImage)
+                                    .resizable()
+                                    .aspectRatio(contentMode: .fit)
+                                    .frame(width: 18, height: 18)
+                            } else if tab.provider == nil {
+                            Image(systemName: "square.grid.2x2")
+                                    .font(.system(size: 14, weight: .medium))
+                            }
+                            Text(tab.label)
+                                .font(.system(.caption, design: .rounded))
+                                .fontWeight(tab.isSelected ? .semibold : .regular)
+                                .lineLimit(1)
+                        }
+                        .padding(.horizontal, RunicSpacing.xs + 2)
+                        .padding(.vertical, RunicSpacing.xxs + 2)
+                        .background(
+                            Capsule(style: .continuous)
+                                .fill(tab.isSelected
+                                    ? tab.brandColor.opacity(RunicColors.Opacity.medium)
+                                    : Color(nsColor: .controlBackgroundColor).opacity(RunicColors.Opacity.subtle))
+                        )
+                        .overlay(
+                            Capsule(style: .continuous)
+                                .stroke(
+                                    tab.isSelected
+                                        ? tab.brandColor.opacity(RunicColors.Opacity.strong)
+                                        : Color(nsColor: .separatorColor).opacity(RunicColors.Opacity.light),
+                                    lineWidth: 0.5)
+                        )
+                        .foregroundStyle(tab.isSelected ? tab.brandColor : .secondary)
+                        .shadow(
+                            color: tab.isSelected ? tab.brandColor.opacity(0.15) : .clear,
+                            radius: 4, y: 1)
+                    }
+                    .buttonStyle(TabButtonStyle())
+                }
+            }
+            .padding(.horizontal, MenuCardMetrics.horizontalPadding)
+            .padding(.vertical, RunicSpacing.xs)
+        }
+        .frame(minWidth: self.width, maxWidth: .infinity)
+        .accessibilityElement(children: .contain)
+        .accessibilityLabel("Provider tabs")
+    }
+}
+
+/// Button style with subtle hover scale feedback.
+private struct TabButtonStyle: ButtonStyle {
+    @State private var isHovered = false
+
+    func makeBody(configuration: Configuration) -> some View {
+        configuration.label
+            .scaleEffect(configuration.isPressed ? 0.95 : (self.isHovered ? 1.03 : 1.0))
+            .animation(RunicAnimation.hoverFeedback, value: configuration.isPressed)
+            .animation(RunicAnimation.hoverFeedback, value: self.isHovered)
+            .onHover { self.isHovered = $0 }
+    }
+}

package/Sources/Runic/Views/Menu/SubscriptionUtilizationChartMenuView.swift

@@ -0,0 +1,201 @@
+import Charts
+import RunicCore
+import SwiftUI
+
+/// Subscription utilization chart — shows daily usage as % bars with Daily/Weekly/Monthly picker.
+/// Inspired by CodexBar "Subscription Utilization" submenu.
+@MainActor
+struct SubscriptionUtilizationChartMenuView: View {
+    enum Period: String, CaseIterable {
+        case daily = "Daily"
+        case weekly = "Weekly"
+        case monthly = "Monthly"
+    }
+
+    private struct UtilizationBar: Identifiable {
+        let id: String
+        let label: String
+        let date: Date
+        let usedPercent: Double
+        let isToday: Bool
+    }
+
+    private let dailySummaries: [UsageLedgerDailySummary]
+    private let currentUsedPercent: Double
+    private let todayTokens: Int
+    private let width: CGFloat
+    @State private var selectedPeriod: Period = .daily
+
+    init(
+        dailySummaries: [UsageLedgerDailySummary],
+        currentUsedPercent: Double,
+        todayTokens: Int,
+        width: CGFloat)
+    {
+        self.dailySummaries = dailySummaries
+        self.currentUsedPercent = currentUsedPercent
+        self.todayTokens = todayTokens
+        self.width = width
+    }
+
+    private static let barColor = RunicColors.chartColor(at: 4)  // teal
+    private static let wastedColor = Color(nsColor: .systemGray).opacity(0.2)
+
+    var body: some View {
+        let model = Self.makeModel(
+            from: self.dailySummaries,
+            period: self.selectedPeriod,
+            currentUsedPercent: self.currentUsedPercent,
+            todayTokens: self.todayTokens)
+
+        VStack(alignment: .leading, spacing: RunicSpacing.xs) {
+            Text("Utilization")
+                .font(.system(.subheadline, design: .rounded))
+                .fontWeight(.semibold)
+
+            Picker("", selection: self.$selectedPeriod) {
+                ForEach(Period.allCases, id: \.self) { period in
+                    Text(period.rawValue).tag(period)
+                }
+            }
+            .pickerStyle(.segmented)
+
+            if model.bars.isEmpty {
+                Text("No utilization data available.")
+                    .font(.system(.footnote, design: .rounded))
+                    .foregroundStyle(.secondary)
+                    .frame(height: 80)
+            } else {
+                Chart {
+                    ForEach(model.bars) { bar in
+                        BarMark(
+                            x: .value("Period", bar.label),
+                            y: .value("Used %", bar.usedPercent))
+                            .foregroundStyle(bar.isToday ? Self.barColor : Self.barColor.opacity(0.6))
+                            .cornerRadius(RunicCornerRadius.xs)
+                    }
+                }
+                .chartYScale(domain: 0...100)
+                .chartYAxis {
+                    AxisMarks(values: [0, 25, 50, 75, 100]) { value in
+                        AxisGridLine(stroke: StrokeStyle(lineWidth: 0.5, dash: [4, 3]))
+                            .foregroundStyle(Color(nsColor: .separatorColor).opacity(0.5))
+                        AxisValueLabel {
+                            if let pct = value.as(Int.self) {
+                                Text("\(pct)%")
+                                    .font(.system(.caption2, design: .rounded))
+                                    .foregroundStyle(Color(nsColor: .tertiaryLabelColor))
+                            }
+                        }
+                    }
+                }
+                .chartXAxis {
+                    AxisMarks(values: .automatic(desiredCount: 5)) { _ in
+                        AxisValueLabel()
+                            .font(.system(.caption2, design: .rounded))
+                            .foregroundStyle(Color(nsColor: .tertiaryLabelColor))
+                    }
+                }
+                .chartLegend(.hidden)
+                .frame(height: RunicSpacing.chartHeight - 10)
+
+                // Latest detail
+                if let latest = model.bars.last {
+                    let used = Int(latest.usedPercent.rounded())
+                    let unused = max(0, 100 - used)
+                    Text("\(latest.label): \(used)% used, \(unused)% unused")
+                        .font(.system(.caption, design: .rounded))
+                        .foregroundStyle(.secondary)
+                }
+            }
+        }
+        .chartPanelStyle(width: self.width)
+        .accessibilityElement(children: .ignore)
+        .accessibilityLabel("Subscription utilization chart")
+    }
+
+    // MARK: - Model
+
+    private struct UtilizationModel {
+        let bars: [UtilizationBar]
+    }
+
+    private static func makeModel(
+        from summaries: [UsageLedgerDailySummary],
+        period: Period,
+        currentUsedPercent: Double,
+        todayTokens: Int) -> UtilizationModel
+    {
+        let calendar = Calendar.current
+        let todayStart = calendar.startOfDay(for: Date())
+
+        // Build token counts by day
+        var tokensByDay: [String: Int] = [:]
+        let formatter = DateFormatter()
+        formatter.dateFormat = "yyyy-MM-dd"
+        formatter.timeZone = TimeZone.current
+
+        for summary in summaries {
+            tokensByDay[summary.dayKey, default: 0] += summary.totals.totalTokens
+        }
+
+        // Scale factor: map today's tokens to the current used %
+        let scaleFactor: Double = todayTokens > 0 ? currentUsedPercent / Double(todayTokens) : 0
+
+        switch period {
+        case .daily:
+            let bars = (0..<14).compactMap { offset -> UtilizationBar? in
+                guard let date = calendar.date(byAdding: .day, value: offset - 13, to: todayStart) else { return nil }
+                let key = formatter.string(from: date)
+                let tokens = tokensByDay[key] ?? 0
+                let pct = min(100, Double(tokens) * scaleFactor)
+                let label = date.formatted(.dateTime.day().month(.abbreviated))
+                let isToday = offset == 13
+                return UtilizationBar(id: key, label: label, date: date, usedPercent: pct, isToday: isToday)
+            }
+            return UtilizationModel(bars: bars)
+
+        case .weekly:
+            // Aggregate by ISO week
+            var weekBuckets: [(label: String, tokens: Int, date: Date, isThisWeek: Bool)] = []
+            for weekOffset in stride(from: -3, through: 0, by: 1) {
+                guard let weekStart = calendar.date(byAdding: .weekOfYear, value: weekOffset, to: todayStart) else { continue }
+                var total = 0
+                for dayOffset in 0..<7 {
+                    guard let date = calendar.date(byAdding: .day, value: dayOffset, to: weekStart) else { continue }
+                    total += tokensByDay[formatter.string(from: date)] ?? 0
+                }
+                let label = "W\(calendar.component(.weekOfYear, from: weekStart))"
+                weekBuckets.append((label, total, weekStart, weekOffset == 0))
+            }
+            let maxWeekTokens = weekBuckets.map(\.tokens).max() ?? 1
+            let bars = weekBuckets.map { bucket in
+                let pct = maxWeekTokens > 0 ? Double(bucket.tokens) / Double(maxWeekTokens) * 100 : 0
+                return UtilizationBar(id: bucket.label, label: bucket.label, date: bucket.date, usedPercent: pct, isToday: bucket.isThisWeek)
+            }
+            return UtilizationModel(bars: bars)
+
+        case .monthly:
+            var monthBuckets: [(label: String, tokens: Int, date: Date, isThisMonth: Bool)] = []
+            for monthOffset in stride(from: -2, through: 0, by: 1) {
+                guard let monthStart = calendar.date(byAdding: .month, value: monthOffset, to: todayStart) else { continue }
+                let monthComponents = calendar.dateComponents([.year, .month], from: monthStart)
+                guard let actualMonthStart = calendar.date(from: monthComponents),
+                      let range = calendar.range(of: .day, in: .month, for: actualMonthStart) else { continue }
+                var total = 0
+                for dayOffset in 0..<range.count {
+                    guard let date = calendar.date(byAdding: .day, value: dayOffset, to: actualMonthStart) else { continue }
+                    total += tokensByDay[formatter.string(from: date)] ?? 0
+                }
+                let label = monthStart.formatted(.dateTime.month(.abbreviated))
+                monthBuckets.append((label, total, monthStart, monthOffset == 0))
+            }
+            let maxMonthTokens = monthBuckets.map(\.tokens).max() ?? 1
+            let bars = monthBuckets.map { bucket in
+                let pct = maxMonthTokens > 0 ? Double(bucket.tokens) / Double(maxMonthTokens) * 100 : 0
+                return UtilizationBar(id: bucket.label, label: bucket.label, date: bucket.date, usedPercent: pct, isToday: bucket.isThisMonth)
+            }
+            return UtilizationModel(bars: bars)
+        }
+    }
+}