---
title: "Example Vignette"
vignette: >
  %\VignetteIndexEntry{example}
  %\VignetteEngine{quarto::html}
  %\VignetteEncoding{UTF-8}
knitr:
  opts_chunk:
    collapse: true
    comment: '#>'
---

```{r setup, include=FALSE}
brand <- yaml::read_yaml(brand::brand_file())
palette <- brand$color$palette

hex <- function(value, mode) {
  value <- if (is.list(value)) value[[mode]] else value
  paste0("`", if (value %in% names(palette)) palette[[value]] else value, "`")
}
```

## Typography

### H3

#### H4

Paragraph text should use the brand base font. Inline code should use the brand monospace: `const x = 42`.

```text
text block should use the brand monospace.
abcdefghijklmnopqrstuvwxyz 0123456789
```

```{r}
#| echo: false
#| output: asis
roles <- c(headings = "Headings", base = "Body", monospace = "Code")
families <- unlist(brand$typography[names(roles)])
in_own_face <- if (identical(knitr::pandoc_to(), "typst")) {
  "- %s: `#text(font: \"%s\")[%s]`{=typst}\n"
} else {
  "- %s: [%s]{style=\"font-family: '%s'\"}\n"
}
cat(sprintf(in_own_face, roles, families, families), sep = "")
```

## Theme colors (semantic)

Read straight out of `_brand.yml`, the same file that styles this site.

```{r}
#| echo: false
tokens <- setdiff(names(brand$color), "palette")
knitr::kable(
  data.frame(
    Token = tokens,
    Light = vapply(tokens, function(t) hex(brand$color[[t]], "light"), ""),
    Dark = vapply(tokens, function(t) hex(brand$color[[t]], "dark"), "")
  ),
  row.names = FALSE
)
```

## Palette (named colors)

These are the single-value entries under `color.palette`.

```{r}
#| echo: false
knitr::kable(
  data.frame(Name = names(palette), Value = paste0("`", unlist(palette), "`")),
  row.names = FALSE
)
```

## Components

::: {.callout-note}
Info callout.
:::

::: {.callout-warning}
Warning callout.
:::

::: {.callout-important}
Danger callout.
:::

::: {.callout-tip}
Tip callout.
:::

::: {.callout-caution}
Caution callout.
:::

> Blockquote example. This should remain readable in both light and dark modes.

### Table

| Item | Example |
|---|---|
| Link | <`r brand$meta$link$home`> |
| Inline code | `printf("hello")` |
| Emphasis | *italic*, **bold**, and ***both*** |