const STATUS_COLORS = {
    draft: { bg: '#e5e7eb', fg: '#374151' },
    review: { bg: '#dbeafe', fg: '#1d4ed8' },
    approved: { bg: '#d1fae5', fg: '#065f46' },
    implementing: { bg: '#fef3c7', fg: '#92400e' },
    done: { bg: '#d1fae5', fg: '#065f46' },
};
export function buildSpecHeaderSection(data) {
    const defaultColors = { bg: '#e5e7eb', fg: '#374151' };
    const colors = STATUS_COLORS[data.status] ?? defaultColors;
    const date = new Date(data.generatedAt).toLocaleDateString('en-US', {
        year: 'numeric',
        month: 'long',
        day: 'numeric',
    });
    return `<div class="header">
  <h1>Planu — Spec Report</h1>
  <h2>${escapeHtml(data.specId)}: ${escapeHtml(data.title)}</h2>
  <div class="meta">
    <span class="badge" style="background:${colors.bg};color:${colors.fg}">${escapeHtml(data.status)}</span>
    &nbsp;&middot;&nbsp; Generated ${date}
  </div>
</div>`;
}
export function buildSpecMetricsSection(data) {
    return `<div class="section">
  <h2>Metrics</h2>
  <div class="metric-grid">
    ${metricCard(String(data.devHours), 'Dev Hours')}
    ${metricCard(String(data.reviewHours), 'Review Hours')}
    ${metricCard(`$${String(data.totalCostUsd)}`, 'Total Cost')}
    ${metricCard(data.risk, 'Risk Level')}
    ${metricCard(data.difficulty, 'Difficulty')}
  </div>
</div>`;
}
export function buildSpecDependenciesSection(data) {
    if (data.dependencies.length === 0 && data.blockedBy.length === 0) {
        return '';
    }
    const deps = data.dependencies.length > 0
        ? `<p><strong>Depends on:</strong> ${data.dependencies.map(escapeHtml).join(', ')}</p>`
        : '';
    const blocked = data.blockedBy.length > 0
        ? `<p><strong>Blocked by:</strong> ${data.blockedBy.map(escapeHtml).join(', ')}</p>`
        : '';
    return `<div class="section">
  <h2>Dependencies</h2>
  ${deps}${blocked}
</div>`;
}
export function buildSpecTagsSection(data) {
    if (data.tags.length === 0) {
        return '';
    }
    const badges = data.tags
        .map((t) => `<span class="badge badge-draft">${escapeHtml(t)}</span>`)
        .join(' ');
    return `<div class="section">
  <h2>Tags</h2>
  <p>${badges}</p>
</div>`;
}
export function buildEffortDistributionSvg(devHours, reviewHours) {
    const total = devHours + reviewHours;
    if (total === 0) {
        return '';
    }
    const devPct = Math.round((devHours / total) * 100);
    const reviewPct = 100 - devPct;
    const devWidth = Math.round((devHours / total) * 300);
    const reviewWidth = 300 - devWidth;
    return `<div class="section">
  <h2>Effort Distribution</h2>
  <svg width="320" height="50" viewBox="0 0 320 50">
    <rect x="10" y="10" width="${String(devWidth)}" height="30" rx="4" fill="#4F46E5"/>
    <rect x="${String(10 + devWidth)}" y="10" width="${String(reviewWidth)}" height="30" rx="4" fill="#818cf8"/>
    <text x="${String(10 + devWidth / 2)}" y="30" text-anchor="middle" fill="white" font-size="11" font-weight="600">Dev ${String(devPct)}%</text>
    <text x="${String(10 + devWidth + reviewWidth / 2)}" y="30" text-anchor="middle" fill="white" font-size="11" font-weight="600">Review ${String(reviewPct)}%</text>
  </svg>
</div>`;
}
export function buildAffectedFilesSection(files) {
    if (files.length === 0) {
        return '';
    }
    const rows = files.map((f) => `<li><code>${escapeHtml(f)}</code></li>`).join('\n    ');
    return `<div class="section">
  <h2>Affected Files</h2>
  <ul>${rows}</ul>
</div>`;
}
export function buildArchDecisionsSection(decisions) {
    if (decisions.length === 0) {
        return '';
    }
    const items = decisions.map((d) => `<li>${escapeHtml(d)}</li>`).join('\n    ');
    return `<div class="section">
  <h2>Architectural Decisions</h2>
  <ul>${items}</ul>
</div>`;
}
export function buildSpecFooterSection() {
    return `<div class="footer">
  Generated by <strong>Planu</strong> &mdash; Spec Driven Development
</div>`;
}
function metricCard(value, label) {
    return `<div class="metric-card">
      <div class="metric-value">${escapeHtml(value)}</div>
      <div class="metric-label">${escapeHtml(label)}</div>
    </div>`;
}
function escapeHtml(str) {
    return str
        .replace(/&/g, '&amp;')
        .replace(/</g, '&lt;')
        .replace(/>/g, '&gt;')
        .replace(/"/g, '&quot;');
}
//# sourceMappingURL=spec-section-builders.js.map