// HTML wrapper — embed SVG charts in HTML for browser preview

///|
pub fn wrap_html(svg : String) -> String {
  "\n\n\n\n" +
  "\n" +
  "\n\n\n\n
MoonChartSVG Chart Gallery
\n" +
  "
\n" +
  svg +
  "\n
\n" +
  "\n"
}

///|
pub fn wrap_html_multi(svgs : Array[String], titles : Array[String]) -> String {
  let result = "\n\n\n\n" +
    "\n\n\n\n
MoonChartSVG Dashboard
\n
\n"
  wrap_html_cards(result, svgs, titles, 0) + "
\n\n"
}

///|
fn wrap_html_cards(
  result : String,
  svgs : Array[String],
  titles : Array[String],
  idx : Int,
) -> String {
  if idx >= svgs.length() {
    result
  } else {
    let title = if idx < titles.length() {
      titles[idx]
    } else {
      "Chart " + idx.to_string()
    }
    let card = "
\n
" +
      title +
      "
\n" +
      svgs[idx] +
      "\n
\n"
    wrap_html_cards(result + card, svgs, titles, idx + 1)
  }
}

// Inline SVG in HTML with custom styling

///|
pub fn wrap_html_styled(
  svg : String,
  bg_color : String,
  title : String,
) -> String {
  "\n\n\n\n" +
  "\n\n\n\n
\n" +
  svg +
  "\n
\n\n"
}