typst: declare brand-logo and brand-logo-images dictionaries

brand processedData resolves paths in logo.images

Author: gordonwoodhull

news/changelog-1.8.md

@@ -48,6 +48,7 @@ All changes included in 1.8:
 - ([#12695](https://github.com/quarto-dev/quarto-cli/issues/12695)): Resolve Typst `font-paths` that start with `/` relative to project root.
 - ([#12739](https://github.com/quarto-dev/quarto-cli/pull/12739)): Remove unused variable `heading-background-color` and `heading-decoration` from Typst's templates. They are leftover from previous change, and not part of Brand.yml schema for typography of headings.
 - ([#12815](https://github.com/quarto-dev/quarto-cli/issues/12815)): Do not crash when floats have no content.
+- ([#13119](https://github.com/quarto-dev/quarto-cli/pull/13119)): Expose `brand.logo` metadata as Typst dictionaries.
 
 ### `beamer`
 

src/core/brand/brand.ts

@@ -10,6 +10,7 @@ import {
   BrandColorLightDark,
   BrandFont,
   BrandLogoExplicitResource,
+  BrandLogoResource,
   BrandLogoSingle,
   BrandLogoUnified,
   BrandNamedLogo,
@@ -143,11 +144,7 @@ export class Brand {
       }
     }
     for (const [key, value] of Object.entries(data.logo?.images ?? {})) {
-      if (typeof value === "string") {
-        logo.images[key] = { path: value };
-      } else {
-        logo.images[key] = value;
-      }
+      logo.images[key] = this.resolvePath(value);
     }
 
     return {
@@ -240,11 +237,7 @@ export class Brand {
     return fonts ?? [];
   }
 
-  getLogoResource(name: string): BrandLogoExplicitResource {
-    const entry = this.data.logo?.images?.[name];
-    if (!entry) {
-      return { path: name };
-    }
+  resolvePath(entry: BrandLogoResource) {
     const pathPrefix = relative(this.projectDir, this.brandDir);
     if (typeof entry === "string") {
       return { path: join(pathPrefix, entry) };
@@ -255,6 +248,13 @@ export class Brand {
     };
   }
 
+  getLogoResource(name: string): BrandLogoExplicitResource {
+    const entry = this.data.logo?.images?.[name];
+    if (!entry) {
+      return { path: name };
+    }
+    return this.resolvePath(entry);
+  }
   getLogo(name: BrandNamedLogo): BrandLogoExplicitResource | undefined {
     const entry = this.data.logo?.[name];
     if (!entry) {

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

@@ -96,6 +96,33 @@ function render_typst_brand_yaml()
           local decl = '#let brand-color-background = ' .. to_typst_dict_indent(themebk)
           quarto.doc.include_text('in-header', decl)
         end
+        if brand.processedData.logo and next(brand.processedData.logo) then
+          local logo = brand.processedData.logo
+          if logo.images then
+            local declImage = {}
+            for name, image in pairs(logo.images) do
+              declImage[name] = {
+                path = quote_string(image.path):gsub('\\', '\\\\'),
+                alt = quote_string(image.alt),
+              }
+            end
+            if next(declImage) then
+              quarto.doc.include_text('in-header', '#let brand-logo-images = ' .. to_typst_dict_indent(declImage))
+            end
+          end
+          local declLogo = {}
+          for _, size in pairs({'small', 'medium', 'large'}) do
+            if logo[size] then
+              declLogo[size] = {
+                path = quote_string(logo[size].path):gsub('\\', '\\\\'),
+                alt = quote_string(logo[size].alt),
+              }
+            end
+          end
+          if next(declLogo) then
+            quarto.doc.include_text('in-header', '#let brand-logo = ' .. to_typst_dict_indent(declLogo))
+          end
+        end
         local function conditional_entry(key, value, quote_strings)
           if quote_strings == null then quote_strings = true end
           if not value then return '' end

tests/docs/smoke-all/typst/brand-yaml/logo/posit/brand-logo.qmd

@@ -9,6 +9,8 @@ _quarto:
     typst:
       ensureTypstFileRegexMatches:
       -
+        - '#let brand-logo-images = \(\s*brand-typst-with-good-padding: \(\s*path: "good-padding\.png"\s*\),\s*posit-logo-light-medium: \(\s*alt: "Posit Logo",\s*path: "posit-logo-2024.svg"\s*\)'
+        - '#let brand-logo = \(\s*medium: \(\s*alt: "Posit Logo",\s*path: "posit-logo-2024\.svg"\s*\)\s*\)'
         - '#set page\(background: align\(left\+top, box\(inset: 0.75in, image\("posit-logo-2024.svg", width: 1.5in, alt: "Posit Logo"\)\)\)\)'
       - []
 ---

tests/docs/smoke-all/typst/brand-yaml/logo/relative-path/brand-logo.qmd

@@ -11,9 +11,15 @@ _quarto:
     typst:
       ensureTypstFileRegexMatches:
       -
+        - '#let brand-logo-images = \(\s*large-light: \(\s*path: "brand_yaml(/|\\\\)resources(/|\\\\)quarto.png"\s*\)\s*\)'
+        - '#let brand-logo = \(\s*large: \(\s*path: "brand_yaml(/|\\\\)resources(/|\\\\)quarto.png"\s*\)\s*\)'
         - '#set page\(background: align\(center\+top, box\(inset: 2em, image\("brand_yaml(/|\\\\)resources(/|\\\\)quarto.png", width: 225pt\)\)\)\)'
+        - '#image\(brand-logo-images\.large-light\.path, alt:"from brand-logo-images"\)'
       - []
 ---
 
 {{< lipsum 4 >}}
 
+```{=typst}
+#image(brand-logo-images.large-light.path, alt:"from brand-logo-images")
+```