Syntax highlighting and hello world

docs/getting-started/hello-world.md

@@ -0,0 +1,21 @@
+---
+slug: /hello-world
+---
+
+# Hello World
+
+The simplest example of a program in Rue is the classic hello world example.
+
+Write the following program in a file named `hello.rue`:
+
+```rue title="hello.rue"
+fun main() -> Bytes {
+    "Hello, world!"
+}
+```
+
+Now, run the following command to run the file:
+
+```bash
+rue build hello.rue --run
+```

docs/getting-started/installation.md

@@ -12,6 +12,12 @@ You can install the Rue CLI with this command:
 cargo install rue-cli
 ```
 
+It's also useful to install [clvm_tools_rs](https://github.com/Chia-Network/clvm_tools_rs):
+
+```bash
+cargo install clvm_tools_rs
+```
+
 ## VSCode
 
 Currently the only editor with support for Rue is [Visual Studio Code](https://code.visualstudio.com).

docusaurus.config.ts

@@ -90,7 +90,7 @@ const config: Config = {
     },
     prism: {
       theme: prismThemes.github,
-      darkTheme: prismThemes.dracula,
+      darkTheme: prismThemes.oneDark,
       additionalLanguages: ["bash"],
     },
   } satisfies Preset.ThemeConfig,

package.json

@@ -21,15 +21,18 @@
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
     "prism-react-renderer": "^2.3.0",
+    "prismjs": "^1.29.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "3.4.0",
     "@docusaurus/tsconfig": "3.4.0",
     "@docusaurus/types": "3.4.0",
+    "@types/prismjs": "^1.26.4",
     "prettier": "^3.3.2",
-    "typescript": "~5.2.2"
+    "typescript": "~5.2.2",
+    "utility-types": "^3.11.0"
   },
   "browserslist": {
     "production": [

sidebars.ts

@@ -5,7 +5,7 @@ const sidebars: SidebarsConfig = {
     {
       type: "category",
       label: "Getting Started",
-      items: ["getting-started/installation"],
+      items: ["getting-started/installation", "getting-started/hello-world"],
     },
   ],
 };

src/theme/prism-include-languages.ts

@@ -0,0 +1,27 @@
+import siteConfig from "@generated/docusaurus.config";
+import type * as PrismNamespace from "prismjs";
+import type { Optional } from "utility-types";
+
+export default function prismIncludeLanguages(
+  PrismObject: typeof PrismNamespace,
+): void {
+  const {
+    themeConfig: { prism },
+  } = siteConfig;
+  const { additionalLanguages } = prism as { additionalLanguages: string[] };
+
+  globalThis.Prism = PrismObject;
+
+  additionalLanguages.forEach((lang) => {
+    if (lang === "php") {
+      // eslint-disable-next-line global-require
+      require("prismjs/components/prism-markup-templating.js");
+    }
+    // eslint-disable-next-line global-require, import/no-dynamic-require
+    require(`prismjs/components/prism-${lang}`);
+  });
+
+  require("./prism-rue");
+
+  delete (globalThis as Optional<typeof globalThis, "Prism">).Prism;
+}

src/theme/prism-rue.ts

@@ -0,0 +1,56 @@
+Prism.languages.rue = {
+  function: {
+    pattern: /(\bfun\s+)[a-zA-Z_][a-zA-Z0-9_]*/,
+    lookbehind: true,
+  },
+  "function-call": {
+    pattern: /\b[a-zA-Z_][a-zA-Z0-9_]*(?=\s*(?:\(|<.*?>\())/,
+    alias: "function",
+  },
+  field: {
+    pattern: /\b[a-zA-Z_][a-zA-Z0-9_]*(?=\s*:)/,
+    alias: "property",
+  },
+  "field-access": {
+    pattern: /\b(\.)([a-zA-Z_][a-zA-Z0-9_]*)/,
+    lookbehind: true,
+    alias: "property",
+  },
+  string: {
+    pattern: /"[^"]*"/,
+    lookbehind: true,
+    greedy: true,
+  },
+  comment: {
+    pattern: /\/\/.*|\/\*[^]*?\*\//,
+    multiline: true,
+    greedy: true,
+  },
+  number: /\b[0-9][0-9_]*\b/,
+  operator: /[+\-*?%!\^]|<[<=]?|>[>=]?|=[=>]?|!=?|\.(?:\.\.)?|::|->?|&&?|\|\|?/,
+  punctuation: /[(){}[\],:]/,
+  "control-flow": {
+    pattern: /\b(?:if|else|return|raise|assert|assume)\b/,
+    alias: "keyword",
+  },
+  binding: {
+    pattern: /\b(?:let|const|fun)\b/,
+    alias: "keyword",
+  },
+  type: {
+    pattern: /\b(?:type|struct|enum|as|is)\b/,
+    alias: "keyword",
+  },
+  module: {
+    pattern: /\b(?:import|mod)\b/,
+    alias: "keyword",
+  },
+  modifier: { pattern: /\b(?:inline|export)\b/, alias: "keyword" },
+  boolean: /\b(?:false|true)\b/,
+  null: {
+    pattern: /\bnil\b/,
+    alias: "constant",
+  },
+  builtin: /\b(?:Int|Any|Bytes32|Bytes|PublicKey|Nil|Bool)\b/,
+  "class-name": /\b[A-Z][a-z][a-zA-Z0-9_]*\b/,
+};