Merge pull request #9723 from quarto-dev/bugfix/9722

typst - support data URIs in images

Author: cscheid

news/changelog-1.5.md

@@ -74,6 +74,7 @@ All changes included in 1.5:
 - ([#9293](https://github.com/quarto-dev/quarto-cli/pull/9293)): Add `toc-indent` to control indentation of entries in the table of contents.
 - ([#9671](https://github.com/quarto-dev/quarto-cli/issues/9671)): Reimplement `typst` subfloats to fix subfloat counters.
 - ([#9694](https://github.com/quarto-dev/quarto-cli/issues/9694)): Fix default callout (`::: callout ... ::: `) in Typst.
+- ([#9722](https://github.com/quarto-dev/quarto-cli/issues/9722)): Resolve data URI images in Typst.
 - Upgrade Typst to 0.11
 - Upgrade the Typst template to draw tables without grid lines by default, in accordance with latest Pandoc.
 

src/resources/filters/modules/mediabag.lua

@@ -55,8 +55,28 @@ local function fetch_and_store_image(src)
   return filename
 end
 
+local function resolve_image_from_url(image)
+  if resolved_url_cache[image.src] then
+    image.src = resolved_url_cache[image.src]
+    return image
+  end 
+  local relativePath = image.src:match("https?://[%w%$%-%_%.%+%!%*%'%(%)%:%%]+/(.+)") or
+    image.src:match("data:image/.+;base64,(.+)")
+  if not (relativePath or param("has-resource-path", false)) then
+    return nil
+  end
+
+  local filename = fetch_and_store_image(image.src)
+  if filename == nil then
+    return nil
+  end
+  image.src = filename
+  return image
+end
+
 return {
   resolved_url_cache = resolved_url_cache,
   with_mediabag_contents = with_mediabag_contents,
-  fetch_and_store_image = fetch_and_store_image
+  fetch_and_store_image = fetch_and_store_image,
+  resolve_image_from_url = resolve_image_from_url
 }

src/resources/filters/quarto-post/pdf-images.lua

@@ -1,8 +1,6 @@
 -- svg.lua
 -- Copyright (C) 2021 by RStudio, PBC
 
-local mediabag = require 'modules/mediabag'
-
 local function call_rsvg_convert(path)
   local stem = pandoc.path.split_extension(path)
   local output = stem .. '.pdf'
@@ -75,7 +73,7 @@ function pdfImages()
 
       -- See if the path points to an SVG in the media bag
       -- (been generated by a filter, for example)
-      return mediabag.with_mediabag_contents(image.src, function (mime_type, tempPath)
+      return _quarto.modules.mediabag.with_mediabag_contents(image.src, function (mime_type, tempPath)
         if mime_type == 'image/svg+xml' then
           local convertedPath = call_rsvg_convert(tempPath)
           if convertedPath == nil then
@@ -97,23 +95,7 @@ function pdfImages()
           image.src = mbPath
           return image
         elseif mt == nil then
-          if mediabag.resolved_url_cache[image.src] then
-            image.src = mediabag.resolved_url_cache[image.src]
-            return image
-          end 
-          
-          local relativePath = image.src:match("https?://[%w%$%-%_%.%+%!%*%'%(%)%:%%]+/(.+)") or
-            image.src:match("data:image/.+;base64,(.+)")
-          if not (relativePath or param("has-resource-path", false)) then
-            return nil
-          end
-
-          local filename = mediabag.fetch_and_store_image(image.src)
-          if filename == nil then
-            return nil
-          end
-          image.src = filename
-          return image
+          return _quarto.modules.mediabag.resolve_image_from_url(image)
         end
       end)
     end

src/resources/filters/quarto-post/typst.lua

@@ -103,6 +103,8 @@ function render_typst_fixups()
   return {
     traverse = "topdown",
     Image = function(image)
+      image = _quarto.modules.mediabag.resolve_image_from_url(image) or image
+
       -- if the width or height are "ratio" or "relative", in typst parlance,
       -- then we currently need to hide it from Pandoc 3.1.9 until
       -- https://github.com/jgm/pandoc/issues/9104 is properly fixed
@@ -121,6 +123,8 @@ function render_typst_fixups()
         local escaped_src = image.src:gsub("\\", "\\\\"):gsub("\"", "\\\"")
         return pandoc.RawInline("typst", "#box(" .. attr_str .. "image(\"" .. escaped_src .. "\"))")
       end
+
+      return image
     end,
     Div = function(div)
       local cod = quarto.utils.match(".cell/:child/.cell-output-display")(div)

tests/docs/smoke-all/2024/05/20/9722.qmd

@@ -0,0 +1,11 @@
+---
+format: typst
+---
+
+{{< placeholder >}}
+
+Now with a caption:
+
+![A caption]({{< placeholder >}}){#fig-1}
+
+See @fig-1.