docs: update code online repl doc

docs/.vuepress/notes.ts

@@ -31,6 +31,12 @@ export const zhNotes = definePlumeNotesConfig({
               icon: 'ph:code-bold',
               items: ['介绍', '特性支持', '代码组', '导入代码', 'codepen', 'jsFiddle', 'codeSandbox', 'replit', 'twoslash', '代码演示'],
             },
+            {
+              text: '代码演示',
+              dir: '代码演示',
+              icon: 'carbon:demo',
+              items: ['前端', 'rust', 'golang', 'kotlin'],
+            },
             {
               text: '图表',
               icon: 'mdi:chart-line',

docs/.vuepress/theme.ts

@@ -83,6 +83,7 @@ export const theme: Theme = themePlume({
       replit: true,
       codeSandbox: true,
       jsfiddle: true,
+      repl: true,
     },
     comment: {
       provider: 'Giscus',

docs/1.示例/示例文章9.md

@@ -4,3 +4,133 @@ author: Plume Theme
 createTime: 2024/03/01 22:56:03
 permalink: /article/z8zvx0ru/
 ---
+
+:::go-repl
+
+```go
+package main
+
+import (
+  "fmt"
+)
+
+func main() {
+  fmt.Println("Hello World")
+}
+```
+
+:::
+
+:::go-repl
+
+```go
+package main
+
+import (
+  "fmt"
+  "math/rand"
+  "time"
+)
+
+func main() {
+  for i := 0; i < 10; i++ {
+    dur := time.Duration(rand.Intn(1000)) * time.Millisecond
+    fmt.Printf("Sleeping for %v\n", dur)
+    // Sleep for a random duration between 0-1000ms
+    time.Sleep(dur)
+  }
+  fmt.Println("Done!")
+}
+```
+
+:::
+
+::: go-repl
+
+```go
+package main
+
+import (
+  "fmt"
+  "io"
+  "log"
+  "net"
+  "net/http"
+  "os"
+)
+
+func main() {
+  http.HandleFunc("/hello", func(w http.ResponseWriter, r *http.Request) {
+    fmt.Fprint(w, "Hello, playground")
+  })
+
+  log.Println("Starting server...")
+  l, err := net.Listen("tcp", "localhost:8080")
+  if err != nil {
+    log.Fatal(err)
+  }
+  go func() {
+    log.Fatal(http.Serve(l, nil))
+  }()
+
+  log.Println("Sending request...")
+  res, err := http.Get("http://localhost:8080/hello")
+  if err != nil {
+    log.Fatal(err)
+  }
+
+  log.Println("Reading response...")
+  if _, err := io.Copy(os.Stdout, res.Body); err != nil {
+    log.Fatal(err)
+  }
+}
+```
+
+:::
+
+::: kotlin-repl
+
+```kotlin
+class Contact(val id: Int, var email: String)
+
+fun main(args: Array<String>) {
+    val contact = Contact(1, "mary@gmail.com")
+    println(contact.id)
+}
+```
+
+:::
+
+::: kotlin-repl
+
+```kotlin
+fun mul(a: Int, b: Int): Int {
+    return a * b
+}
+
+fun main(args: Array<String>) {
+    print(mul(-2, 4))
+}
+```
+
+:::
+
+::: rust-repl
+
+```rust
+fn main() {
+    println!("Hello, world!");
+}
+```
+
+:::
+
+::: rust-repl
+
+```rust
+fn main() {
+    printlnl!("Hello, world!");
+}
+```
+
+:::

docs/notes/theme/guide/代码演示/golang.md

@@ -0,0 +1,188 @@
+---
+title: Golang
+author: pengzhanbo
+icon: devicon-plain:go
+createTime: 2024/04/22 09:44:30
+permalink: /guide/repl/golang/
+---
+
+## 概述
+
+主题提供了 Golang 代码演示，支持 在线运行 Go 代码。
+
+::: important
+该功能通过将 代码提交到 服务器 进行 编译并执行，且一次只能提交单个代码文件。
+
+因此，请不要使用此功能 执行 过于复杂的代码，也不要过于频繁的进行执行请求。
+:::
+
+## 配置
+
+该功能默认不启用，你可以通过配置来启用它。
+
+::: code-tabs
+@tab .vuepress/config.ts
+
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownPower: {
+        repl: true,
+      },
+    }
+  })
+})
+```
+
+:::
+
+## 使用
+
+使用 `::: go-repl` 容器语法 将 Go 代码块包裹起来。主题会检查代码块并添加执行按钮。
+
+````md
+::: go-repl
+```go
+// your rust code
+```
+:::
+````
+
+## 示例
+
+### 打印内容
+
+**输入：**
+
+````md
+:::go-repl
+```go
+package main
+
+import (
+  "fmt"
+)
+
+func main() {
+  fmt.Println("Hello World")
+}
+```
+:::
+````
+
+**输出：**
+:::go-repl
+
+```go
+package main
+
+import (
+  "fmt"
+)
+
+func main() {
+  fmt.Println("Hello World")
+}
+```
+
+:::
+
+### 循环随机延迟打印
+
+**输入：**
+
+````md
+:::go-repl
+```go
+package main
+
+import (
+  "fmt"
+  "math/rand"
+  "time"
+)
+
+func main() {
+  for i := 0; i < 10; i++ {
+    dur := time.Duration(rand.Intn(1000)) * time.Millisecond
+    fmt.Printf("Sleeping for %v\n", dur)
+    // Sleep for a random duration between 0-1000ms
+    time.Sleep(dur)
+  }
+  fmt.Println("Done!")
+}
+```
+:::
+````
+
+**输出：**
+
+:::go-repl
+
+```go
+package main
+
+import (
+  "fmt"
+  "math/rand"
+  "time"
+)
+
+func main() {
+  for i := 0; i < 10; i++ {
+    dur := time.Duration(rand.Intn(1000)) * time.Millisecond
+    fmt.Printf("Sleeping for %v\n", dur)
+    // Sleep for a random duration between 0-1000ms
+    time.Sleep(dur)
+  }
+  fmt.Println("Done!")
+}
+```
+
+:::
+
+### 网络请求
+
+::: go-repl
+
+```go
+package main
+
+import (
+  "fmt"
+  "io"
+  "log"
+  "net"
+  "net/http"
+  "os"
+)
+
+func main() {
+  http.HandleFunc("/hello", func(w http.ResponseWriter, r *http.Request) {
+    fmt.Fprint(w, "Hello, playground")
+  })
+
+  log.Println("Starting server...")
+  l, err := net.Listen("tcp", "localhost:8080")
+  if err != nil {
+    log.Fatal(err)
+  }
+  go func() {
+    log.Fatal(http.Serve(l, nil))
+  }()
+
+  log.Println("Sending request...")
+  res, err := http.Get("http://localhost:8080/hello")
+  if err != nil {
+    log.Fatal(err)
+  }
+
+  log.Println("Reading response...")
+  if _, err := io.Copy(os.Stdout, res.Body); err != nil {
+    log.Fatal(err)
+  }
+}
+```
+
+:::

docs/notes/theme/guide/代码演示/kotlin.md

@@ -0,0 +1,100 @@
+---
+title: Kotlin
+author: pengzhanbo
+icon: tabler:brand-kotlin
+createTime: 2024/04/22 09:44:37
+permalink: /guide/repl/kotlin/
+---
+
+## 概述
+
+主题提供了 Kotlin 代码演示，支持 在线运行 Kotlin 代码。
+
+::: important
+该功能通过将 代码提交到 服务器 进行 编译并执行，且一次只能提交单个代码文件。
+
+因此，请不要使用此功能 执行 过于复杂的代码，也不要过于频繁的进行执行请求。
+:::
+
+## 配置
+
+该功能默认不启用，你可以通过配置来启用它。
+
+::: code-tabs
+@tab .vuepress/config.ts
+
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownPower: {
+        repl: true,
+      },
+    }
+  })
+})
+```
+
+:::
+
+## 使用
+
+使用 `::: kotlin-repl` 容器语法 将 Rust 代码块包裹起来。主题会检查代码块并添加执行按钮。
+
+````md
+::: kotlin-repl
+```kotlin
+// your kotlin code
+```
+:::
+````
+
+## 示例
+
+### 打印内容
+
+**输入：**
+
+````md
+::: kotlin-repl
+```kotlin
+class Contact(val id: Int, var email: String)
+
+fun main(args: Array<String>) {
+    val contact = Contact(1, "mary@gmail.com")
+    println(contact.id)
+}
+```
+:::
+````
+
+**输出：**
+
+::: kotlin-repl
+
+```kotlin
+class Contact(val id: Int, var email: String)
+
+fun main(args: Array<String>) {
+    val contact = Contact(1, "mary@gmail.com")
+    println(contact.id)
+}
+```
+
+:::
+
+### 运算
+
+::: kotlin-repl
+
+```kotlin
+fun mul(a: Int, b: Int): Int {
+    return a * b
+}
+
+fun main(args: Array<String>) {
+    print(mul(-2, 4))
+}
+```
+
+:::

docs/notes/theme/guide/代码演示/rust.md

@@ -0,0 +1,123 @@
+---
+title: Rust
+author: pengzhanbo
+icon: logos:rust
+createTime: 2024/04/22 09:44:43
+permalink: /guide/repl/rust/
+---
+
+## 概述
+
+主题提供了 Rust 代码演示，支持 在线运行 Rust 代码。
+
+::: important
+该功能通过将 代码提交到 服务器 进行 编译并执行，且一次只能提交单个代码文件。
+
+因此，请不要使用此功能 执行 过于复杂的代码，也不要过于频繁的进行执行请求。
+:::
+
+## 配置
+
+该功能默认不启用，你可以通过配置来启用它。
+
+::: code-tabs
+@tab .vuepress/config.ts
+
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownPower: {
+        repl: true,
+      },
+    }
+  })
+})
+```
+
+:::
+
+## 使用
+
+使用 `::: rust-repl` 容器语法 将 Rust 代码块包裹起来。主题会检查代码块并添加执行按钮。
+
+````md
+::: rust-repl
+```rust
+// your rust code
+```
+:::
+````
+
+## 示例
+
+### 打印内容
+
+**输入：**
+
+````md
+::: rust-repl
+```rust
+fn main() {
+    println!("Hello, world!");
+}
+```
+:::
+````
+
+**输出：**
+
+::: rust-repl
+
+```rust
+fn main() {
+    println!("Hello, world!");
+}
+```
+
+:::
+
+点击 执行 按钮，即可执行代码。
+
+### 打印错误信息
+
+**输入：**
+
+````md
+::: rust-repl
+```rust
+fn main() {
+    printlnl!("Hello, world!");
+}
+```
+:::
+````
+
+**输出：**
+
+::: rust-repl
+
+```rust
+fn main() {
+    printlnl!("Hello, world!");
+}
+```
+
+:::
+
+### 等待子进程执行
+
+::: rust-repl
+
+```rust
+use std::process::Command;
+
+fn main() {
+    let mut child = Command::new("sleep").arg("5").spawn().unwrap();
+    let _result = child.wait().unwrap();
+
+    println!("reached end of main");
+}
+```
+
+:::

docs/notes/theme/guide/代码演示/前端.md

@@ -1,14 +1,16 @@
 ---
-title: 代码演示
+title: 前端
 author: pengzhanbo
-icon: carbon:demo
+icon: icon-park-outline:html-five
 createTime: 2024/04/04 11:39:05
-permalink: /guide/code/demo/
+permalink: /guide/repl/frontend/
 ---
 
 ## 概述
 
-代码演示 默认不启用，你可以通过配置来启用它。
+前端代码演示 由 [vuepress-plugin-md-enhance](https://plugin-md-enhance.vuejs.press/zh/) 提供支持。
+
+前端 代码演示 默认不启用，你可以通过配置来启用它。
 
 ::: code-tabs
 @tab .vuepress/config.ts