@elevasis/core 0.1.0

package/src/business/pdf/browser/image-utils.ts

@@ -0,0 +1,74 @@
+/* eslint-disable no-undef */
+/**
+ * Image Utilities for PDF Generation
+ *
+ * Converts image URLs to base64 data URLs for use with pdfmake.
+ * pdfmake requires images in base64 format for client-side PDF generation.
+ *
+ * @see https://pdfmake.github.io/docs/0.1/document-definition-object/images/
+ */
+
+/**
+ * Convert an image URL to a base64 data URL
+ *
+ * Uses canvas to convert the image, which handles CORS properly
+ * for same-origin images.
+ *
+ * @param url - Image URL (relative or absolute)
+ * @returns Promise resolving to base64 data URL
+ */
+export async function imageUrlToBase64(url: string): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const img = new Image()
+    img.crossOrigin = 'anonymous'
+
+    img.onload = () => {
+      const canvas = document.createElement('canvas')
+      canvas.width = img.naturalWidth
+      canvas.height = img.naturalHeight
+
+      const ctx = canvas.getContext('2d')
+      if (!ctx) {
+        reject(new Error('Failed to get canvas context'))
+        return
+      }
+
+      ctx.drawImage(img, 0, 0)
+
+      // Get as PNG to preserve transparency
+      const dataUrl = canvas.toDataURL('image/png')
+      resolve(dataUrl)
+    }
+
+    img.onerror = () => {
+      reject(new Error(`Failed to load image: ${url}`))
+    }
+
+    img.src = url
+  })
+}
+
+/**
+ * Preload multiple images and return a map of URL to base64
+ *
+ * Useful for preloading all images before PDF generation.
+ *
+ * @param urls - Array of image URLs to preload
+ * @returns Promise resolving to map of URL -> base64 data URL
+ */
+export async function preloadImages(urls: string[]): Promise<Map<string, string>> {
+  const results = new Map<string, string>()
+
+  await Promise.all(
+    urls.map(async (url) => {
+      try {
+        const base64 = await imageUrlToBase64(url)
+        results.set(url, base64)
+      } catch (error) {
+        console.warn(`Failed to preload image: ${url}`, error)
+      }
+    })
+  )
+
+  return results
+}

package/src/business/pdf/browser/index.ts

@@ -0,0 +1,16 @@
+/**
+ * PDF Browser Module
+ *
+ * Browser-compatible PDF generation using pdfmake.
+ * Use this module for client-side PDF rendering in web applications.
+ *
+ * @example
+ * import { PdfMakeBrowserService } from '@repo/core/pdf/browser'
+ *
+ * const service = new PdfMakeBrowserService()
+ * const dataUrl = await service.generateDataUrl(document)
+ * // Use dataUrl as iframe src
+ */
+
+export { PdfMakeBrowserService, pdfMakeBrowserService } from './pdfmake-browser'
+export { imageUrlToBase64, preloadImages } from './image-utils'

package/src/business/pdf/browser/pdfmake-browser.ts

@@ -0,0 +1,229 @@
+/**
+ * PDF Browser Service (pdfmake)
+ *
+ * Browser-compatible PDF rendering using pdfmake.
+ * Generates PDFs in the browser without server round-trips.
+ *
+ * Uses Roboto fonts from vfs_fonts for consistent rendering.
+ *
+ * @see https://pdfmake.github.io/docs/
+ */
+
+import type { TFontDictionary, TCreatedPdf, TDocumentDefinitions } from 'pdfmake/interfaces'
+
+import { defaultTheme } from '../themes'
+import type { PDFTheme } from '../themes'
+import type { PDFDocument } from '../types'
+import { convertDocument } from '../shared/convert'
+
+// ============================================================================
+// Lazy pdfmake initialization
+// ============================================================================
+
+interface PdfMakeInstance {
+  createPdf: (docDefinition: TDocumentDefinitions) => TCreatedPdf
+  setFonts?: (fonts: TFontDictionary) => void
+  addVirtualFileSystem?: (vfs: Record<string, string>) => void
+}
+
+// pdfmake module reference (loaded on first use)
+let pdfMakeModule: PdfMakeInstance | null = null
+let fontsConfigured = false
+
+/**
+ * Get pdfmake module with lazy initialization
+ * This avoids SSR issues and ensures proper browser-side loading
+ */
+async function getPdfMake(): Promise<PdfMakeInstance> {
+  if (pdfMakeModule) {
+    return pdfMakeModule
+  }
+
+  // Dynamic import to ensure browser-side loading
+  const [pdfMakeImport, pdfFontsImport] = await Promise.all([
+    import('pdfmake/build/pdfmake'),
+    import('pdfmake/build/vfs_fonts')
+  ])
+
+  // Handle both default and named exports (CJS/ESM interop)
+  const mod = ((pdfMakeImport as { default?: PdfMakeInstance }).default ?? pdfMakeImport) as PdfMakeInstance
+  pdfMakeModule = mod
+
+  // Add virtual file system with font data
+  const vfsModule = pdfFontsImport as Record<string, unknown>
+  const vfsKeys = Object.keys(vfsModule).filter((k) => k !== 'default')
+
+  // vfs_fonts exports font files directly at top level (e.g., 'Roboto-Regular.ttf': base64data)
+  // Build VFS object from the import, excluding 'default' key
+  const vfsData: Record<string, string> = {}
+  for (const key of vfsKeys) {
+    if (typeof vfsModule[key] === 'string') {
+      vfsData[key] = vfsModule[key]
+    }
+  }
+
+  if (Object.keys(vfsData).length > 0 && mod.addVirtualFileSystem) {
+    mod.addVirtualFileSystem(vfsData)
+  }
+
+  // Set fonts on first load (use Roboto from vfs_fonts)
+  if (!fontsConfigured && pdfMakeModule.setFonts) {
+    pdfMakeModule.setFonts({
+      Roboto: {
+        normal: 'Roboto-Regular.ttf',
+        bold: 'Roboto-Medium.ttf',
+        italics: 'Roboto-Italic.ttf',
+        bolditalics: 'Roboto-MediumItalic.ttf'
+      }
+    })
+    fontsConfigured = true
+  }
+
+  return pdfMakeModule
+}
+
+// ============================================================================
+// Browser Service Class
+// ============================================================================
+
+/**
+ * PdfMakeBrowserService
+ *
+ * Browser-compatible PDF generation service using pdfmake.
+ * Generates PDFs client-side and returns them as data URLs, blobs, or triggers downloads.
+ */
+export class PdfMakeBrowserService {
+  /**
+   * Generate PDF and return as data URL for iframe src
+   *
+   * @param document - PDFDocument schema to render
+   * @param theme - Optional theme override (merged with defaults)
+   * @returns Data URL string (e.g., "data:application/pdf;base64,...")
+   */
+  async generateDataUrl(document: PDFDocument, theme?: Partial<PDFTheme>): Promise<string> {
+    const pdfMake = await getPdfMake()
+    if (!pdfMake) throw new Error('pdfmake failed to load')
+
+    const mergedTheme = this.mergeTheme(theme)
+    const docDefinition = convertDocument(document, mergedTheme)
+    const pdf = pdfMake.createPdf(docDefinition)
+
+    // pdfmake browser API uses callbacks, wrap in Promise
+    // Note: @types/pdfmake doesn't properly type callback overloads
+    return new Promise<string>((resolve, reject) => {
+      try {
+        ;(pdf.getDataUrl as (cb: (result: string) => void) => void)((result) => {
+          resolve(result)
+        })
+      } catch (err) {
+        reject(err)
+      }
+    })
+  }
+
+  /**
+   * Generate PDF and return as Blob for download or processing
+   *
+   * @param document - PDFDocument schema to render
+   * @param theme - Optional theme override (merged with defaults)
+   * @returns Blob containing the PDF
+   */
+  async generateBlob(document: PDFDocument, theme?: Partial<PDFTheme>): Promise<Blob> {
+    const pdfMake = await getPdfMake()
+    if (!pdfMake) throw new Error('pdfmake failed to load')
+
+    const mergedTheme = this.mergeTheme(theme)
+    const docDefinition = convertDocument(document, mergedTheme)
+    const pdf = pdfMake.createPdf(docDefinition)
+    // pdfmake browser API uses callbacks
+    // Note: @types/pdfmake doesn't properly type callback overloads
+    return new Promise<Blob>((resolve, reject) => {
+      try {
+        ;(pdf.getBlob as (cb: (result: Blob) => void) => void)((result) => {
+          resolve(result)
+        })
+      } catch (err) {
+        reject(err)
+      }
+    })
+  }
+
+  /**
+   * Trigger browser download of the PDF
+   *
+   * @param document - PDFDocument schema to render
+   * @param filename - Filename for the download (e.g., "proposal.pdf")
+   * @param theme - Optional theme override (merged with defaults)
+   */
+  async download(document: PDFDocument, filename: string, theme?: Partial<PDFTheme>): Promise<void> {
+    const pdfMake = await getPdfMake()
+    if (!pdfMake) throw new Error('pdfmake failed to load')
+
+    const mergedTheme = this.mergeTheme(theme)
+    const docDefinition = convertDocument(document, mergedTheme)
+    const pdf = pdfMake.createPdf(docDefinition)
+    await pdf.download(filename)
+  }
+
+  /**
+   * Open PDF in a new browser tab
+   *
+   * @param document - PDFDocument schema to render
+   * @param theme - Optional theme override (merged with defaults)
+   */
+  async openInNewTab(document: PDFDocument, theme?: Partial<PDFTheme>): Promise<void> {
+    const pdfMake = await getPdfMake()
+    if (!pdfMake) throw new Error('pdfmake failed to load')
+
+    const mergedTheme = this.mergeTheme(theme)
+    const docDefinition = convertDocument(document, mergedTheme)
+    const pdf = pdfMake.createPdf(docDefinition)
+    await pdf.open()
+  }
+
+  /**
+   * Print PDF using browser's print dialog
+   *
+   * @param document - PDFDocument schema to render
+   * @param theme - Optional theme override (merged with defaults)
+   */
+  async print(document: PDFDocument, theme?: Partial<PDFTheme>): Promise<void> {
+    const pdfMake = await getPdfMake()
+    if (!pdfMake) throw new Error('pdfmake failed to load')
+
+    const mergedTheme = this.mergeTheme(theme)
+    const docDefinition = convertDocument(document, mergedTheme)
+    const pdf = pdfMake.createPdf(docDefinition)
+    await pdf.print()
+  }
+
+  // ==========================================================================
+  // Private Helpers
+  // ==========================================================================
+
+  /**
+   * Merge theme override with defaults
+   */
+  private mergeTheme(themeOverride?: Partial<PDFTheme>): PDFTheme {
+    if (!themeOverride) {
+      return defaultTheme
+    }
+    return {
+      ...defaultTheme,
+      ...themeOverride,
+      colors: { ...defaultTheme.colors, ...themeOverride.colors },
+      typography: { ...defaultTheme.typography, ...themeOverride.typography },
+      spacing: { ...defaultTheme.spacing, ...themeOverride.spacing }
+    }
+  }
+}
+
+/**
+ * Singleton instance for convenience
+ *
+ * Can be used directly without instantiation:
+ * @example
+ * import { pdfMakeBrowserService } from '@repo/core/pdf/browser'
+ * const dataUrl = await pdfMakeBrowserService.generateDataUrl(document)
+ */
+export const pdfMakeBrowserService = new PdfMakeBrowserService()

package/src/business/pdf/index.ts

@@ -0,0 +1,10 @@
+/**
+ * PDF Module
+ *
+ * Browser-safe exports for PDF document types, schemas, and themes.
+ * Note: Do NOT export ./server here - it contains Node.js-only code.
+ */
+
+export * from './types'
+export * from './themes'
+export * from './sections'

package/src/business/pdf/sections/acceptance.ts

@@ -0,0 +1,112 @@
+/**
+ * Acceptance Section Builder
+ *
+ * Creates a dedicated signature/acceptance page for proposals.
+ * This page contains minimal terms and signature fields placement area.
+ *
+ * Pattern: Content-only configuration, styling handled by theme system.
+ *
+ * @example
+ * ```typescript
+ * import { acceptanceSection } from '@repo/core/pdf/sections'
+ *
+ * const page = acceptanceSection({
+ *   companyName: 'Acme Corp',
+ *   contactName: 'John Smith',
+ *   tier: 'tier2',
+ *   initialFee: 5000,
+ *   monthlyFee: 2500  // optional
+ * })
+ * ```
+ */
+
+import type { Page } from '../types'
+
+/**
+ * Configuration for acceptance section
+ */
+export interface AcceptanceSectionConfig {
+  /** Company name for personalization */
+  companyName: string
+  /** Contact name for personalization */
+  contactName: string
+  /** Service tier being proposed */
+  tier: 'tier1' | 'tier2' | 'tier3' | 'custom'
+  /** Initial fee amount in dollars (one-time implementation fee) */
+  initialFee: number
+  /** Monthly fee amount in dollars (optional, for ongoing support) */
+  monthlyFee?: number
+}
+
+/**
+ * Build acceptance page with simplified terms and signature area
+ *
+ * Creates a dedicated page at the end of the proposal with:
+ * - Pricing summary
+ * - Key terms (audit timeline, training, support, guarantee)
+ * - Acceptance statement
+ * - Space for electronic signature fields (added by SignatureAPI)
+ *
+ * @param config - Acceptance section configuration
+ * @returns Page structure for terms and acceptance
+ */
+export function acceptanceSection(config: AcceptanceSectionConfig): Page {
+  const { companyName, contactName, tier, initialFee, monthlyFee } = config
+
+  const tierDescriptions = {
+    tier1: 'Standard Implementation',
+    tier2: 'Professional Implementation',
+    tier3: 'Enterprise Implementation',
+    custom: 'Custom Implementation'
+  }
+
+  // Build simplified terms list
+  const terms: string[] = [
+    `Initial fee: $${initialFee.toLocaleString()} (${tierDescriptions[tier]})`,
+    ...(monthlyFee ? [`Monthly fee: $${monthlyFee.toLocaleString()}/month`] : []),
+    'Detailed audit begins within 5 business days of payment',
+    'Training materials provided',
+    ...(monthlyFee ? ['Ongoing maintenance, support, and optimization included'] : []),
+    'Payment link provided via email after signing',
+    '60-day money-back guarantee'
+  ]
+
+  return {
+    header: { title: 'Agreement & Terms', variant: 'accent' },
+    footer: true,
+    sections: [
+      {
+        type: 'card',
+        content: [
+          {
+            type: 'list',
+            ordered: false,
+            items: terms
+          }
+        ]
+      },
+      {
+        type: 'text',
+        content: `By signing below, ${contactName} of ${companyName} authorizes Elevasis to proceed.`,
+        variant: 'body'
+      },
+      {
+        type: 'card',
+        title: 'Signature',
+        variant: 'light',
+        content: [
+          {
+            type: 'text',
+            content: 'Electronic signature will be captured below via SignatureAPI',
+            variant: 'caption'
+          },
+          {
+            type: 'text',
+            content: '\n\n\n\n\n',
+            variant: 'body'
+          }
+        ]
+      }
+    ]
+  }
+}

package/src/business/pdf/sections/automation.ts

@@ -0,0 +1,56 @@
+/**
+ * Automation Section Builder
+ *
+ * Creates a detail page for a single automation.
+ * Consumer provides content only; styling is handled internally.
+ */
+
+import type { Page, ListItem } from '../types'
+import type { AutomationConfig } from './types'
+
+/**
+ * Creates an automation detail page with metrics, workflow, and impact
+ *
+ * @param config - Content-only configuration
+ * @returns Page object ready for PDFDocument.pages array
+ */
+export function automationSection(config: AutomationConfig): Page {
+  const { title, howItWorks, workflow, impact, hoursPerWeek, annualSavings } = config
+
+  // Convert workflow items to ListItem format
+  const workflowItems: ListItem[] = workflow.map(item => {
+    if (typeof item === 'string') {
+      return item
+    }
+    return { text: item.text, highlight: item.highlight }
+  })
+
+  return {
+    sections: [
+      // Inline metrics without card container for compactness
+      {
+        type: 'columns',
+        content: [
+          {
+            type: 'metric',
+            value: String(hoursPerWeek),
+            label: 'Projected Hours/Week Saved'
+          },
+          {
+            type: 'metric',
+            value: `$${annualSavings.toLocaleString()}`,
+            label: 'Projected Annual Savings'
+          }
+        ]
+      },
+      { type: 'text', content: 'How It Works', variant: 'subtitle' },
+      { type: 'text', content: howItWorks, variant: 'body' },
+      { type: 'text', content: 'Workflow', variant: 'subtitle' },
+      { type: 'list', ordered: true, items: workflowItems },
+      { type: 'text', content: 'Expected Impact', variant: 'subtitle' },
+      { type: 'list', items: impact }
+    ],
+    header: { subtitle: 'Automation', title, variant: 'accent' },
+    footer: true
+  }
+}

package/src/business/pdf/sections/cover.ts

@@ -0,0 +1,51 @@
+/**
+ * Cover Section Builder
+ *
+ * Creates a styled cover page for proposals.
+ * Consumer provides content only; styling is handled internally.
+ */
+
+import type { Page } from '../types'
+import type { CoverConfig } from './types'
+
+/**
+ * Creates a cover page with company info, vertical, and solutions
+ *
+ * @param config - Content-only configuration
+ * @returns Page object ready for PDFDocument.pages array
+ */
+export function coverSection(config: CoverConfig): Page {
+  const {
+    company,
+    contact,
+    vertical,
+    solutions,
+    date = new Date().toLocaleDateString('en-US', {
+      year: 'numeric',
+      month: 'long',
+      day: 'numeric'
+    }),
+    logoSrc
+  } = config
+
+  // Build bottom left text - handle empty contact gracefully
+  const preparedForText = contact && contact.trim()
+    ? `Prepared for ${contact}`
+    : 'Prepared for You'
+
+  return {
+    sections: [
+      { type: 'text', content: company, variant: 'coverCompany' },
+      { type: 'text', content: vertical, variant: 'coverVertical' },
+      { type: 'text', content: solutions, variant: 'coverSolutions' }
+    ],
+    cover: {
+      topLeft: logoSrc ? { src: logoSrc, width: 34 } : undefined,
+      topRight: [{ type: 'text', content: 'AUTOMATION PROPOSAL', variant: 'caption' }],
+      centerContent: true,
+      bottomLeft: [{ type: 'text', content: preparedForText, variant: 'caption' }],
+      bottomRight: [{ type: 'text', content: date, variant: 'caption' }]
+    },
+    footer: false
+  }
+}

package/src/business/pdf/sections/index.ts

@@ -0,0 +1,57 @@
+/**
+ * PDF Section Builders
+ *
+ * Composable section builders for creating styled PDF pages.
+ * Each builder takes content-only configuration and returns a Page object.
+ *
+ * @example
+ * ```typescript
+ * import {
+ *   coverSection,
+ *   summarySection,
+ *   automationSection,
+ *   summaryInvestmentSection  // Combined section (recommended)
+ * } from '@repo/core/pdf/sections'
+ *
+ * // Recommended: 5-page layout with combined summary + investment
+ * const document: PDFDocument = {
+ *   pages: [
+ *     coverSection({ company: 'Acme', contact: 'John', vertical: 'Tech', solutions: 'Automation' }),
+ *     summarySection({ totalSavings: 50000, automationCount: 2, description: '...' }),
+ *     ...automations.map(a => automationSection(a)),
+ *     summaryInvestmentSection({ automations, tier: 'tier2' })  // Combined final page
+ *   ],
+ *   metadata: { title: 'Proposal', author: 'Elevasis' }
+ * }
+ *
+ * // Legacy: 6-page layout with separate summary table and investment pages
+ * // Use tableSummarySection + investmentSection if you need them separate
+ * ```
+ */
+
+// Section builders
+export { coverSection } from './cover'
+export { summarySection } from './summary'
+export { automationSection } from './automation'
+export { tableSummarySection } from './table-summary'
+export { investmentSection } from './investment'
+export { summaryInvestmentSection } from './summary-investment'
+export { acceptanceSection } from './acceptance'
+
+// Shared proposal document builder (used by sandbox, diagnostic, and production)
+export {
+  buildProposalDocument,
+  generateExecutiveSummary,
+  type ProposalDocumentConfig
+} from './proposal-document'
+
+// Config types
+export type {
+  CoverConfig,
+  SummaryConfig,
+  AutomationConfig,
+  TableSummaryConfig,
+  InvestmentConfig,
+  SummaryInvestmentConfig,
+  AcceptanceConfig
+} from './types'

package/src/business/pdf/sections/investment.ts

@@ -0,0 +1,69 @@
+/**
+ * Investment Section Builder
+ *
+ * Creates an investment and next steps page.
+ * Consumer provides content only; styling is handled internally.
+ */
+
+import type { Page } from '../types'
+import type { InvestmentConfig } from './types'
+
+/** Tier descriptions for standard packages */
+const TIER_DESCRIPTIONS: Record<string, string> = {
+  tier1: 'Tier 1: Essential Automation - $1,500-3,000/month',
+  tier2: 'Tier 2: Growth Automation - $3,000-5,000/month',
+  tier3: 'Tier 3: Enterprise Automation - $5,000-10,000/month',
+  custom: 'Custom Package - Tailored to your needs'
+}
+
+/** Default next steps if not provided */
+const DEFAULT_NEXT_STEPS = [
+  'Review this proposal and note any questions',
+  'Schedule a follow-up call to discuss details',
+  "We'll provide a detailed SOW with timeline",
+  'Begin implementation within 2 weeks of approval'
+]
+
+/**
+ * Creates an investment page with tier info and next steps
+ *
+ * @param config - Content-only configuration
+ * @returns Page object ready for PDFDocument.pages array
+ */
+export function investmentSection(config: InvestmentConfig): Page {
+  const {
+    tier,
+    customTierDescription,
+    nextSteps = DEFAULT_NEXT_STEPS,
+    contactCta = 'Questions? Reply to this email or book a call at elevasis.io/call'
+  } = config
+
+  const tierDescription = tier === 'custom' && customTierDescription
+    ? customTierDescription
+    : TIER_DESCRIPTIONS[tier]
+
+  return {
+    sections: [
+      {
+        type: 'card',
+        title: 'Recommended Package',
+        content: [
+          { type: 'text', content: tierDescription, variant: 'subtitle' }
+        ]
+      },
+      { type: 'text', content: 'Next Steps', variant: 'subtitle' },
+      {
+        type: 'list',
+        ordered: true,
+        items: nextSteps
+      },
+      {
+        type: 'text',
+        content: contactCta,
+        variant: 'caption'
+      }
+    ],
+    header: { title: 'Investment', variant: 'accent' },
+    footer: true
+  }
+}