From e94577b0c71857ae2b29f4c4fbe3764bb4466197 Mon Sep 17 00:00:00 2001
From: fisker Cheung <lionkay@gmail.com>
Date: Wed, 31 Dec 2025 03:06:26 +0800
Subject: [PATCH] Website: improve handlebars language support (#18554)

---
 .github/renovate.json5               |  6 +++-
 cspell.json                          |  1 +
 website/package.json                 |  1 +
 website/playground/panel/language.js |  8 +++++
 website/yarn.lock                    | 45 ++++++++++++++++++++++++++--
 5 files changed, 58 insertions(+), 3 deletions(-)

diff --git a/.github/renovate.json5 b/.github/renovate.json5
index 1c604fc2c..b613be4b0 100644
--- a/.github/renovate.json5
+++ b/.github/renovate.json5
@@ -84,7 +84,11 @@
     },
     {
       groupName: "CodeMirror",
-      matchPackageNames: ["@codemirror/*", "cm6-graphql"],
+      matchPackageNames: [
+        "@codemirror/*",
+        "cm6-graphql",
+        "@xiechao/codemirror-lang-handlebars",
+      ],
     },
   ],
   ignoreDeps: [
diff --git a/cspell.json b/cspell.json
index 1615d4a21..55224441e 100644
--- a/cspell.json
+++ b/cspell.json
@@ -307,6 +307,7 @@
         "withastro",
         "wxss",
         "xdescribe",
+        "xiechao",
         "xquery",
         "xtest",
         "yamafaktory",
diff --git a/website/package.json b/website/package.json
index 43383fb87..3c451a8d8 100644
--- a/website/package.json
+++ b/website/package.json
@@ -27,6 +27,7 @@
     "@lezer/highlight": "1.2.3",
     "@mdx-js/react": "3.1.1",
     "@sandhose/prettier-animated-logo": "1.0.3",
+    "@xiechao/codemirror-lang-handlebars": "1.0.4",
     "clipboard": "2.0.11",
     "clsx": "2.1.1",
     "cm6-graphql": "0.2.1",
diff --git a/website/playground/panel/language.js b/website/playground/panel/language.js
index f934d7956..27b2363e9 100644
--- a/website/playground/panel/language.js
+++ b/website/playground/panel/language.js
@@ -51,6 +51,8 @@ function getCodemirrorMode(parser) {
       return "YAML";
 
     case "glimmer":
+      return "Handlebars";
+
     case "html":
     case "mjml":
     case "lwc":
@@ -75,6 +77,12 @@ async function getLanguageExtension(mode) {
     return graphql();
   }
 
+  if (mode === "Handlebars") {
+    const { handlebarsLanguage } =
+      await import("@xiechao/codemirror-lang-handlebars");
+    return handlebarsLanguage;
+  }
+
   if (!languageExtensions) {
     const { languages } = await import("@codemirror/language-data");
     languageExtensions = new Map(
diff --git a/website/yarn.lock b/website/yarn.lock
index 303612104..49eeee457 100644
--- a/website/yarn.lock
+++ b/website/yarn.lock
@@ -1551,7 +1551,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@codemirror/commands@npm:6.10.1":
+"@codemirror/commands@npm:6.10.1, @codemirror/commands@npm:^6.0.0":
   version: 6.10.1
   resolution: "@codemirror/commands@npm:6.10.1"
   dependencies:
@@ -1613,7 +1613,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@codemirror/lang-html@npm:^6.0.0":
+"@codemirror/lang-html@npm:^6.0.0, @codemirror/lang-html@npm:^6.4.7":
   version: 6.4.11
   resolution: "@codemirror/lang-html@npm:6.4.11"
   dependencies:
@@ -1905,6 +1905,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@codemirror/search@npm:^6.0.0":
+  version: 6.5.11
+  resolution: "@codemirror/search@npm:6.5.11"
+  dependencies:
+    "@codemirror/state": "npm:^6.0.0"
+    "@codemirror/view": "npm:^6.0.0"
+    crelt: "npm:^1.0.5"
+  checksum: 10/d057f37cb369460b25625d7eb72f40636bf78ecd140608da53010cf3660f982a9e613826e38d85d87c9c2ff11e45c9482429987bfd4f29cbbd192f1ee3fd2695
+  languageName: node
+  linkType: hard
+
 "@codemirror/state@npm:6.5.3, @codemirror/state@npm:^6.0.0, @codemirror/state@npm:^6.4.0, @codemirror/state@npm:^6.5.0":
   version: 6.5.3
   resolution: "@codemirror/state@npm:6.5.3"
@@ -5626,6 +5637,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@xiechao/codemirror-lang-handlebars@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@xiechao/codemirror-lang-handlebars@npm:1.0.4"
+  dependencies:
+    "@codemirror/lang-html": "npm:^6.4.7"
+    "@codemirror/language": "npm:^6.0.0"
+    "@lezer/common": "npm:^1.2.0"
+    "@lezer/highlight": "npm:^1.0.0"
+    "@lezer/lr": "npm:^1.0.0"
+    codemirror: "npm:^6.0.1"
+  checksum: 10/f305566c1e321d89a426d41876ecc5a2898630df6e71fb51140d26318af327a398eda098e1b74a887d36e6bd83020aad82ed8b9b22de0d4b48b4a0cff377ca6f
+  languageName: node
+  linkType: hard
+
 "@xtuc/ieee754@npm:^1.2.0":
   version: 1.2.0
   resolution: "@xtuc/ieee754@npm:1.2.0"
@@ -6545,6 +6570,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"codemirror@npm:^6.0.1":
+  version: 6.0.2
+  resolution: "codemirror@npm:6.0.2"
+  dependencies:
+    "@codemirror/autocomplete": "npm:^6.0.0"
+    "@codemirror/commands": "npm:^6.0.0"
+    "@codemirror/language": "npm:^6.0.0"
+    "@codemirror/lint": "npm:^6.0.0"
+    "@codemirror/search": "npm:^6.0.0"
+    "@codemirror/state": "npm:^6.0.0"
+    "@codemirror/view": "npm:^6.0.0"
+  checksum: 10/bd73c9ebbd8cb709a697fa4e2484c188c44aafce4b4d2a342807a5648c6be5bd5876f0caac47db0c1181f1ec8d86e38bd2b6efe51b971bf240fd3382bef0b371
+  languageName: node
+  linkType: hard
+
 "collapse-white-space@npm:^2.0.0":
   version: 2.1.0
   resolution: "collapse-white-space@npm:2.1.0"
@@ -13244,6 +13284,7 @@ __metadata:
     "@types/react": "npm:19.2.7"
     "@vitejs/plugin-vue": "npm:6.0.2"
     "@vitejs/plugin-vue-jsx": "npm:5.1.2"
+    "@xiechao/codemirror-lang-handlebars": "npm:1.0.4"
     clipboard: "npm:2.0.11"
     clsx: "npm:2.1.1"
     cm6-graphql: "npm:0.2.1"