diff --git a/_freeze/docs/output-formats/html-code/execute-results/html.json b/_freeze/docs/output-formats/html-code/execute-results/html.json
index e7bf853bc3..e2515b62cb 100644
--- a/_freeze/docs/output-formats/html-code/execute-results/html.json
+++ b/_freeze/docs/output-formats/html-code/execute-results/html.json
@@ -1,8 +1,8 @@
 {
-  "hash": "9cc8fb834369ccb1f07a179eedabf580",
+  "hash": "3341dff44119386c90bb6d062caf9898",
   "result": {
     "engine": "knitr",
-    "markdown": "---\ntitle: \"HTML Code Blocks\"\ncode-tools: true\nexecute:\n  warning: false\nfig-cap-location: top\n---\n\n\n::: {.cell}\n\n```{.r .cell-code}\nset.seed(29319)\n```\n:::\n\n\n## Overview\n\nThere are wide variety of options available to customize the display of source code within HTML documents, including:\n\n1.  Hiding some or all code that was executed by [Knitr](https://yihui.name/knitr) or [Jupyter](https://jupyter.org).\n2.  Code folding for executed code (hidden by default and expandable by readers).\n3.  Handling code that overflows the available horizontal display space.\n4.  View the source code of the markdown file used to generate the document.\n5.  Syntax highlighting themes and other options to control the appearance of code.\n6.  Copy to clipboard button for code blocks.\n7.  Generating hyperlinks to online documentation for functions used within code blocks via the [downlit](https://downlit.r-lib.org/) package (note that this option currently only works when using the Knitr engine).\n\nDetails on using all of these options are provided below.\n\n## Hiding Code\n\nFor many documents you may want to hide all of the executable source code used to produce dynamic outputs. You can do this by specifying `echo: false` in the document `execute` options. For example:\n\n``` yaml\n---\ntitle: \"My Document\"\nexecute:\n  echo: false\njupyter: python3\n---\n```\n\nNote that we can override this option on a per code-block basis. For example:\n\n```{{python}}\n#| echo: true\n\nimport matplotlib.pyplot as plt\nplt.plot([1,2,3,4])\nplt.show()\n```\n\nCode block options are included in a special comment at the top of the block (lines at the top prefaced with `#|` are considered options).\n\n## Folding Code\n\nUse the `code-fold` option to include code but have it hidden by default using the HTML `<details>` tag. For example, click the **Code** button to see the code that produced this plot.\n\n\n::: {.cell}\n\n```{.r .cell-code  code-fold=\"true\"}\nlibrary(ggplot2)\ndat <- data.frame(cond = rep(c(\"A\", \"B\"), each=10),\n                  xvar = 1:20 + rnorm(20,sd=3),\n                  yvar = 1:20 + rnorm(20,sd=3))\n\nggplot(dat, aes(x=xvar, y=yvar)) +\n  geom_point(shape=1) + \n  geom_smooth() \n```\n\n::: {.cell-output-display}\n![](html-code_files/figure-html/unnamed-chunk-2-1.png){fig-alt='Scatterplot with a smoothed trend line.' width=672}\n:::\n:::\n\n\nHere we specify both `code-fold: true` as well as custom summary text (the default is just \"Code\" as shown above):\n\n``` yaml\nformat:\n  html:\n    code-fold: true\n    code-summary: \"Show the code\"\n```\n\nValid values for `code-fold` include:\n\n| Value   | Behavior                     |\n|---------|------------------------------|\n| `false` | No folding (default)         |\n| `true`  | Fold code (initially hidden) |\n| `show`  | Fold code (initially shown)  |\n\nUse the `code-fold` and `code-summary` chunk attributes to control this on a chunk-by-chunk basis:\n\n```{{r}}\n#| code-fold: true\n#| code-summary: \"Show the code\"\n```\n\n## Code Overflow\n\nIn some cases the width of source code will overflow the available horizontal display space. By default, this will result in a horizontal scroll bar for the code block. However if you prefer not to have scrollbars you can have the longer lines wrap instead.\n\nTo set the global default behavior use the `code-overflow` option. For example:\n\n``` yaml\nformat:\n  html:\n    code-overflow: wrap\n```\n\nValid values for `code-overflow` are:\n\n| Option   | Description                                                                                  |\n|------------------|------------------------------------------------------|\n| `scroll` | Scroll code blocks that exceed available width (default, corresponds to `white-space: pre`). |\n| `wrap`   | Wrap lines of code that exceed available width (corresponds to `white-space: pre-wrap`).     |\n\nYou can also override the global default on a per-code-block basis. For computational cells you do this with the `code-overflow` cell option:\n\n```{{python}}\n#| code-overflow: wrap\n\n# very long line of code....\n```\n\nFor a static code block, add the `.code-overflow-scroll` or `.code-overflow-wrap` CSS class:\n\n```` python\n```{.python .code-overflow-wrap}\n# very long line of code....\n```\n````\n\nNote that irrespective of these options, code will always wrap within printed HTML output (as it would otherwise be clipped off the edge of the page).\n\n## Code Tools\n\nYou can include a **Code** menu in the header of your document that provides various tools for readers to interact with the source code. Specify `code-tools: true` to activate these tools:\n\n``` yaml\nformat:\n  html:\n    code-fold: true\n    code-tools: true\n```\n\nIf you have a document that includes folded code blocks then the **Code** menu will present options to show and hide the folded code as well as view the full source code of the document:\n\n![](images/code-tools-01.png){.border fig-alt=\"A screen shot of the header of a rendered Quarto document showing the result of setting both the code-fold and code-tools option to true. There is a drop-down menu labeled 'Code' to the right of the page title with a triangle pointing down. The menu is open and there are three options listed vertically beneath it: 'Hide All Code,' 'Show All Code,' and 'View Source.'\"}\n\nThis document specifies `code-tools: true` in its options so you should see the **Code** menu above next to the main header.\n\nYou can control which of these options are made available as well as the \"Code\" caption text using sub-options of `code-tools`. For example, here we specify that we want only \"View Source\" (no toggling of code visibility) and no caption on the code menu:\n\n``` yaml\nformat:\n  html: \n    code-tools:\n      source: true\n      toggle: false\n      caption: none\n```\n\nBy default, the source code is embedded in the document and shown in a popup window like this:\n\n![](images/code-tools-source.png){fig-alt=\"A screenshot of this webpage with a pop-up window labeled 'Source Code' over it. This 'Source Code' window contains the raw markdown and R code used to write this page. There is an 'X' on the upper right corner of the 'Source Code' pop up to close it.\"}\n\nYou can alternatively specify a URL for the value of `source`:\n\n``` yaml\nformat:\n  html: \n    code-tools:\n      source: https://github.com/quarto-dev/quarto-web/blob/main/index.md\n```\n\nIf you are within a project and have specified a `repo-url` option then you can just use `repo` and the correct link to your source file will be generated:\n\n``` yaml\nformat:\n  html: \n    code-tools:\n      source: repo\n```\n\nNote that the `code-tools` option is not available when you disable the standard HTML theme (e.g. if you specify the `theme: none` option).\n\n## Appearance\n\nBy default code blocks are rendered with a left border whose color is derived from the current theme. You can customize code chunk appearance with some simple options that control the background color and left border. Options can either be booleans to enable or disable the treatment or can be legal CSS color strings (or they could even be SASS variable names!).\n\nHere is the default appearance for code blocks (`code-block-bg: true`):\n\n![](images/code-bg.png){fig-alt=\"A block of code with a gray background.\"}\n\nYou can instead use a left border treatment using the `code-block-border-left` option:\n\n``` yaml\ncode-block-border-left: true\n```\n\n![](images/code-default.png){fig-alt=\"A block of code with a gray vertical stripe running along its left border. This code block has no background.\"}\n\nYou can combine a background and border treatment as well as customize the left border color:\n\n``` yaml\ncode-block-bg: true\ncode-block-border-left: \"#31BAE9\"\n```\n\n![](images/code-custom.png){fig-alt=\"A block of code with a gray background and a blue vertical stripe running along its left border.\"}\n\n## Code Filename {#code-filename}\n\nUse the `filename` attribute on code blocks If you are documenting the contents of a file and want to be especially clear about the name of the file the code is associated with.\n\nFor example, the following code:\n\n```` markdown\n```{.python filename=\"matplotlib.py\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n````\n\nResults in this HTML output:\n\n```{.python filename=\"matplotlib.py\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n\nNon-HTML formats will still have the filename, but it will simply be shown in bold above the code block.\n\n## Highlighting\n\nPandoc will automatically highlight syntax in [fenced code blocks](https://pandoc.org/MANUAL.html#fenced-code-blocks) that are marked with a language name. For example:\n\n    ```python\n    1 + 1\n    ```\n\nPandoc can provide syntax highlighting for over 140 different languages (see the output of `quarto pandoc --list-highlight-languages` for a list of all of them). If you want to provide the appearance of a highlighted code block for a language not supported, just use `default` as the language name.\n\nYou can specify the code highlighting style using `syntax-highlighting` and specifying one of the supported themes. These themes are \"adaptive\", which means they will automatically switch between a dark and light mode based upon the theme of the website. These are designed to work well with sites that include a dark and light mode.\n\n-   a11y\n-   arrow\n-   atom-one\n-   ayu\n-   breeze\n-   github\n-   gruvbox\n\nAll of the standard Pandoc themes are also available:\n\n-   pygments\n-   tango\n-   espresso\n-   zenburn\n-   kate\n-   monochrome\n-   breezedark\n-   haddock\n\nAs well as an additional set of extended themes, including:\n\n-   dracula\n-   monokai\n-   nord\n-   oblivion\n-   printing\n-   radical\n-   solarized\n-   vim-dark\n\nThe `syntax-highlighting` option determines which theme is used. For example:\n\n``` yaml\nsyntax-highlighting: github\n```\n\nHighlighting themes can provide either a single highlighting definition or two definitions, one optimized for a light colored background and another optimized for a dark color background. When available, Quarto will automatically select the appropriate style based upon the code chunk background color's darkness. Users may always opt to specify the full name (e.g. `atom-one-dark`) to by pass this automatic behavior.\n\nBy default, code is highlighted using the `arrow` theme, which is optimized for accessibility. We've additionally introduced the `arrow-dark` theme which is designed to provide accessible highlighting against dark backgrounds.\n\nExamples of the light and dark themes:\n\n![Arrow (light)](images/arrow.png){fig-alt=\"A block of code showcasing the Arrow (light) theme.\"}\n\n![Arrow (dark)](images/arrow-dark.png){fig-alt=\"A block of code showcasing the Arrow (dark) theme.\"}\n\n![Ayu (light)](images/ayu.png){fig-alt=\"A block of code showcasing the Ayu (light) theme.\"}\n\n![Ayu (dark)](images/ayu-dark.png){.preview-image fig-alt=\"A block of code showcasing the Ayu (dark) theme.\"}\n\n### Custom Highlighting\n\nIn addition to the built in themes available for syntax highlighting, you can also specify your own syntax highlighting by providing the path to a valid theme file (which is based upon the KDE XML syntax highlighting descriptions). Highlighting is implemented using [skylighting](https://github.com/jgm/skylighting).\n\nFor example:\n\n``` yaml\n---\nsyntax-highlighting: custom.theme\n---\n```\n\nIn addition, if you'd like to provide adaptive themes, you may also pass both a light and dark theme file:\n\n``` yaml\n---\nsyntax-highlighting:\n  light: custom-light.theme\n  dark: custom-dark.theme\n---\n```\n\nNote that as with adaptive text higlighting themes, when you provide a dark and light `syntax-highlighting`, background colors specified in the themes will be ignored in favor of the overall theme specified background colors.\n\n## Code Annotation\n\nYou can add annotations to lines of code in code blocks and executable code cells. See [Code Annotation](/docs/authoring/code-annotation.qmd) for full details.\n\n\n## Line Numbers {#line-numbers}\n\nIf you want to display line numbers alongside the code block, add the `code-line-numbers` option. For example:\n\n``` yaml\nformat:\n  html:\n    code-line-numbers: true\n```\n\nHere's how a code block with line numbers would display:\n\n``` {.python code-line-numbers=\"true\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n\nYou can also enable line numbers for an individual code block using the `code-line-numbers` attribute. For example:\n\n```` python\n``` {.python code-line-numbers=\"true\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n````\n\n## Executable Blocks\n\nThe documentation on [computations](/docs/get-started/computations/index.qmd) covers how to include executable code blocks (code which is actually executed, with its output being included in the rendered document). We won't additionally cover that here, but we will talk about how to include code blocks that demonstrate executable syntax (e.g. for writing a tutorial).\n\n\n\n\nOften you'll want to include a fenced code block purely as documentation (not executable). You can do this by using two curly braces around the language (e.g. `python`, `r`, etc.) rather than one. For example:\n\n```{{{python}}}\n1 + 1\n```\n\nWill be output into the document as:\n\n```{{python}}\n1 + 1\n```\n\nIf you want to show an example with multiple code blocks and other markdown, just enclose the entire example in 4 backticks (e.g. ````` ```` `````) and use the two curly brace syntax for code blocks within. For example:\n\n    ````\n    ---\n    title: \"My document\"\n    ---\n\n    Some markdown content.\n\n    ```{{{python}}}\n    1 + 1\n    ```\n\n    Some additional markdown content.\n\n    ````\n\n\n## Copy Button\n\nHover over the code block below and you will see a copy icon in the top-right corner:\n\n\n::: {.cell}\n\n```{.r .cell-code}\nlibrary(dygraphs)\ndygraph(nhtemp, main = \"New Haven Temperatures\") %>% \n  dyRangeSelector(dateWindow = c(\"1920-01-01\", \"1960-01-01\"))\n```\n:::\n\n\nThis behavior is enabled by default but you configure it using the `code-copy` option:\n\n``` yaml\nformat:\n  html:\n    code-copy: false\n```\n\nValid values for `code-copy` include:\n\n|         |                                |\n|---------|--------------------------------|\n| `hover` | Show button on hover (default) |\n| `true`  | Always show code copy button   |\n| `false` | Never show code copy button    |\n\n## Code Linking\n\nThe `code-link` option enables hyper-linking of functions within code blocks to their online documentation:\n\n``` yaml\nformat:\n  html:\n    code-link: true\n```\n\nCode linking is currently implemented only for the knitr engine (via the [downlit](https://downlit.r-lib.org) package).\nA limitation of downlit currently prevents code linking if `code-line-numbers` and/or `code-annotations` are also `true`.\n",
+    "markdown": "---\ntitle: \"HTML Code Blocks\"\ncode-tools: true\nexecute:\n  warning: false\nfig-cap-location: top\n---\n\n\n::: {.cell}\n\n```{.r .cell-code}\nset.seed(29319)\n```\n:::\n\n\n## Overview\n\nThere are wide variety of options available to customize the display of source code within HTML documents, including:\n\n1.  Hiding some or all code that was executed by [Knitr](https://yihui.name/knitr) or [Jupyter](https://jupyter.org).\n2.  Code folding for executed code (hidden by default and expandable by readers).\n3.  Handling code that overflows the available horizontal display space.\n4.  View the source code of the markdown file used to generate the document.\n5.  Syntax highlighting themes and other options to control the appearance of code.\n6.  Copy to clipboard button for code blocks.\n7.  Generating hyperlinks to online documentation for functions used within code blocks via the [downlit](https://downlit.r-lib.org/) package (note that this option currently only works when using the Knitr engine).\n\nDetails on using all of these options are provided below.\n\n## Hiding Code\n\nFor many documents you may want to hide all of the executable source code used to produce dynamic outputs. You can do this by specifying `echo: false` in the document `execute` options. For example:\n\n``` yaml\n---\ntitle: \"My Document\"\nexecute:\n  echo: false\njupyter: python3\n---\n```\n\nNote that we can override this option on a per code-block basis. For example:\n\n```{{python}}\n#| echo: true\n\nimport matplotlib.pyplot as plt\nplt.plot([1,2,3,4])\nplt.show()\n```\n\nCode block options are included in a special comment at the top of the block (lines at the top prefaced with `#|` are considered options).\n\n## Folding Code\n\nUse the `code-fold` option to include code but have it hidden by default using the HTML `<details>` tag. For example, click the **Code** button to see the code that produced this plot.\n\n\n::: {.cell}\n\n```{.r .cell-code  code-fold=\"true\"}\nlibrary(ggplot2)\ndat <- data.frame(cond = rep(c(\"A\", \"B\"), each=10),\n                  xvar = 1:20 + rnorm(20,sd=3),\n                  yvar = 1:20 + rnorm(20,sd=3))\n\nggplot(dat, aes(x=xvar, y=yvar)) +\n  geom_point(shape=1) + \n  geom_smooth() \n```\n\n::: {.cell-output-display}\n![](html-code_files/figure-html/unnamed-chunk-2-1.png){fig-alt='Scatterplot with a smoothed trend line.' width=672}\n:::\n:::\n\n\nHere we specify both `code-fold: true` as well as custom summary text (the default is just \"Code\" as shown above):\n\n``` yaml\nformat:\n  html:\n    code-fold: true\n    code-summary: \"Show the code\"\n```\n\nValid values for `code-fold` include:\n\n| Value   | Behavior                     |\n|---------|------------------------------|\n| `false` | No folding (default)         |\n| `true`  | Fold code (initially hidden) |\n| `show`  | Fold code (initially shown)  |\n\nUse the `code-fold` and `code-summary` chunk attributes to control this on a chunk-by-chunk basis:\n\n```{{r}}\n#| code-fold: true\n#| code-summary: \"Show the code\"\n```\n\n## Code Overflow\n\nIn some cases the width of source code will overflow the available horizontal display space. By default, this will result in a horizontal scroll bar for the code block. However if you prefer not to have scrollbars you can have the longer lines wrap instead.\n\nTo set the global default behavior use the `code-overflow` option. For example:\n\n``` yaml\nformat:\n  html:\n    code-overflow: wrap\n```\n\nValid values for `code-overflow` are:\n\n| Option   | Description                                                                                  |\n|------------------|------------------------------------------------------|\n| `scroll` | Scroll code blocks that exceed available width (default, corresponds to `white-space: pre`). |\n| `wrap`   | Wrap lines of code that exceed available width (corresponds to `white-space: pre-wrap`).     |\n\nYou can also override the global default on a per-code-block basis. For computational cells you do this with the `code-overflow` cell option:\n\n```{{python}}\n#| code-overflow: wrap\n\n# very long line of code....\n```\n\nFor a static code block, add the `.code-overflow-scroll` or `.code-overflow-wrap` CSS class:\n\n```` python\n```{.python .code-overflow-wrap}\n# very long line of code....\n```\n````\n\nNote that irrespective of these options, code will always wrap within printed HTML output (as it would otherwise be clipped off the edge of the page).\n\n## Code Tools\n\nYou can include a **Code** menu in the header of your document that provides various tools for readers to interact with the source code. Specify `code-tools: true` to activate these tools:\n\n``` yaml\nformat:\n  html:\n    code-fold: true\n    code-tools: true\n```\n\nIf you have a document that includes folded code blocks then the **Code** menu will present options to show and hide the folded code as well as view the full source code of the document:\n\n![](images/code-tools-01.png){.border fig-alt=\"A screen shot of the header of a rendered Quarto document showing the result of setting both the code-fold and code-tools option to true. There is a drop-down menu labeled 'Code' to the right of the page title with a triangle pointing down. The menu is open and there are three options listed vertically beneath it: 'Hide All Code,' 'Show All Code,' and 'View Source.'\"}\n\nThis document specifies `code-tools: true` in its options so you should see the **Code** menu above next to the main header.\n\nYou can control which of these options are made available as well as the \"Code\" caption text using sub-options of `code-tools`. For example, here we specify that we want only \"View Source\" (no toggling of code visibility) and no caption on the code menu:\n\n``` yaml\nformat:\n  html: \n    code-tools:\n      source: true\n      toggle: false\n      caption: none\n```\n\nBy default, the source code is embedded in the document and shown in a popup window like this:\n\n![](images/code-tools-source.png){fig-alt=\"A screenshot of this webpage with a pop-up window labeled 'Source Code' over it. This 'Source Code' window contains the raw markdown and R code used to write this page. There is an 'X' on the upper right corner of the 'Source Code' pop up to close it.\"}\n\nYou can alternatively specify a URL for the value of `source`:\n\n``` yaml\nformat:\n  html: \n    code-tools:\n      source: https://github.com/quarto-dev/quarto-web/blob/main/index.md\n```\n\nIf you are within a project and have specified a `repo-url` option then you can just use `repo` and the correct link to your source file will be generated:\n\n``` yaml\nformat:\n  html: \n    code-tools:\n      source: repo\n```\n\nNote that the `code-tools` option is not available when you disable the standard HTML theme (e.g. if you specify the `theme: none` option).\n\n## Appearance\n\nBy default code blocks are rendered with a left border whose color is derived from the current theme. You can customize code chunk appearance with some simple options that control the background color and left border. Options can either be booleans to enable or disable the treatment or can be legal CSS color strings (or they could even be SASS variable names!).\n\nHere is the default appearance for code blocks (`code-block-bg: true`):\n\n![](images/code-bg.png){fig-alt=\"A block of code with a gray background.\"}\n\nYou can instead use a left border treatment using the `code-block-border-left` option:\n\n``` yaml\ncode-block-border-left: true\n```\n\n![](images/code-default.png){fig-alt=\"A block of code with a gray vertical stripe running along its left border. This code block has no background.\"}\n\nYou can combine a background and border treatment as well as customize the left border color:\n\n``` yaml\ncode-block-bg: true\ncode-block-border-left: \"#31BAE9\"\n```\n\n![](images/code-custom.png){fig-alt=\"A block of code with a gray background and a blue vertical stripe running along its left border.\"}\n\n## Code Filename {#code-filename}\n\nUse the `filename` attribute on code blocks If you are documenting the contents of a file and want to be especially clear about the name of the file the code is associated with.\n\nFor example, the following code:\n\n```` markdown\n```{.python filename=\"matplotlib.py\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n````\n\nResults in this HTML output:\n\n```{.python filename=\"matplotlib.py\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n\nTypst output shows the filename in a bar above the code block. Other non-HTML formats will still have the filename, but it will simply be shown in bold above the code block.\n\n## Highlighting\n\nPandoc will automatically highlight syntax in [fenced code blocks](https://pandoc.org/MANUAL.html#fenced-code-blocks) that are marked with a language name. For example:\n\n    ```python\n    1 + 1\n    ```\n\nPandoc can provide syntax highlighting for over 140 different languages (see the output of `quarto pandoc --list-highlight-languages` for a list of all of them). If you want to provide the appearance of a highlighted code block for a language not supported, just use `default` as the language name.\n\nYou can specify the code highlighting style using `syntax-highlighting` and specifying one of the supported themes. These themes are \"adaptive\", which means they will automatically switch between a dark and light mode based upon the theme of the website. These are designed to work well with sites that include a dark and light mode.\n\n-   a11y\n-   arrow\n-   atom-one\n-   ayu\n-   breeze\n-   github\n-   gruvbox\n\nAll of the standard Pandoc themes are also available:\n\n-   pygments\n-   tango\n-   espresso\n-   zenburn\n-   kate\n-   monochrome\n-   breezedark\n-   haddock\n\nAs well as an additional set of extended themes, including:\n\n-   dracula\n-   monokai\n-   nord\n-   oblivion\n-   printing\n-   radical\n-   solarized\n-   vim-dark\n\nThe `syntax-highlighting` option determines which theme is used. For example:\n\n``` yaml\nsyntax-highlighting: github\n```\n\nHighlighting themes can provide either a single highlighting definition or two definitions, one optimized for a light colored background and another optimized for a dark color background. When available, Quarto will automatically select the appropriate style based upon the code chunk background color's darkness. Users may always opt to specify the full name (e.g. `atom-one-dark`) to by pass this automatic behavior.\n\nBy default, code is highlighted using the `arrow` theme, which is optimized for accessibility. We've additionally introduced the `arrow-dark` theme which is designed to provide accessible highlighting against dark backgrounds.\n\nExamples of the light and dark themes:\n\n![Arrow (light)](images/arrow.png){fig-alt=\"A block of code showcasing the Arrow (light) theme.\"}\n\n![Arrow (dark)](images/arrow-dark.png){fig-alt=\"A block of code showcasing the Arrow (dark) theme.\"}\n\n![Ayu (light)](images/ayu.png){fig-alt=\"A block of code showcasing the Ayu (light) theme.\"}\n\n![Ayu (dark)](images/ayu-dark.png){.preview-image fig-alt=\"A block of code showcasing the Ayu (dark) theme.\"}\n\n### Custom Highlighting\n\nIn addition to the built in themes available for syntax highlighting, you can also specify your own syntax highlighting by providing the path to a valid theme file (which is based upon the KDE XML syntax highlighting descriptions). Highlighting is implemented using [skylighting](https://github.com/jgm/skylighting).\n\nFor example:\n\n``` yaml\n---\nsyntax-highlighting: custom.theme\n---\n```\n\nIn addition, if you'd like to provide adaptive themes, you may also pass both a light and dark theme file:\n\n``` yaml\n---\nsyntax-highlighting:\n  light: custom-light.theme\n  dark: custom-dark.theme\n---\n```\n\nNote that as with adaptive text higlighting themes, when you provide a dark and light `syntax-highlighting`, background colors specified in the themes will be ignored in favor of the overall theme specified background colors.\n\n## Code Annotation\n\nYou can add annotations to lines of code in code blocks and executable code cells. See [Code Annotation](/docs/authoring/code-annotation.qmd) for full details.\n\n\n## Line Numbers {#line-numbers}\n\nIf you want to display line numbers alongside the code block, add the `code-line-numbers` option. For example:\n\n``` yaml\nformat:\n  html:\n    code-line-numbers: true\n```\n\nHere's how a code block with line numbers would display:\n\n``` {.python code-line-numbers=\"true\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n\nYou can also enable line numbers for an individual code block using the `code-line-numbers` attribute. For example:\n\n```` python\n``` {.python code-line-numbers=\"true\"}\nimport matplotlib.pyplot as plt\nplt.plot([1,23,2,4])\nplt.show()\n```\n````\n\n## Executable Blocks\n\nThe documentation on [computations](/docs/get-started/computations/index.qmd) covers how to include executable code blocks (code which is actually executed, with its output being included in the rendered document). We won't additionally cover that here, but we will talk about how to include code blocks that demonstrate executable syntax (e.g. for writing a tutorial).\n\n\n\n\nOften you'll want to include a fenced code block purely as documentation (not executable). You can do this by using two curly braces around the language (e.g. `python`, `r`, etc.) rather than one. For example:\n\n```{{{python}}}\n1 + 1\n```\n\nWill be output into the document as:\n\n```{{python}}\n1 + 1\n```\n\nIf you want to show an example with multiple code blocks and other markdown, just enclose the entire example in 4 backticks (e.g. ````` ```` `````) and use the two curly brace syntax for code blocks within. For example:\n\n    ````\n    ---\n    title: \"My document\"\n    ---\n\n    Some markdown content.\n\n    ```{{{python}}}\n    1 + 1\n    ```\n\n    Some additional markdown content.\n\n    ````\n\n\n## Copy Button\n\nHover over the code block below and you will see a copy icon in the top-right corner:\n\n\n::: {.cell}\n\n```{.r .cell-code}\nlibrary(dygraphs)\ndygraph(nhtemp, main = \"New Haven Temperatures\") %>% \n  dyRangeSelector(dateWindow = c(\"1920-01-01\", \"1960-01-01\"))\n```\n:::\n\n\nThis behavior is enabled by default but you configure it using the `code-copy` option:\n\n``` yaml\nformat:\n  html:\n    code-copy: false\n```\n\nValid values for `code-copy` include:\n\n|         |                                |\n|---------|--------------------------------|\n| `hover` | Show button on hover (default) |\n| `true`  | Always show code copy button   |\n| `false` | Never show code copy button    |\n\n## Code Linking\n\nThe `code-link` option enables hyper-linking of functions within code blocks to their online documentation:\n\n``` yaml\nformat:\n  html:\n    code-link: true\n```\n\nCode linking is currently implemented only for the knitr engine (via the [downlit](https://downlit.r-lib.org) package).\nA limitation of downlit currently prevents code linking if `code-line-numbers` and/or `code-annotations` are also `true`.\n",
     "supporting": [
       "html-code_files"
     ],
diff --git a/docs/authoring/code-annotation.qmd b/docs/authoring/code-annotation.qmd
index 794689f551..ad64ec86e7 100644
--- a/docs/authoring/code-annotation.qmd
+++ b/docs/authoring/code-annotation.qmd
@@ -32,13 +32,22 @@ The default HTML annotation style displays annotations in a list below the code
 format: revealjs
 ```
 
-The PDF format also allows for annotations, numbering, and displaying the annotation text below the code. In other formats, like Word and GitHub Markdown, annotations are instead labeled with the line of code (or lines of code) to which the annotation text applies.
+The PDF and Typst formats also allow for annotations, numbering, and displaying the annotation text below the code. In other formats, like Word and GitHub Markdown, annotations are instead labeled with the line of code (or lines of code) to which the annotation text applies.
 
 ::: panel-tabset
 #### PDF
 
 ![](images/annote-pdf.png){fig-alt="Screenshot of output in PDF format showing code annotation."}
 
+#### Typst
+
+{{< prerelease-callout 1.11 >}}
+
+In Typst output, each annotation number is a circle at the end of the annotated line, and links to the annotation text below the code block.
+The annotation text links back to the line.
+
+![](images/annote-typst.png){fig-alt="Screenshot of output in Typst format showing code annotation: circled numbers 1 and 2 at the end of the annotated lines of an R code block, and the two annotation texts below it."}
+
 #### GitHub Flavored Markdown
 
 ````markdown
@@ -64,6 +73,7 @@ add new columns for the bill ratio and bill area.
 To add code annotation to a code block, you need to add two things: specially formatted code comments in your code cell, and an ordered list below the code cell with the annotation text. Read more in [Annotation Syntax](#annotation-syntax).
 
 The `code-annotations` option controls how annotations appear in the HTML format (`below` (default), `hover` or `select`), and in all formats, whether annotation is disabled (`false`), or if annotations should be removed from the output (`none`).
+In Typst output, the `hover` and `select` styles use the same layout as `below`.
 
 ## Annotation Syntax {#annotation-syntax}
 
diff --git a/docs/authoring/images/annote-typst.png b/docs/authoring/images/annote-typst.png
new file mode 100644
index 0000000000..2c0055aa30
Binary files /dev/null and b/docs/authoring/images/annote-typst.png differ
diff --git a/docs/authoring/markdown-basics.qmd b/docs/authoring/markdown-basics.qmd
index 5358caee68..0b6d9e5ec1 100644
--- a/docs/authoring/markdown-basics.qmd
+++ b/docs/authoring/markdown-basics.qmd
@@ -404,6 +404,8 @@ code
 ```
 ````
 
+In HTML and Typst output, the filename shows as a bar above the code block.
+
 If you are creating HTML output there is a wide variety of options available for code block output. See the article on [HTML Code](/docs/output-formats/html-code.qmd) for additional details.
 
 ## Raw Content
diff --git a/docs/output-formats/html-code.qmd b/docs/output-formats/html-code.qmd
index b57f44f892..6890201461 100644
--- a/docs/output-formats/html-code.qmd
+++ b/docs/output-formats/html-code.qmd
@@ -227,7 +227,7 @@ plt.plot([1,23,2,4])
 plt.show()
 ```
 
-Non-HTML formats will still have the filename, but it will simply be shown in bold above the code block.
+Typst output shows the filename in a bar above the code block. Other non-HTML formats will still have the filename, but it will simply be shown in bold above the code block.
 
 ## Highlighting