feat: pass fileData to image generator

quartz/components/Head.tsx

@@ -14,13 +14,13 @@ import { unescapeHTML } from "../util/escape"
  * @param opts options for generating image
  */
 async function generateSocialImage(
-  { cfg, description, fileName, fontsPromise, title }: ImageOptions,
+  { cfg, description, fileName, fontsPromise, title, fileData }: ImageOptions,
   userOpts: SocialImageOptions,
 ) {
   const fonts = await fontsPromise
 
   // JSX that will be used to generate satori svg
-  const imageElement = userOpts.imageStructure(cfg, userOpts, title, description, fonts)
+  const imageElement = userOpts.imageStructure(cfg, userOpts, title, description, fonts, fileData)
 
   const svg = await satori(imageElement, {
     width: userOpts.width,
@@ -101,6 +101,7 @@ export default (() => {
             fileExt: extension,
             fontsPromise,
             cfg,
+            fileData
           },
           fullOptions,
         )

quartz/util/imageHelper.ts

@@ -1,6 +1,7 @@
-import satori, { FontWeight, SatoriOptions } from "satori/wasm"
+import { FontWeight, SatoriOptions } from "satori/wasm"
 import { GlobalConfiguration } from "../cfg"
 import { JSXInternal } from "preact/src/jsx"
+import { QuartzPluginData } from "../plugins/vfile"
 
 /**
  * Get an array of `FontOptions` (for satori) given google font names
@@ -70,6 +71,7 @@ export type SocialImageOptions = {
    * @param title title of current page
    * @param description description of current page
    * @param fonts global font that can be used for styling
+   * @param fileData full fileData of current page
    * @returns prepared jsx to be used for generating image
    */
   imageStructure: (
@@ -78,6 +80,7 @@ export type SocialImageOptions = {
     title: string,
     description: string,
     fonts: SatoriOptions["fonts"],
+    fileData: QuartzPluginData
   ) => JSXInternal.Element
 }
 
@@ -112,4 +115,8 @@ export type ImageOptions = {
    * `GlobalConfiguration` of quartz (used for theme/typography)
    */
   cfg: GlobalConfiguration
+  /**
+   * full file data of current page
+   */
+  fileData: QuartzPluginData
 }

quartz/util/socialImage.tsx

@@ -1,6 +1,7 @@
 import { SatoriOptions } from "satori/wasm"
 import { GlobalConfiguration } from "../cfg"
 import { SocialImageOptions, UserOpts } from "./imageHelper"
+import { QuartzPluginData } from "../plugins/vfile"
 
 export const defaultImage: SocialImageOptions["imageStructure"] = (
   cfg: GlobalConfiguration,
@@ -8,6 +9,7 @@ export const defaultImage: SocialImageOptions["imageStructure"] = (
   title: string,
   description: string,
   fonts: SatoriOptions["fonts"],
+  fileData: QuartzPluginData
 ) => {
   // How many characters are allowed before switching to smaller font
   const fontBreakPoint = 22