diff --git a/quartz/plugins/transformers/ofm.ts b/quartz/plugins/transformers/ofm.ts index 1eeb7832..3757f421 100644 --- a/quartz/plugins/transformers/ofm.ts +++ b/quartz/plugins/transformers/ofm.ts @@ -138,6 +138,7 @@ const tagRegex = new RegExp(/(?:^| )#((?:[-_\p{L}\p{Emoji}\d])+(?:\/[-_\p{L}\p{E const blockReferenceRegex = new RegExp(/\^([-_A-Za-z0-9]+)$/, "g") const ytLinkRegex = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/ const videoExtensionRegex = new RegExp(/\.(mp4|webm|ogg|avi|mov|flv|wmv|mkv|mpg|mpeg|3gp|m4v)$/) +const wikilinkImageEmbedRegex = new RegExp(/^(?(?!^\d*x?\d*$).*?)?(\|?\s*?(?\d+)(x(?\d+))?)?$/) export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin | undefined> = ( userOpts, @@ -222,18 +223,10 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin const ext: string = path.extname(fp).toLowerCase() const url = slugifyFilePath(fp as FilePath) if ([".png", ".jpg", ".jpeg", ".gif", ".bmp", ".svg", ".webp"].includes(ext)) { - // either |alt|dims or |dims - let [alt, dims] = (alias ?? "").split("|") - - // |dims case, treat first alt slot as dims - if (dims === undefined) { - dims = alt - alt = "" - } - - let [width, height] = dims.split("x", 2) - width ||= "auto" - height ||= "auto" + const match = wikilinkImageEmbedRegex.exec(alias ?? "") + const alt = match?.groups?.alt ?? "" + const width = match?.groups?.width ?? "auto" + const height = match?.groups?.height ?? "auto" return { type: "image", url, @@ -267,9 +260,8 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin return { type: "html", data: { hProperties: { transclude: true } }, - value: `
Transclude of ${url}${block}
`, + value: `
Transclude of ${url}${block}
`, } } @@ -467,9 +459,8 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin node.data = { hProperties: { ...(node.data?.hProperties ?? {}), - className: `callout ${calloutType} ${collapse ? "is-collapsible" : ""} ${ - defaultState === "collapsed" ? "is-collapsed" : "" - }`, + className: `callout ${calloutType} ${collapse ? "is-collapsible" : ""} ${defaultState === "collapsed" ? "is-collapsed" : "" + }`, "data-callout": calloutType, "data-callout-fold": collapse, },