# KaTeX files

public/*.min.css

public/fonts/KaTeX_**.ttf

public/fonts/KaTeX_**.woff

public/fonts/KaTeX_**.woff2

# Twemoji Assets

public/twemoji/*.svg

    <script type="module">

      // Make global 'Buffer' available to legacy modules.

      import { Buffer } from "buffer";

      window.Buffer = Buffer;

    </script>

      "hasInstallScript": true,

        "@radicle/gray-matter": "4.1.0",

        "@wooorm/starry-night": "^3.5.0",

        "hast-util-to-dom": "^4.0.0",

        "marked": "^14.1.2",

        "marked-emoji": "^1.4.2",

        "marked-footnote": "^1.2.4",

        "marked-katex-extension": "^5.1.2",

        "marked-linkify-it": "^3.1.11",

        "twemoji": "^14.0.2",

    "node_modules/@radicle/gray-matter": {

      "version": "4.1.0",

      "resolved": "https://registry.npmjs.org/@radicle/gray-matter/-/gray-matter-4.1.0.tgz",

      "integrity": "sha512-Cbdz8QMzIuZXxeGpJtvnNiMYF4YTOJn1EDsEZ0GsgCVWVL96LGPZIu30/bEtw2U8p7anZuQNqa4ugqB+qsEjqw==",

      "dev": true,

      "dependencies": {

        "js-yaml": "^4.1.0",

        "kind-of": "^6.0.2",

        "section-matter": "^1.0.0",

        "strip-bom-string": "^1.0.0"

      },

      "engines": {

        "node": ">=6.0"

      }

    },

    "node_modules/@types/hast": {

      "version": "3.0.4",

      "resolved": "https://registry.npmjs.org/@types/hast/-/hast-3.0.4.tgz",

      "integrity": "sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==",

      "dev": true,

      "dependencies": {

        "@types/unist": "*"

      }

    },

    "node_modules/@types/katex": {

      "version": "0.16.7",

      "resolved": "https://registry.npmjs.org/@types/katex/-/katex-0.16.7.tgz",

      "integrity": "sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==",

      "dev": true

    },

    "node_modules/@types/linkify-it": {

      "version": "5.0.0",

      "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",

      "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==",

      "dev": true

    },

      "version": "20.16.7",

      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.16.7.tgz",

      "integrity": "sha512-QkDQjAY3gkvJNcZOWwzy3BN34RweT0OQ9zJyvLCU0kSK22dO2QYh/NHGfbEAYylPYzRB1/iXcojS79wOg5gFSw==",

    "node_modules/@types/unist": {

      "version": "3.0.3",

      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.3.tgz",

      "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==",

      "dev": true

    },

    "node_modules/@wooorm/starry-night": {

      "version": "3.5.0",

      "resolved": "https://registry.npmjs.org/@wooorm/starry-night/-/starry-night-3.5.0.tgz",

      "integrity": "sha512-nYnfdeWS0ApqIFqr4ezLjr6pyYuqiG5Ywc2aJ4u1EY3qzf2oCTfLv7sMjEQSuSzPWUIH+a39eVbGUiRrFKZElA==",

      "dev": true,

      "dependencies": {

        "@types/hast": "^3.0.0",

        "import-meta-resolve": "^4.0.0",

        "vscode-oniguruma": "^2.0.0",

        "vscode-textmate": "^9.0.0"

      },

      "funding": {

        "type": "github",

        "url": "https://github.com/sponsors/wooorm"

      }

    },

    "node_modules/commander": {

      "version": "8.3.0",

      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",

      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",

      "dev": true,

      "peer": true,

      "engines": {

        "node": ">= 12"

      }

    },

    "node_modules/extend-shallow": {

      "version": "2.0.1",

      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",

      "integrity": "sha512-zCnTtlxNoAiDc3gqY2aYAWFx7XWWiasuF2K8Me5WbN8otHKTUKBwjPtNpRs/rbUZm7KxWAaNj7P1a/p52GbVug==",

      "dev": true,

      "dependencies": {

        "is-extendable": "^0.1.0"

      },

      "engines": {

        "node": ">=0.10.0"

      }

    },

    "node_modules/fs-extra": {

      "version": "8.1.0",

      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz",

      "integrity": "sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==",

      "dev": true,

      "dependencies": {

        "graceful-fs": "^4.2.0",

        "jsonfile": "^4.0.0",

        "universalify": "^0.1.0"

      },

      "engines": {

        "node": ">=6 <7 || >=8"

      }

    },

    "node_modules/fs-extra/node_modules/jsonfile": {

      "version": "4.0.0",

      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",

      "integrity": "sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==",

      "dev": true,

      "optionalDependencies": {

        "graceful-fs": "^4.1.6"

      }

    },

    "node_modules/graceful-fs": {

      "version": "4.2.11",

      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",

      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",

      "dev": true

    },

    "node_modules/hast-util-to-dom": {

      "version": "4.0.0",

      "resolved": "https://registry.npmjs.org/hast-util-to-dom/-/hast-util-to-dom-4.0.0.tgz",

      "integrity": "sha512-oW7RScutPE58LfjuVUNvvH0+6rB89mAm/pkDqD3bdj9g6xKQlMcuW6yBmovbpDKkvYI2apPKmHZMtc9KiZTywA==",

      "dev": true,

      "dependencies": {

        "@types/hast": "^3.0.0",

        "property-information": "^6.0.0",

        "web-namespaces": "^2.0.0"

      },

      "funding": {

        "type": "opencollective",

        "url": "https://opencollective.com/unified"

      }

    },

    "node_modules/import-meta-resolve": {

      "version": "4.1.0",

      "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.1.0.tgz",

      "integrity": "sha512-I6fiaX09Xivtk+THaMfAwnA3MVA5Big1WHF1Dfx9hFuvNIWpXnorlkzhcQf6ehrqQiiZECRt1poOAkPmer3ruw==",

      "dev": true,

      "funding": {

        "type": "github",

        "url": "https://github.com/sponsors/wooorm"

      }

    },

    "node_modules/is-extendable": {

      "version": "0.1.1",

      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",

      "integrity": "sha512-5BMULNob1vgFX6EjQw5izWDxrecWK9AM72rugNr0TFldMOi0fj6Jk+zeKIt0xGj4cEfQIJth4w3OKWOJ4f+AFw==",

      "dev": true,

      "engines": {

        "node": ">=0.10.0"

      }

    },

    "node_modules/jsonfile": {

      "version": "5.0.0",

      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-5.0.0.tgz",

      "integrity": "sha512-NQRZ5CRo74MhMMC3/3r5g2k4fjodJ/wh8MxjFbCViWKFjxrnudWSY5vomh+23ZaXzAS7J3fBZIR2dV6WbmfM0w==",

      "dev": true,

      "dependencies": {

        "universalify": "^0.1.2"

      },

      "optionalDependencies": {

        "graceful-fs": "^4.1.6"

      }

    },

    "node_modules/katex": {

      "version": "0.16.11",

      "resolved": "https://registry.npmjs.org/katex/-/katex-0.16.11.tgz",

      "integrity": "sha512-RQrI8rlHY92OLf3rho/Ts8i/XvjgguEjOkO1BEXcU3N8BqPpSzBNwV/G0Ukr+P/l3ivvJUE/Fa/CwbS6HesGNQ==",

      "dev": true,

      "funding": [

        "https://opencollective.com/katex",

        "https://github.com/sponsors/katex"

      ],

      "peer": true,

      "dependencies": {

        "commander": "^8.3.0"

      },

      "bin": {

        "katex": "cli.js"

      }

    },

    "node_modules/kind-of": {

      "version": "6.0.3",

      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",

      "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",

      "dev": true,

      "engines": {

        "node": ">=0.10.0"

      }

    },

    "node_modules/linkify-it": {

      "version": "5.0.0",

      "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",

      "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==",

      "dev": true,

      "dependencies": {

        "uc.micro": "^2.0.0"

      }

    },

    "node_modules/marked": {

      "version": "14.1.2",

      "resolved": "https://registry.npmjs.org/marked/-/marked-14.1.2.tgz",

      "integrity": "sha512-f3r0yqpz31VXiDB/wj9GaOB0a2PRLQl6vJmXiFrniNwjkKdvakqJRULhjFKJpxOchlCRiG5fcacoUZY5Xa6PEQ==",

      "dev": true,

      "bin": {

        "marked": "bin/marked.js"

      },

      "engines": {

        "node": ">= 18"

      }

    },

    "node_modules/marked-emoji": {

      "version": "1.4.2",

      "resolved": "https://registry.npmjs.org/marked-emoji/-/marked-emoji-1.4.2.tgz",

      "integrity": "sha512-2sP+bp2z76dwbILzQ7ijy2PyjjAJR3iAZCzaNGThD2UijFUBeidkn6MoCdX/j47tPIcWt9nwnjqRQPd01ZrfdA==",

      "dev": true,

      "peerDependencies": {

        "marked": ">=4 <15"

      }

    },

    "node_modules/marked-footnote": {

      "version": "1.2.4",

      "resolved": "https://registry.npmjs.org/marked-footnote/-/marked-footnote-1.2.4.tgz",

      "integrity": "sha512-DB2Kl+wFh6YwZd70qABMY6WUkG1UuyqoNTFoDfGyG79Pz24neYtLBkB+45a7o72V7gkfvbC3CGzIYFobxfMT1Q==",

      "dev": true,

      "peerDependencies": {

        "marked": ">=7.0.0"

      }

    },

    "node_modules/marked-katex-extension": {

      "version": "5.1.2",

      "resolved": "https://registry.npmjs.org/marked-katex-extension/-/marked-katex-extension-5.1.2.tgz",

      "integrity": "sha512-jRtacvDAPULKBWArDno0IGpzzpUw12yb8OaEsv3dTlvcIr21+mF9kD+Bxo2m/ErX/2ZIml6zFVMnpxCpqx3stw==",

      "dev": true,

      "dependencies": {

        "@types/katex": "^0.16.7"

      },

      "peerDependencies": {

        "katex": ">=0.16 <0.17",

        "marked": ">=4 <15"

      }

    },

    "node_modules/marked-linkify-it": {

      "version": "3.1.11",

      "resolved": "https://registry.npmjs.org/marked-linkify-it/-/marked-linkify-it-3.1.11.tgz",

      "integrity": "sha512-xcrc9c4PMQdUoEO8dE6HLW80ShrolXBqqmJz1c9XdM5t/D0fzXXZ+FJOM4wqhs1AOfpjLipPQKmkcxA5cSFykw==",

      "dev": true,

      "dependencies": {

        "@types/linkify-it": "^5.0.0",

        "linkify-it": "^5.0.0"

      },

      "peerDependencies": {

        "marked": ">=4 <15"

      }

    },

    "node_modules/property-information": {

      "version": "6.5.0",

      "resolved": "https://registry.npmjs.org/property-information/-/property-information-6.5.0.tgz",

      "integrity": "sha512-PgTgs/BlvHxOu8QuEN7wi5A0OmXaBcHpmCSTehcs6Uuu9IkDIEo13Hy7n898RHfrQ49vKCoGeWZSaAK01nwVig==",

      "dev": true,

      "funding": {

        "type": "github",

        "url": "https://github.com/sponsors/wooorm"

      }

    },

    "node_modules/section-matter": {

      "version": "1.0.0",

      "resolved": "https://registry.npmjs.org/section-matter/-/section-matter-1.0.0.tgz",

      "integrity": "sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==",

      "dev": true,

      "dependencies": {

        "extend-shallow": "^2.0.1",

        "kind-of": "^6.0.0"

      },

      "engines": {

        "node": ">=4"

      }

    },

    "node_modules/strip-bom-string": {

      "version": "1.0.0",

      "resolved": "https://registry.npmjs.org/strip-bom-string/-/strip-bom-string-1.0.0.tgz",

      "integrity": "sha512-uCC2VHvQRYu+lMh4My/sFNmF2klFymLX1wHJeXnbEJERpV/ZsVuonzerjfrGpIGF7LBVa1O7i9kjiWvJiFck8g==",

      "dev": true,

      "engines": {

        "node": ">=0.10.0"

      }

    },

      "version": "5.0.0-next.259",

      "resolved": "https://registry.npmjs.org/svelte/-/svelte-5.0.0-next.259.tgz",

      "integrity": "sha512-trRFSjKD+11KbXerGmBT0Uc+ZSNUhxn0aQ02q9tjtig/FV24dpZlXmCrcZTZliOLS0P8JWjw6xaWgNheZZoYOg==",

    "node_modules/twemoji": {

      "version": "14.0.2",

      "resolved": "https://registry.npmjs.org/twemoji/-/twemoji-14.0.2.tgz",

      "integrity": "sha512-BzOoXIe1QVdmsUmZ54xbEH+8AgtOKUiG53zO5vVP2iUu6h5u9lN15NcuS6te4OY96qx0H7JK9vjjl9WQbkTRuA==",

      "dev": true,

      "dependencies": {

        "fs-extra": "^8.0.1",

        "jsonfile": "^5.0.0",

        "twemoji-parser": "14.0.0",

        "universalify": "^0.1.2"

      }

    },

    "node_modules/twemoji-parser": {

      "version": "14.0.0",

      "resolved": "https://registry.npmjs.org/twemoji-parser/-/twemoji-parser-14.0.0.tgz",

      "integrity": "sha512-9DUOTGLOWs0pFWnh1p6NF+C3CkQ96PWmEFwhOVmT3WbecRC+68AIqpsnJXygfkFcp4aXbOp8Dwbhh/HQgvoRxA==",

      "dev": true

    },

    "node_modules/uc.micro": {

      "version": "2.1.0",

      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",

      "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==",

      "dev": true

    },

    "node_modules/universalify": {

      "version": "0.1.2",

      "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",

      "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==",

      "dev": true,

      "engines": {

        "node": ">= 4.0.0"

      }

    },

      "version": "5.4.8",

      "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.8.tgz",

      "integrity": "sha512-FqrItQ4DT1NC4zCUqMB4c4AZORMKIa0m8/URVCZ77OZ/QSNeJ54bU1vrFADbDsuwfIPcgknRkmqakQcgnL4GiQ==",

    "node_modules/vscode-oniguruma": {

      "version": "2.0.1",

      "resolved": "https://registry.npmjs.org/vscode-oniguruma/-/vscode-oniguruma-2.0.1.tgz",

      "integrity": "sha512-poJU8iHIWnC3vgphJnrLZyI3YdqRlR27xzqDmpPXYzA93R4Gk8z7T6oqDzDoHjoikA2aS82crdXFkjELCdJsjQ==",

      "dev": true

    },

    "node_modules/vscode-textmate": {

      "version": "9.1.0",

      "resolved": "https://registry.npmjs.org/vscode-textmate/-/vscode-textmate-9.1.0.tgz",

      "integrity": "sha512-lxKSVp2DkFOx9RDAvpiYUrB9/KT1fAfi1aE8CBGstP8N7rLF+Seifj8kDA198X0mYj1CjQUC+81+nQf8CO0nVA==",

      "dev": true

    },

    "node_modules/web-namespaces": {

      "version": "2.0.1",

      "resolved": "https://registry.npmjs.org/web-namespaces/-/web-namespaces-2.0.1.tgz",

      "integrity": "sha512-bKr1DkiNa2krS7qxNtdrtHAmzuYGFQLiQ13TsorsdT6ULTkPLKuu5+GsFpDlg6JFjUTwX2DyhMPG2be8uPrqsQ==",

      "dev": true,

      "funding": {

        "type": "github",

        "url": "https://github.com/sponsors/wooorm"

      }

    },

    "build": "vite build && scripts/copy-katex-assets && scripts/install-twemoji-assets",

    "postinstall": "scripts/copy-katex-assets && scripts/install-twemoji-assets",

    "@radicle/gray-matter": "4.1.0",

    "@wooorm/starry-night": "^3.5.0",

    "hast-util-to-dom": "^4.0.0",

    "marked": "^14.1.2",

    "marked-emoji": "^1.4.2",

    "marked-footnote": "^1.2.4",

    "marked-katex-extension": "^5.1.2",

    "marked-linkify-it": "^3.1.11",

    "twemoji": "^14.0.2",

#!/usr/bin/env bash

set -Eeuo pipefail

echo "Copying katex assets into bundle directory"

cp -r node_modules/katex/dist/katex.min.css public/katex.min.css

cp -r node_modules/katex/dist/fonts/* public/fonts/

#!/usr/bin/env bash

set -Eeou pipefail

version="$(node -e 'console.log(require("twemoji/package.json").version)')"

echo "Installing Twemoji SVG assets v${version}"

curl -sSL "https://github.com/twitter/twemoji/archive/refs/tags/v${version}.tar.gz" \

  | tar -x -z -C public/twemoji/ --strip-components=3 "twemoji-${version}/assets/svg"

<script lang="ts">

  import dompurify from "dompurify";

  import matter from "@radicle/gray-matter";

  import { afterUpdate } from "svelte";

  import { toDom } from "hast-util-to-dom";

  import { Renderer, markdownWithExtensions } from "@app/lib/markdown";

  import { highlight } from "@app/lib/syntax";

  import { twemoji, scrollIntoView } from "@app/lib/utils";

  export let content: string;

  // If true, add <br> on a single line break

  export let breaks: boolean = false;

  let container: HTMLElement;

  // eslint-disable-next-line @typescript-eslint/no-explicit-any

  let frontMatter: [string, any][] | undefined = undefined;

  $: {

    try {

      const doc = matter(content);

      content = doc.content;

      frontMatter = Object.entries(doc.data).filter(

        ([, val]) => typeof val === "string" || typeof val === "number",

      );

    } catch (error) {

      console.error("Not able to parse frontmatter: ", error);

    }

  }

  function render(content: string): string {

    return dompurify.sanitize(

      markdownWithExtensions.parse(content, {

        renderer: new Renderer(),

        breaks,

      }) as string,

    );

  }

  afterUpdate(async () => {

    for (const e of container.querySelectorAll("a")) {

      try {

        const url = new URL(e.href);

        if (url.origin !== window.origin) {

          e.target = "_blank";

        }

      } catch (e) {

        console.warn("Not able to parse url", e);

      }

      // Don't underline <a> tags that contain images.

      // Make an exception for emojis.

      if (

        e.firstElementChild instanceof HTMLImageElement &&

        !e.firstElementChild.classList.contains("txt-emoji")

      ) {

        e.classList.add("no-underline");

      }

    }

    // Replace standard HTML checkboxes with our custom radicle-icon-small element

    for (const i of container.querySelectorAll('input[type="checkbox"]')) {

      i.parentElement?.classList.add("task-item");

      const checkbox = document.createElement("radicle-icon-small");

      const checked = i.getAttribute("checked");

      checkbox.setAttribute(

        "name",

        checked === null ? "checkbox-unchecked" : "checkbox-checked",

      );

      i.insertAdjacentElement("beforebegin", checkbox);

      i.remove();

    }

    // Replaces code blocks in the background with highlighted code.

    const prefix = "language-";

    const nodes = Array.from(document.body.querySelectorAll("pre code"));

    const treeChanges: Promise<void>[] = [];

    for (const node of nodes) {

      const className = Array.from(node.classList).find(name =>

        name.startsWith(prefix),

      );

      if (!className) continue;

      treeChanges.push(

        highlight(node.textContent ?? "", className.slice(prefix.length))

          .then(tree => {

            if (tree) {

              node.replaceChildren(toDom(tree, { fragment: true }));

            }

          })

          .catch(e => console.warn("Not able to highlight code block", e)),

      );

    }

    await Promise.allSettled(treeChanges);

    if (window.location.hash) {

      scrollIntoView(window.location.hash.substring(1));

    }

  });

</script>

<style>

  :global(html) {

    scroll-padding-top: 4rem;

  }

  .markdown {

    word-break: break-word;

    -webkit-touch-callout: initial;

    -webkit-user-select: text;

    user-select: text;

  }

  .front-matter {

    font-size: var(--font-size-tiny);

    font-family: var(--font-family-monospace);

    border: 1px dashed var(--color-border-default);

    padding: 0.5rem;

    margin-bottom: 2rem;

  }

  .front-matter table {

    border-collapse: collapse;

  }

  .front-matter table td {

    padding: 0.125rem 1rem;

  }

  .front-matter table td:first-child {

    padding-left: 0.5rem;

  }

  .markdown :global(h1) {

    font-size: calc(var(--font-size-x-large) * 0.75);

    font-weight: var(--font-weight-semibold);

    padding: 1rem 0 0.5rem 0;

    margin: 0 0 0.75rem;

    border-bottom: 1px solid var(--color-border-hint);

  }

  .markdown :global(h2) {

    font-size: var(--font-size-medium);

    font-weight: var(--font-weight-regular);

    padding: 0.25rem 0;

    margin: 2rem 0 0.5rem;

    border-bottom: 1px solid var(--color-border-hint);

  }

  .markdown :global(.pre-wrapper) {

    position: relative;

    margin: 1rem 0;

  }

  .markdown :global(radicle-clipboard) {

    display: none;

    position: absolute;

    right: 0.5rem;

    top: 0.5rem;

  }

  .markdown :global(radicle-clipboard) {

    background-color: var(--color-fill-ghost);

  }

  .markdown :global(.pre-wrapper:hover > radicle-clipboard) {

    display: flex;

  }

  .markdown :global(h3) {

    font-size: calc(var(--font-size-medium) * 0.9);

    font-weight: var(--font-weight-semibold);

    padding: 0.5rem 0;

    margin: 1rem 0 0.25rem;

  }

  .markdown :global(h4) {

    font-weight: var(--font-weight-semibold);

    font-size: var(--font-size-regular);

    padding: 0.5rem 0;

    margin: 1rem 0 0.125rem;

  }

  .markdown :global(h5),

  .markdown :global(h6) {

    font-weight: var(--font-weight-semibold);

    font-size: var(--font-size-small);

    padding: 0.35rem 0;

    margin: 1rem 0 0.125rem;

  }

  .markdown :global(h6) {

    color: var(--color-foreground-dim);

  }

  .markdown :global(p) {

    line-height: 1.625rem;

    margin-top: 0;

    margin-bottom: 0.625rem;

  }

  .markdown :global(p:only-child) {

    margin-bottom: 0;

  }

  .markdown :global(li.task-item) {

    display: flex;

    align-items: center;

    gap: 0.5rem;

    margin-left: -1.2rem;

    color: var(--color-foreground-dim);

  }

  .markdown :global(li.task-item:not(:last-child)) {

    margin-bottom: 0.25rem;

  }

  .markdown :global(blockquote) {

    color: var(--color-foreground-dim);

    border-left: 0.3rem solid var(--color-fill-ghost);

    padding: 0 0 0 1rem;

    margin: 1rem 0 1rem 0;

  }

  .markdown :global(strong) {

    font-weight: var(--font-weight-semibold);

  }

  .markdown :global(.footnote-ref) {

    vertical-align: top;

    position: relative;

    top: -0.4rem;

  }

  .markdown :global(.footnote-ref),

  .markdown :global(.footnote > .marker),

  .markdown :global(.footnote > .ref-arrow) {

    color: var(--color-foreground-dim);

  }

  .markdown :global(.footnote-ref:hover),

  .markdown :global(.footnote .ref-arrow:hover) {

    color: var(--color-background-default);

  }

  .markdown :global(.footnote) {

    margin-bottom: 0;

  }

  .markdown :global(img) {

    border-style: none;

    max-width: 100%;

  }

  .markdown :global(code) {

    font-family: var(--font-family-monospace);

    font-size: var(--font-size-small);

    background-color: var(--color-fill-ghost);

    padding: 0.125rem 0.25rem;

  }

  .markdown :global(pre > code) {

    background: none;

    padding: 0;

  }

  .markdown :global(:not(pre) > code) {

    font-size: inherit;

  }

  .markdown :global(pre) {

    font-family: var(--font-family-monospace);

    font-size: var(--font-size-regular);

    background-color: var(--color-fill-ghost);

    padding: 1rem !important;

    overflow: scroll;

    scrollbar-width: none;

  }

  .markdown :global(pre::-webkit-scrollbar) {

    display: none;

  }

  .markdown :global(a),

  .markdown :global(a > code) {

    color: var(--color-foreground-contrast);

    background: none;

    padding: 0;

  }

  .markdown :global(a) {

    text-decoration: underline;

    text-decoration-color: var(--color-foreground-dim);

  }

  .markdown :global(a.no-underline) {

    text-decoration: none;

  }

  .markdown :global(a:hover) {

    text-decoration-color: var(--color-foreground-contrast);

  }

  .markdown :global(hr) {

    height: 0;

    margin: 1rem 0;

    overflow: hidden;

    background: transparent;

    border: 0;

    border-bottom: 1px solid var(--color-border-hint);

  }

  .markdown :global(ol) {

    line-height: 1.625;

    list-style-type: decimal;

    margin-bottom: 1rem;

    padding-left: 1.5rem;

  }

  .markdown :global(ul) {

    line-height: 1.625;

    list-style-type: inherit;

    padding-left: 1.25rem;

    margin-bottom: 1rem;

  }

  .markdown :global(.list-content) {

    margin: 1rem 0;

  }

  /* Allows the parent to specify its own bottom margin */

  .markdown :global(> :last-child) {

    margin-bottom: 0;

  }

  .markdown :global(li > ul) {

    margin-bottom: 0rem;

  }

  .markdown :global(li > ol) {

    margin-bottom: 0rem;

  }

  .markdown :global(table) {

    margin: 1.5rem 0;

    border-collapse: collapse;

    border-style: hidden;

    box-shadow: 0 0 0 1px var(--color-border-hint);

    overflow: hidden;

  }

  .markdown :global(td) {

    text-align: left;

    text-overflow: ellipsis;

    border: 1px solid var(--color-border-hint);

    padding: 0.5rem 1rem;

  }

  .markdown :global(tr:nth-child(even)) {

    background-color: var(--color-background-default);

  }

  .markdown :global(th) {

    text-align: center;

    padding: 0.5rem 1rem;

  }

  .markdown :global(*:first-child:not(pre)) {

    padding-top: 0 !important;

  }

  .markdown :global(*:first-child) {

    margin-top: 0 !important;

  }

  .markdown :global(dl dt) {

    font-style: italic;

    margin-top: 1rem;

  }

  .markdown :global(dl dd) {

    margin: 0 0 0 2rem;

  }

</style>

{#if frontMatter && frontMatter.length > 0}

  <div class="front-matter">

    <table>

      {#each frontMatter as [key, val]}

        <!-- svelte-ignore node_invalid_placement_ssr -->

        <tr>

          <td><span class="txt-bold">{key}</span></td>

          <td>{val}</td>

        </tr>

      {/each}

    </table>

  </div>

{/if}

<div class="markdown" bind:this={container} use:twemoji={{ exclude: ["21a9"] }}>

  {@html render(content)}

</div>

/* eslint-disable @typescript-eslint/naming-convention */

const emojis: { [key: string]: string } = {

  100: "💯",

  question: "❓",

  exclamation: "❗",

  sunrise: "🌅",

  rainbow: "🌈",

  ocean: "🌊",

  volcano: "🌋",

  seedling: "🌱",

  maple_leaf: "🍁",

  wood: "🪵",

  evergreen_tree: "🌲",

  gift: "🎁",

  santa: "🎅",

  tada: "🎉",

  art: "🎨",

  dart: "🎯",

  bug: "🐛",

  wave: "👋",

  ok_hand: "👌",

  building_construction: "🏗️",

  "+1": "👍",

  thumbsup: "👍",

  "-1": "👎",

  thumbsdown: "👎",

  clap: "👏",

  open_hands: "👐",

  ghost: "👻",

  alien: "👽",

  skull: "💀",

  boom: "💥",

  poop: "💩",

  muscle: "💪",

  mage: "🧙‍♀️",

  bow: "🙇‍♂️",

  see_no_evil: "🙈",

  hear_no_evil: "🙉",

  speak_no_evil: "🙊",

  pray: "🙏",

  rocket: "🚀",

  construction: "🚧",

  rotating_light: "🚨",

  no_entry_sign: "🚫",

  clown_face: "🤡",

};

export default emojis;

import type { MarkedExtension, Tokens } from "marked";

import dompurify from "dompurify";

import katexMarkedExtension from "marked-katex-extension";

import markedFootnote from "marked-footnote";

import markedLinkifyIt from "marked-linkify-it";

import { Marked, Renderer as BaseRenderer } from "marked";

import { markedEmoji } from "marked-emoji";

import emojis from "@app/lib/emojis";

dompurify.setConfig({

  // eslint-disable-next-line @typescript-eslint/naming-convention

  SANITIZE_DOM: false,

  // eslint-disable-next-line @typescript-eslint/naming-convention

  FORBID_TAGS: ["textarea", "style"],

});

// Converts self closing anchor tags into empty anchor tags, to avoid erratic wrapping behaviour

// e.g. <a name="test"/> -> <a name="test"></a>

const anchorMarkedExtension = {

  name: "sanitizedAnchor",

  level: "block",

  start: (src: string) => src.match(/<a name="([\w]+)"\/>/)?.index,

  tokenizer(src: string) {

    const match = src.match(/^<a name="([\w]+)"\/>/);

    if (match) {

      return {

        type: "sanitizedAnchor",

        raw: match[0],

        text: match[1].trim(),

      };

    }

  },

  renderer: (token: Tokens.Generic): string => `<a name="${token.text}"></a>`,

};

export class Renderer extends BaseRenderer {

  /**

   * If `baseUrl` is provided, all hrefs attributes in anchor tags, except those

   * starting with `#`, are resolved with respect to `baseUrl`

   */

  constructor() {

    super();

  }

  // Overwrites the rendering of heading tokens.

  // Since there are possible non ASCII characters in headings,

  // we escape them by replacing them with dashes and,

  // trim eventual dashes on each side of the string.

  heading({ tokens, depth }: Tokens.Heading) {

    const text = this.parser.parseInline(tokens);

    const escapedText = text

      // By lowercasing we avoid casing mismatches, between headings and links.

      .toLowerCase()

      .replace(/[^\w]+/g, "-")

      .replace(/^-|-$/g, "");

    return `<h${depth} id="${escapedText}">${text}</h${depth}>`;

  }

  link({ href, title, tokens }: Tokens.Link): string {

    const text = this.parser.parseInline(tokens);

    if (href.startsWith("#")) {

      // By lowercasing we avoid casing mismatches, between headings and links.

      return `<a ${title ? `title="${title}"` : ""} href="${href.toLowerCase()}">${text}</a>`;

    }

    return `<a ${title ? `title="${title}"` : ""} href="${href}">${text}</a>`;

  }

}

export default new Marked();

export const markdownWithExtensions = new Marked(

  katexMarkedExtension({ throwOnError: false }),

  markedLinkifyIt({}, { fuzzyLink: false }),

  markedFootnote({ refMarkers: true }),

  markedEmoji({ emojis }),

  ((): MarkedExtension => ({

    extensions: [anchorMarkedExtension],

  }))(),

);

import type { ElementContent, Root } from "hast";

import onigurumaWASMUrl from "vscode-oniguruma/release/onig.wasm?url";

import sourceAsciiDoc from "@wooorm/starry-night/text.html.asciidoc";

import sourceDockerfile from "@wooorm/starry-night/source.dockerfile";

import sourceErlang from "@wooorm/starry-night/source.erlang";

import sourceSolidity from "@wooorm/starry-night/source.solidity";

import sourceSvelte from "@wooorm/starry-night/source.svelte";

import sourceSass from "@wooorm/starry-night/source.sass";

import sourceToml from "@wooorm/starry-night/source.toml";

import sourceTsx from "@wooorm/starry-night/source.tsx";

import sourceNix from "@wooorm/starry-night/source.nix";

import sourceGitconfig from "@wooorm/starry-night/source.gitconfig";

import sourceGitignore from "@wooorm/starry-night/source.gitignore";

import sourceGitrevlist from "@wooorm/starry-night/source.git-revlist";

import sourceGitattributes from "@wooorm/starry-night/source.gitattributes";

import sourceJson from "@wooorm/starry-night/source.json";

import sourceNpmrc from "@wooorm/starry-night/source.ini.npmrc";

import sourceGradle from "@wooorm/starry-night/source.groovy.gradle";

import sourceBatchfile from "@wooorm/starry-night/source.batchfile";

import sourceEditorconfig from "@wooorm/starry-night/source.editorconfig";

import sourceHaproxyConfig from "@wooorm/starry-night/source.haproxy-config";

import sourceDotenv from "@wooorm/starry-night/source.dotenv";

import sourceZig from "@wooorm/starry-night/source.zig";

import textHtmlVue from "@wooorm/starry-night/text.html.vue";

import textHtmlDjango from "@wooorm/starry-night/text.html.django";

import textRobotsTxt from "@wooorm/starry-night/text.robots-txt";

import textZoneFile from "@wooorm/starry-night/text.zone_file";

import etc from "@wooorm/starry-night/etc";

import goMod from "@wooorm/starry-night/go.mod";

import goSum from "@wooorm/starry-night/go.sum";

import { createStarryNight, common, type Grammar } from "@wooorm/starry-night";

export { type Root };

export const grammars = [

  ...common,

  sourceAsciiDoc,

  sourceToml,

  sourceErlang,

  sourceSolidity,

  sourceSvelte,

  sourceSass,

  sourceTsx,

  sourceDockerfile,

  sourceNix,

  sourceGitconfig,

  sourceGitignore,

  sourceGitrevlist,

  sourceGitattributes,

  sourceNpmrc,

  sourceGradle,

  sourceBatchfile,

  sourceEditorconfig,

  sourceHaproxyConfig,

  sourceDotenv,

  sourceZig,

  textHtmlVue,

  textHtmlDjango,

  textRobotsTxt,

  textZoneFile,

  etc,

  goMod,

  goSum,

  {

    extensions: [".hintrc"],

    names: ["json"],

    patterns: [sourceJson],

    scopeName: "source.json",

  },

  {

    extensions: [

      ".npmignore",

      ".eslintignore",

      ".dockerignore",

      ".nuxtignore",

      ".vscodeignore",

    ],

    names: ["ignore"],

    patterns: [sourceGitignore],

    scopeName: "source.gitignore",

  },

  {

    extensions: [".sample", ".example", ".template"],

    names: [".env.sample", ".env.example", ".env.template"],

    patterns: [sourceDotenv],

    scopeName: "source.dotenv",

  },

  {

    extensions: [".mod"],

    names: ["go.mod"],

    patterns: [goMod],

    scopeName: "go.mode",

  },

  {

    extensions: [".sum"],

    names: ["go.sum"],

    patterns: [goSum],

    scopeName: "go.sum",

  },

  // A grammar that doesn't do any parsing, but needed for files without a known filetype.

  {

    extensions: [""],

    names: ["raw-format"],

    patterns: [],

    scopeName: "text.raw",

  },

] satisfies Grammar[];

let starryNight: Awaited<ReturnType<typeof createStarryNight>>;

export async function highlight(

  content: string,

  grammar: string,

): Promise<Root> {

  if (starryNight === undefined) {

    starryNight = await createStarryNight(grammars, {

      getOnigurumaUrlFetch: () => new URL(onigurumaWASMUrl, import.meta.url),

    });

  }

  const scope = starryNight.flagToScope(grammar);

  return starryNight.highlight(content, scope ?? "text.raw");

}

export function lineNumbersGutter(tree: Root) {

  const replacement: ElementContent[] = [];

  const search = /\r?\n|\r/g;

  let index = -1;

  let start = 0;

  let startTextRemainder = "";

  let lineNumber = 0;

  while (++index < tree.children.length) {

    const child = tree.children[index];

    if (child.type === "text") {

      let textStart = 0;

      let match = search.exec(child.value);

      while (match) {

        // Nodes in this line.

        const line = tree.children.slice(start, index) as ElementContent[];

        // Prepend text from a partial matched earlier text.

        if (startTextRemainder) {

          line.unshift({ type: "text", value: startTextRemainder });

          startTextRemainder = "";

        }

        // Append text from this text.

        if (match.index > textStart) {

          line.push({

            type: "text",

            value: child.value.slice(textStart, match.index),

          });

        }

        // Add a line, and the eol.

        lineNumber += 1;

        replacement.push(createLine(line, lineNumber), {

          type: "text",

          value: match[0],

        });

        start = index + 1;

        textStart = match.index + match[0].length;

        match = search.exec(child.value);

      }

      // If we matched, make sure to not drop the text after the last line ending.

      if (start === index + 1) {

        startTextRemainder = child.value.slice(textStart);

      }

    }

  }

  const line = tree.children.slice(start) as ElementContent[];

  // Prepend text from a partial matched earlier text.

  if (startTextRemainder) {

    line.unshift({ type: "text", value: startTextRemainder });

    startTextRemainder = "";

  }

  if (line.length > 0) {

    lineNumber += 1;

    replacement.push(createLine(line, lineNumber));

  }

  // Replace children with new array.

  tree.children = replacement;

  return tree;

}

function createLine(children: ElementContent[], line: number): ElementContent {

  return {

    type: "element",

    tagName: "tr",

    properties: {

      class: "line",

      id: "L" + line,

    },

    children: [

      {

        type: "element",

        tagName: "td",

        properties: {

          className: "line-number",

        },

        children: [

          {

            type: "element",

            tagName: "a",

            properties: { href: "#L" + line },

            children: [{ type: "text", value: line.toString() }],

          },

        ],

      },

      {

        type: "element",

        tagName: "td",

        properties: {

          className: "line-content",

        },

        children: [

          {

            type: "element",

            tagName: "pre",

            properties: {

              className: "content",

            },

            children,

          },

        ],

      },

    ],

  };

}

import twemojiModule from "twemoji";

export function twemoji(

  node: HTMLElement,

  { exclude }: { exclude: string[] } = { exclude: [] },

) {

  twemojiModule.parse(node, {

    callback: (icon, options) => {

      const { base, size, ext } = options as Record<string, string>;

      if (!exclude.includes(icon)) {

        return `${base}${size}/${icon}${ext}`;

      }

      return false;

    },

    base: "/",

    folder: "twemoji",

    ext: ".svg",

    className: `txt-emoji`,

  });

}

export function scrollIntoView(id: string, options?: ScrollIntoViewOptions) {

  const lineElement = document.getElementById(id);

  if (lineElement) lineElement.scrollIntoView(options);

}