renderOptionParamField function

function renderOptionParamField(
  def: GeneratorParamDef,
  existingParams?: GeneratorParams,
): string {
  const label = t(def.labelKey) || def.labelKey;
  const currentValue = existingParams?.[def.key] ?? def.defaultValue;

  if (def.type === "select" && def.selectOptions) {
    const options = def.selectOptions
      .map((opt) => {
        const optLabel = t(opt.labelKey) || opt.labelKey;
        const selected = opt.value === currentValue ? "selected" : "";
        return `<option value="${escapeHtml(opt.value)}" ${selected}>${escapeHtml(optLabel)}</option>`;
      })
      .join("");
    return `
      <div class="form-group" style="min-width:150px;">
        <label>${escapeHtml(label)}</label>
        <select data-param-key="${def.key}">${options}</select>
      </div>`;
  }

  if (def.type === "boolean") {
    const checked = currentValue ? "checked" : "";
    return `
      <div class="form-group" style="min-width:150px;">
        <label style="display:flex;align-items:center;gap:6px;cursor:pointer;">
          <input type="checkbox" data-param-key="${def.key}" ${checked} />
          ${escapeHtml(label)}
        </label>
      </div>`;
  }

  const min = def.min != null ? `min="${def.min}"` : "";
  const max = def.max != null ? `max="${def.max}"` : "";
  const step = def.step != null ? `step="${def.step}"` : "";
  return `
    <div class="form-group" style="min-width:120px;">
      <label>${escapeHtml(label)}</label>
      <input type="number" data-param-key="${def.key}" value="${currentValue ?? ""}" ${min} ${max} ${step} />
    </div>`;
}