// Planu — Risk Gauge semicircle SVG (SPEC-143)
const W = 200;
const H = 120;
const CX = W / 2;
const CY = 105;
const R = 80;
/**
 * Convert polar angle (in degrees, 0 = right) to SVG x,y on the gauge arc.
 * Gauge goes from 180° (left) to 0° (right), i.e. the top semicircle.
 */
function polarToXY(angleDeg, radius) {
    const rad = (angleDeg * Math.PI) / 180;
    return {
        x: CX + radius * Math.cos(rad),
        y: CY - radius * Math.sin(rad),
    };
}
function scoreToAngle(score) {
    // Map 0→180°, 100→0°  (left to right)
    const clamped = Math.max(0, Math.min(100, score));
    return 180 - clamped * 1.8;
}
function gaugeColor(score) {
    if (score <= 30) {
        return '#22c55e';
    } // green
    if (score <= 60) {
        return '#f59e0b';
    } // yellow
    return '#ef4444'; // red
}
function buildArcPath(startAngle, endAngle, r, _strokeWidth) {
    const start = polarToXY(startAngle, r);
    const end = polarToXY(endAngle, r);
    const largeArc = Math.abs(endAngle - startAngle) > 180 ? 1 : 0;
    // Sweep: going from high angle to low angle means clockwise in SVG
    const sweep = endAngle < startAngle ? 1 : 0;
    return `M ${start.x.toFixed(1)} ${start.y.toFixed(1)} A ${r} ${r} 0 ${largeArc} ${sweep} ${end.x.toFixed(1)} ${end.y.toFixed(1)}`;
}
/**
 * Build a semicircle gauge SVG for a risk score (0-100).
 */
export function buildRiskGaugeSvg(score) {
    const clamped = Math.max(0, Math.min(100, score));
    const color = gaugeColor(clamped);
    const needleAngle = scoreToAngle(clamped);
    const needle = polarToXY(needleAngle, R - 10);
    // Background arc (grey, full 180°)
    const bgPath = buildArcPath(180, 0, R, 14);
    // Foreground arc (colored, proportional)
    const fgPath = buildArcPath(180, needleAngle, R, 14);
    // Zone arcs (thin overlay for green/yellow/red zones)
    const greenEnd = scoreToAngle(30);
    const yellowEnd = scoreToAngle(60);
    const greenArc = buildArcPath(180, greenEnd, R, 14);
    const yellowArc = buildArcPath(greenEnd, yellowEnd, R, 14);
    const redArc = buildArcPath(yellowEnd, 0, R, 14);
    return `<svg viewBox="0 0 ${W} ${H}" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Risk Score Gauge: ${clamped}">
  <!-- Zone backgrounds -->
  <path d="${greenArc}" fill="none" stroke="#d1fae5" stroke-width="14" stroke-linecap="butt"/>
  <path d="${yellowArc}" fill="none" stroke="#fef3c7" stroke-width="14" stroke-linecap="butt"/>
  <path d="${redArc}" fill="none" stroke="#fee2e2" stroke-width="14" stroke-linecap="butt"/>
  <!-- Progress arc -->
  <path d="${bgPath}" fill="none" stroke="#e5e7eb" stroke-width="10" stroke-linecap="round"/>
  <path d="${fgPath}" fill="none" stroke="${color}" stroke-width="10" stroke-linecap="round"/>
  <!-- Needle dot -->
  <circle cx="${needle.x.toFixed(1)}" cy="${needle.y.toFixed(1)}" r="5" fill="${color}" stroke="white" stroke-width="2"/>
  <!-- Center dot -->
  <circle cx="${CX}" cy="${CY}" r="4" fill="#374151"/>
  <!-- Score number -->
  <text x="${CX}" y="${CY - 20}" text-anchor="middle" font-size="28" font-weight="700" fill="${color}">${clamped}</text>
  <!-- Label -->
  <text x="${CX}" y="${CY - 4}" text-anchor="middle" font-size="11" fill="#6b7280">Risk Score</text>
  <!-- Scale labels -->
  <text x="14" y="${CY + 16}" font-size="9" fill="#6b7280">0</text>
  <text x="${CX - 4}" y="22" font-size="9" fill="#6b7280">50</text>
  <text x="${W - 22}" y="${CY + 16}" font-size="9" fill="#6b7280">100</text>
</svg>`;
}
//# sourceMappingURL=risk-gauge-svg.js.map