// PulseIcon — parametric monoline "Pulse" mark.
// Open outer ring + vertical stem (extends past ring) + right-bulging "p" bowl.
// All geometry derives from R so variants stay on-system.

function _polar(cx, cy, r, deg) {
  const a = (deg * Math.PI) / 180;
  return [cx + r * Math.cos(a), cy - r * Math.sin(a)];
}

// Almost-full ring with a small gap centred at `gapAt` (math degrees), gap = 2*gapHalf wide.
function _ringPath(cx, cy, r, gapAt, gapHalf) {
  const start = gapAt + gapHalf;
  const end = gapAt - gapHalf + 360;
  const [x0, y0] = _polar(cx, cy, r, start);
  const [x1, y1] = _polar(cx, cy, r, end);
  return `M ${x0.toFixed(2)} ${y0.toFixed(2)} A ${r} ${r} 0 1 0 ${x1.toFixed(2)} ${y1.toFixed(2)}`;
}

// Bowl of the p: a circle of radius r clipped by the stem (chord at x=cx).
// off = 0  -> exact semicircle (flat D on the stem)
// off > 0  -> centre pushed right of the stem, so the right portion is the
//             MAJOR arc: a fuller "driekwart rondje" that overhangs the stem.
function _bowlPath(cx, cy, r, off) {
  const o = off || 0;
  const h = Math.sqrt(Math.max(r * r - o * o, 0)); // half chord height
  const large = o > 0 ? 1 : 0;
  const topY = (cy - h).toFixed(2);
  const botY = (cy + h).toFixed(2);
  return `M ${cx} ${topY} A ${r} ${r} 0 ${large} 1 ${cx} ${botY}`;
}

function PulseIcon({
  R = 70,
  sw = 3.1,
  bowlR = 30,
  bowlOff = 0,           // push bowl centre right of stem for a fuller arc
  bowlCy = 140,          // vertical centre of the bowl
  cx = 100,
  cy = 140,
  extTop = 30,           // stem reach above the ring
  extBot = 36,           // stem reach below the ring
  gapAt = 222,           // gap position (lower-left)
  gapHalf = 15,
  color = "#A4875F",
  style,
}) {
  const pad = sw + 2;
  const top = cy - R - extTop - pad;
  const bottom = cy + R + extBot + pad;
  const left = cx - R - pad;
  const right = Math.max(cx + R, cx + bowlOff + bowlR) + pad;
  const vb = `${left} ${top} ${right - left} ${bottom - top}`;

  return (
    <svg viewBox={vb} style={style} fill="none" xmlns="http://www.w3.org/2000/svg">
      <g
        stroke={color}
        strokeWidth={sw}
        strokeLinecap="round"
        strokeLinejoin="round"
      >
        <path d={_ringPath(cx, cy, R, gapAt, gapHalf)} />
        <line x1={cx} y1={cy - R - extTop} x2={cx} y2={cy + R + extBot} />
        <path d={_bowlPath(cx, bowlCy, bowlR, bowlOff)} />
      </g>
    </svg>
  );
}

window.PulseIcon = PulseIcon;