Wrapper to the 'Figma API'

## ---- include = FALSE---------------------------------------------------------
knitr::opts_chunk$set(
  collapse = TRUE,
  comment = "#>"
)

## ---- include = FALSE---------------------------------------------------------
library(figma)

## ---- eval = FALSE------------------------------------------------------------
#  library(figma)
#  quarto_website

## ---- echo = FALSE, fig.cap = 'A screenshot of a Figma file named "Quarto-Website"', out.width="100%"----
knitr::include_graphics("figma-quarto-website.png")

## -----------------------------------------------------------------------------
fd <- figma::as_figma_document(quarto_website)
fd

## -----------------------------------------------------------------------------
objects <- fd$canvas[[1]][["objects"]]
length(objects)

## -----------------------------------------------------------------------------
objects[[1]][["name"]]

## -----------------------------------------------------------------------------
nav_bar <- objects[[2]]
str(nav_bar)

## -----------------------------------------------------------------------------
css_selector <- function(object) {
  name <- object$name
  prefix <- "."
  css <- paste0(prefix, name)
  return(css)
}

css_selector(nav_bar)

## -----------------------------------------------------------------------------
bck_color <- function(object) {
  color <- object$fills[[1]][["color"]]
  as_hex <- rgb(
    color$r, color$g, color$b, color$a,
    maxColorValue = 1
  )
  return(as_hex)
}

bck_color(nav_bar)

## -----------------------------------------------------------------------------
css_statement <- function(selector, attributes) {
  key_values <- vector("character", length(attributes))
  for (i in seq_along(attributes)) {
    key <- attributes[[i]][["key"]]
    value <- attributes[[i]][["value"]]
    kv <- sprintf("\t%s: %s;", key, value)
    key_values[i] <- kv
  }
  body <- paste(key_values, collapse = "\n")
  first_line <- sprintf("%s {", selector)
  # Add curly braces
  body <- paste(
    first_line, body, "}", 
    sep = "\n", collapse = ""
  )
  return(body)
}

## -----------------------------------------------------------------------------
attrs <- list(
  list(key = "text-align", value = "center"),
  list(key = "color", value = "purple"),
  list(key = "width", value = "100px")
)

css_statement("body", attrs) |> cat()

## -----------------------------------------------------------------------------
css_bck_color <- function(object) {
  selector <- css_selector(object)
  color <- bck_color(object)
  color_specs <- list(
    list(key = "background-color", value = color)
  )
  css_statement <- css_statement(selector, color_specs)
  return(css_statement)
}

nav_bar |> 
  css_bck_color() |> 
  cat()