markupr 2.1.8

package/scripts/generate-installer-images.cjs

@@ -0,0 +1,253 @@
+#!/usr/bin/env node
+/**
+ * Generate Windows NSIS Installer Images
+ *
+ * Creates PNG versions that electron-builder will handle:
+ * - installer-header.png (150x57) - Top banner in installer
+ * - installer-sidebar.png (164x314) - Left sidebar wizard image
+ *
+ * Note: electron-builder accepts PNG and converts to BMP automatically for NSIS
+ */
+
+const sharp = require('sharp');
+const path = require('path');
+const fs = require('fs');
+
+const BUILD_DIR = path.join(__dirname, '../build');
+
+// markupr brand colors
+const COLORS = {
+  primary: '#6366f1',      // Indigo
+  secondary: '#8b5cf6',    // Purple
+  background: '#1e1e2e',   // Dark slate
+  text: '#ffffff',         // White
+  accent: '#22d3ee'        // Cyan accent
+};
+
+/**
+ * Create installer header image (150x57)
+ * This appears at the top of the installer wizard
+ */
+async function createInstallerHeader() {
+  const width = 150;
+  const height = 57;
+
+  // Create a gradient header with markupr branding
+  const svg = `
+    <svg width="${width}" height="${height}" xmlns="http://www.w3.org/2000/svg">
+      <defs>
+        <linearGradient id="headerGrad" x1="0%" y1="0%" x2="100%" y2="100%">
+          <stop offset="0%" style="stop-color:${COLORS.primary};stop-opacity:1" />
+          <stop offset="100%" style="stop-color:${COLORS.secondary};stop-opacity:1" />
+        </linearGradient>
+      </defs>
+      <rect width="${width}" height="${height}" fill="url(#headerGrad)"/>
+      <text x="10" y="35" font-family="Segoe UI, Arial, sans-serif" font-size="16" font-weight="600" fill="${COLORS.text}">
+        markupr
+      </text>
+    </svg>
+  `;
+
+  // Create PNG version (electron-builder handles conversion)
+  const pngPath = path.join(BUILD_DIR, 'installer-header.png');
+  await sharp(Buffer.from(svg))
+    .resize(width, height)
+    .png()
+    .toFile(pngPath);
+  console.log(`Created: ${pngPath}`);
+
+  // Also create BMP using raw pixel conversion
+  const bmpPath = path.join(BUILD_DIR, 'installer-header.bmp');
+  await createBmpFromSvg(svg, width, height, bmpPath);
+  console.log(`Created: ${bmpPath}`);
+}
+
+/**
+ * Create installer sidebar image (164x314)
+ * This appears on the left side of the wizard-style installer
+ */
+async function createInstallerSidebar() {
+  const width = 164;
+  const height = 314;
+
+  // Create a branded sidebar with gradient and logo area
+  const svg = `
+    <svg width="${width}" height="${height}" xmlns="http://www.w3.org/2000/svg">
+      <defs>
+        <linearGradient id="sidebarGrad" x1="0%" y1="0%" x2="0%" y2="100%">
+          <stop offset="0%" style="stop-color:${COLORS.primary};stop-opacity:1" />
+          <stop offset="50%" style="stop-color:${COLORS.secondary};stop-opacity:1" />
+          <stop offset="100%" style="stop-color:${COLORS.background};stop-opacity:1" />
+        </linearGradient>
+      </defs>
+      <rect width="${width}" height="${height}" fill="url(#sidebarGrad)"/>
+
+      <!-- Logo circle -->
+      <circle cx="82" cy="80" r="40" fill="${COLORS.text}" fill-opacity="0.15"/>
+      <circle cx="82" cy="80" r="35" fill="${COLORS.text}" fill-opacity="0.1"/>
+
+      <!-- F letter for markupr -->
+      <text x="82" y="95" font-family="Segoe UI, Arial, sans-serif" font-size="40" font-weight="700" fill="${COLORS.text}" text-anchor="middle">
+        F
+      </text>
+
+      <!-- App name -->
+      <text x="82" y="150" font-family="Segoe UI, Arial, sans-serif" font-size="14" font-weight="600" fill="${COLORS.text}" text-anchor="middle">
+        markupr
+      </text>
+
+      <!-- Tagline -->
+      <text x="82" y="170" font-family="Segoe UI, Arial, sans-serif" font-size="9" fill="${COLORS.text}" fill-opacity="0.8" text-anchor="middle">
+        AI-Ready Feedback
+      </text>
+      <text x="82" y="185" font-family="Segoe UI, Arial, sans-serif" font-size="9" fill="${COLORS.text}" fill-opacity="0.8" text-anchor="middle">
+        Capture Tool
+      </text>
+
+      <!-- Decorative elements -->
+      <circle cx="30" cy="250" r="20" fill="${COLORS.accent}" fill-opacity="0.2"/>
+      <circle cx="130" cy="280" r="15" fill="${COLORS.primary}" fill-opacity="0.3"/>
+      <circle cx="50" cy="290" r="10" fill="${COLORS.secondary}" fill-opacity="0.2"/>
+
+      <!-- Version hint at bottom -->
+      <text x="82" y="300" font-family="Segoe UI, Arial, sans-serif" font-size="8" fill="${COLORS.text}" fill-opacity="0.5" text-anchor="middle">
+        Setup Wizard
+      </text>
+    </svg>
+  `;
+
+  // Create PNG version
+  const pngPath = path.join(BUILD_DIR, 'installer-sidebar.png');
+  await sharp(Buffer.from(svg))
+    .resize(width, height)
+    .png()
+    .toFile(pngPath);
+  console.log(`Created: ${pngPath}`);
+
+  // Also create BMP
+  const bmpPath = path.join(BUILD_DIR, 'installer-sidebar.bmp');
+  await createBmpFromSvg(svg, width, height, bmpPath);
+  console.log(`Created: ${bmpPath}`);
+}
+
+/**
+ * Create a BMP file from SVG using raw pixel data
+ * BMP format: 24-bit uncompressed
+ */
+async function createBmpFromSvg(svg, width, height, outputPath) {
+  // Get raw RGBA pixel data
+  const { data, info } = await sharp(Buffer.from(svg))
+    .resize(width, height)
+    .raw()
+    .toBuffer({ resolveWithObject: true });
+
+  // BMP is stored bottom-to-top, BGR format
+  const rowSize = Math.ceil((width * 3) / 4) * 4; // Rows padded to 4-byte boundary
+  const pixelDataSize = rowSize * height;
+  const fileSize = 54 + pixelDataSize; // 54 byte header + pixel data
+
+  const bmp = Buffer.alloc(fileSize);
+
+  // BMP File Header (14 bytes)
+  bmp.write('BM', 0);                          // Signature
+  bmp.writeUInt32LE(fileSize, 2);              // File size
+  bmp.writeUInt32LE(0, 6);                     // Reserved
+  bmp.writeUInt32LE(54, 10);                   // Pixel data offset
+
+  // DIB Header (40 bytes - BITMAPINFOHEADER)
+  bmp.writeUInt32LE(40, 14);                   // DIB header size
+  bmp.writeInt32LE(width, 18);                 // Width
+  bmp.writeInt32LE(height, 22);                // Height (positive = bottom-up)
+  bmp.writeUInt16LE(1, 26);                    // Color planes
+  bmp.writeUInt16LE(24, 28);                   // Bits per pixel
+  bmp.writeUInt32LE(0, 30);                    // Compression (0 = none)
+  bmp.writeUInt32LE(pixelDataSize, 34);        // Image size
+  bmp.writeInt32LE(2835, 38);                  // X pixels per meter (~72 DPI)
+  bmp.writeInt32LE(2835, 42);                  // Y pixels per meter
+  bmp.writeUInt32LE(0, 46);                    // Colors in color table
+  bmp.writeUInt32LE(0, 50);                    // Important colors
+
+  // Pixel data (bottom-to-top, BGR)
+  const channels = info.channels; // Should be 3 (RGB) or 4 (RGBA)
+
+  for (let y = height - 1; y >= 0; y--) {
+    const bmpRow = (height - 1 - y) * rowSize + 54;
+    for (let x = 0; x < width; x++) {
+      const srcOffset = (y * width + x) * channels;
+      const dstOffset = bmpRow + x * 3;
+
+      // Convert RGB(A) to BGR
+      bmp[dstOffset] = data[srcOffset + 2];     // Blue
+      bmp[dstOffset + 1] = data[srcOffset + 1]; // Green
+      bmp[dstOffset + 2] = data[srcOffset];     // Red
+    }
+  }
+
+  fs.writeFileSync(outputPath, bmp);
+}
+
+/**
+ * Create Windows icon (ICO format placeholder)
+ */
+async function createWindowsIcon() {
+  const outputPath = path.join(BUILD_DIR, 'icon.ico');
+
+  // Check if icon already exists
+  if (fs.existsSync(outputPath)) {
+    console.log(`Icon already exists: ${outputPath}`);
+    return;
+  }
+
+  // Create a placeholder icon PNG
+  const svg = `
+    <svg width="256" height="256" xmlns="http://www.w3.org/2000/svg">
+      <defs>
+        <linearGradient id="iconGrad" x1="0%" y1="0%" x2="100%" y2="100%">
+          <stop offset="0%" style="stop-color:${COLORS.primary};stop-opacity:1" />
+          <stop offset="100%" style="stop-color:${COLORS.secondary};stop-opacity:1" />
+        </linearGradient>
+      </defs>
+      <rect width="256" height="256" rx="40" fill="url(#iconGrad)"/>
+      <text x="128" y="165" font-family="Arial, sans-serif" font-size="120" font-weight="700" fill="${COLORS.text}" text-anchor="middle">
+        F
+      </text>
+    </svg>
+  `;
+
+  // Create PNG at multiple sizes for ICO conversion
+  const sizes = [16, 32, 48, 64, 128, 256];
+  for (const size of sizes) {
+    const pngPath = path.join(BUILD_DIR, `icon-${size}.png`);
+    await sharp(Buffer.from(svg))
+      .resize(size, size)
+      .png()
+      .toFile(pngPath);
+    console.log(`Created: ${pngPath}`);
+  }
+
+  console.log('\nNote: To create icon.ico, run:');
+  console.log('  npx electron-icon-builder --input=build/icon-256.png --output=build');
+  console.log('  or use an online converter with the PNG files');
+}
+
+async function main() {
+  console.log('Generating Windows installer images...\n');
+
+  // Ensure build directory exists
+  if (!fs.existsSync(BUILD_DIR)) {
+    fs.mkdirSync(BUILD_DIR, { recursive: true });
+  }
+
+  try {
+    await createInstallerHeader();
+    await createInstallerSidebar();
+    await createWindowsIcon();
+
+    console.log('\nDone! Windows installer images created in build/');
+  } catch (error) {
+    console.error('Error generating images:', error);
+    process.exit(1);
+  }
+}
+
+main();

package/scripts/generate-tray-icons.mjs

@@ -0,0 +1,258 @@
+/**
+ * Generate tray icons for all states and sizes
+ *
+ * Generates 40 PNGs: 5 states x 2 sizes (16x16, 32x32) x 2 variants (normal, Template)
+ * Plus 4 animation frames for processing state (16 additional PNGs)
+ *
+ * States:
+ * - idle: gray outline circle (microphone shape)
+ * - recording: red filled circle with pulse animation support
+ * - processing: dashed circle with rotation frames
+ * - complete: green circle with checkmark
+ * - error: orange warning triangle
+ *
+ * Requires: sharp (already in dependencies)
+ * Usage: node scripts/generate-tray-icons.mjs
+ */
+
+import sharp from 'sharp';
+import { mkdir, writeFile } from 'fs/promises';
+import { join, dirname } from 'path';
+import { fileURLToPath } from 'url';
+import { existsSync } from 'fs';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const ASSETS_DIR = join(__dirname, '../assets');
+
+// Icon dimensions
+const SIZES = [
+  { suffix: '', size: 16 },
+  { suffix: '@2x', size: 32 },
+];
+
+// Colors from design spec
+const COLORS = {
+  gray: '#6B7280',
+  red: '#EF4444',
+  green: '#10B981',
+  orange: '#F59E0B',
+  white: '#FFFFFF',
+  black: '#000000',
+};
+
+/**
+ * Generate SVG for idle state (microphone/circle outline)
+ */
+function generateIdleSvg(size, isTemplate = false) {
+  const color = isTemplate ? COLORS.black : COLORS.gray;
+  return `
+    <svg width="${size}" height="${size}" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+      <circle cx="8" cy="8" r="6" fill="none" stroke="${color}" stroke-width="1.5"/>
+    </svg>
+  `.trim();
+}
+
+/**
+ * Generate SVG for recording state (filled red circle)
+ */
+function generateRecordingSvg(size, isTemplate = false) {
+  const color = isTemplate ? COLORS.black : COLORS.red;
+  return `
+    <svg width="${size}" height="${size}" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+      <circle cx="8" cy="8" r="5" fill="${color}"/>
+    </svg>
+  `.trim();
+}
+
+/**
+ * Generate SVG for processing state with rotation
+ * @param {number} size - Icon size
+ * @param {number} rotation - Rotation angle in degrees (0, 90, 180, 270)
+ * @param {boolean} isTemplate - Whether this is a template image for macOS
+ */
+function generateProcessingSvg(size, rotation = 0, isTemplate = false) {
+  const color = isTemplate ? COLORS.black : COLORS.gray;
+  return `
+    <svg width="${size}" height="${size}" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+      <g transform="rotate(${rotation} 8 8)">
+        <circle cx="8" cy="8" r="6" fill="none" stroke="${color}" stroke-width="1.5"
+                stroke-dasharray="4 3" stroke-linecap="round"/>
+      </g>
+    </svg>
+  `.trim();
+}
+
+/**
+ * Generate SVG for complete state (green checkmark in circle)
+ */
+function generateCompleteSvg(size, isTemplate = false) {
+  const bgColor = isTemplate ? COLORS.black : COLORS.green;
+  return `
+    <svg width="${size}" height="${size}" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+      <circle cx="8" cy="8" r="6" fill="${bgColor}"/>
+      <path d="M5 8l2 2 4-4" stroke="${COLORS.white}" stroke-width="1.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
+    </svg>
+  `.trim();
+}
+
+/**
+ * Generate SVG for error state (warning triangle)
+ */
+function generateErrorSvg(size, isTemplate = false) {
+  const color = isTemplate ? COLORS.black : COLORS.orange;
+  return `
+    <svg width="${size}" height="${size}" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+      <path d="M8 2L14 13H2L8 2Z" fill="${color}"/>
+      <text x="8" y="11" text-anchor="middle" fill="${COLORS.white}" font-size="8" font-weight="bold" font-family="system-ui, sans-serif">!</text>
+    </svg>
+  `.trim();
+}
+
+/**
+ * Convert SVG to PNG using sharp
+ */
+async function svgToPng(svg, outputPath, targetSize) {
+  // Parse the SVG to get its viewBox dimensions
+  const viewBoxMatch = svg.match(/viewBox="0 0 (\d+) (\d+)"/);
+  const svgSize = viewBoxMatch ? parseInt(viewBoxMatch[1]) : 16;
+
+  // Create the PNG at the target size
+  await sharp(Buffer.from(svg))
+    .resize(targetSize, targetSize)
+    .png()
+    .toFile(outputPath);
+}
+
+/**
+ * Generate all icon files
+ */
+async function generateIcons() {
+  // Ensure assets directory exists
+  if (!existsSync(ASSETS_DIR)) {
+    await mkdir(ASSETS_DIR, { recursive: true });
+    console.log(`Created assets directory: ${ASSETS_DIR}`);
+  }
+
+  const generated = [];
+  const errors = [];
+
+  // State definitions
+  const states = [
+    { name: 'idle', generator: generateIdleSvg },
+    { name: 'recording', generator: generateRecordingSvg },
+    { name: 'complete', generator: generateCompleteSvg },
+    { name: 'error', generator: generateErrorSvg },
+  ];
+
+  // Generate static state icons
+  for (const state of states) {
+    for (const { suffix, size } of SIZES) {
+      // Normal colored version
+      const normalFilename = `tray-${state.name}${suffix}.png`;
+      const normalPath = join(ASSETS_DIR, normalFilename);
+      try {
+        const svg = state.generator(size, false);
+        await svgToPng(svg, normalPath, size);
+        generated.push(normalFilename);
+      } catch (err) {
+        errors.push({ file: normalFilename, error: err.message });
+      }
+
+      // Template version for macOS (auto dark/light mode)
+      const templateFilename = `tray-${state.name}Template${suffix}.png`;
+      const templatePath = join(ASSETS_DIR, templateFilename);
+      try {
+        const svg = state.generator(size, true);
+        await svgToPng(svg, templatePath, size);
+        generated.push(templateFilename);
+      } catch (err) {
+        errors.push({ file: templateFilename, error: err.message });
+      }
+    }
+  }
+
+  // Generate processing animation frames (4 frames at 0, 90, 180, 270 degrees)
+  const processingFrames = [0, 1, 2, 3];
+  const rotations = [0, 90, 180, 270];
+
+  for (let i = 0; i < processingFrames.length; i++) {
+    const frame = processingFrames[i];
+    const rotation = rotations[i];
+
+    for (const { suffix, size } of SIZES) {
+      // Normal colored version
+      const normalFilename = `tray-processing-${frame}${suffix}.png`;
+      const normalPath = join(ASSETS_DIR, normalFilename);
+      try {
+        const svg = generateProcessingSvg(size, rotation, false);
+        await svgToPng(svg, normalPath, size);
+        generated.push(normalFilename);
+      } catch (err) {
+        errors.push({ file: normalFilename, error: err.message });
+      }
+
+      // Template version for macOS
+      const templateFilename = `tray-processing-${frame}Template${suffix}.png`;
+      const templatePath = join(ASSETS_DIR, templateFilename);
+      try {
+        const svg = generateProcessingSvg(size, rotation, true);
+        await svgToPng(svg, templatePath, size);
+        generated.push(templateFilename);
+      } catch (err) {
+        errors.push({ file: templateFilename, error: err.message });
+      }
+    }
+  }
+
+  // Also generate a static processing icon (for fallback)
+  for (const { suffix, size } of SIZES) {
+    const normalFilename = `tray-processing${suffix}.png`;
+    const normalPath = join(ASSETS_DIR, normalFilename);
+    try {
+      const svg = generateProcessingSvg(size, 0, false);
+      await svgToPng(svg, normalPath, size);
+      generated.push(normalFilename);
+    } catch (err) {
+      errors.push({ file: normalFilename, error: err.message });
+    }
+
+    const templateFilename = `tray-processingTemplate${suffix}.png`;
+    const templatePath = join(ASSETS_DIR, templateFilename);
+    try {
+      const svg = generateProcessingSvg(size, 0, true);
+      await svgToPng(svg, templatePath, size);
+      generated.push(templateFilename);
+    } catch (err) {
+      errors.push({ file: templateFilename, error: err.message });
+    }
+  }
+
+  // Summary
+  console.log('\n=== Tray Icon Generation Complete ===\n');
+  console.log(`Generated: ${generated.length} icons`);
+
+  if (generated.length > 0) {
+    console.log('\nGenerated files:');
+    generated.forEach((f) => console.log(`  - ${f}`));
+  }
+
+  if (errors.length > 0) {
+    console.log('\nErrors:');
+    errors.forEach(({ file, error }) => console.log(`  - ${file}: ${error}`));
+  }
+
+  console.log('\nIcon states:');
+  console.log('  - idle: Gray circle outline (ready to record)');
+  console.log('  - recording: Red filled circle');
+  console.log('  - processing: Gray dashed circle (4 rotation frames)');
+  console.log('  - complete: Green circle with checkmark');
+  console.log('  - error: Orange warning triangle');
+
+  return { generated, errors };
+}
+
+// Run the generator
+generateIcons().catch((err) => {
+  console.error('Failed to generate icons:', err);
+  process.exit(1);
+});

package/scripts/notarize.cjs

@@ -0,0 +1,180 @@
+/**
+ * notarize.js
+ *
+ * Apple Notarization script for markupr
+ * This script runs automatically after code signing via electron-builder
+ *
+ * Handles notarization for:
+ *   - .app bundles (main application)
+ *   - .dmg files (disk image installers)
+ *   - .zip files (compressed archives)
+ *
+ * Required Environment Variables:
+ *   APPLE_ID                    - Your Apple ID email
+ *   APPLE_APP_SPECIFIC_PASSWORD - App-specific password from appleid.apple.com
+ *   APPLE_TEAM_ID               - Your Apple Developer Team ID
+ *
+ * @see https://developer.apple.com/documentation/security/notarizing_macos_software_before_distribution
+ */
+
+const { notarize } = require('@electron/notarize');
+const path = require('path');
+const fs = require('fs');
+
+// Logging utilities
+const log = {
+  info: (msg) => console.log(`[notarize] INFO: ${msg}`),
+  progress: (msg) => console.log(`[notarize] >>> ${msg}`),
+  success: (msg) => console.log(`[notarize] SUCCESS: ${msg}`),
+  warn: (msg) => console.warn(`[notarize] WARN: ${msg}`),
+  error: (msg) => console.error(`[notarize] ERROR: ${msg}`),
+  divider: () => console.log('='.repeat(60)),
+};
+
+/**
+ * Format duration in human-readable form
+ */
+function formatDuration(ms) {
+  const seconds = Math.floor(ms / 1000);
+  const minutes = Math.floor(seconds / 60);
+  const remainingSeconds = seconds % 60;
+
+  if (minutes > 0) {
+    return `${minutes}m ${remainingSeconds}s`;
+  }
+  return `${seconds}s`;
+}
+
+/**
+ * Check if required environment variables are set
+ */
+function checkCredentials() {
+  const required = ['APPLE_ID', 'APPLE_APP_SPECIFIC_PASSWORD', 'APPLE_TEAM_ID'];
+  const missing = required.filter(key => !process.env[key]);
+
+  if (missing.length > 0) {
+    return {
+      valid: false,
+      missing,
+    };
+  }
+
+  return { valid: true, missing: [] };
+}
+
+/**
+ * Notarize a single artifact
+ */
+async function notarizeArtifact(artifactPath, appBundleId) {
+  log.progress(`Notarizing: ${path.basename(artifactPath)}`);
+  log.info(`Full path: ${artifactPath}`);
+
+  const startTime = Date.now();
+
+  try {
+    await notarize({
+      appBundleId,
+      appPath: artifactPath,
+      appleId: process.env.APPLE_ID,
+      appleIdPassword: process.env.APPLE_APP_SPECIFIC_PASSWORD,
+      teamId: process.env.APPLE_TEAM_ID,
+    });
+
+    const duration = formatDuration(Date.now() - startTime);
+    log.success(`Notarized ${path.basename(artifactPath)} in ${duration}`);
+    return true;
+  } catch (error) {
+    log.error(`Failed to notarize ${path.basename(artifactPath)}`);
+    log.error(error.message);
+    return false;
+  }
+}
+
+/**
+ * Main notarization function called by electron-builder afterSign hook
+ */
+exports.default = async function notarizing(context) {
+  const { electronPlatformName, appOutDir } = context;
+  const appBundleId = 'com.eddiesanjuan.markupr';
+
+  log.divider();
+  log.info('markupr Notarization');
+  log.divider();
+
+  // Only notarize on macOS
+  if (electronPlatformName !== 'darwin') {
+    log.info('Skipping: not macOS platform');
+    return;
+  }
+
+  // Check credentials
+  const credentials = checkCredentials();
+  if (!credentials.valid) {
+    log.warn('Skipping: missing credentials');
+    log.info(`Missing: ${credentials.missing.join(', ')}`);
+    log.info('');
+    log.info('To enable notarization, set these environment variables:');
+    log.info('  export APPLE_ID="your@email.com"');
+    log.info('  export APPLE_APP_SPECIFIC_PASSWORD="xxxx-xxxx-xxxx-xxxx"');
+    log.info('  export APPLE_TEAM_ID="XXXXXXXXXX"');
+    log.info('');
+    log.info('Get an app-specific password at: https://appleid.apple.com/account/manage');
+    return;
+  }
+
+  log.info(`Team ID: ${process.env.APPLE_TEAM_ID}`);
+  log.info(`Apple ID: ${process.env.APPLE_ID.replace(/(.{3}).*(@.*)/, '$1***$2')}`);
+  log.info('');
+
+  const appName = context.packager.appInfo.productFilename;
+  const appPath = path.join(appOutDir, `${appName}.app`);
+
+  // Verify app exists
+  if (!fs.existsSync(appPath)) {
+    log.error(`App bundle not found: ${appPath}`);
+    throw new Error(`App bundle not found: ${appPath}`);
+  }
+
+  const totalStartTime = Date.now();
+  const results = [];
+
+  // Step 1: Notarize the .app bundle
+  log.divider();
+  log.progress('Step 1/1: Notarizing app bundle');
+  log.divider();
+
+  const appResult = await notarizeArtifact(appPath, appBundleId);
+  results.push({ artifact: '.app bundle', success: appResult });
+
+  // Summary
+  log.divider();
+  log.info('Notarization Summary');
+  log.divider();
+
+  const successful = results.filter(r => r.success).length;
+  const failed = results.filter(r => !r.success).length;
+
+  results.forEach(({ artifact, success }) => {
+    const status = success ? 'OK' : 'FAILED';
+    console.log(`  [${status}] ${artifact}`);
+  });
+
+  log.info('');
+  log.info(`Total: ${successful} succeeded, ${failed} failed`);
+  log.info(`Duration: ${formatDuration(Date.now() - totalStartTime)}`);
+  log.divider();
+
+  if (failed > 0) {
+    log.error('Some artifacts failed notarization');
+    log.info('');
+    log.info('Troubleshooting tips:');
+    log.info('  1. Verify your Apple ID is enrolled in the Developer Program');
+    log.info('  2. Generate a new app-specific password at https://appleid.apple.com');
+    log.info('  3. Ensure your Team ID matches your Developer account');
+    log.info('  4. Check that code signing succeeded before notarization');
+    log.info('  5. Run `xcrun notarytool history` to see submission status');
+    throw new Error('Notarization failed');
+  }
+
+  log.success('All notarization complete!');
+};