Merge branch 'v4' of https://github.com/jackyzha0/quartz into v4

2026-06-04 05:20:35 +00:00 · 2025-11-09 15:15:58 -05:00
parent 6783a351a9 ef29c69828
commit 342d6428a3
29 changed files with 750 additions and 483 deletions
@@ -50,6 +50,11 @@ export type Analytics =
  | {
      provider: "vercel"
    }
+  | {
+      provider: "rybbit"
+      siteId: string
+      host?: string
+    }

 export interface GlobalConfiguration {
  pageTitle: string
@@ -20,7 +20,6 @@ export default ((userOpts?: Partial<SearchOptions>) => {
    return (
      <div class={classNames(displayClass, "search")}>
        <button class="search-button">
-          <p>{i18n(cfg.locale).components.search.title}</p>
          <svg role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7">
            <title>Search</title>
            <g class="search-path" fill="none">
@@ -28,6 +27,7 @@ export default ((userOpts?: Partial<SearchOptions>) => {
              <circle cx="8" cy="8" r="7" />
            </g>
          </svg>
+          <p>{i18n(cfg.locale).components.search.title}</p>
        </button>
        <div class="search-container">
          <div class="search-space">
@@ -9,6 +9,7 @@ import { visit } from "unist-util-visit"
 import { Root, Element, ElementContent } from "hast"
 import { GlobalConfiguration } from "../cfg"
 import { i18n } from "../i18n"
+import { styleText } from "util"

 interface RenderComponents {
  head: QuartzComponent
@@ -68,6 +69,7 @@ function renderTranscludes(
  cfg: GlobalConfiguration,
  slug: FullSlug,
  componentData: QuartzComponentProps,
+  visited: Set<FullSlug>,
 ) {
  // process transcludes in componentData
  visit(root, "element", (node, _index, _parent) => {
@@ -76,6 +78,30 @@ function renderTranscludes(
      if (classNames.includes("transclude")) {
        const inner = node.children[0] as Element
        const transcludeTarget = (inner.properties["data-slug"] ?? slug) as FullSlug
+        if (visited.has(transcludeTarget)) {
+          console.warn(
+            styleText(
+              "yellow",
+              `Warning: Skipping circular transclusion: ${slug} -> ${transcludeTarget}`,
+            ),
+          )
+          node.children = [
+            {
+              type: "element",
+              tagName: "p",
+              properties: { style: "color: var(--secondary);" },
+              children: [
+                {
+                  type: "text",
+                  value: `Circular transclusion detected: ${transcludeTarget}`,
+                },
+              ],
+            },
+          ]
+          return
+        }
+        visited.add(transcludeTarget)
+
        const page = componentData.allFiles.find((f) => f.slug === transcludeTarget)
        if (!page) {
          return
@@ -196,7 +222,8 @@ export function renderPage(
  // make a deep copy of the tree so we don't remove the transclusion references
  // for the file cached in contentMap in build.ts
  const root = clone(componentData.tree) as Root
-  renderTranscludes(root, cfg, slug, componentData)
+  const visited = new Set<FullSlug>([slug])
+  renderTranscludes(root, cfg, slug, componentData, visited)

  // set componentData.tree to the edited html that has transclusions rendered
  componentData.tree = root
@@ -231,8 +258,9 @@ export function renderPage(
  )

  const lang = componentData.fileData.frontmatter?.lang ?? cfg.locale?.split("-")[0] ?? "en"
+  const direction = i18n(cfg.locale).direction ?? "ltr"
  const doc = (
-    <html lang={lang}>
+    <html lang={lang} dir={direction}>
      <Head {...componentData} />
      <body data-slug={slug}>
        <div id="quartz-root" class="page">
@@ -1,4 +1,4 @@
-import FlexSearch from "flexsearch"
+import FlexSearch, { DefaultDocumentSearchResults } from "flexsearch"
 import { ContentDetails } from "../../plugins/emitters/contentIndex"
 import { registerEscapeHandler, removeAllChildren } from "./util"
 import { FullSlug, normalizeRelativeURLs, resolveRelative } from "../../util/path"
@@ -9,15 +9,21 @@ interface Item {
  title: string
  content: string
  tags: string[]
+  [key: string]: any
 }

 // Can be expanded with things like "term" in the future
 type SearchType = "basic" | "tags"
 let searchType: SearchType = "basic"
 let currentSearchTerm: string = ""
-const encoder = (str: string) => str.toLowerCase().split(/([^a-z]|[^\x00-\x7F])/)
+const encoder = (str: string) => {
+  return str
+    .toLowerCase()
+    .split(/\s+/)
+    .filter((token) => token.length > 0)
+}
+
 let index = new FlexSearch.Document<Item>({
-  charset: "latin:extra",
  encode: encoder,
  document: {
    id: "id",
@@ -397,7 +403,7 @@ async function setupSearch(searchElement: Element, currentSlug: FullSlug, data:
    searchLayout.classList.toggle("display-results", currentSearchTerm !== "")
    searchType = currentSearchTerm.startsWith("#") ? "tags" : "basic"

-    let searchResults: FlexSearch.SimpleDocumentSearchResultSetUnit[]
+    let searchResults: DefaultDocumentSearchResults<Item>
    if (searchType === "tags") {
      currentSearchTerm = currentSearchTerm.substring(1).trim()
      const separatorIndex = currentSearchTerm.indexOf(" ")
@@ -410,7 +416,7 @@ async function setupSearch(searchElement: Element, currentSlug: FullSlug, data:
          // return at least 10000 documents, so it is enough to filter them by tag (implemented in flexsearch)
          limit: Math.max(numSearchResults, 10000),
          index: ["title", "content"],
-          tag: tag,
+          tag: { tags: tag },
        })
        for (let searchResult of searchResults) {
          searchResult.result = searchResult.result.slice(0, numSearchResults)
@@ -133,12 +133,16 @@ button.desktop-explorer {
  }

  .folder-outer {
+    visibility: collapse;
    display: grid;
    grid-template-rows: 0fr;
-    transition: grid-template-rows 0.3s ease-in-out;
+    transition-property: grid-template-rows, visibility;
+    transition-duration: 0.3s;
+    transition-timing-function: ease-in-out;
  }

  .folder-outer.open {
+    visibility: visible;
    grid-template-rows: 1fr;
  }

@@ -8,24 +8,24 @@
  }

  & > .search-button {
-    background-color: color-mix(in srgb, var(--lightgray) 60%, var(--light));
-    border: none;
+    background-color: transparent;
+    border: 1px var(--lightgray) solid;
    border-radius: 4px;
    font-family: inherit;
    font-size: inherit;
    height: 2rem;
-    padding: 0;
+    padding: 0 1rem 0 0;
    display: flex;
    align-items: center;
    text-align: inherit;
    cursor: pointer;
    white-space: nowrap;
    width: 100%;
-    justify-content: space-between;

    & > p {
      display: inline;
-      padding: 0 1rem;
+      color: var(--gray);
+      text-wrap: unset;
    }

    & svg {
@@ -36,7 +36,7 @@

      .search-path {
        stroke: var(--darkgray);
-        stroke-width: 2px;
+        stroke-width: 1.5px;
        transition: stroke 0.5s ease;
      }
    }
@@ -27,6 +27,8 @@ import lt from "./locales/lt-LT"
 import fi from "./locales/fi-FI"
 import no from "./locales/nb-NO"
 import id from "./locales/id-ID"
+import kk from "./locales/kk-KZ"
+import he from "./locales/he-IL"

 export const TRANSLATIONS = {
  "en-US": enUs,
@@ -78,6 +80,8 @@ export const TRANSLATIONS = {
  "fi-FI": fi,
  "nb-NO": no,
  "id-ID": id,
+  "kk-KZ": kk,
+  "he-IL": he,
 } as const

 export const defaultTranslation = "en-US"
@@ -5,6 +5,7 @@ export default {
    title: "غير معنون",
    description: "لم يتم تقديم أي وصف",
  },
+  direction: "rtl" as const,
  components: {
    callout: {
      note: "ملاحظة",
@@ -21,6 +21,7 @@ export interface Translation {
    title: string
    description: string
  }
+  direction?: "ltr" | "rtl"
  components: {
    callout: CalloutTranslation
    backlinks: {
@@ -5,6 +5,7 @@ export default {
    title: "بدون عنوان",
    description: "توضیح خاصی اضافه نشده است",
  },
+  direction: "rtl" as const,
  components: {
    callout: {
      note: "یادداشت",
@@ -0,0 +1,88 @@
+import { Translation } from "./definition"
+
+export default {
+  propertyDefaults: {
+    title: "ללא כותרת",
+    description: "לא סופק תיאור",
+  },
+  direction: "rtl" as const,
+  components: {
+    callout: {
+      note: "הערה",
+      abstract: "תקציר",
+      info: "מידע",
+      todo: "לעשות",
+      tip: "טיפ",
+      success: "הצלחה",
+      question: "שאלה",
+      warning: "אזהרה",
+      failure: "כשלון",
+      danger: "סכנה",
+      bug: "באג",
+      example: "דוגמה",
+      quote: "ציטוט",
+    },
+    backlinks: {
+      title: "קישורים חוזרים",
+      noBacklinksFound: "לא נמצאו קישורים חוזרים",
+    },
+    themeToggle: {
+      lightMode: "מצב בהיר",
+      darkMode: "מצב כהה",
+    },
+    readerMode: {
+      title: "מצב קריאה",
+    },
+    explorer: {
+      title: "סייר",
+    },
+    footer: {
+      createdWith: "נוצר באמצעות",
+    },
+    graph: {
+      title: "מבט גרף",
+    },
+    recentNotes: {
+      title: "הערות אחרונות",
+      seeRemainingMore: ({ remaining }) => `עיין ב ${remaining} נוספים →`,
+    },
+    transcludes: {
+      transcludeOf: ({ targetSlug }) => `מצוטט מ ${targetSlug}`,
+      linkToOriginal: "קישור למקורי",
+    },
+    search: {
+      title: "חיפוש",
+      searchBarPlaceholder: "חפשו משהו",
+    },
+    tableOfContents: {
+      title: "תוכן עניינים",
+    },
+    contentMeta: {
+      readingTime: ({ minutes }) => `${minutes} דקות קריאה`,
+    },
+  },
+  pages: {
+    rss: {
+      recentNotes: "הערות אחרונות",
+      lastFewNotes: ({ count }) => `${count} הערות אחרונות`,
+    },
+    error: {
+      title: "לא נמצא",
+      notFound: "העמוד הזה פרטי או לא קיים.",
+      home: "חזרה לעמוד הבית",
+    },
+    folderContent: {
+      folder: "תיקייה",
+      itemsUnderFolder: ({ count }) =>
+        count === 1 ? "פריט אחד תחת תיקייה זו." : `${count} פריטים תחת תיקייה זו.`,
+    },
+    tagContent: {
+      tag: "תגית",
+      tagIndex: "מפתח התגיות",
+      itemsUnderTag: ({ count }) =>
+        count === 1 ? "פריט אחד עם תגית זו." : `${count} פריטים עם תגית זו.`,
+      showingFirst: ({ count }) => `מראה את ה-${count} תגיות הראשונות.`,
+      totalTags: ({ count }) => `${count} תגיות נמצאו סך הכל.`,
+    },
+  },
+} as const satisfies Translation
@@ -8,7 +8,7 @@ export default {
  components: {
    callout: {
      note: "Nota",
-      abstract: "Astratto",
+      abstract: "Abstract",
      info: "Info",
      todo: "Da fare",
      tip: "Consiglio",
@@ -17,7 +17,7 @@ export default {
      warning: "Attenzione",
      failure: "Errore",
      danger: "Pericolo",
-      bug: "Bug",
+      bug: "Problema",
      example: "Esempio",
      quote: "Citazione",
    },
@@ -43,10 +43,11 @@ export default {
    },
    recentNotes: {
      title: "Note recenti",
-      seeRemainingMore: ({ remaining }) => `Vedi ${remaining} altro →`,
+      seeRemainingMore: ({ remaining }) =>
+        remaining === 1 ? "Vedi 1 altra →" : `Vedi altre ${remaining} →`,
    },
    transcludes: {
-      transcludeOf: ({ targetSlug }) => `Transclusione di ${targetSlug}`,
+      transcludeOf: ({ targetSlug }) => `Inclusione di ${targetSlug}`,
      linkToOriginal: "Link all'originale",
    },
    search: {
@@ -54,16 +55,16 @@ export default {
      searchBarPlaceholder: "Cerca qualcosa",
    },
    tableOfContents: {
-      title: "Tabella dei contenuti",
+      title: "Indice",
    },
    contentMeta: {
-      readingTime: ({ minutes }) => `${minutes} minuti`,
+      readingTime: ({ minutes }) => (minutes === 1 ? "1 minuto" : `${minutes} minuti`),
    },
  },
  pages: {
    rss: {
      recentNotes: "Note recenti",
-      lastFewNotes: ({ count }) => `Ultime ${count} note`,
+      lastFewNotes: ({ count }) => (count === 1 ? "Ultima nota" : `Ultime ${count} note`),
    },
    error: {
      title: "Non trovato",
@@ -80,8 +81,9 @@ export default {
      tagIndex: "Indice etichette",
      itemsUnderTag: ({ count }) =>
        count === 1 ? "1 oggetto con questa etichetta." : `${count} oggetti con questa etichetta.`,
-      showingFirst: ({ count }) => `Prime ${count} etichette.`,
-      totalTags: ({ count }) => `Trovate ${count} etichette totali.`,
+      showingFirst: ({ count }) => (count === 1 ? "Prima etichetta." : `Prime ${count} etichette.`),
+      totalTags: ({ count }) =>
+        count === 1 ? "Trovata 1 etichetta in totale." : `Trovate ${count} etichette totali.`,
    },
  },
 } as const satisfies Translation
@@ -0,0 +1,87 @@
+import { Translation } from "./definition"
+
+export default {
+  propertyDefaults: {
+    title: "Атаусыз",
+    description: "Сипаттама берілмеген",
+  },
+  components: {
+    callout: {
+      note: "Ескерту",
+      abstract: "Аннотация",
+      info: "Ақпарат",
+      todo: "Істеу керек",
+      tip: "Кеңес",
+      success: "Сәттілік",
+      question: "Сұрақ",
+      warning: "Ескерту",
+      failure: "Қате",
+      danger: "Қауіп",
+      bug: "Қате",
+      example: "Мысал",
+      quote: "Дәйексөз",
+    },
+    backlinks: {
+      title: "Артқа сілтемелер",
+      noBacklinksFound: "Артқа сілтемелер табылмады",
+    },
+    themeToggle: {
+      lightMode: "Жарық режимі",
+      darkMode: "Қараңғы режим",
+    },
+    readerMode: {
+      title: "Оқу режимі",
+    },
+    explorer: {
+      title: "Зерттеуші",
+    },
+    footer: {
+      createdWith: "Құрастырылған құрал:",
+    },
+    graph: {
+      title: "Граф көрінісі",
+    },
+    recentNotes: {
+      title: "Соңғы жазбалар",
+      seeRemainingMore: ({ remaining }) => `Тағы ${remaining} жазбаны қарау →`,
+    },
+    transcludes: {
+      transcludeOf: ({ targetSlug }) => `${targetSlug} кірістіру`,
+      linkToOriginal: "Бастапқыға сілтеме",
+    },
+    search: {
+      title: "Іздеу",
+      searchBarPlaceholder: "Бірдеңе іздеу",
+    },
+    tableOfContents: {
+      title: "Мазмұны",
+    },
+    contentMeta: {
+      readingTime: ({ minutes }) => `${minutes} мин оқу`,
+    },
+  },
+  pages: {
+    rss: {
+      recentNotes: "Соңғы жазбалар",
+      lastFewNotes: ({ count }) => `Соңғы ${count} жазба`,
+    },
+    error: {
+      title: "Табылмады",
+      notFound: "Бұл бет жеке немесе жоқ болуы мүмкін.",
+      home: "Басты бетке оралу",
+    },
+    folderContent: {
+      folder: "Қалта",
+      itemsUnderFolder: ({ count }) =>
+        count === 1 ? "Бұл қалтада 1 элемент бар." : `Бұл қалтада ${count} элемент бар.`,
+    },
+    tagContent: {
+      tag: "Тег",
+      tagIndex: "Тегтер индексі",
+      itemsUnderTag: ({ count }) =>
+        count === 1 ? "Бұл тегпен 1 элемент." : `Бұл тегпен ${count} элемент.`,
+      showingFirst: ({ count }) => `Алғашқы ${count} тег көрсетілуде.`,
+      totalTags: ({ count }) => `Барлығы ${count} тег табылды.`,
+    },
+  },
+} as const satisfies Translation
@@ -1,7 +1,7 @@
-import { FilePath, joinSegments } from "../../util/path"
 import { QuartzEmitterPlugin } from "../types"
-import fs from "fs"
+import { write } from "./helpers"
 import { styleText } from "util"
+import { FullSlug } from "../../util/path"

 export function extractDomainFromBaseUrl(baseUrl: string) {
  const url = new URL(`https://${baseUrl}`)
@@ -10,20 +10,25 @@ export function extractDomainFromBaseUrl(baseUrl: string) {

 export const CNAME: QuartzEmitterPlugin = () => ({
  name: "CNAME",
-  async emit({ argv, cfg }) {
-    if (!cfg.configuration.baseUrl) {
+  async emit(ctx) {
+    if (!ctx.cfg.configuration.baseUrl) {
      console.warn(
        styleText("yellow", "CNAME emitter requires `baseUrl` to be set in your configuration"),
      )
      return []
    }
-    const path = joinSegments(argv.output, "CNAME")
-    const content = extractDomainFromBaseUrl(cfg.configuration.baseUrl)
+    const content = extractDomainFromBaseUrl(ctx.cfg.configuration.baseUrl)
    if (!content) {
      return []
    }
-    await fs.promises.writeFile(path, content)
-    return [path] as FilePath[]
+
+    const path = await write({
+      ctx,
+      content,
+      slug: "CNAME" as FullSlug,
+      ext: "",
+    })
+    return [path]
  },
  async *partialEmit() {},
 })
@@ -241,6 +241,16 @@ function addGlobalPageResources(ctx: BuildCtx, componentResources: ComponentReso
      vercelInsightsScript.defer = true
      document.head.appendChild(vercelInsightsScript)
    `)
+  } else if (cfg.analytics?.provider === "rybbit") {
+    componentResources.afterDOMLoaded.push(`
+      const rybbitScript = document.createElement("script");
+      rybbitScript.src = "${cfg.analytics.host ?? "https://app.rybbit.io"}/api/script.js";
+      rybbitScript.setAttribute("data-site-id", "${cfg.analytics.siteId}");
+      rybbitScript.async = true;
+      rybbitScript.defer = true;
+
+      document.head.appendChild(rybbitScript);
+    `)
  }

  if (cfg.enableSPA) {
@@ -103,7 +103,6 @@ export const FrontMatter: QuartzTransformerPlugin<Partial<Options>> = (userOpts)
            const created = coalesceAliases(data, ["created", "date"])
            if (created) {
              data.created = created
-              data.modified ||= created // if modified is not set, use created
            }

            const modified = coalesceAliases(data, [
@@ -113,6 +112,8 @@ export const FrontMatter: QuartzTransformerPlugin<Partial<Options>> = (userOpts)
              "last-modified",
            ])
            if (modified) data.modified = modified
+            data.modified ||= created // if modified is not set, use created
+
            const published = coalesceAliases(data, ["published", "publishDate", "date"])
            if (published) data.published = published

@@ -57,7 +57,7 @@ export const CrawlLinks: QuartzTransformerPlugin<Partial<Options>> = (userOpts)
              ) {
                let dest = node.properties.href as RelativeURL
                const classes = (node.properties.className ?? []) as string[]
-                const isExternal = isAbsoluteUrl(dest)
+                const isExternal = isAbsoluteUrl(dest, { httpOnly: false })
                classes.push(isExternal ? "external" : "internal")

                if (isExternal && opts.externalLinkIcon) {
@@ -99,7 +99,9 @@ export const CrawlLinks: QuartzTransformerPlugin<Partial<Options>> = (userOpts)
                }

                // don't process external links or intra-document anchors
-                const isInternal = !(isAbsoluteUrl(dest) || dest.startsWith("#"))
+                const isInternal = !(
+                  isAbsoluteUrl(dest, { httpOnly: false }) || dest.startsWith("#")
+                )
                if (isInternal) {
                  dest = node.properties.href = transformLink(
                    file.data.slug!,
@@ -145,7 +147,7 @@ export const CrawlLinks: QuartzTransformerPlugin<Partial<Options>> = (userOpts)
                  node.properties.loading = "lazy"
                }

-                if (!isAbsoluteUrl(node.properties.src)) {
+                if (!isAbsoluteUrl(node.properties.src, { httpOnly: false })) {
                  let dest = node.properties.src as RelativeURL
                  dest = node.properties.src = transformLink(
                    file.data.slug!,
@@ -488,16 +488,7 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<Options>>
                    {
                      data: { hProperties: { className: ["callout-content"] }, hName: "div" },
                      type: "blockquote",
-                      children: [
-                        {
-                          data: {
-                            hProperties: { className: ["callout-content-inner"] },
-                            hName: "div",
-                          },
-                          type: "blockquote",
-                          children: [...calloutContent],
-                        },
-                      ],
+                      children: [...calloutContent],
                    },
                  ]
                }
@@ -1,4 +1,6 @@
 import { QuartzTransformerPlugin } from "../types"
+import rehypeRaw from "rehype-raw"
+import { PluggableList } from "unified"

 export interface Options {
  /** Replace {{ relref }} with quartz wikilinks []() */
@@ -102,5 +104,9 @@ export const OxHugoFlavouredMarkdown: QuartzTransformerPlugin<Partial<Options>>
      }
      return src
    },
+    htmlPlugins() {
+      const plugins: PluggableList = [rehypeRaw]
+      return plugins
+    },
  }
 }
@@ -44,22 +44,8 @@ ul,
 .typst-doc * {
  color: var(--darkgray);
  fill: var(--darkgray);
-  hyphens: auto;
-}
-
-p,
-ul,
-text,
-a,
-li,
-ol,
-ul,
-.katex,
-.math,
-.typst-doc,
-.typst-doc * {
-  overflow-wrap: anywhere;
-  /* tr and td removed from list of selectors for overflow-wrap, allowing them to use default 'normal' property value */
+  overflow-wrap: break-word;
+  text-wrap: pretty;
 }

 .math {
@@ -225,7 +211,7 @@ a {
    }

    & .sidebar {
-      gap: 2rem;
+      gap: 1.2rem;
      top: 0;
      box-sizing: border-box;
      padding: $topSpacing 2rem 2rem 2rem;
@@ -11,14 +11,11 @@

  & > .callout-content {
    display: grid;
-    transition: grid-template-rows 0.3s ease;
+    transition: grid-template-rows 0.1s cubic-bezier(0.02, 0.01, 0.47, 1);
+    overflow: hidden;

-    & > .callout-content-inner {
-      overflow: hidden;
-
-      & > :first-child {
-        margin-top: 0;
-      }
+    & > :first-child {
+      margin-top: 0;
    }
  }

@@ -121,8 +118,28 @@
    --callout-icon: var(--callout-icon-quote);
  }

-  &.is-collapsed > .callout-title > .fold-callout-icon {
-    transform: rotateZ(-90deg);
+  &.is-collapsed {
+    & > .callout-title > .fold-callout-icon {
+      transform: rotateZ(-90deg);
+    }
+
+    .callout-content {
+      & > * {
+        transition:
+          height 0.1s cubic-bezier(0.02, 0.01, 0.47, 1),
+          margin 0.1s cubic-bezier(0.02, 0.01, 0.47, 1),
+          padding 0.1s cubic-bezier(0.02, 0.01, 0.47, 1);
+        overflow-y: clip;
+        height: 0;
+        margin-bottom: 0;
+        margin-top: 0;
+        padding-bottom: 0;
+        padding-top: 0;
+      }
+      & > :first-child {
+        margin-top: -1rem;
+      }
+    }
  }
 }