feat(theme-common): code block MagicComments support for Lua/Haskell -- and WebAssembly ;; (#8870)

Co-authored-by: Tarun Chauhan <[email protected]>
Co-authored-by: Sébastien Lorber <[email protected]>

Author: 3 people

packages/docusaurus-theme-common/src/utils/codeBlockUtils.ts

@@ -19,6 +19,8 @@ const commentPatterns = {
   jsx: {start: '\\{\\s*\\/\\*', end: '\\*\\/\\s*\\}'},
   bash: {start: '#', end: ''},
   html: {start: '<!--', end: '-->'},
+  lua: {start: '--', end: ''},
+  wasm: {start: '\\;\\;', end: ''},
 };
 
 type CommentType = keyof typeof commentPatterns;
@@ -83,10 +85,20 @@ function getAllMagicCommentDirectiveStyles(
       // Text uses HTML, front matter uses bash
       return getCommentPattern(['html', 'jsx', 'bash'], magicCommentDirectives);
 
+    case 'lua':
+    case 'haskell':
+    case 'sql':
+      return getCommentPattern(['lua'], magicCommentDirectives);
+
+    case 'wasm':
+      return getCommentPattern(['wasm'], magicCommentDirectives);
+
     default:
-      // All comment types
+      // All comment types except lua and wasm
       return getCommentPattern(
-        Object.keys(commentPatterns) as CommentType[],
+        Object.keys(commentPatterns).filter(
+          (pattern) => !['lua', 'wasm'].includes(pattern),
+        ) as CommentType[],
         magicCommentDirectives,
       );
   }

website/_dogfooding/_pages tests/code-block-tests.mdx

@@ -267,3 +267,50 @@ export default function MyReactPage() {
   );
 }
 ```
+
+## Magic comments tests
+
+```lua title="lua_sum.lua"
+function sum(n)
+  -- highlight-next-line
+  local result = 0
+  for i = 1, n do
+   -- highlight-start
+    result = result + i
+  end
+  -- highlight-end
+  print(result)
+end
+```
+
+```haskell title="haskell.hs"
+stringLength :: String -> Int
+-- highlight-next-line
+stringLength [] = 0
+stringLength (x:xs) = 1 + stringLength xs
+```
+
+```wasm title="sum_webAssembly.wasm"
+(module
+  ;; highlight-next-line
+  (func $add (param $a i32) (param $b i32) (result i32)
+    local.get $a
+    ;; highlight-start
+    local.get $b
+    i32.add)
+    ;; highlight-end
+  (export "add" (func $add)))
+```
+
+```sql title="sql_query.sql"
+-- highlight-start
+SELECT *
+FROM orders
+-- highlight-end
+WHERE customer_id IN (
+  SELECT customer_id
+  -- highlight-next-line
+  FROM customers
+  WHERE country = 'USA'
+)
+```