From bf1f0c593c3e5557e3e70346f9a2b8f19163775f Mon Sep 17 00:00:00 2001
From: pearmini <pearminipro@gmail.com>
Date: Thu, 29 Feb 2024 20:10:30 +0800
Subject: [PATCH] feat(vitepress): support inject global

---
 .../__tests__/.vitepress/theme/index.js       | 10 +++++-
 .../__tests__/markdown-examples.md            |  8 +++--
 packages/genji-theme-vitepress/src/Layout.vue | 34 +++++++++++--------
 packages/genji-theme-vitepress/src/index.js   |  2 +-
 .../src/stdlib/display.js                     |  3 --
 .../genji-theme-vitepress/src/stdlib/index.js |  1 -
 packages/genji-theme-vitepress/src/theme.js   | 13 ++++---
 7 files changed, 44 insertions(+), 27 deletions(-)
 delete mode 100644 packages/genji-theme-vitepress/src/stdlib/display.js
 delete mode 100644 packages/genji-theme-vitepress/src/stdlib/index.js

diff --git a/packages/genji-theme-vitepress/__tests__/.vitepress/theme/index.js b/packages/genji-theme-vitepress/__tests__/.vitepress/theme/index.js
index c740ece..a6f7946 100644
--- a/packages/genji-theme-vitepress/__tests__/.vitepress/theme/index.js
+++ b/packages/genji-theme-vitepress/__tests__/.vitepress/theme/index.js
@@ -1,4 +1,12 @@
-import { Theme } from "../../../src";
+import { createTheme } from "../../../src";
+
+function display(fn) {
+  return fn();
+}
+
+const Theme = createTheme({
+  global: { display },
+});
 
 export default {
   extends: Theme,
diff --git a/packages/genji-theme-vitepress/__tests__/markdown-examples.md b/packages/genji-theme-vitepress/__tests__/markdown-examples.md
index c9d0934..6ed2486 100644
--- a/packages/genji-theme-vitepress/__tests__/markdown-examples.md
+++ b/packages/genji-theme-vitepress/__tests__/markdown-examples.md
@@ -1,6 +1,10 @@
-# Genji Markdown Extension
+# Genji Markdown Extensions
 
-Render a red block.
+Test Genji' built-in Markdown Extensions.
+
+## Basic Block
+
+It should render a red block.
 
 ```js
 display(() => {
diff --git a/packages/genji-theme-vitepress/src/Layout.vue b/packages/genji-theme-vitepress/src/Layout.vue
index 5e75400..de81a7c 100644
--- a/packages/genji-theme-vitepress/src/Layout.vue
+++ b/packages/genji-theme-vitepress/src/Layout.vue
@@ -1,37 +1,41 @@
 <script setup>
 import { useRoute } from "vitepress";
 import DefaultTheme from "vitepress/theme";
-import { onMounted, watch } from "vue";
-import * as stdlib from "./stdlib";
+import { onMounted, watch, defineProps } from "vue";
 
 const { Layout } = DefaultTheme;
 
+const { global = {} } = defineProps(["global"]);
+
 const route = useRoute();
+
 watch(
   () => route.path,
   () => setTimeout(() => render())
 );
 
 onMounted(() => {
-  injectStdlib();
+  injectGlobal();
   render();
 });
 
-function injectStdlib() {
-  Object.assign(window, stdlib);
+function injectGlobal() {
+  Object.assign(window, global);
 }
 
 function render() {
-  const block = document.getElementsByClassName("language-js")[0];
-  if (!block) return;
-  const pre = document.getElementsByClassName("shiki")[0];
-  if (!pre) return;
-  const code = pre.textContent.replace(/\n/g, "");
-  const node = new Function(`return ${code}`)();
-  const cell = document.createElement("div");
-  cell.classList.add("genji-cell");
-  cell.appendChild(node);
-  block.parentNode.insertBefore(cell, block);
+  const blocks = document.getElementsByClassName("language-js");
+  if (!blocks.length) return;
+  for (const block of blocks) {
+    const pre = block.getElementsByClassName("shiki")[0];
+    if (!pre) return;
+    const code = pre.textContent.replace(/\n/g, "");
+    const node = new Function(`return ${code}`)();
+    const cell = document.createElement("div");
+    cell.classList.add("genji-cell");
+    cell.appendChild(node);
+    block.parentNode.insertBefore(cell, block);
+  }
 }
 </script>
 
diff --git a/packages/genji-theme-vitepress/src/index.js b/packages/genji-theme-vitepress/src/index.js
index 94b008d..796bf88 100644
--- a/packages/genji-theme-vitepress/src/index.js
+++ b/packages/genji-theme-vitepress/src/index.js
@@ -1 +1 @@
-export { default as Theme } from "./theme";
+export { createTheme } from "./theme";
diff --git a/packages/genji-theme-vitepress/src/stdlib/display.js b/packages/genji-theme-vitepress/src/stdlib/display.js
deleted file mode 100644
index c173aba..0000000
--- a/packages/genji-theme-vitepress/src/stdlib/display.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export function display(render) {
-  return render();
-}
diff --git a/packages/genji-theme-vitepress/src/stdlib/index.js b/packages/genji-theme-vitepress/src/stdlib/index.js
deleted file mode 100644
index 3698ace..0000000
--- a/packages/genji-theme-vitepress/src/stdlib/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { display } from "./display";
diff --git a/packages/genji-theme-vitepress/src/theme.js b/packages/genji-theme-vitepress/src/theme.js
index 0af7156..54b9111 100644
--- a/packages/genji-theme-vitepress/src/theme.js
+++ b/packages/genji-theme-vitepress/src/theme.js
@@ -1,8 +1,13 @@
+import { h } from "vue";
 import Layout from "./Layout.vue";
 import DefaultTheme from "vitepress/theme";
 import "./style.css";
 
-export default {
-  extends: DefaultTheme,
-  Layout: Layout,
-};
+export function createTheme({ global } = {}) {
+  return {
+    extends: DefaultTheme,
+    Layout: () => {
+      return h(Layout, { global });
+    },
+  };
+}