How to make quarto preserve a callout div in format: commonmark?

[JosiahParry]

Description

When you render a quarto doc with a :::{.callout-warning} or other div with a callout class to gfm or commonmark_x, the div with the class is not respected. Instead, the div is converted to a div with an inline code chunk. For example the following quarto callout

:::{.callout-warning}
Note that depending on the version of the package you download,...
:::

results in the following markdown

<div>

> **Warning**
>
> Note that depending on the version of the package you download, ...

</div>

whereas the existing callout is already comonmark compatible. If I remove the .callout- from the class, the result is as one would expect

:::{.warning}
Note that depending on the version of the package you download, ...
:::

How can I make quarto respect the existing commonmark format?

[cscheid]

Concretely, what's happening is that divs with class callout- are treated specially by Quarto. They are parsed as a Callout AST element, so that (for example) filters can operate on Callouts specifically. This operates under the same principle as how a div with ids starting in fig- are treated specially.

With that said, the solution to your problem depends on what you want to do and how you want to solve it.

If you're emitting output for a number of different formats and you want to change how Quarto handles Callout nodes in gfm and commonmark_x, then your solution would be to write a Lua filter that catches the Callout node and emits whatever output you want to, ahead of our rendering.

If you're emitting only gfm or commonmark output, and want a snippet of code to be passed through Quarto's pipeline undisturbed, then the solution is to use a raw block which won't be parsed as a Callout node.

[JosiahParry]

What is a raw block? I would like to have the divs be outputted as standard common mark but still have code rendered. I've tried to use the Quarto extension system but it doesn't make much sense to me unfortunately:(

[mcanouil]

See https://quarto.org/docs/authoring/markdown-basics.html#raw-content.

[JosiahParry]

So in order to get quarto to respect the rendering of the existing commonmark syntax to commonmark syntax e.g. format: commonmark, the commonmark syntax needs to be wrapped in the following. Is that correct?

```{=markdown}
:::{.callout-warning}
my warning message
:::
```

[mcanouil]

Which version of Quarto are you using?

With 1.5 latest I have:

Quarto document	GFM	GitHub
--- title: "Quarto Playground" format: gfm --- This is a playground for Quarto. ::: {.callout-warning} Something :::	# Quarto Playground This is a playground for Quarto. > [!WARNING] > > Something	Quarto Playground This is a playground for Quarto. Warning Something

[JosiahParry]

1.3.44. The output is still similar between these two. Your gfm shows inline code chunk as well and not the commonmark format.

[mcanouil]

1.3.44

Is it correct? So you are using a quite old pre-release version. You should consider upgrading at least to the 1.3 stable version (v1.3.450) or even the 1.4 stable version (v1.4.553).

Your gfm shows inline code chunk as well

There are no "inline code chunk".
There is only a Blockquote. Note that this particular block quote is how GitHub (GFM) is making "callouts" as illustrated in the third column.

Please do provide a reproducible example rather than a snippet of code, as the one I shared in the first column of the table in my last reply.

[JosiahParry]

Here's your repro:

---
title: "Quarto Playground"
format: commonmark_x
---

This is a playground for Quarto.

::: {.callout-warning}
Something
:::

which produces

# Quarto Playground

This is a playground for Quarto.

<div>

> **Warning**
>
> Something

</div>

my apologies for not using the correct terminology. The block quote is undesired. commonmark markdown is desired.

[cscheid]

Just FYI, I lightly edited the discussion title to make it clearer that the intent of the question is for the div block to be preserved throughout the processing. <div> elements and block quotes are allowed in commonmark, and so Quarto is "respecting commonmark". But if the goal is to not change the callout div, then additional steps are required, as I described in my original answer.