From 4877a9c934201e8f0e4e83821efe2dc3f9299d9a Mon Sep 17 00:00:00 2001 From: Jacky Zhao Date: Thu, 3 Aug 2023 00:08:13 -0700 Subject: [PATCH] fix callout aliases not being used properly --- content/features/callouts.md | 4 + quartz/plugins/transformers/ofm.ts | 127 ++++++++++++++--------------- 2 files changed, 67 insertions(+), 64 deletions(-) diff --git a/content/features/callouts.md b/content/features/callouts.md index cb5feb9d..15b689c2 100644 --- a/content/features/callouts.md +++ b/content/features/callouts.md @@ -50,6 +50,10 @@ title: Callouts > > Aliases: failure, fail, missing +> [!fail] Failure +> +> Aliases: failure, fail, missing + > [!danger] Error > > Aliases: danger, error diff --git a/quartz/plugins/transformers/ofm.ts b/quartz/plugins/transformers/ofm.ts index 23b97d6f..57a9b7f6 100644 --- a/quartz/plugins/transformers/ofm.ts +++ b/quartz/plugins/transformers/ofm.ts @@ -50,40 +50,6 @@ const icons = { quoteIcon: ``, } -function canonicalizeCallout(calloutName: string): keyof typeof callouts { - let callout = calloutName.toLowerCase() as keyof typeof calloutMapping - - const calloutMapping: Record = { - note: "note", - abstract: "abstract", - info: "info", - todo: "todo", - tip: "tip", - hint: "tip", - important: "tip", - success: "success", - check: "success", - done: "success", - question: "question", - help: "question", - faq: "question", - warning: "warning", - attention: "warning", - caution: "warning", - failure: "failure", - missing: "failure", - fail: "failure", - danger: "danger", - error: "danger", - bug: "bug", - example: "example", - quote: "quote", - cite: "quote", - } - - return calloutMapping[callout] -} - const callouts = { note: icons.pencilIcon, abstract: icons.clipboardListIcon, @@ -100,6 +66,40 @@ const callouts = { quote: icons.quoteIcon, } +const calloutMapping: Record = { + note: "note", + abstract: "abstract", + info: "info", + todo: "todo", + tip: "tip", + hint: "tip", + important: "tip", + success: "success", + check: "success", + done: "success", + question: "question", + help: "question", + faq: "question", + warning: "warning", + attention: "warning", + caution: "warning", + failure: "failure", + missing: "failure", + fail: "failure", + danger: "danger", + error: "danger", + bug: "bug", + example: "example", + quote: "quote", + cite: "quote", +} + +function canonicalizeCallout(calloutName: string): keyof typeof callouts { + let callout = calloutName.toLowerCase() as keyof typeof calloutMapping + return calloutMapping[callout] +} + + const capitalize = (s: string): string => { return s.substring(0, 1).toUpperCase() + s.substring(1) } @@ -125,34 +125,34 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin const findAndReplace = opts.enableInHtmlEmbed ? (tree: Root, regex: RegExp, replace?: Replace | null | undefined) => { - if (replace) { - const mdastToHtml = (ast: PhrasingContent) => { - const hast = toHast(ast, { allowDangerousHtml: true })! - return toHtml(hast, { allowDangerousHtml: true }) - } - - visit(tree, "html", (node: HTML) => { - if (typeof replace === "string") { - node.value = node.value.replace(regex, replace) - } else { - node.value = node.value.replaceAll(regex, (substring: string, ...args) => { - const replaceValue = replace(substring, ...args) - if (typeof replaceValue === "string") { - return replaceValue - } else if (Array.isArray(replaceValue)) { - return replaceValue.map(mdastToHtml).join("") - } else if (typeof replaceValue === "object" && replaceValue !== null) { - return mdastToHtml(replaceValue) - } else { - return substring - } - }) - } - }) + if (replace) { + const mdastToHtml = (ast: PhrasingContent) => { + const hast = toHast(ast, { allowDangerousHtml: true })! + return toHtml(hast, { allowDangerousHtml: true }) } - mdastFindReplace(tree, regex, replace) + visit(tree, "html", (node: HTML) => { + if (typeof replace === "string") { + node.value = node.value.replace(regex, replace) + } else { + node.value = node.value.replaceAll(regex, (substring: string, ...args) => { + const replaceValue = replace(substring, ...args) + if (typeof replaceValue === "string") { + return replaceValue + } else if (Array.isArray(replaceValue)) { + return replaceValue.map(mdastToHtml).join("") + } else if (typeof replaceValue === "object" && replaceValue !== null) { + return mdastToHtml(replaceValue) + } else { + return substring + } + }) + } + }) } + + mdastFindReplace(tree, regex, replace) + } : mdastFindReplace return { @@ -292,7 +292,7 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin const match = firstLine.match(calloutRegex) if (match && match.input) { const [calloutDirective, typeString, collapseChar] = match - const calloutType = typeString.toLowerCase() as keyof typeof callouts + const calloutType = canonicalizeCallout(typeString.toLowerCase() as keyof typeof calloutMapping) const collapse = collapseChar === "+" || collapseChar === "-" const defaultState = collapseChar === "-" ? "collapsed" : "expanded" const title = @@ -307,7 +307,7 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin value: `
-
${callouts[canonicalizeCallout(calloutType)]}
+
${callouts[calloutType]}
${title}
${collapse ? toggleIcon : ""}
`, @@ -334,9 +334,8 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin node.data = { hProperties: { ...(node.data?.hProperties ?? {}), - className: `callout ${collapse ? "is-collapsible" : ""} ${ - defaultState === "collapsed" ? "is-collapsed" : "" - }`, + className: `callout ${collapse ? "is-collapsible" : ""} ${defaultState === "collapsed" ? "is-collapsed" : "" + }`, "data-callout": calloutType, "data-callout-fold": collapse, },