Merge pull request #10362 from quarto-dev/feature/brand-yaml

`_brand.yml` - Lua API, shortcodes

Author: cscheid

src/core/brand/brand.ts

@@ -38,11 +38,38 @@ export const defaultColorNames: BrandNamedThemeColor[] = [
 //   "monospace",
 // ];
 
+type ProcessedBrandData = {
+  color: Record<string, string>;
+  // typography: Record<string, ???>;
+  // logo: Record<string, string>; // paths
+};
+
 export class Brand {
   data: BrandJson;
+  processedData: ProcessedBrandData;
 
   constructor(readonly brand: BrandJson) {
     this.data = brand;
+    this.processedData = this.processData(brand);
+  }
+
+  processData(data: BrandJson): ProcessedBrandData {
+    const color: Record<string, string> = {};
+    for (const colorName of Object.keys(data.color?.with ?? {})) {
+      color[colorName] = this.getColor(colorName);
+    }
+    for (const colorName of Object.keys(data.color ?? {})) {
+      if (colorName === "with") {
+        continue;
+      }
+      color[colorName] = this.getColor(colorName);
+    }
+
+    return {
+      color,
+      // typography,
+      // logo,
+    };
   }
 
   // semantics of name resolution for colors, logo and fonts are:

src/resources/filters/modules/brand/brand.lua

@@ -0,0 +1,11 @@
+-- brand.lua
+-- Copyright (C) 2020-2024 Posit Software, PBC
+
+local function get_color(name)
+  local brand = param("brand").processedData -- from src/core/brand/brand.ts
+  return brand.color[name]
+end
+
+return {
+  get_color = get_color
+}

src/resources/filters/quarto-pre/shortcodes-handlers.lua

@@ -59,6 +59,20 @@ end
 
 local handlers = {}
 
+local function read_arg(args, n)
+  local arg = args[n or 1]
+  local varName
+  if arg == nil then
+    return nil
+  end
+  if type(arg) ~= "string" then
+    varName = inlinesToString(arg)
+  else
+    varName = arg
+  end
+  return varName
+end
+
 function initShortcodeHandlers()
 
   -- user provided handlers
@@ -90,32 +104,35 @@ function initShortcodeHandlers()
     end)
   end
 
+  local function handle_brand(args)
+    local brand = require("modules/brand/brand")
+    local brandCommand = read_arg(args, 1)
+    if brandCommand ~= "color" then 
+      warn("Unknown brand command " .. brandCommand .. " specified in a brand shortcode.")
+      return { pandoc.Strong({pandoc.Str("?brand:" .. brandCommand)}) } 
+    end
+    local brandName = read_arg(args, 2)
+    local brandValue = brand.get_color(brandName)
+    if brandValue ~= nil then
+      return { pandoc.Str(brandValue) }
+    else 
+      warn("Unknown brand " .. brandName .. " specified in a brand shortcode.")
+      return { pandoc.Strong({pandoc.Str("?brand:" .. brandName)}) } 
+    end
+  end
 
   -- built in handlers (these override any user handlers)
   handlers['meta'] = { handle = handleMeta }
   handlers['var'] = { handle = handleVars }
   handlers['env'] = { handle = handleEnv }
   handlers['pagebreak'] = { handle = handlePagebreak }
+  handlers['brand'] = { handle = handle_brand }
 end
 
 function handlerForShortcode(shortCode)
   return handlers[shortCode.name]
 end
 
-local function read_arg(args, n)
-  local arg = args[n or 1]
-  local varName
-  if arg == nil then
-    return nil
-  end
-  if type(arg) ~= "string" then
-    varName = inlinesToString(arg)
-  else
-    varName = arg
-  end
-  return varName
-end
-
 -- Implements reading values from envrionment variables
 function handleEnv(args)
   if #args > 0 then

tests/docs/smoke-all/brand/test-01/.gitignore

@@ -0,0 +1 @@
+/.quarto/

tests/docs/smoke-all/brand/test-01/_brand.yml

@@ -0,0 +1,4 @@
+color:
+  with:
+    red: "#ff0000"
+  primary: red

tests/docs/smoke-all/brand/test-01/_quarto.yml

@@ -0,0 +1,15 @@
+project:
+  type: website
+
+website:
+  title: "test-01"
+  navbar:
+    left:
+      - href: index.qmd
+        text: Home
+      - about.qmd
+
+format:
+  html:
+    css: styles.css
+    toc: true

tests/docs/smoke-all/brand/test-01/dashboard.qmd

@@ -0,0 +1,8 @@
+---
+title: "test-01"
+format: dashboard
+---
+
+This is a Quarto website.
+
+To learn more about Quarto websites visit <https://quarto.org/docs/websites>.

tests/docs/smoke-all/brand/test-01/index.qmd

@@ -0,0 +1,17 @@
+---
+title: "test-01"
+filters:
+  - test_brand.lua
+_quarto:
+  tests:
+    html:
+      ensureFileRegexMatches:
+        - ['<span style="color: #ff0000">a span</span>']
+        - []
+---
+
+This is a Quarto website.
+
+[a span]{style='color: {{< brand color primary >}}'}
+
+To learn more about Quarto websites visit <https://quarto.org/docs/websites>.

tests/docs/smoke-all/brand/test-01/revealjs.qmd

@@ -0,0 +1,9 @@
+---
+format: revealjs
+---
+
+## Slides
+
+This is a Quarto presentation.
+
+To learn more about Quarto websites visit <https://quarto.org/docs/websites>.

tests/docs/smoke-all/brand/test-01/styles.css

@@ -0,0 +1 @@
+/* css styles */