Ver Fonte

Add Draw & Print blank canvas with drawing tools and print support.

Wire the home screen feature card to a canvas overlay with draw, text, and image tools, undo/redo, and printing through the existing print service.

Co-authored-by: Cursor <cursoragent@cursor.com>
AhtashamShahzad1 há 1 mês atrás
pai
commit
ac774dd45c

+ 1045 - 0
smart_printer/DrawPrintView.swift

@@ -0,0 +1,1045 @@
+import Cocoa
+import UniformTypeIdentifiers
+
+// MARK: - Service
+
+enum DrawPrintService {
+    static func present(from window: NSWindow?) {
+        let hostWindow = window ?? NSApp.keyWindow
+        guard let viewController = hostWindow?.contentViewController as? ViewController else { return }
+        viewController.presentDrawPrint()
+    }
+}
+
+// MARK: - Canvas Model
+
+enum CanvasTool: CaseIterable {
+    case text
+    case image
+    case draw
+}
+
+struct CanvasStroke {
+    var points: [NSPoint]
+    var color: NSColor
+    var lineWidth: CGFloat
+}
+
+struct CanvasTextData {
+    var id: UUID
+    var text: String
+    var origin: NSPoint
+    var fontSize: CGFloat
+    var color: NSColor
+    var alignment: NSTextAlignment
+}
+
+struct CanvasImageData {
+    var id: UUID
+    var origin: NSPoint
+    var size: NSSize
+    var image: NSImage
+}
+
+struct CanvasSnapshot {
+    var strokes: [CanvasStroke]
+    var texts: [CanvasTextData]
+    var images: [CanvasImageData]
+}
+
+// MARK: - Overlay
+
+final class DrawPrintOverlayView: NSView, AppearanceRefreshable {
+    var onDismiss: (() -> Void)?
+
+    private let backButton = DrawPrintToolbarButton(symbolName: "chevron.left", accessibilityLabel: "Back")
+    private let titleLabel = NSTextField(labelWithString: "Blank Canvas")
+    private let canvasContainer = NSView()
+    private let canvasView = BlankCanvasView()
+    private let toolsPanel = CanvasToolsPanel()
+    private let printButton = DrawPrintPrintButton()
+
+    init() {
+        super.init(frame: .zero)
+        translatesAutoresizingMaskIntoConstraints = false
+        setup()
+        refreshAppearance()
+        NotificationCenter.default.addObserver(
+            self,
+            selector: #selector(appearanceDidChange),
+            name: .appearanceDidChange,
+            object: nil
+        )
+    }
+
+    deinit {
+        NotificationCenter.default.removeObserver(self)
+    }
+
+    @objc private func appearanceDidChange() {
+        refreshAppearance()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        layer?.backgroundColor = AppTheme.background.cgColor
+        titleLabel.textColor = AppTheme.textPrimary
+        canvasContainer.layer?.backgroundColor = AppTheme.cardBackground.cgColor
+        canvasContainer.layer?.borderColor = AppTheme.paywallBorder.cgColor
+        backButton.refreshAppearance()
+        printButton.refreshAppearance()
+        canvasView.refreshAppearance()
+        toolsPanel.refreshAppearance()
+    }
+
+    func present(in parent: NSView) {
+        guard superview == nil else { return }
+        parent.addSubview(self)
+        NSLayoutConstraint.activate([
+            leadingAnchor.constraint(equalTo: parent.leadingAnchor),
+            trailingAnchor.constraint(equalTo: parent.trailingAnchor),
+            topAnchor.constraint(equalTo: parent.topAnchor),
+            bottomAnchor.constraint(equalTo: parent.bottomAnchor),
+        ])
+        alphaValue = 0
+        NSAnimationContext.runAnimationGroup { context in
+            context.duration = 0.2
+            animator().alphaValue = 1
+        }
+    }
+
+    func dismiss(animated: Bool = true) {
+        let remove = { [weak self] in
+            self?.removeFromSuperview()
+            self?.onDismiss?()
+        }
+        guard animated else {
+            remove()
+            return
+        }
+        NSAnimationContext.runAnimationGroup({ context in
+            context.duration = 0.15
+            animator().alphaValue = 0
+        }, completionHandler: remove)
+    }
+
+    private func setup() {
+        wantsLayer = true
+
+        titleLabel.font = AppTheme.semiboldFont(size: 18)
+        titleLabel.alignment = .center
+        titleLabel.translatesAutoresizingMaskIntoConstraints = false
+
+        canvasContainer.wantsLayer = true
+        canvasContainer.layer?.cornerRadius = AppTheme.contentPanelCornerRadius
+        canvasContainer.layer?.borderWidth = 1.5
+        canvasContainer.clipsToBounds = false
+        canvasContainer.applyCardShadow()
+        canvasContainer.translatesAutoresizingMaskIntoConstraints = false
+
+        canvasView.translatesAutoresizingMaskIntoConstraints = false
+        toolsPanel.translatesAutoresizingMaskIntoConstraints = false
+
+        backButton.translatesAutoresizingMaskIntoConstraints = false
+        printButton.translatesAutoresizingMaskIntoConstraints = false
+
+        backButton.onClick = { [weak self] in self?.dismiss() }
+        printButton.onClick = { [weak self] in self?.printCanvas() }
+
+        toolsPanel.onToolChanged = { [weak self] tool in
+            self?.canvasView.activeTool = tool
+        }
+        toolsPanel.onAddText = { [weak self] in
+            self?.canvasView.addTextItem()
+        }
+        toolsPanel.onTextAlignment = { [weak self] alignment in
+            self?.canvasView.setSelectedTextAlignment(alignment)
+        }
+        toolsPanel.onTextFontSize = { [weak self] size in
+            self?.canvasView.setSelectedTextFontSize(size)
+        }
+        toolsPanel.onTextColor = { [weak self] color in
+            self?.canvasView.setSelectedTextColor(color)
+        }
+        toolsPanel.onDrawColor = { [weak self] color in
+            self?.canvasView.drawColor = color
+        }
+        toolsPanel.onDrawLineWidth = { [weak self] width in
+            self?.canvasView.drawLineWidth = width
+        }
+        toolsPanel.onAddImage = { [weak self] in
+            self?.pickImage()
+        }
+
+        canvasView.onUndoStateChanged = { [weak self] canUndo, canRedo in
+            self?.canvasView.updateUndoButtons(canUndo: canUndo, canRedo: canRedo)
+        }
+
+        canvasContainer.addSubview(canvasView)
+        canvasContainer.addSubview(toolsPanel)
+
+        addSubview(backButton)
+        addSubview(titleLabel)
+        addSubview(canvasContainer)
+        addSubview(printButton)
+
+        NSLayoutConstraint.activate([
+            backButton.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 24),
+            backButton.topAnchor.constraint(equalTo: topAnchor, constant: 20),
+            backButton.widthAnchor.constraint(equalToConstant: 40),
+            backButton.heightAnchor.constraint(equalToConstant: 40),
+
+            titleLabel.centerXAnchor.constraint(equalTo: centerXAnchor),
+            titleLabel.centerYAnchor.constraint(equalTo: backButton.centerYAnchor),
+
+            canvasContainer.leadingAnchor.constraint(equalTo: leadingAnchor, constant: AppTheme.contentPanelInset),
+            canvasContainer.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -AppTheme.contentPanelInset),
+            canvasContainer.topAnchor.constraint(equalTo: backButton.bottomAnchor, constant: 28),
+            canvasContainer.bottomAnchor.constraint(equalTo: printButton.topAnchor, constant: -28),
+
+            toolsPanel.trailingAnchor.constraint(equalTo: canvasContainer.trailingAnchor, constant: -8),
+            toolsPanel.centerYAnchor.constraint(equalTo: canvasContainer.centerYAnchor),
+            toolsPanel.widthAnchor.constraint(equalToConstant: 56),
+
+            canvasView.leadingAnchor.constraint(equalTo: canvasContainer.leadingAnchor),
+            canvasView.trailingAnchor.constraint(equalTo: toolsPanel.leadingAnchor, constant: -8),
+            canvasView.topAnchor.constraint(equalTo: canvasContainer.topAnchor),
+            canvasView.bottomAnchor.constraint(equalTo: canvasContainer.bottomAnchor),
+
+            printButton.centerXAnchor.constraint(equalTo: centerXAnchor),
+            printButton.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -28),
+            printButton.widthAnchor.constraint(greaterThanOrEqualToConstant: 220),
+        ])
+    }
+
+    private func pickImage() {
+        let panel = NSOpenPanel()
+        panel.title = "Add Image"
+        panel.message = "Select an image to place on the canvas."
+        panel.prompt = "Add"
+        panel.canChooseDirectories = false
+        panel.canChooseFiles = true
+        panel.allowsMultipleSelection = false
+        panel.allowedContentTypes = [.image, .png, .jpeg, .gif, .tiff, .bmp, .heic]
+
+        guard panel.runModal() == .OK, let url = panel.url,
+              let image = NSImage(contentsOf: url) else { return }
+        canvasView.addImage(image)
+    }
+
+    private func printCanvas() {
+        guard canvasView.hasContent else {
+            PrintService.showEmptyCanvasAlert()
+            return
+        }
+        guard let image = canvasView.renderSnapshot() else { return }
+        PrintService.printCanvas(image, from: window)
+    }
+}
+
+// MARK: - Canvas View
+
+final class BlankCanvasView: NSView, AppearanceRefreshable {
+    var activeTool: CanvasTool = .draw {
+        didSet { needsDisplay = true }
+    }
+    var drawColor: NSColor = NSColor(red: 0.13, green: 0.68, blue: 0.42, alpha: 1)
+    var drawLineWidth: CGFloat = 3
+    var onUndoStateChanged: ((_ canUndo: Bool, _ canRedo: Bool) -> Void)?
+
+    var hasContent: Bool {
+        syncTextFromFields()
+        let hasText = textItems.contains { !$0.text.trimmingCharacters(in: .whitespacesAndNewlines).isEmpty }
+        return !strokes.isEmpty || !imageItems.isEmpty || hasText
+    }
+
+    private var strokes: [CanvasStroke] = []
+    private var textItems: [CanvasTextData] = []
+    private var imageItems: [CanvasImageData] = []
+    private var undoStack: [CanvasSnapshot] = []
+    private var redoStack: [CanvasSnapshot] = []
+
+    private var currentStroke: CanvasStroke?
+    private var selectedTextID: UUID?
+
+    private let undoButton = CanvasHistoryButton(symbolName: "arrow.uturn.backward", accessibilityLabel: "Undo")
+    private let redoButton = CanvasHistoryButton(symbolName: "arrow.uturn.forward", accessibilityLabel: "Redo")
+
+    init() {
+        super.init(frame: .zero)
+        setup()
+        refreshAppearance()
+        notifyUndoState()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        undoButton.refreshAppearance()
+        redoButton.refreshAppearance()
+    }
+
+    func updateUndoButtons(canUndo: Bool, canRedo: Bool) {
+        undoButton.setActionEnabled(canUndo)
+        redoButton.setActionEnabled(canRedo)
+    }
+
+    private func setup() {
+        wantsLayer = true
+
+        undoButton.translatesAutoresizingMaskIntoConstraints = false
+        redoButton.translatesAutoresizingMaskIntoConstraints = false
+
+        undoButton.onClick = { [weak self] in self?.undo() }
+        redoButton.onClick = { [weak self] in self?.redo() }
+
+        addSubview(undoButton)
+        addSubview(redoButton)
+
+        NSLayoutConstraint.activate([
+            undoButton.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 12),
+            undoButton.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -12),
+            undoButton.widthAnchor.constraint(equalToConstant: 32),
+            undoButton.heightAnchor.constraint(equalToConstant: 32),
+
+            redoButton.leadingAnchor.constraint(equalTo: undoButton.trailingAnchor, constant: 8),
+            redoButton.centerYAnchor.constraint(equalTo: undoButton.centerYAnchor),
+            redoButton.widthAnchor.constraint(equalToConstant: 32),
+            redoButton.heightAnchor.constraint(equalToConstant: 32),
+        ])
+    }
+
+    override func draw(_ dirtyRect: NSRect) {
+        NSColor.white.setFill()
+        bounds.fill()
+
+        let context = NSGraphicsContext.current?.cgContext
+        for stroke in strokes {
+            drawStroke(stroke, in: context)
+        }
+        if let currentStroke {
+            drawStroke(currentStroke, in: context)
+        }
+
+        for item in imageItems {
+            let rect = NSRect(origin: item.origin, size: item.size)
+            item.image.draw(in: rect, from: .zero, operation: .sourceOver, fraction: 1)
+        }
+    }
+
+    private func drawStroke(_ stroke: CanvasStroke, in context: CGContext?) {
+        guard stroke.points.count > 1, let context else { return }
+        context.saveGState()
+        context.setStrokeColor(stroke.color.cgColor)
+        context.setLineWidth(stroke.lineWidth)
+        context.setLineCap(.round)
+        context.setLineJoin(.round)
+        context.beginPath()
+        context.move(to: stroke.points[0])
+        for point in stroke.points.dropFirst() {
+            context.addLine(to: point)
+        }
+        context.strokePath()
+        context.restoreGState()
+    }
+
+    override func mouseDown(with event: NSEvent) {
+        let point = convert(event.locationInWindow, from: nil)
+
+        switch activeTool {
+        case .draw:
+            pushSnapshot()
+            currentStroke = CanvasStroke(points: [point], color: drawColor, lineWidth: drawLineWidth)
+            needsDisplay = true
+        case .text:
+            if let hitID = textField(at: point)?.identifier.flatMap({ UUID(uuidString: $0.rawValue) }) {
+                selectedTextID = hitID
+                window?.makeFirstResponder(textField(for: hitID))
+            } else {
+                addTextItem(at: point)
+            }
+        case .image:
+            break
+        }
+    }
+
+    override func mouseDragged(with event: NSEvent) {
+        guard activeTool == .draw, var stroke = currentStroke else { return }
+        let point = convert(event.locationInWindow, from: nil)
+        stroke.points.append(point)
+        currentStroke = stroke
+        needsDisplay = true
+    }
+
+    override func mouseUp(with event: NSEvent) {
+        guard activeTool == .draw, let stroke = currentStroke, stroke.points.count > 1 else {
+            currentStroke = nil
+            return
+        }
+        strokes.append(stroke)
+        currentStroke = nil
+        needsDisplay = true
+        notifyUndoState()
+    }
+
+    func addTextItem(at origin: NSPoint? = nil) {
+        pushSnapshot()
+        let placement = origin ?? NSPoint(x: 24, y: bounds.height - 48)
+        let item = CanvasTextData(
+            id: UUID(),
+            text: "Text",
+            origin: placement,
+            fontSize: 18,
+            color: .black,
+            alignment: .left
+        )
+        textItems.append(item)
+        installTextField(for: item)
+        selectedTextID = item.id
+        window?.makeFirstResponder(textField(for: item.id))
+        notifyUndoState()
+    }
+
+    func addImage(_ image: NSImage) {
+        pushSnapshot()
+        let maxSide: CGFloat = min(bounds.width, bounds.height) * 0.4
+        let imageSize = image.size
+        let scale = min(maxSide / max(imageSize.width, 1), maxSide / max(imageSize.height, 1))
+        let size = NSSize(width: imageSize.width * scale, height: imageSize.height * scale)
+        let origin = NSPoint(
+            x: (bounds.width - size.width) / 2,
+            y: (bounds.height - size.height) / 2
+        )
+        imageItems.append(CanvasImageData(id: UUID(), origin: origin, size: size, image: image))
+        needsDisplay = true
+        notifyUndoState()
+    }
+
+    func setSelectedTextAlignment(_ alignment: NSTextAlignment) {
+        guard let id = selectedTextID, let index = textItems.firstIndex(where: { $0.id == id }) else { return }
+        pushSnapshot()
+        textItems[index].alignment = alignment
+        if let field = textField(for: id) {
+            field.alignment = alignment
+        }
+        notifyUndoState()
+    }
+
+    func setSelectedTextFontSize(_ size: CGFloat) {
+        guard let id = selectedTextID, let index = textItems.firstIndex(where: { $0.id == id }) else { return }
+        pushSnapshot()
+        textItems[index].fontSize = size
+        if let field = textField(for: id) {
+            field.font = AppTheme.regularFont(size: size)
+        }
+        notifyUndoState()
+    }
+
+    func setSelectedTextColor(_ color: NSColor) {
+        guard let id = selectedTextID, let index = textItems.firstIndex(where: { $0.id == id }) else { return }
+        pushSnapshot()
+        textItems[index].color = color
+        if let field = textField(for: id) {
+            field.textColor = color
+        }
+        notifyUndoState()
+    }
+
+    func renderSnapshot() -> NSImage? {
+        syncTextFromFields()
+        guard let rep = bitmapImageRepForCachingDisplay(in: bounds) else { return nil }
+        cacheDisplay(in: bounds, to: rep)
+        let image = NSImage(size: bounds.size)
+        image.addRepresentation(rep)
+        return image
+    }
+
+    private func syncTextFromFields() {
+        for index in textItems.indices {
+            if let field = textField(for: textItems[index].id) {
+                textItems[index].text = field.stringValue
+                textItems[index].origin = field.frame.origin
+            }
+        }
+    }
+
+    private func pushSnapshot() {
+        syncTextFromFields()
+        undoStack.append(CanvasSnapshot(strokes: strokes, texts: textItems, images: imageItems))
+        redoStack.removeAll()
+        if undoStack.count > 50 { undoStack.removeFirst() }
+    }
+
+    private func undo() {
+        guard let snapshot = undoStack.popLast() else { return }
+        syncTextFromFields()
+        redoStack.append(CanvasSnapshot(strokes: strokes, texts: textItems, images: imageItems))
+        restore(snapshot)
+    }
+
+    private func redo() {
+        guard let snapshot = redoStack.popLast() else { return }
+        syncTextFromFields()
+        undoStack.append(CanvasSnapshot(strokes: strokes, texts: textItems, images: imageItems))
+        restore(snapshot)
+    }
+
+    private func restore(_ snapshot: CanvasSnapshot) {
+        strokes = snapshot.strokes
+        textItems = snapshot.texts
+        imageItems = snapshot.images
+        removeTextFields()
+        for item in textItems {
+            installTextField(for: item)
+        }
+        needsDisplay = true
+        notifyUndoState()
+    }
+
+    private func notifyUndoState() {
+        onUndoStateChanged?(!undoStack.isEmpty, !redoStack.isEmpty)
+        updateUndoButtons(canUndo: !undoStack.isEmpty, canRedo: !redoStack.isEmpty)
+    }
+
+    private func installTextField(for item: CanvasTextData) {
+        let field = NSTextField(string: item.text)
+        field.identifier = NSUserInterfaceItemIdentifier(item.id.uuidString)
+        field.isBordered = false
+        field.isBezeled = false
+        field.drawsBackground = false
+        field.font = AppTheme.regularFont(size: item.fontSize)
+        field.textColor = item.color
+        field.alignment = item.alignment
+        field.frame = NSRect(x: item.origin.x, y: item.origin.y, width: 200, height: 28)
+        field.target = self
+        field.action = #selector(textFieldEdited(_:))
+        addSubview(field)
+    }
+
+    @objc private func textFieldEdited(_ sender: NSTextField) {
+        guard let idString = sender.identifier?.rawValue,
+              let id = UUID(uuidString: idString),
+              let index = textItems.firstIndex(where: { $0.id == id }) else { return }
+        textItems[index].text = sender.stringValue
+        textItems[index].origin = sender.frame.origin
+    }
+
+    private func textField(for id: UUID) -> NSTextField? {
+        subviews.compactMap { $0 as? NSTextField }.first {
+            $0.identifier?.rawValue == id.uuidString
+        }
+    }
+
+    private func textField(at point: NSPoint) -> NSTextField? {
+        subviews.compactMap { $0 as? NSTextField }.first { $0.frame.contains(point) }
+    }
+
+    private func removeTextFields() {
+        subviews.compactMap { $0 as? NSTextField }.forEach { $0.removeFromSuperview() }
+    }
+}
+
+// MARK: - Tools Panel
+
+final class CanvasToolsPanel: NSView, AppearanceRefreshable {
+    var onToolChanged: ((CanvasTool) -> Void)?
+    var onAddText: (() -> Void)?
+    var onTextAlignment: ((NSTextAlignment) -> Void)?
+    var onTextFontSize: ((CGFloat) -> Void)?
+    var onTextColor: ((NSColor) -> Void)?
+    var onDrawColor: ((NSColor) -> Void)?
+    var onDrawLineWidth: ((CGFloat) -> Void)?
+    var onAddImage: (() -> Void)?
+
+    private var activeTool: CanvasTool = .draw
+    private let toolStack = NSStackView()
+    private let subToolbar = NSView()
+    private var toolButtons: [CanvasTool: CanvasToolButton] = [:]
+    private var subToolbarHeight: NSLayoutConstraint?
+    private var subToolbarWidth: NSLayoutConstraint?
+
+    private let drawColors: [NSColor] = [
+        NSColor(red: 0.13, green: 0.68, blue: 0.42, alpha: 1),
+        NSColor(red: 0.22, green: 0.47, blue: 0.96, alpha: 1),
+        NSColor.black,
+        NSColor.red,
+        NSColor.orange,
+        NSColor.purple,
+    ]
+
+    init() {
+        super.init(frame: .zero)
+        setup()
+        refreshAppearance()
+        selectTool(.draw)
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        layer?.backgroundColor = AppTheme.cardBackground.cgColor
+        layer?.borderColor = AppTheme.paywallBorder.cgColor
+        layer?.borderWidth = 1
+        subToolbar.layer?.backgroundColor = AppTheme.elevatedBackground.cgColor
+        subToolbar.layer?.borderColor = AppTheme.paywallBorder.cgColor
+        subToolbar.layer?.borderWidth = 1
+        toolButtons.values.forEach { $0.refreshAppearance() }
+        rebuildSubToolbar()
+    }
+
+    private func setup() {
+        wantsLayer = true
+        layer?.cornerRadius = 28
+
+        toolStack.orientation = .vertical
+        toolStack.spacing = 4
+        toolStack.translatesAutoresizingMaskIntoConstraints = false
+
+        subToolbar.wantsLayer = true
+        subToolbar.layer?.cornerRadius = 20
+        subToolbar.translatesAutoresizingMaskIntoConstraints = false
+
+        for tool in CanvasTool.allCases {
+            let button = CanvasToolButton(tool: tool)
+            button.onClick = { [weak self] in self?.selectTool(tool) }
+            toolButtons[tool] = button
+            toolStack.addArrangedSubview(button)
+        }
+
+        addSubview(subToolbar)
+        addSubview(toolStack)
+
+        subToolbarHeight = subToolbar.heightAnchor.constraint(equalToConstant: 44)
+        subToolbarWidth = subToolbar.widthAnchor.constraint(equalToConstant: 120)
+
+        NSLayoutConstraint.activate([
+            toolStack.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 6),
+            toolStack.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -6),
+            toolStack.topAnchor.constraint(equalTo: topAnchor, constant: 10),
+            toolStack.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -10),
+
+            subToolbar.trailingAnchor.constraint(equalTo: leadingAnchor, constant: -8),
+            subToolbar.centerYAnchor.constraint(equalTo: toolStack.arrangedSubviews.first?.centerYAnchor ?? centerYAnchor),
+            subToolbarHeight!,
+            subToolbarWidth!,
+        ])
+    }
+
+    private func selectTool(_ tool: CanvasTool) {
+        activeTool = tool
+        toolButtons.forEach { $0.value.setSelected($0.key == tool) }
+        onToolChanged?(tool)
+        rebuildSubToolbar()
+    }
+
+    private func rebuildSubToolbar() {
+        subToolbar.subviews.forEach { $0.removeFromSuperview() }
+
+        let stack = NSStackView()
+        stack.orientation = .horizontal
+        stack.spacing = 6
+        stack.translatesAutoresizingMaskIntoConstraints = false
+
+        switch activeTool {
+        case .text:
+            stack.addArrangedSubview(makeSubButton(symbol: "text.alignleft", action: { [weak self] in
+                self?.onTextAlignment?(.left)
+            }))
+            stack.addArrangedSubview(makeSubButton(symbol: "text.aligncenter", action: { [weak self] in
+                self?.onTextAlignment?(.center)
+            }))
+            stack.addArrangedSubview(makeSubButton(symbol: "text.alignright", action: { [weak self] in
+                self?.onTextAlignment?(.right)
+            }))
+            stack.addArrangedSubview(makeSubButton(symbol: "textformat.size", action: { [weak self] in
+                self?.onTextFontSize?(22)
+            }))
+            stack.addArrangedSubview(makeSubButton(symbol: "character.textbox", action: { [weak self] in
+                self?.onAddText?()
+            }))
+            stack.addArrangedSubview(makeColorButton(color: .black, action: { [weak self] in
+                self?.pickTextColor()
+            }))
+        case .image:
+            stack.addArrangedSubview(makeSubButton(symbol: "photo.on.rectangle.angled", action: { [weak self] in
+                self?.onAddImage?()
+            }))
+        case .draw:
+            for color in drawColors {
+                stack.addArrangedSubview(makeColorButton(color: color, action: { [weak self] in
+                    self?.onDrawColor?(color)
+                }))
+            }
+            stack.addArrangedSubview(makeSubButton(symbol: "lineweight", action: { [weak self] in
+                self?.onDrawLineWidth?(5)
+            }))
+        }
+
+        subToolbar.addSubview(stack)
+        NSLayoutConstraint.activate([
+            stack.leadingAnchor.constraint(equalTo: subToolbar.leadingAnchor, constant: 10),
+            stack.trailingAnchor.constraint(equalTo: subToolbar.trailingAnchor, constant: -10),
+            stack.topAnchor.constraint(equalTo: subToolbar.topAnchor, constant: 6),
+            stack.bottomAnchor.constraint(equalTo: subToolbar.bottomAnchor, constant: -6),
+        ])
+
+        let itemCount = max(stack.arrangedSubviews.count, 1)
+        subToolbarHeight?.constant = 44
+        let width = CGFloat(itemCount) * 38 + CGFloat(max(itemCount - 1, 0)) * 6 + 20
+        subToolbarWidth?.constant = width
+    }
+
+    private func makeSubButton(symbol: String, action: @escaping () -> Void) -> CanvasSubToolButton {
+        let button = CanvasSubToolButton(symbolName: symbol)
+        button.onClick = action
+        return button
+    }
+
+    private func makeColorButton(color: NSColor, action: @escaping () -> Void) -> CanvasColorButton {
+        let button = CanvasColorButton(color: color)
+        button.onClick = action
+        return button
+    }
+
+    private func pickTextColor() {
+        let panel = NSColorPanel.shared
+        panel.setTarget(self)
+        panel.setAction(#selector(textColorPanelChanged(_:)))
+        panel.orderFront(nil)
+    }
+
+    @objc private func textColorPanelChanged(_ sender: NSColorPanel) {
+        onTextColor?(sender.color)
+    }
+}
+
+// MARK: - Controls
+
+private final class DrawPrintToolbarButton: NSControl, AppearanceRefreshable {
+    var onClick: (() -> Void)?
+
+    private let symbolName: String
+    private let iconView = NSImageView()
+
+    init(symbolName: String, accessibilityLabel: String) {
+        self.symbolName = symbolName
+        super.init(frame: .zero)
+        toolTip = accessibilityLabel
+        wantsLayer = true
+        layer?.cornerRadius = 12
+
+        if let image = NSImage(systemSymbolName: symbolName, accessibilityDescription: accessibilityLabel) {
+            let config = NSImage.SymbolConfiguration(pointSize: 15, weight: .semibold)
+            iconView.image = image.withSymbolConfiguration(config)
+        }
+        iconView.translatesAutoresizingMaskIntoConstraints = false
+        addSubview(iconView)
+        NSLayoutConstraint.activate([
+            iconView.centerXAnchor.constraint(equalTo: centerXAnchor),
+            iconView.centerYAnchor.constraint(equalTo: centerYAnchor),
+        ])
+        refreshAppearance()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        layer?.backgroundColor = AppTheme.elevatedBackground.cgColor
+        layer?.borderColor = AppTheme.paywallBorder.cgColor
+        layer?.borderWidth = 1.5
+        iconView.contentTintColor = AppTheme.textPrimary
+    }
+
+    override func mouseUp(with event: NSEvent) {
+        guard bounds.contains(convert(event.locationInWindow, from: nil)) else { return }
+        onClick?()
+    }
+
+    override func resetCursorRects() {
+        addCursorRect(bounds, cursor: .pointingHand)
+    }
+}
+
+private final class DrawPrintPrintButton: NSControl, AppearanceRefreshable {
+    var onClick: (() -> Void)?
+
+    private let titleLabel = NSTextField(labelWithString: "Print Canvas")
+    private let iconView = NSImageView()
+    private var hoverTracker: HoverTracker?
+    private var isHovered = false
+
+    init() {
+        super.init(frame: .zero)
+        wantsLayer = true
+        layer?.cornerRadius = 22
+
+        titleLabel.font = AppTheme.semiboldFont(size: 16)
+        titleLabel.textColor = .white
+        titleLabel.translatesAutoresizingMaskIntoConstraints = false
+
+        if let image = NSImage(systemSymbolName: "printer.fill", accessibilityDescription: "Print") {
+            let config = NSImage.SymbolConfiguration(pointSize: 14, weight: .semibold)
+            iconView.image = image.withSymbolConfiguration(config)
+        }
+        iconView.contentTintColor = .white
+        iconView.translatesAutoresizingMaskIntoConstraints = false
+
+        addSubview(titleLabel)
+        addSubview(iconView)
+
+        NSLayoutConstraint.activate([
+            heightAnchor.constraint(equalToConstant: 52),
+            titleLabel.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 28),
+            titleLabel.centerYAnchor.constraint(equalTo: centerYAnchor),
+            iconView.leadingAnchor.constraint(equalTo: titleLabel.trailingAnchor, constant: 10),
+            iconView.centerYAnchor.constraint(equalTo: centerYAnchor),
+            iconView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -28),
+            iconView.widthAnchor.constraint(equalToConstant: 20),
+            iconView.heightAnchor.constraint(equalToConstant: 20),
+        ])
+
+        hoverTracker = HoverTracker(view: self) { [weak self] hovering in
+            self?.setHovered(hovering)
+        }
+        refreshAppearance()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        let color = isHovered
+            ? AppTheme.blue.blended(withFraction: 0.15, of: .black) ?? AppTheme.blue
+            : AppTheme.blue
+        layer?.backgroundColor = color.cgColor
+        titleLabel.textColor = .white
+        iconView.contentTintColor = .white
+    }
+
+    private func setHovered(_ hovering: Bool) {
+        isHovered = hovering
+        animateHover {
+            let color = hovering
+                ? AppTheme.blue.blended(withFraction: 0.15, of: .black) ?? AppTheme.blue
+                : AppTheme.blue
+            layer?.backgroundColor = color.cgColor
+            layer?.transform = hovering
+                ? CATransform3DMakeScale(1.03, 1.03, 1)
+                : CATransform3DIdentity
+        }
+    }
+
+    override func mouseUp(with event: NSEvent) {
+        guard bounds.contains(convert(event.locationInWindow, from: nil)) else { return }
+        onClick?()
+    }
+
+    override func resetCursorRects() {
+        addCursorRect(bounds, cursor: .pointingHand)
+    }
+}
+
+private final class CanvasHistoryButton: NSControl, AppearanceRefreshable {
+    var onClick: (() -> Void)?
+    private var actionEnabled = true {
+        didSet { alphaValue = actionEnabled ? 1 : 0.35 }
+    }
+
+    private let iconView = NSImageView()
+
+    init(symbolName: String, accessibilityLabel: String) {
+        super.init(frame: .zero)
+        toolTip = accessibilityLabel
+        wantsLayer = true
+        layer?.cornerRadius = 16
+
+        if let image = NSImage(systemSymbolName: symbolName, accessibilityDescription: accessibilityLabel) {
+            let config = NSImage.SymbolConfiguration(pointSize: 12, weight: .semibold)
+            iconView.image = image.withSymbolConfiguration(config)
+        }
+        iconView.translatesAutoresizingMaskIntoConstraints = false
+        addSubview(iconView)
+        NSLayoutConstraint.activate([
+            iconView.centerXAnchor.constraint(equalTo: centerXAnchor),
+            iconView.centerYAnchor.constraint(equalTo: centerYAnchor),
+        ])
+        refreshAppearance()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        layer?.backgroundColor = NSColor(calibratedWhite: 0.88, alpha: 1).cgColor
+        iconView.contentTintColor = NSColor(calibratedWhite: 0.35, alpha: 1)
+    }
+
+    func setActionEnabled(_ enabled: Bool) {
+        actionEnabled = enabled
+    }
+
+    override func mouseUp(with event: NSEvent) {
+        guard actionEnabled, bounds.contains(convert(event.locationInWindow, from: nil)) else { return }
+        onClick?()
+    }
+
+    override func resetCursorRects() {
+        addCursorRect(bounds, cursor: .pointingHand)
+    }
+}
+
+private final class CanvasToolButton: NSControl, AppearanceRefreshable {
+    var onClick: (() -> Void)?
+
+    private let tool: CanvasTool
+    private let iconView = NSImageView()
+    private var selected = false
+
+    init(tool: CanvasTool) {
+        self.tool = tool
+        super.init(frame: .zero)
+        wantsLayer = true
+        layer?.cornerRadius = 14
+
+        let symbol: String
+        switch tool {
+        case .text: symbol = "character.cursor.ibeam"
+        case .image: symbol = "photo.on.rectangle.angled"
+        case .draw: symbol = "paintbrush.pointed.fill"
+        }
+        if let image = NSImage(systemSymbolName: symbol, accessibilityDescription: toolLabel) {
+            let config = NSImage.SymbolConfiguration(pointSize: 16, weight: .medium)
+            iconView.image = image.withSymbolConfiguration(config)
+        }
+        iconView.translatesAutoresizingMaskIntoConstraints = false
+        addSubview(iconView)
+
+        NSLayoutConstraint.activate([
+            widthAnchor.constraint(equalToConstant: 44),
+            heightAnchor.constraint(equalToConstant: 44),
+            iconView.centerXAnchor.constraint(equalTo: centerXAnchor),
+            iconView.centerYAnchor.constraint(equalTo: centerYAnchor),
+        ])
+        refreshAppearance()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    private var toolLabel: String {
+        switch tool {
+        case .text: return "Text"
+        case .image: return "Image"
+        case .draw: return "Draw"
+        }
+    }
+
+    func setSelected(_ selected: Bool) {
+        self.selected = selected
+        refreshAppearance()
+    }
+
+    func refreshAppearance() {
+        layer?.backgroundColor = selected
+            ? AppTheme.homeActiveBackground.cgColor
+            : NSColor.clear.cgColor
+        iconView.contentTintColor = selected ? AppTheme.homeActiveForeground : AppTheme.textPrimary
+    }
+
+    override func mouseUp(with event: NSEvent) {
+        guard bounds.contains(convert(event.locationInWindow, from: nil)) else { return }
+        onClick?()
+    }
+
+    override func resetCursorRects() {
+        addCursorRect(bounds, cursor: .pointingHand)
+    }
+}
+
+private final class CanvasSubToolButton: NSControl, AppearanceRefreshable {
+    var onClick: (() -> Void)?
+
+    private let iconView = NSImageView()
+
+    init(symbolName: String) {
+        super.init(frame: .zero)
+        wantsLayer = true
+        layer?.cornerRadius = 16
+
+        if let image = NSImage(systemSymbolName: symbolName, accessibilityDescription: nil) {
+            let config = NSImage.SymbolConfiguration(pointSize: 13, weight: .medium)
+            iconView.image = image.withSymbolConfiguration(config)
+        }
+        iconView.translatesAutoresizingMaskIntoConstraints = false
+        addSubview(iconView)
+
+        NSLayoutConstraint.activate([
+            widthAnchor.constraint(equalToConstant: 32),
+            heightAnchor.constraint(equalToConstant: 32),
+            iconView.centerXAnchor.constraint(equalTo: centerXAnchor),
+            iconView.centerYAnchor.constraint(equalTo: centerYAnchor),
+        ])
+        refreshAppearance()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        layer?.backgroundColor = AppTheme.elevatedBackground.cgColor
+        layer?.borderColor = AppTheme.paywallBorder.cgColor
+        layer?.borderWidth = 1
+        iconView.contentTintColor = AppTheme.textPrimary
+    }
+
+    override func mouseUp(with event: NSEvent) {
+        guard bounds.contains(convert(event.locationInWindow, from: nil)) else { return }
+        onClick?()
+    }
+
+    override func resetCursorRects() {
+        addCursorRect(bounds, cursor: .pointingHand)
+    }
+}
+
+private final class CanvasColorButton: NSControl, AppearanceRefreshable {
+    var onClick: (() -> Void)?
+
+    private let swatchColor: NSColor
+
+    init(color: NSColor) {
+        self.swatchColor = color
+        super.init(frame: .zero)
+        wantsLayer = true
+        layer?.cornerRadius = 14
+        layer?.borderWidth = 2
+        layer?.borderColor = AppTheme.paywallBorder.cgColor
+
+        NSLayoutConstraint.activate([
+            widthAnchor.constraint(equalToConstant: 28),
+            heightAnchor.constraint(equalToConstant: 28),
+        ])
+        refreshAppearance()
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) { nil }
+
+    func refreshAppearance() {
+        layer?.backgroundColor = swatchColor.cgColor
+    }
+
+    override func mouseUp(with event: NSEvent) {
+        guard bounds.contains(convert(event.locationInWindow, from: nil)) else { return }
+        onClick?()
+    }
+
+    override func resetCursorRects() {
+        addCursorRect(bounds, cursor: .pointingHand)
+    }
+}

+ 17 - 0
smart_printer/PrintService.swift

@@ -16,6 +16,14 @@ enum PrintService {
         printPDF(document, title: "Print Contacts", from: window ?? NSApp.keyWindow)
     }
 
+    static func printCanvas(_ image: NSImage, from window: NSWindow? = nil) {
+        guard image.size.width > 0, image.size.height > 0 else {
+            showEmptyCanvasAlert()
+            return
+        }
+        printImage(image, title: "Blank Canvas", from: window)
+    }
+
     static func printText(_ text: String, title: String = "Print Text", from window: NSWindow? = nil) {
         let trimmed = text.trimmingCharacters(in: .whitespacesAndNewlines)
         guard !trimmed.isEmpty else {
@@ -282,6 +290,15 @@ enum PrintService {
         alert.runModal()
     }
 
+    static func showEmptyCanvasAlert() {
+        let alert = NSAlert()
+        alert.messageText = "Nothing to Print"
+        alert.informativeText = "Add a drawing, text, or image to the canvas before printing."
+        alert.alertStyle = .informational
+        alert.addButton(withTitle: "OK")
+        alert.runModal()
+    }
+
     private static func showEmptyTextAlert() {
         let alert = NSAlert()
         alert.messageText = "No Text to Print"

+ 22 - 0
smart_printer/ViewController.swift

@@ -19,6 +19,7 @@ class ViewController: NSViewController {
     private var filePreviewOverlay: FilePreviewOverlayView?
     private var printTextOverlay: PrintTextOverlayView?
     private var printContactsOverlay: PrintContactsOverlayView?
+    private var drawPrintOverlay: DrawPrintOverlayView?
 
     private var headerView: NSView!
     private var contentTopBelowHeader: NSLayoutConstraint!
@@ -84,12 +85,14 @@ class ViewController: NSViewController {
         filePreviewOverlay?.refreshAppearance()
         printTextOverlay?.refreshAppearance()
         printContactsOverlay?.refreshAppearance()
+        drawPrintOverlay?.refreshAppearance()
     }
 
     func presentPrintText() {
         photoPreviewOverlay?.dismiss(animated: false)
         filePreviewOverlay?.dismiss(animated: false)
         printContactsOverlay?.dismiss(animated: false)
+        drawPrintOverlay?.dismiss(animated: false)
 
         let overlay = PrintTextOverlayView()
         overlay.onDismiss = { [weak self] in
@@ -103,6 +106,7 @@ class ViewController: NSViewController {
         photoPreviewOverlay?.dismiss(animated: false)
         filePreviewOverlay?.dismiss(animated: false)
         printTextOverlay?.dismiss(animated: false)
+        drawPrintOverlay?.dismiss(animated: false)
 
         let overlay = PrintContactsOverlayView()
         overlay.onDismiss = { [weak self] in
@@ -112,6 +116,20 @@ class ViewController: NSViewController {
         overlay.present(in: mainContentView)
     }
 
+    func presentDrawPrint() {
+        photoPreviewOverlay?.dismiss(animated: false)
+        filePreviewOverlay?.dismiss(animated: false)
+        printTextOverlay?.dismiss(animated: false)
+        printContactsOverlay?.dismiss(animated: false)
+
+        let overlay = DrawPrintOverlayView()
+        overlay.onDismiss = { [weak self] in
+            self?.drawPrintOverlay = nil
+        }
+        drawPrintOverlay = overlay
+        overlay.present(in: mainContentView)
+    }
+
     func presentPhotoPreview(urls: [URL]) {
         photoPreviewOverlay?.dismiss(animated: false)
         filePreviewOverlay?.dismiss(animated: false)
@@ -610,6 +628,10 @@ class ViewController: NSViewController {
                 updated.onActivate = { [weak self] in
                     PrintContactsService.present(from: self?.view.window)
                 }
+            } else if card.iconKind == .drawPrint {
+                updated.onActivate = { [weak self] in
+                    DrawPrintService.present(from: self?.view.window)
+                }
             }
             return updated
         }