[Feature Request] Result Folding

[eitsupi]

Related to rstudio/rmarkdown#1453

It would be great to have an option to collapse the output as well as the code when in HTML format, as implemented in the minidown R package.
https://minidown.atusy.net/?framework=sakura&theme=default#results-folding

[MokeEire]

I managed to do this using a lua filter from what seems like the author of minidown. I put the lua filter file (called fold_results.lua) in my website root directory, added the following lines to my _quarto.yml file:

filters:
  - fold_results.lua

And included the attr-output chunk option wherever I wanted output folded as specified in the gist linked above. Obviously not ideal but functional!

[cderv]

For reference, related discussion item:

• Is there a way to hide an output of a code, similar to how code-fold works for code? #5131
• Feature request: option to fold (hide) output #4911

[ANP-Oxy]

Can you give an example of how to do this in jupyter or a .qmd file for python? I want to create a foldable output block. I looked at the solution above but I’m lost. It’s not making much sense to me.

[cderv]

@ANP-Oxy this is not yet an available feature built in Quarto

@MokeEire shared a workaround using Lua above (#341 (comment)) but you would need to adapt it - the Lua filter used is leveraging a knitr only feature attr.output so it won't work as for Python with Jupyter.

We'll try to add this feature in 1.4 as the Milestone is showing. Thanks for your patience

[mcanouil]

FYI, #5329 and #5332

[zhengchencai]

@MokeEire shared solution works well in my case for R chunks. It even give fold panels for code and output different <summary>

A little bit of modification like below also allows the same panel style as the default code panel.

function CodeBlock(elem)
  if elem.classes and elem.classes:find("details") then
    local summary = "Code"
    if elem.attributes.summary then
      summary = elem.attributes.summary
    end
    local panelClass = elem.attributes.panelClass or "sourceCode"
    local codeClass = elem.attributes.panelClass or "sourceCode"

    return {
      pandoc.RawBlock("html", "<details><summary>" .. summary .. "</summary>"),
      pandoc.RawBlock("html", "<div class=\"" .. panelClass .. "\">"),
      pandoc.RawBlock("html", "<pre><code class=\"" .. codeClass .. "\">"),
      elem,
      pandoc.RawBlock("html", "</code></pre>"),
      pandoc.RawBlock("html", "</div></details>")
    }
  end
end

and setting a scrollable panel if the output text is too long.

.sourceCode {
 max-height: 600px;
 overflow-y: auto;
}

What I'm not sure is how to set the text panel using the same font and size as code panel, local codeClass = elem.attributes.panelClass or "sourceCode" made the text size smaller