From 2fb3da074776629502acf70e60da06022aa06b61 Mon Sep 17 00:00:00 2001
From: pengzhanbo <volodymyr@foxmail.com>
Date: Mon, 18 Mar 2024 00:12:25 +0800
Subject: [PATCH] docs: update theme docs

---
 docs/.vuepress/config.ts                      |    2 +
 docs/.vuepress/notes.ts                       |   12 +-
 docs/.vuepress/public/data/flare.json         | 1040 +++++++++++++++++
 docs/.vuepress/theme.ts                       |    7 +
 docs/notes/theme/config/frontmatter/basic.md  |    7 +
 docs/notes/theme/config/frontmatter/post.md   |    2 +-
 docs/notes/theme/config/plugins/代码高亮.md   |   11 +
 docs/notes/theme/config/plugins/搜索.md       |    2 +-
 .../{markdown-基础.md => markdown/基础.md}    |    0
 .../{markdown-扩展.md => markdown/扩展.md}    |    2 +-
 .../试验性.md}                                |    0
 .../{markdown-进阶.md => markdown/进阶.md}    |  499 ++++++--
 docs/notes/theme/guide/{ => 功能}/seo.md      |    0
 docs/notes/theme/guide/{ => 功能}/sitemap.md  |    2 +-
 docs/notes/theme/guide/{ => 功能}/代码复制.md |    0
 docs/notes/theme/guide/{ => 功能}/内容搜索.md |    0
 docs/notes/theme/guide/{ => 功能}/加密.md     |    4 +
 .../theme/guide/{ => 功能}/友情链接页.md      |    0
 docs/notes/theme/guide/{ => 功能}/组件.md     |   10 +-
 docs/notes/theme/guide/功能/评论.md           |  236 ++++
 docs/notes/theme/guide/图表/chart.md          |  127 ++
 docs/notes/theme/guide/图表/echarts.md        |  237 ++++
 docs/notes/theme/guide/图表/flowchart.md      |  332 ++++++
 docs/notes/theme/guide/图表/mermaid.md        |  313 +++++
 docs/notes/theme/guide/安装与使用.md          |   10 +
 docs/notes/theme/guide/评论.md                |   41 -
 docs/notes/theme/snippet/chart-1.snippet.md   |   42 +
 docs/notes/theme/snippet/chart-2.snippet.md   |   21 +
 docs/notes/theme/snippet/chart-3.snippet.md   |   21 +
 docs/notes/theme/snippet/chart-4.snippet.md   |   25 +
 docs/notes/theme/snippet/chart-5.snippet.md   |   43 +
 docs/notes/theme/snippet/chart-6.snippet.md   |   31 +
 docs/notes/theme/snippet/echarts-1.snippet.md |  101 ++
 .../notes/theme/snippet/echarts-10.snippet.md |   70 ++
 docs/notes/theme/snippet/echarts-2.snippet.md |   76 ++
 docs/notes/theme/snippet/echarts-3.snippet.md |   75 ++
 docs/notes/theme/snippet/echarts-4.snippet.md |   40 +
 docs/notes/theme/snippet/echarts-5.snippet.md |   41 +
 docs/notes/theme/snippet/echarts-6.snippet.md |  309 +++++
 docs/notes/theme/snippet/echarts-7.snippet.md |   37 +
 docs/notes/theme/snippet/echarts-8.snippet.md |  180 +++
 docs/notes/theme/snippet/echarts-9.snippet.md |   34 +
 docs/notes/theme/snippet/include-1.snippet.md |  252 ++++
 docs/notes/theme/snippet/include-2.snippet.md |   14 +
 docs/notes/theme/snippet/mermaid-1.snippet.md |   21 +
 .../notes/theme/snippet/mermaid-10.snippet.md |   20 +
 .../notes/theme/snippet/mermaid-11.snippet.md |   12 +
 .../notes/theme/snippet/mermaid-12.snippet.md |   72 ++
 .../notes/theme/snippet/mermaid-13.snippet.md |   16 +
 .../notes/theme/snippet/mermaid-14.snippet.md |   17 +
 .../notes/theme/snippet/mermaid-15.snippet.md |    9 +
 .../notes/theme/snippet/mermaid-16.snippet.md |   13 +
 .../notes/theme/snippet/mermaid-17.snippet.md |   25 +
 docs/notes/theme/snippet/mermaid-2.snippet.md |   12 +
 docs/notes/theme/snippet/mermaid-3.snippet.md |   26 +
 docs/notes/theme/snippet/mermaid-4.snippet.md |   10 +
 docs/notes/theme/snippet/mermaid-5.snippet.md |   16 +
 docs/notes/theme/snippet/mermaid-6.snippet.md |   12 +
 docs/notes/theme/snippet/mermaid-7.snippet.md |   32 +
 docs/notes/theme/snippet/mermaid-8.snippet.md |   45 +
 docs/notes/theme/snippet/mermaid-9.snippet.md |   35 +
 docs/package.json                             |    4 +
 eslint.config.js                              |    3 +-
 pnpm-lock.yaml                                |  792 ++++++++++++-
 64 files changed, 5312 insertions(+), 188 deletions(-)
 create mode 100644 docs/.vuepress/public/data/flare.json
 rename docs/notes/theme/guide/{markdown-基础.md => markdown/基础.md} (100%)
 rename docs/notes/theme/guide/{markdown-扩展.md => markdown/扩展.md} (99%)
 rename docs/notes/theme/guide/{markdown-试验性.md => markdown/试验性.md} (100%)
 rename docs/notes/theme/guide/{markdown-进阶.md => markdown/进阶.md} (56%)
 rename docs/notes/theme/guide/{ => 功能}/seo.md (100%)
 rename docs/notes/theme/guide/{ => 功能}/sitemap.md (94%)
 rename docs/notes/theme/guide/{ => 功能}/代码复制.md (100%)
 rename docs/notes/theme/guide/{ => 功能}/内容搜索.md (100%)
 rename docs/notes/theme/guide/{ => 功能}/加密.md (98%)
 rename docs/notes/theme/guide/{ => 功能}/友情链接页.md (100%)
 rename docs/notes/theme/guide/{ => 功能}/组件.md (86%)
 create mode 100644 docs/notes/theme/guide/功能/评论.md
 create mode 100644 docs/notes/theme/guide/图表/chart.md
 create mode 100644 docs/notes/theme/guide/图表/echarts.md
 create mode 100644 docs/notes/theme/guide/图表/flowchart.md
 create mode 100644 docs/notes/theme/guide/图表/mermaid.md
 delete mode 100644 docs/notes/theme/guide/评论.md
 create mode 100644 docs/notes/theme/snippet/chart-1.snippet.md
 create mode 100644 docs/notes/theme/snippet/chart-2.snippet.md
 create mode 100644 docs/notes/theme/snippet/chart-3.snippet.md
 create mode 100644 docs/notes/theme/snippet/chart-4.snippet.md
 create mode 100644 docs/notes/theme/snippet/chart-5.snippet.md
 create mode 100644 docs/notes/theme/snippet/chart-6.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-1.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-10.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-2.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-3.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-4.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-5.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-6.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-7.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-8.snippet.md
 create mode 100644 docs/notes/theme/snippet/echarts-9.snippet.md
 create mode 100644 docs/notes/theme/snippet/include-1.snippet.md
 create mode 100644 docs/notes/theme/snippet/include-2.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-1.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-10.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-11.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-12.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-13.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-14.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-15.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-16.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-17.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-2.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-3.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-4.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-5.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-6.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-7.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-8.snippet.md
 create mode 100644 docs/notes/theme/snippet/mermaid-9.snippet.md

diff --git a/docs/.vuepress/config.ts b/docs/.vuepress/config.ts
index f50466a4..20dc76ef 100644
--- a/docs/.vuepress/config.ts
+++ b/docs/.vuepress/config.ts
@@ -18,6 +18,8 @@ export default defineUserConfig({
     ['link', { rel: 'icon', type: 'image/png', sizes: '16x16', href: '/favicon-16x16.png' }],
   ],
 
+  pagePatterns: ['**/*.md', '!**/*.snippet.md', '!.vuepress', '!node_modules'],
+
   bundler: viteBundler(),
 
   theme,
diff --git a/docs/.vuepress/notes.ts b/docs/.vuepress/notes.ts
index 05c4907a..83303917 100644
--- a/docs/.vuepress/notes.ts
+++ b/docs/.vuepress/notes.ts
@@ -20,18 +20,26 @@ export const zhNotes = definePlumeNotesConfig({
           collapsed: false,
           items: [
             '编写文章',
+            '国际化',
             {
               text: 'markdown',
               icon: 'material-symbols:markdown-outline',
-              items: ['markdown-基础', 'markdown-扩展', 'markdown-进阶', 'markdown-试验性'],
+              dir: 'markdown',
+              items: ['基础', '扩展', '进阶', '试验性'],
+            },
+            {
+              text: '图表',
+              icon: 'mdi:chart-line',
+              dir: '图表',
+              items: ['chart', 'echarts', 'mermaid', 'flowchart'],
             },
-            '国际化',
           ],
         },
         {
           text: '功能',
           icon: 'lucide:box',
           collapsed: false,
+          dir: '功能',
           items: ['代码复制', '内容搜索', '评论', '加密', '组件', '友情链接页', 'seo', 'sitemap'],
         },
         {
diff --git a/docs/.vuepress/public/data/flare.json b/docs/.vuepress/public/data/flare.json
new file mode 100644
index 00000000..761f482c
--- /dev/null
+++ b/docs/.vuepress/public/data/flare.json
@@ -0,0 +1,1040 @@
+{
+  "name": "flare",
+  "children": [
+    {
+      "name": "analytics",
+      "children": [
+        {
+          "name": "cluster",
+          "children": [
+            {
+              "name": "AgglomerativeCluster",
+              "value": 3938
+            },
+            {
+              "name": "CommunityStructure",
+              "value": 3812
+            },
+            {
+              "name": "HierarchicalCluster",
+              "value": 6714
+            },
+            {
+              "name": "MergeEdge",
+              "value": 743
+            }
+          ]
+        },
+        {
+          "name": "graph",
+          "children": [
+            {
+              "name": "BetweennessCentrality",
+              "value": 3534
+            },
+            {
+              "name": "LinkDistance",
+              "value": 5731
+            },
+            {
+              "name": "MaxFlowMinCut",
+              "value": 7840
+            },
+            {
+              "name": "ShortestPaths",
+              "value": 5914
+            },
+            {
+              "name": "SpanningTree",
+              "value": 3416
+            }
+          ]
+        },
+        {
+          "name": "optimization",
+          "children": [
+            {
+              "name": "AspectRatioBanker",
+              "value": 7074
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "animate",
+      "children": [
+        {
+          "name": "Easing",
+          "value": 17010
+        },
+        {
+          "name": "FunctionSequence",
+          "value": 5842
+        },
+        {
+          "name": "interpolate",
+          "children": [
+            {
+              "name": "ArrayInterpolator",
+              "value": 1983
+            },
+            {
+              "name": "ColorInterpolator",
+              "value": 2047
+            },
+            {
+              "name": "DateInterpolator",
+              "value": 1375
+            },
+            {
+              "name": "Interpolator",
+              "value": 8746
+            },
+            {
+              "name": "MatrixInterpolator",
+              "value": 2202
+            },
+            {
+              "name": "NumberInterpolator",
+              "value": 1382
+            },
+            {
+              "name": "ObjectInterpolator",
+              "value": 1629
+            },
+            {
+              "name": "PointInterpolator",
+              "value": 1675
+            },
+            {
+              "name": "RectangleInterpolator",
+              "value": 2042
+            }
+          ]
+        },
+        {
+          "name": "ISchedulable",
+          "value": 1041
+        },
+        {
+          "name": "Parallel",
+          "value": 5176
+        },
+        {
+          "name": "Pause",
+          "value": 449
+        },
+        {
+          "name": "Scheduler",
+          "value": 5593
+        },
+        {
+          "name": "Sequence",
+          "value": 5534
+        },
+        {
+          "name": "Transition",
+          "value": 9201
+        },
+        {
+          "name": "Transitioner",
+          "value": 19975
+        },
+        {
+          "name": "TransitionEvent",
+          "value": 1116
+        },
+        {
+          "name": "Tween",
+          "value": 6006
+        }
+      ]
+    },
+    {
+      "name": "data",
+      "children": [
+        {
+          "name": "converters",
+          "children": [
+            {
+              "name": "Converters",
+              "value": 721
+            },
+            {
+              "name": "DelimitedTextConverter",
+              "value": 4294
+            },
+            {
+              "name": "GraphMLConverter",
+              "value": 9800
+            },
+            {
+              "name": "IDataConverter",
+              "value": 1314
+            },
+            {
+              "name": "JSONConverter",
+              "value": 2220
+            }
+          ]
+        },
+        {
+          "name": "DataField",
+          "value": 1759
+        },
+        {
+          "name": "DataSchema",
+          "value": 2165
+        },
+        {
+          "name": "DataSet",
+          "value": 586
+        },
+        {
+          "name": "DataSource",
+          "value": 3331
+        },
+        {
+          "name": "DataTable",
+          "value": 772
+        },
+        {
+          "name": "DataUtil",
+          "value": 3322
+        }
+      ]
+    },
+    {
+      "name": "display",
+      "children": [
+        {
+          "name": "DirtySprite",
+          "value": 8833
+        },
+        {
+          "name": "LineSprite",
+          "value": 1732
+        },
+        {
+          "name": "RectSprite",
+          "value": 3623
+        },
+        {
+          "name": "TextSprite",
+          "value": 10066
+        }
+      ]
+    },
+    {
+      "name": "flex",
+      "children": [
+        {
+          "name": "FlareVis",
+          "value": 4116
+        }
+      ]
+    },
+    {
+      "name": "physics",
+      "children": [
+        {
+          "name": "DragForce",
+          "value": 1082
+        },
+        {
+          "name": "GravityForce",
+          "value": 1336
+        },
+        {
+          "name": "IForce",
+          "value": 319
+        },
+        {
+          "name": "NBodyForce",
+          "value": 10498
+        },
+        {
+          "name": "Particle",
+          "value": 2822
+        },
+        {
+          "name": "Simulation",
+          "value": 9983
+        },
+        {
+          "name": "Spring",
+          "value": 2213
+        },
+        {
+          "name": "SpringForce",
+          "value": 1681
+        }
+      ]
+    },
+    {
+      "name": "query",
+      "children": [
+        {
+          "name": "AggregateExpression",
+          "value": 1616
+        },
+        {
+          "name": "And",
+          "value": 1027
+        },
+        {
+          "name": "Arithmetic",
+          "value": 3891
+        },
+        {
+          "name": "Average",
+          "value": 891
+        },
+        {
+          "name": "BinaryExpression",
+          "value": 2893
+        },
+        {
+          "name": "Comparison",
+          "value": 5103
+        },
+        {
+          "name": "CompositeExpression",
+          "value": 3677
+        },
+        {
+          "name": "Count",
+          "value": 781
+        },
+        {
+          "name": "DateUtil",
+          "value": 4141
+        },
+        {
+          "name": "Distinct",
+          "value": 933
+        },
+        {
+          "name": "Expression",
+          "value": 5130
+        },
+        {
+          "name": "ExpressionIterator",
+          "value": 3617
+        },
+        {
+          "name": "Fn",
+          "value": 3240
+        },
+        {
+          "name": "If",
+          "value": 2732
+        },
+        {
+          "name": "IsA",
+          "value": 2039
+        },
+        {
+          "name": "Literal",
+          "value": 1214
+        },
+        {
+          "name": "Match",
+          "value": 3748
+        },
+        {
+          "name": "Maximum",
+          "value": 843
+        },
+        {
+          "name": "methods",
+          "children": [
+            {
+              "name": "add",
+              "value": 593
+            },
+            {
+              "name": "and",
+              "value": 330
+            },
+            {
+              "name": "average",
+              "value": 287
+            },
+            {
+              "name": "count",
+              "value": 277
+            },
+            {
+              "name": "distinct",
+              "value": 292
+            },
+            {
+              "name": "div",
+              "value": 595
+            },
+            {
+              "name": "eq",
+              "value": 594
+            },
+            {
+              "name": "fn",
+              "value": 460
+            },
+            {
+              "name": "gt",
+              "value": 603
+            },
+            {
+              "name": "gte",
+              "value": 625
+            },
+            {
+              "name": "iff",
+              "value": 748
+            },
+            {
+              "name": "isa",
+              "value": 461
+            },
+            {
+              "name": "lt",
+              "value": 597
+            },
+            {
+              "name": "lte",
+              "value": 619
+            },
+            {
+              "name": "max",
+              "value": 283
+            },
+            {
+              "name": "min",
+              "value": 283
+            },
+            {
+              "name": "mod",
+              "value": 591
+            },
+            {
+              "name": "mul",
+              "value": 603
+            },
+            {
+              "name": "neq",
+              "value": 599
+            },
+            {
+              "name": "not",
+              "value": 386
+            },
+            {
+              "name": "or",
+              "value": 323
+            },
+            {
+              "name": "orderby",
+              "value": 307
+            },
+            {
+              "name": "range",
+              "value": 772
+            },
+            {
+              "name": "select",
+              "value": 296
+            },
+            {
+              "name": "stddev",
+              "value": 363
+            },
+            {
+              "name": "sub",
+              "value": 600
+            },
+            {
+              "name": "sum",
+              "value": 280
+            },
+            {
+              "name": "update",
+              "value": 307
+            },
+            {
+              "name": "variance",
+              "value": 335
+            },
+            {
+              "name": "where",
+              "value": 299
+            },
+            {
+              "name": "xor",
+              "value": 354
+            },
+            {
+              "name": "-",
+              "value": 264
+            }
+          ]
+        },
+        {
+          "name": "Minimum",
+          "value": 843
+        },
+        {
+          "name": "Not",
+          "value": 1554
+        },
+        {
+          "name": "Or",
+          "value": 970
+        },
+        {
+          "name": "Query",
+          "value": 13896
+        },
+        {
+          "name": "Range",
+          "value": 1594
+        },
+        {
+          "name": "StringUtil",
+          "value": 4130
+        },
+        {
+          "name": "Sum",
+          "value": 791
+        },
+        {
+          "name": "Variable",
+          "value": 1124
+        },
+        {
+          "name": "Variance",
+          "value": 1876
+        },
+        {
+          "name": "Xor",
+          "value": 1101
+        }
+      ]
+    },
+    {
+      "name": "scale",
+      "children": [
+        {
+          "name": "IScaleMap",
+          "value": 2105
+        },
+        {
+          "name": "LinearScale",
+          "value": 1316
+        },
+        {
+          "name": "LogScale",
+          "value": 3151
+        },
+        {
+          "name": "OrdinalScale",
+          "value": 3770
+        },
+        {
+          "name": "QuantileScale",
+          "value": 2435
+        },
+        {
+          "name": "QuantitativeScale",
+          "value": 4839
+        },
+        {
+          "name": "RootScale",
+          "value": 1756
+        },
+        {
+          "name": "Scale",
+          "value": 4268
+        },
+        {
+          "name": "ScaleType",
+          "value": 1821
+        },
+        {
+          "name": "TimeScale",
+          "value": 5833
+        }
+      ]
+    },
+    {
+      "name": "util",
+      "children": [
+        {
+          "name": "Arrays",
+          "value": 8258
+        },
+        {
+          "name": "Colors",
+          "value": 10001
+        },
+        {
+          "name": "Dates",
+          "value": 8217
+        },
+        {
+          "name": "Displays",
+          "value": 12555
+        },
+        {
+          "name": "Filter",
+          "value": 2324
+        },
+        {
+          "name": "Geometry",
+          "value": 10993
+        },
+        {
+          "name": "heap",
+          "children": [
+            {
+              "name": "FibonacciHeap",
+              "value": 9354
+            },
+            {
+              "name": "HeapNode",
+              "value": 1233
+            }
+          ]
+        },
+        {
+          "name": "IEvaluable",
+          "value": 335
+        },
+        {
+          "name": "IPredicate",
+          "value": 383
+        },
+        {
+          "name": "IValueProxy",
+          "value": 874
+        },
+        {
+          "name": "math",
+          "children": [
+            {
+              "name": "DenseMatrix",
+              "value": 3165
+            },
+            {
+              "name": "IMatrix",
+              "value": 2815
+            },
+            {
+              "name": "SparseMatrix",
+              "value": 3366
+            }
+          ]
+        },
+        {
+          "name": "Maths",
+          "value": 17705
+        },
+        {
+          "name": "Orientation",
+          "value": 1486
+        },
+        {
+          "name": "palette",
+          "children": [
+            {
+              "name": "ColorPalette",
+              "value": 6367
+            },
+            {
+              "name": "Palette",
+              "value": 1229
+            },
+            {
+              "name": "ShapePalette",
+              "value": 2059
+            },
+            {
+              "name": "SizePalette",
+              "value": 2291
+            }
+          ]
+        },
+        {
+          "name": "Property",
+          "value": 5559
+        },
+        {
+          "name": "Shapes",
+          "value": 19118
+        },
+        {
+          "name": "Sort",
+          "value": 6887
+        },
+        {
+          "name": "Stats",
+          "value": 6557
+        },
+        {
+          "name": "Strings",
+          "value": 22026
+        }
+      ]
+    },
+    {
+      "name": "vis",
+      "children": [
+        {
+          "name": "axis",
+          "children": [
+            {
+              "name": "Axes",
+              "value": 1302
+            },
+            {
+              "name": "Axis",
+              "value": 24593
+            },
+            {
+              "name": "AxisGridLine",
+              "value": 652
+            },
+            {
+              "name": "AxisLabel",
+              "value": 636
+            },
+            {
+              "name": "CartesianAxes",
+              "value": 6703
+            }
+          ]
+        },
+        {
+          "name": "controls",
+          "children": [
+            {
+              "name": "AnchorControl",
+              "value": 2138
+            },
+            {
+              "name": "ClickControl",
+              "value": 3824
+            },
+            {
+              "name": "Control",
+              "value": 1353
+            },
+            {
+              "name": "ControlList",
+              "value": 4665
+            },
+            {
+              "name": "DragControl",
+              "value": 2649
+            },
+            {
+              "name": "ExpandControl",
+              "value": 2832
+            },
+            {
+              "name": "HoverControl",
+              "value": 4896
+            },
+            {
+              "name": "IControl",
+              "value": 763
+            },
+            {
+              "name": "PanZoomControl",
+              "value": 5222
+            },
+            {
+              "name": "SelectionControl",
+              "value": 7862
+            },
+            {
+              "name": "TooltipControl",
+              "value": 8435
+            }
+          ]
+        },
+        {
+          "name": "data",
+          "children": [
+            {
+              "name": "Data",
+              "value": 20544
+            },
+            {
+              "name": "DataList",
+              "value": 19788
+            },
+            {
+              "name": "DataSprite",
+              "value": 10349
+            },
+            {
+              "name": "EdgeSprite",
+              "value": 3301
+            },
+            {
+              "name": "NodeSprite",
+              "value": 19382
+            },
+            {
+              "name": "render",
+              "children": [
+                {
+                  "name": "ArrowType",
+                  "value": 698
+                },
+                {
+                  "name": "EdgeRenderer",
+                  "value": 5569
+                },
+                {
+                  "name": "IRenderer",
+                  "value": 353
+                },
+                {
+                  "name": "ShapeRenderer",
+                  "value": 2247
+                }
+              ]
+            },
+            {
+              "name": "ScaleBinding",
+              "value": 11275
+            },
+            {
+              "name": "Tree",
+              "value": 7147
+            },
+            {
+              "name": "TreeBuilder",
+              "value": 9930
+            }
+          ]
+        },
+        {
+          "name": "events",
+          "children": [
+            {
+              "name": "DataEvent",
+              "value": 2313
+            },
+            {
+              "name": "SelectionEvent",
+              "value": 1880
+            },
+            {
+              "name": "TooltipEvent",
+              "value": 1701
+            },
+            {
+              "name": "VisualizationEvent",
+              "value": 1117
+            }
+          ]
+        },
+        {
+          "name": "legend",
+          "children": [
+            {
+              "name": "Legend",
+              "value": 20859
+            },
+            {
+              "name": "LegendItem",
+              "value": 4614
+            },
+            {
+              "name": "LegendRange",
+              "value": 10530
+            }
+          ]
+        },
+        {
+          "name": "operator",
+          "children": [
+            {
+              "name": "distortion",
+              "children": [
+                {
+                  "name": "BifocalDistortion",
+                  "value": 4461
+                },
+                {
+                  "name": "Distortion",
+                  "value": 6314
+                },
+                {
+                  "name": "FisheyeDistortion",
+                  "value": 3444
+                }
+              ]
+            },
+            {
+              "name": "encoder",
+              "children": [
+                {
+                  "name": "ColorEncoder",
+                  "value": 3179
+                },
+                {
+                  "name": "Encoder",
+                  "value": 4060
+                },
+                {
+                  "name": "PropertyEncoder",
+                  "value": 4138
+                },
+                {
+                  "name": "ShapeEncoder",
+                  "value": 1690
+                },
+                {
+                  "name": "SizeEncoder",
+                  "value": 1830
+                }
+              ]
+            },
+            {
+              "name": "filter",
+              "children": [
+                {
+                  "name": "FisheyeTreeFilter",
+                  "value": 5219
+                },
+                {
+                  "name": "GraphDistanceFilter",
+                  "value": 3165
+                },
+                {
+                  "name": "VisibilityFilter",
+                  "value": 3509
+                }
+              ]
+            },
+            {
+              "name": "IOperator",
+              "value": 1286
+            },
+            {
+              "name": "label",
+              "children": [
+                {
+                  "name": "Labeler",
+                  "value": 9956
+                },
+                {
+                  "name": "RadialLabeler",
+                  "value": 3899
+                },
+                {
+                  "name": "StackedAreaLabeler",
+                  "value": 3202
+                }
+              ]
+            },
+            {
+              "name": "layout",
+              "children": [
+                {
+                  "name": "AxisLayout",
+                  "value": 6725
+                },
+                {
+                  "name": "BundledEdgeRouter",
+                  "value": 3727
+                },
+                {
+                  "name": "CircleLayout",
+                  "value": 9317
+                },
+                {
+                  "name": "CirclePackingLayout",
+                  "value": 12003
+                },
+                {
+                  "name": "DendrogramLayout",
+                  "value": 4853
+                },
+                {
+                  "name": "ForceDirectedLayout",
+                  "value": 8411
+                },
+                {
+                  "name": "IcicleTreeLayout",
+                  "value": 4864
+                },
+                {
+                  "name": "IndentedTreeLayout",
+                  "value": 3174
+                },
+                {
+                  "name": "Layout",
+                  "value": 7881
+                },
+                {
+                  "name": "NodeLinkTreeLayout",
+                  "value": 12870
+                },
+                {
+                  "name": "PieLayout",
+                  "value": 2728
+                },
+                {
+                  "name": "RadialTreeLayout",
+                  "value": 12348
+                },
+                {
+                  "name": "RandomLayout",
+                  "value": 870
+                },
+                {
+                  "name": "StackedAreaLayout",
+                  "value": 9121
+                },
+                {
+                  "name": "TreeMapLayout",
+                  "value": 9191
+                }
+              ]
+            },
+            {
+              "name": "Operator",
+              "value": 2490
+            },
+            {
+              "name": "OperatorList",
+              "value": 5248
+            },
+            {
+              "name": "OperatorSequence",
+              "value": 4190
+            },
+            {
+              "name": "OperatorSwitch",
+              "value": 2581
+            },
+            {
+              "name": "SortOperator",
+              "value": 2023
+            }
+          ]
+        },
+        {
+          "name": "Visualization",
+          "value": 16540
+        }
+      ]
+    }
+  ]
+}
diff --git a/docs/.vuepress/theme.ts b/docs/.vuepress/theme.ts
index e287c32a..734e785e 100644
--- a/docs/.vuepress/theme.ts
+++ b/docs/.vuepress/theme.ts
@@ -30,10 +30,17 @@ export const theme: Theme = themePlume({
     },
   },
   plugins: {
+    frontmatter: { exclude: ['**/*.snippet.*'] },
+
     shiki: { twoslash: true },
+
     markdownEnhance: {
       demo: true,
       include: true,
+      chart: true,
+      echarts: true,
+      mermaid: true,
+      flowchart: true,
     },
     comment: {
       provider: 'Giscus',
diff --git a/docs/notes/theme/config/frontmatter/basic.md b/docs/notes/theme/config/frontmatter/basic.md
index 9ed4ae89..19ab31d6 100644
--- a/docs/notes/theme/config/frontmatter/basic.md
+++ b/docs/notes/theme/config/frontmatter/basic.md
@@ -70,6 +70,13 @@ permalink: /config/frontmatter/basic/
 
 当前文章是否 可评论。 仅在启用了评论功能的情况下生效。
 
+### aside
+
+- 类型： `boolean`
+- 默认值： `true`
+
+当前文章是否 显示 右侧边栏。
+
 ### prev
 
 - 类型： `string | { text: string, link: string, icon?: string }`
diff --git a/docs/notes/theme/config/frontmatter/post.md b/docs/notes/theme/config/frontmatter/post.md
index eae7266b..9b48178e 100644
--- a/docs/notes/theme/config/frontmatter/post.md
+++ b/docs/notes/theme/config/frontmatter/post.md
@@ -24,7 +24,7 @@ tags:
 
 ### sticky
 
-- 类型： `boolean \| number`
+- 类型： `boolean | number`
 - 默认值： `false`
 
 是否在文章列表中，置顶当前文章。
diff --git a/docs/notes/theme/config/plugins/代码高亮.md b/docs/notes/theme/config/plugins/代码高亮.md
index 053d66b5..e4b3a445 100644
--- a/docs/notes/theme/config/plugins/代码高亮.md
+++ b/docs/notes/theme/config/plugins/代码高亮.md
@@ -16,6 +16,17 @@ Shiki 支持多种编程语言。
 
 关联插件： [@vuepress-plume/plugin-shikiji](https://github.com/pengzhanbo/vuepress-theme-plume/tree/main/plugins/plugin-shikiji)
 
+相比于 官方的 [@vuepress/plugin-prismjs](https://ecosystem.vuejs.press/zh/plugins/prismjs.html) 和
+[@vuepress/plugin-shiki](https://ecosystem.vuejs.press/zh/plugins/shiki.html) 两个代码高亮插件，
+提供了更为丰富的功能支持，包括：
+
+- [代码行高亮](/guide/markdown/extensions/#在代码块中实现行高亮)
+- [代码聚焦](/guide/markdown/extensions/#代码块中聚焦)
+- [代码对比差异](/guide/markdown/extensions/#代码块中的颜色差异)
+- [代码高亮“错误”和“警告”](/guide/markdown/extensions/#高亮-错误-和-警告)
+- [代码词高亮](/guide/markdown/extensions/#代码块中-词高亮)
+- [twoslash](/guide/markdown/experiment/#twoslash) <Badge tip="info" text="试验性" /> ，在代码块内提供内联类型提示。
+
 默认配置：
 
 ```ts
diff --git a/docs/notes/theme/config/plugins/搜索.md b/docs/notes/theme/config/plugins/搜索.md
index 1dcb7639..2e446a47 100644
--- a/docs/notes/theme/config/plugins/搜索.md
+++ b/docs/notes/theme/config/plugins/搜索.md
@@ -1,5 +1,5 @@
 ---
-title: 搜索配置
+title: 内容搜索
 author: pengzhanbo
 createTime: 2024/03/06 09:19:26
 permalink: /config/plugins/search/
diff --git a/docs/notes/theme/guide/markdown-基础.md b/docs/notes/theme/guide/markdown/基础.md
similarity index 100%
rename from docs/notes/theme/guide/markdown-基础.md
rename to docs/notes/theme/guide/markdown/基础.md
diff --git a/docs/notes/theme/guide/markdown-扩展.md b/docs/notes/theme/guide/markdown/扩展.md
similarity index 99%
rename from docs/notes/theme/guide/markdown-扩展.md
rename to docs/notes/theme/guide/markdown/扩展.md
index a012389f..6e2829e2 100644
--- a/docs/notes/theme/guide/markdown-扩展.md
+++ b/docs/notes/theme/guide/markdown/扩展.md
@@ -575,7 +575,7 @@ export default config
 
 **输出**
 
-@[code](../snippet/snippet-1.js)
+@[code](../../snippet/snippet-1.js)
 
 如果你只想导入这个文件的一部分：
 
diff --git a/docs/notes/theme/guide/markdown-试验性.md b/docs/notes/theme/guide/markdown/试验性.md
similarity index 100%
rename from docs/notes/theme/guide/markdown-试验性.md
rename to docs/notes/theme/guide/markdown/试验性.md
diff --git a/docs/notes/theme/guide/markdown-进阶.md b/docs/notes/theme/guide/markdown/进阶.md
similarity index 56%
rename from docs/notes/theme/guide/markdown-进阶.md
rename to docs/notes/theme/guide/markdown/进阶.md
index ace668f5..8fa38c39 100644
--- a/docs/notes/theme/guide/markdown-进阶.md
+++ b/docs/notes/theme/guide/markdown/进阶.md
@@ -6,6 +6,405 @@ createTime: 2024/03/05 16:27:59
 permalink: /guide/markdown/advance/
 ---
 
+## 选项组
+
+让你的 Markdown 文件支持选项卡。
+
+你需要将选项卡包装在 `tabs` 容器中。
+
+你可以在 `tabs` 容器中添加一个 id 后缀，该后缀将用作选项卡 id。
+所有具有相同 id 的选项卡将共享相同的切换事件。
+
+```md
+::: tabs#fruit
+
+<!-- 这里，fruit 将用作 id，它是可选的 -->
+
+<!-- 选项卡内容 -->
+
+:::
+```
+
+在这个容器内，你应该使用 `@tab` 标记来标记和分隔选项卡内容。
+
+在 `@tab` 标记后，你可以添加文本 `:active` 默认激活选项卡，之后的文本将被解析为选项卡标题。
+
+```md
+::: tabs
+
+@tab 标题 1
+
+<!-- tab 1 内容 -->
+
+@tab 标题 2
+
+<!-- tab 2 内容 -->
+
+@tab:active 标题 3
+
+<!-- tab 3 将会被默认激活 -->
+
+<!-- tab 3 内容 -->
+
+:::
+```
+
+默认情况下，标题将用作选项卡的值，但你可以使用 id 后缀覆盖它。
+
+```md
+::: tabs
+
+@tab 标题 1
+
+<!-- 此处，选项卡 1 的标题“标题 1”将用作值。 -->
+
+<!-- tab 1 内容 -->
+
+@tab 标题 2#值 2
+
+<!-- 这里，tab 2 的标题将是 “标题 2”，但它会使用 “值 2” 作为选项卡的值-->
+
+<!-- tab 2 内容 -->
+
+:::
+```
+
+你可以在每个选项卡中使用 Vue 语法和组件，并且你可以访问 value 和 isActive，
+表示选项卡的绑定值和选项卡是否处于激活状态。
+
+**输入**
+
+````
+::: tabs
+@tab npm
+
+npm 应该与 Node.js 被一同安装。
+
+@tab pnpm
+
+```sh
+corepack enable
+corepack use pnpm@8
+```
+
+:::
+````
+
+**输出**
+
+::: tabs
+@tab npm
+
+npm 应该与 Node.js 被一同安装。
+
+@tab pnpm
+
+```sh
+corepack enable
+corepack use pnpm@8
+```
+
+:::
+
+## 示例容器
+
+有时候，你可能需要在 内容中补充一些 示例，但期望能与 其它内容 分隔开来呈现。
+主题支持在 Markdown 文件中添加示例容器。
+
+### 语法
+
+````md
+::: demo-wrapper
+添加你的示例
+:::
+````
+
+### 选项
+
+- `title="xxx"`：标题
+- `no-padding`：不添加内边距
+- `img`: 仅包含图片时使用
+- `height="xxx"`: 高度
+
+### 示例
+
+仅包含图片:
+
+```md
+::: demo-wrapper img no-padding
+![](/images/custom-hero.png)
+:::
+```
+
+**输出：**
+::: demo-wrapper img no-padding
+![](/images/custom-hero.png)
+:::
+
+包含 markdown 语法：
+
+```md
+::: demo-wrapper title="标题"
+### 三级标题
+
+这是示例容器中的内容。
+:::
+```
+
+**输出：**
+::: demo-wrapper title="标题"
+### 三级标题
+
+这是示例容器中的内容。
+:::
+
+包含 html /vue 代码：
+
+```md
+::: demo-wrapper
+<h1 class="your-demo-title">这是标题</h1>
+<p class="your-demo-paragraph">这是段落</p>
+
+<style>
+  .your-demo-title {
+    color: red;
+  }
+  .your-demo-paragraph {
+    color: blue;
+  }
+</style>
+:::
+```
+
+**输出：**
+::: demo-wrapper
+
+<h1 class="your-demo-title">这是标题</h1>
+<p class="your-demo-paragraph">这是段落</p>
+
+<style>
+  .your-demo-title {
+    color: red !important;
+  }
+  .your-demo-paragraph {
+    color: blue !important;
+  }
+</style>
+
+:::
+
+## can I use
+
+在编写文章时， 提供嵌入 [can-i-use](https://caniuse.com/) WEB feature 各平台支持说明 的功能。
+
+方便在描述某个 WEB feature 时，能更直观的表述 该特性的支持程度。
+
+在你的 文章 markdown文件中，使用以下格式：
+
+``` md
+::: caniuse <feature> {browser_versions}
+:::
+```
+
+__示例： 获取 css 伪类选择器 `:dir()` 在各个浏览器的支持情况图标：__
+
+``` md
+::: caniuse css-matches-pseudo
+:::
+```
+效果：
+
+::: caniuse css-matches-pseudo
+:::
+
+### 语法
+
+``` md
+::: caniuse <feature> {browser_versions}
+:::
+```
+
+-  `<feature>`
+
+   必填。 正确取值请参考 [https://caniuse.bitsofco.de/](https://caniuse.bitsofco.de/)
+
+- `{browser_versions}`
+
+  可选。当前特性在多个版本中的支持情况。
+
+  默认值为: `{-2,-1,1}`
+
+  格式： `{number,number,...}`  取值范围为 `-5 ~ 3`
+
+  - 小于`0` 表示低于当前浏览器版本的支持情况
+  - `0` 表示当前浏览器版本的支持情况
+  - 大于`0` 表示高于当前浏览器版本的支持情况
+
+## 导入文件
+
+主题支持在 Markdown 文件中导入文件切片。
+
+导入文件 默认不启用，你可以通过配置来启用它。
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownEnhance: {
+        include: true, // [!code highlight]
+      },
+    }
+  })
+})
+```
+:::
+
+### 语法
+
+使用 `<!-- @include: filename -->` 导入文件。
+
+如果要部分导入文件，你可以指定导入的行数:
+
+- `<!-- @include: filename{start-end} -->`
+- `<!-- @include: filename{start-} -->`
+- `<!-- @include: filename{-end} -->`
+
+同时你也可以导入文件区域:
+
+- `<!-- @include: filename#region -->`
+
+::::tip 文件区域
+文件区域是 vscode 中的一个概念，区域内容被 `#region` 和 `#endregion` 注释包围。
+
+<!-- @include: ../../snippet/include-1.snippet.md -->
+::::
+
+### 高级
+
+你还可以设置一个对象来自定义包含文件路径和包含行为。
+
+```ts
+interface IncludeOptions {
+  /**
+   * 处理 include 文件路径
+   *
+   * @default (path) => path
+   */
+  resolvePath?: (path: string, cwd: string | null) => string
+  /**
+   * 是否深度导入包含的 Markdown 文件
+   *
+   * @default false
+   */
+  deep?: boolean
+  /**
+   * 是否使用 `<!-- @include: xxx -->` 代替 `@include: xxx` 导入文件
+   *
+   * @default true
+   */
+  useComment?: boolean
+  /**
+   * 是否解析包含的 Markdown 文件的里的相对图像路径
+   *
+   * @default true
+   */
+  resolveImagePath?: boolean
+  /**
+   * 是否解析包含的 Markdown 文件的里的文件相对路径
+   *
+   * @default true
+   */
+  resolveLinkPath?: boolean
+}
+```
+
+例如: 你可以使用 @src 作为源文件夹的别名。
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts{5-11}
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownEnhance: {
+        include: {
+          resolvePath: (file) => {
+            if (file.startsWith('@src'))
+              return file.replace('@src', path.resolve(__dirname, '..'))
+
+            return file
+          },
+        },
+      },
+    }
+  })
+})
+```
+:::
+
+此外，如果你想将 Markdown 文件直接放在实际文件旁边，但不希望它们呈现为页面，
+你可以在 VuePress 配置中设置 `pagePatterns` 选项。
+有关详细信息，请参阅 [pagePatterns](https://vuejs.press/zh/reference/config.html#pagepatterns)。
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+export default defineUserConfig({
+  // 现在任何带有 `.snippet.md` 扩展名的文件都不会呈现为页面
+  pagePatterns: ['**/*.md', '!**/*.snippet.md', '!.vuepress', '!node_modules'], // [!code ++]
+  theme: plumeTheme({
+    plugins: {
+      markdownEnhance: {
+        include: true,
+      },
+    }
+  })
+})
+```
+:::
+
+### 示例
+
+在项目中有一个 `foo.snippet.md` 文件：
+:::: code-tabs
+@tab foo.snippet.md
+```md
+### 三级标题
+
+这是 foo.snippet.md 文件中的内容。
+
+::: info
+提示容器包括的内容
+:::
+
+<!-- region snippet -->
+这里是被 `<!-- region snippet -->` 包裹的内容。
+
+通过 `<!-- @include: ./foo.snippet.md#snippet -->` 来引入。
+<!-- endregion snippet -->
+```
+::::
+
+使用 `<!-- @include: ./foo.snippet.md -->` 导入文件：
+
+:::: demo-wrapper title="Include by file"
+<!-- @include: ../../snippet/include-2.snippet.md -->
+::::
+
+使用 `<!-- @include: ./foo.snippet.md{5-7} -->` 导入文件内的 5 到 7 行：
+
+:::: demo-wrapper title="Include by lines"
+<!-- @include: ../../snippet/include-2.snippet.md{5-7} -->
+::::
+
+使用 `<!-- @include: ./foo.snippet.md#snippet -->` 导入 `snippet` 区域
+
+:::: demo-wrapper title="Include by file region"
+<!-- @include: ../../snippet/include-2.snippet.md#snippet -->
+::::
+
 ## 代码演示
 
 代码演示 默认不启用，你可以通过配置来启用它。
@@ -443,103 +842,3 @@ export default () => {
 :::
 ````
 ::::
-
-## 选项组
-
-让你的 Markdown 文件支持供选项卡。
-
-你需要将选项卡包装在 `tabs` 容器中。
-
-你可以在 `tabs` 容器中添加一个 id 后缀，该后缀将用作选项卡 id。
-所有具有相同 id 的选项卡将共享相同的切换事件。
-
-```md
-::: tabs#fruit
-
-<!-- 这里，fruit 将用作 id，它是可选的 -->
-
-<!-- 选项卡内容 -->
-
-:::
-```
-
-在这个容器内，你应该使用 `@tab` 标记来标记和分隔选项卡内容。
-
-在 `@tab` 标记后，你可以添加文本 `:active` 默认激活选项卡，之后的文本将被解析为选项卡标题。
-
-```md
-::: tabs
-
-@tab 标题 1
-
-<!-- tab 1 内容 -->
-
-@tab 标题 2
-
-<!-- tab 2 内容 -->
-
-@tab:active 标题 3
-
-<!-- tab 3 将会被默认激活 -->
-
-<!-- tab 3 内容 -->
-
-:::
-```
-
-默认情况下，标题将用作选项卡的值，但你可以使用 id 后缀覆盖它。
-
-```md
-::: tabs
-
-@tab 标题 1
-
-<!-- 此处，选项卡 1 的标题“标题 1”将用作值。 -->
-
-<!-- tab 1 内容 -->
-
-@tab 标题 2#值 2
-
-<!-- 这里，tab 2 的标题将是 “标题 2”，但它会使用 “值 2” 作为选项卡的值-->
-
-<!-- tab 2 内容 -->
-
-:::
-```
-
-你可以在每个选项卡中使用 Vue 语法和组件，并且你可以访问 value 和 isActive，
-表示选项卡的绑定值和选项卡是否处于激活状态。
-
-**输入**
-
-````
-::: tabs
-@tab npm
-
-npm 应该与 Node.js 被一同安装。
-
-@tab pnpm
-
-```sh
-corepack enable
-corepack use pnpm@8
-```
-
-:::
-````
-
-**输出**
-
-::: tabs
-@tab npm
-
-npm 应该与 Node.js 被一同安装。
-
-@tab pnpm
-
-```sh
-corepack enable
-corepack use pnpm@8
-```
-
-:::
diff --git a/docs/notes/theme/guide/seo.md b/docs/notes/theme/guide/功能/seo.md
similarity index 100%
rename from docs/notes/theme/guide/seo.md
rename to docs/notes/theme/guide/功能/seo.md
diff --git a/docs/notes/theme/guide/sitemap.md b/docs/notes/theme/guide/功能/sitemap.md
similarity index 94%
rename from docs/notes/theme/guide/sitemap.md
rename to docs/notes/theme/guide/功能/sitemap.md
index a31c802e..bc100bcb 100644
--- a/docs/notes/theme/guide/sitemap.md
+++ b/docs/notes/theme/guide/功能/sitemap.md
@@ -1,5 +1,5 @@
 ---
-title: 生成 sitemap
+title: sitemap
 author: pengzhanbo
 icon: mdi:sitemap-outline
 createTime: 2024/03/02 16:47:00
diff --git a/docs/notes/theme/guide/代码复制.md b/docs/notes/theme/guide/功能/代码复制.md
similarity index 100%
rename from docs/notes/theme/guide/代码复制.md
rename to docs/notes/theme/guide/功能/代码复制.md
diff --git a/docs/notes/theme/guide/内容搜索.md b/docs/notes/theme/guide/功能/内容搜索.md
similarity index 100%
rename from docs/notes/theme/guide/内容搜索.md
rename to docs/notes/theme/guide/功能/内容搜索.md
diff --git a/docs/notes/theme/guide/加密.md b/docs/notes/theme/guide/功能/加密.md
similarity index 98%
rename from docs/notes/theme/guide/加密.md
rename to docs/notes/theme/guide/功能/加密.md
index 7025a716..c9b20c5a 100644
--- a/docs/notes/theme/guide/加密.md
+++ b/docs/notes/theme/guide/功能/加密.md
@@ -89,6 +89,10 @@ export default defineUserConfig({
 - 使用 `encrypt.admin` 解锁后，被认为是管理员访问，其它未解锁页面也默认解锁。
 :::
 
+## 示例
+
+点击访问 [加密文章，密码：123456](/article/enx7c9s/)
+
 ## 相关配置
 
 以下配置支持在多语言配置中使用。
diff --git a/docs/notes/theme/guide/友情链接页.md b/docs/notes/theme/guide/功能/友情链接页.md
similarity index 100%
rename from docs/notes/theme/guide/友情链接页.md
rename to docs/notes/theme/guide/功能/友情链接页.md
diff --git a/docs/notes/theme/guide/组件.md b/docs/notes/theme/guide/功能/组件.md
similarity index 86%
rename from docs/notes/theme/guide/组件.md
rename to docs/notes/theme/guide/功能/组件.md
index aa3d108d..815bf047 100644
--- a/docs/notes/theme/guide/组件.md
+++ b/docs/notes/theme/guide/功能/组件.md
@@ -6,8 +6,14 @@ createTime: 2024/03/06 09:42:42
 permalink: /guide/features/component/
 ---
 
+## 概述
+
+主题提供了一些具有通用性的组件，可以在任何地方使用。
+
 ## `<Badge />` <Badge type="tip" text="badge" />
 
+标签，用于在页面中增加一些提示信息。
+
 ### Props
 
 - `type`
@@ -35,7 +41,9 @@ permalink: /guide/features/component/
 
 ## `<Iconify />`
 
-支持 iconify 所有图标，支持通过 icon name 加载图标，可在 [iconify search](https://icon-sets.iconify.design/) 搜索图标使用。
+支持 iconify 所有图标，支持通过 icon name 加载图标。
+
+可在 [iconify search](https://icon-sets.iconify.design/) 搜索图标使用。
 
 ### Props
 
diff --git a/docs/notes/theme/guide/功能/评论.md b/docs/notes/theme/guide/功能/评论.md
new file mode 100644
index 00000000..2488393a
--- /dev/null
+++ b/docs/notes/theme/guide/功能/评论.md
@@ -0,0 +1,236 @@
+---
+title: 评论
+author: pengzhanbo
+icon: la:comment
+createTime: 2024/03/04 11:58:59
+permalink: /guide/features/comments/
+---
+
+## 概述
+
+文章评论由 [@vuepress/plugin-comment](https://ecosystem.vuejs.press/zh/plugins/comment/) 提供支持。
+
+主题已内置插件，你无需重新安装即可使用。
+
+在本主题中，通过以下字段进行配置：
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+import { defineUserConfig } from 'vuepress'
+import { plumeTheme } from 'vuepress-theme-plume'
+
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      comment: {
+        // 服务提供商
+        provider: '', // "Artalk“ | "Giscus" | "Twikoo" | "Waline"
+        // 是否默认启用评论
+        comment: true,
+
+        // 其它配置，根据服务提供商进行配置
+        // ...
+      }
+    }
+  })
+})
+```
+:::
+
+### 服务提供商
+
+[@vuepress/plugin-comment](https://ecosystem.vuejs.press/zh/plugins/comment/) 支持
+`"Artalk“ | "Giscus" | "Twikoo" | "Waline"` 等多种不同的评论服务提供商。
+
+你可以根据自己的需求进行配置。
+
+- `Giscus` 是一个基于 GitHub Discussion 的评论系统，启用简便。[查看文档](https://ecosystem.vuejs.press/zh/plugins/comment/giscus/)
+- `Waline` 是一个 需要后端的评论系统，安全性较高。[查看文档](https://ecosystem.vuejs.press/zh/plugins/comment/waline/)
+- `Twikoo` 一个简洁、安全、免费的静态网站评论系统，基于 腾讯云开发。[查看文档](https://ecosystem.vuejs.press/zh/plugins/comment/twikoo/)
+- `Artalk` 是一款简洁的自托管评论系统，你可以在服务器上轻松部署并置入前端页面中。[查看文档](https://ecosystem.vuejs.press/zh/plugins/comment/artalk/)
+
+::: tip 推荐的评论服务
+- 面向程序员和开发人员: Giscus
+- 面向公众: Waline
+:::
+
+## Giscus
+
+Giscus 是一个基于 GitHub Discussion 的评论系统，启用简便。
+
+### 准备工作
+
+1. 你需要创建一个公开仓库，并开启评论区，以作为评论存放的地点
+
+2. 你需要安装 [Giscus App](https://github.com/apps/giscus)，使其有权限访问对应仓库。
+
+3. 在完成以上步骤后，请前往 [Giscus 页面](https://giscus.app/zh-CN) 获得你的设置。
+
+   你只需要填写仓库和 Discussion 分类，之后滚动到页面下部的 “启用 giscus” 部分，
+   获取 `data-repo`, `data-repo-id`, `data-category` 和 `data-category-id` 这四个属性。
+
+### 配置
+
+请配置 `provider: 'Giscus'` 并将 `data-repo`, `data-repo-id`, `data-category` 和 `data-category-id` 作为插件选项传入 `repo`, `repoId`, `category`, `categoryId` 。
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+import { defineUserConfig } from 'vuepress'
+import { plumeTheme } from 'vuepress-theme-plume'
+
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      comment: {
+        provider: 'Giscus', // "Artalk“ | "Giscus" | "Twikoo" | "Waline"
+        comment: true,
+        repo: 'Your_Repo', // [!code ++]
+        repoId: 'Your_RepoId', // [!code ++]
+        category: 'Your_Category', // [!code ++]
+        categoryId: 'Your_CategoryId', // [!code ++]
+      }
+    }
+  })
+})
+```
+:::
+
+### 主题
+
+默认情况下，Giscus 使用 `light` 或 `dark` 主题 (基于夜间模式状态)。
+
+如果你想在日间模式和夜间模式下自定义主题，你可以设置 `lightTheme` 和 `darkTheme` 选项，
+使用内置主题关键字或以 `https://` 开头的自定义 css 链接。
+
+## Waline
+
+一个有后端的安全评论系统。
+
+### 安装
+
+如果你想要在主题中使用 Waline， 你需要先安装 `@waline/client`。
+
+::: code-tabs
+@tab pnpm
+```sh
+pnpm add @waline/client
+```
+@tab npm
+```sh
+npm i @waline/client
+```
+@tab yarn
+```sh
+yarn add @waline/client
+```
+:::
+
+### LeanCloud 设置 (数据库)
+
+1. [登录](https://console.leancloud.app/login) 或 [注册](https://console.leancloud.app/register) `LeanCloud 国际版` 并进入 [控制台](https://console.leancloud.app/apps)
+
+1. 点击左上角 [创建应用](https://console.leancloud.app/apps) 并起一个你喜欢的名字 (请选择免费的开发版):
+
+   ![创建应用](https://ecosystem.vuejs.press/assets/leancloud-1-D6GvqV4-.png)
+
+2. 进入应用，选择左下角的 `设置` > `应用 Key`。你可以看到你的 `APP ID`,`APP Key` 和 `Master Key`。请记录它们，以便后续使用。
+
+   ![ID 和 Key](https://ecosystem.vuejs.press/assets/leancloud-2-B5wKvXiY.png)
+
+::: warning 国内版需要完成备案接入
+
+如果你正在使用 Leancloud 国内版 ([leancloud.cn](https://leancloud.cn))，我们推荐你切换到国际版 ([leancloud.app](https://leancloud.app))。否则，你需要为应用额外绑定**已备案**的域名，同时购买独立 IP 并完成备案接入:
+
+- 登录国内版并进入需要使用的应用
+- 选择 `设置` > `域名绑定` > `API 访问域名` > `绑定新域名` > 输入域名 > `确定`。
+- 按照页面上的提示按要求在 DNS 上完成 CNAME 解析。
+- 购买独立 IP 并提交工单完成备案接入。(独立 IP 目前价格为 ￥ 50/个/月)
+
+![域名设置](https://ecosystem.vuejs.press/assets/leancloud-3-D7gbeXS0.png)
+
+:::
+
+### Vercel 部署 (服务端)
+
+[![Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fwalinejs%2Fwaline%2Ftree%2Fmain%2Fexample)
+
+1. 点击上方按钮，跳转至 Vercel 进行 Server 端部署。
+
+   ::: note
+
+   如果你未登录的话，Vercel 会让你注册或登录，请使用 GitHub 账户进行快捷登录。
+
+   :::
+
+1. 输入一个你喜欢的 Vercel 项目名称并点击 `Create` 继续:
+
+   ![创建项目](https://ecosystem.vuejs.press/images/comment/vercel-1.png)
+
+2. 此时 Vercel 会基于 Waline 模板帮助你新建并初始化仓库，仓库名为你之前输入的项目名。
+
+   ![deploy](https://ecosystem.vuejs.press/images/comment/vercel-3.png)
+
+   一两分钟后，满屏的烟花会庆祝你部署成功。此时点击 `Go to Dashboard` 可以跳转到应用的控制台。
+
+   ![deploy](https://ecosystem.vuejs.press/images/comment/vercel-4.png)
+
+3. 点击顶部的 `Settings` - `Environment Variables` 进入环境变量配置页，并配置三个环境变量 `LEAN_ID`, `LEAN_KEY` 和 `LEAN_MASTER_KEY` 。它们的值分别对应上一步在 LeanCloud 中获得的 `APP ID`, `APP KEY`, `Master Key`。
+
+   ![设置环境变量](https://ecosystem.vuejs.press/images/comment/vercel-5.png)
+
+   ::: note
+
+   如果你使用 LeanCloud 国内版，请额外配置 `LEAN_SERVER` 环境变量，值为你绑定好的域名。
+
+   :::
+
+4. 环境变量配置完成之后点击顶部的 `Deployments` 点击顶部最新的一次部署右侧的 `Redeploy` 按钮进行重新部署。该步骤是为了让刚才设置的环境变量生效。
+
+   ![redeploy](https://ecosystem.vuejs.press/images/comment/vercel-6.png)
+
+5. 此时会跳转到 `Overview` 界面开始部署，等待片刻后 `STATUS` 会变成 `Ready`。此时请点击 `Visit` ，即可跳转到部署好的网站地址，此地址即为你的服务端地址。
+
+   ![redeploy success](https://ecosystem.vuejs.press/images/comment/vercel-7.png)
+
+### 绑定域名 (可选)
+
+1. 点击顶部的 `Settings` - `Domains` 进入域名配置页
+
+1. 输入需要绑定的域名并点击 `Add`
+
+   ![Add domain](https://ecosystem.vuejs.press/images/comment/vercel-8.png)
+
+2. 在域名服务器商处添加新的 `CNAME` 解析记录
+
+   | Type  | Name    | Value                |
+   | ----- | ------- | -------------------- |
+   | CNAME | example | cname.vercel-dns.com |
+
+3. 等待生效，你可以通过自己的域名来访问了:tada:
+
+   - 评论系统：example.your-domain.com
+   - 评论管理：example.your-domain.com/ui
+
+   ![success](https://ecosystem.vuejs.press/images/comment/vercel-9.png)
+
+### 客户端
+
+#### 使用插件
+
+在插件选项中设置 `provider: "Waline"`，同时设置服务端地址 `serverURL` 为上一步获取到的值。
+
+此时，将 `<CommentService>` 组件放置在你网站中合适的位置 (通常是页面的底部)，即可使用 Waline 评论功能。
+
+::: tip
+
+你也可以传入其他 Waline 支持的选项 (除了 `el`)。详情请见 [Waline 配置](https://ecosystem.vuejs.press/zh/plugins/comment/waline/config.html)
+
+:::
+
+### 评论管理 (管理端)
+
+1. 部署完成后，请访问 `<serverURL>/ui/register` 进行注册。首个注册的人会被设定成管理员。
+1. 管理员登陆后，即可看到评论管理界面。在这里可以修改、标记或删除评论。
+1. 用户也可通过评论框注册账号，登陆后会跳转到自己的档案页。
diff --git a/docs/notes/theme/guide/图表/chart.md b/docs/notes/theme/guide/图表/chart.md
new file mode 100644
index 00000000..eee13431
--- /dev/null
+++ b/docs/notes/theme/guide/图表/chart.md
@@ -0,0 +1,127 @@
+---
+title: chart.js
+author: pengzhanbo
+createTime: 2024/03/16 19:33:49
+icon: solar:chart-bold
+permalink: /guide/chart/chartjs/
+---
+
+## 概述
+
+主题支持在 文章中 嵌入由 [chart.js](https://www.chartjs.org/docs/latest/) 图表。
+
+该功能由 [vuepress-plugin-md-enhance](https://plugin-md-enhance.vuejs.press/) 提供支持。
+
+## 配置
+
+主题默认不启用该功能。
+
+你需要在你的项目中安装 [chart.js](https://www.chartjs.org/docs/latest/) 库。
+
+::: code-tabs
+@tab pnpm
+```sh
+pnpm add chart.js
+```
+@tab npm
+```sh
+npm install chart.js
+```
+@tab yarn
+```sh
+yarn add chart.js
+```
+:::
+
+然后在 `.vuepress/config.ts` 配置文件中，启用该功能：
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownEnhance: {
+        chart: true,
+      },
+    }
+  })
+})
+```
+:::
+
+## 语法
+
+````md
+::: chart 标题
+```json
+{
+  // 此处为图表配置
+}
+```
+:::
+````
+
+图标配置请查看 [Chart.js文档](https://www.chartjs.org/docs/latest/) 。
+
+## 示例
+
+### 块状图
+
+**输入：**
+
+<!-- @include: ../../snippet/chart-1.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/chart-1.snippet.md{2-41} -->
+
+### 气泡图
+
+**输入：**
+
+<!-- @include: ../../snippet/chart-2.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/chart-2.snippet.md{2-20} -->
+
+### 折线图
+
+**输入：**
+
+<!-- @include: ../../snippet/chart-3.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/chart-3.snippet.md{2-20} -->
+
+### 玫瑰图
+
+**输入：**
+
+<!-- @include: ../../snippet/chart-4.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/chart-4.snippet.md{2-24} -->
+
+### 雷达图
+
+**输入：**
+
+<!-- @include: ../../snippet/chart-5.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/chart-5.snippet.md{2-42} -->
+
+### 散点图
+
+**输入：**
+
+<!-- @include: ../../snippet/chart-6.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/chart-6.snippet.md{2-30} -->
diff --git a/docs/notes/theme/guide/图表/echarts.md b/docs/notes/theme/guide/图表/echarts.md
new file mode 100644
index 00000000..20818260
--- /dev/null
+++ b/docs/notes/theme/guide/图表/echarts.md
@@ -0,0 +1,237 @@
+---
+title: ECharts
+author: pengzhanbo
+createTime: 2024/03/16 19:34:03
+icon: raphael:piechart
+permalink: /guide/chart/echarts/
+---
+
+## 概述
+
+主题支持在文章中嵌入 [ECharts](https://echarts.apache.org/zh/index.html) 图表。
+
+该功能由 [vuepress-plugin-md-enhance](https://plugin-md-enhance.vuejs.press/) 提供支持。
+
+## 配置
+
+主题默认不启用该功能。
+
+你需要在你的项目中安装 [ECharts](https://echarts.apache.org/zh/index.html) 库。
+
+::: code-tabs
+@tab pnpm
+```sh
+pnpm add echarts
+```
+@tab npm
+```sh
+npm install echarts
+```
+@tab yarn
+```sh
+yarn add echarts
+```
+:::
+
+然后在 `.vuepress/config.ts` 配置文件中，启用该功能：
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownEnhance: {
+        echarts: true,
+      },
+    }
+  })
+})
+```
+:::
+
+## 语法
+
+### JSON 配置
+
+如果你可以很轻松的生成数据，你可以直接通过一个 JSON 代码块来提供 Echarts 配置:
+
+````md
+::: echarts 标题
+
+```json
+{
+  // 此处为 ECharts 图表配置
+}
+```
+
+:::
+````
+
+### JavaScript 配置
+
+如果你需要通过脚本来获取数据，你可以使用 js 和 javascript 的代码块。
+
+我们将通过 `myChart` 变量暴露 Echarts 实例，并且你应该将 Echart 配置赋值给 `option` 变量。
+同时，你也可以赋值 `width` 和 `height` 来设置图表大小。
+
+````md
+::: echarts Title
+```js
+const option = {
+  // 此处为 ECharts 图表配置
+}
+```
+:::
+````
+
+:::tip
+你可以使用顶级 `await` 和 `fetch` 来从网络请求中获取数据。
+:::
+
+相关配置，详见 [ECharts 文档](https://echarts.apache.org/handbook/zh/get-started/)
+
+## 高级
+
+你可以在 [客户端配置文件](https://vuejs.press/zh/guide/configuration.html##使用脚本) 中导入并使用 `defineEchartsConfig` 来自定义 Echarts:
+
+```ts
+import { defineClientConfig } from 'vuepress/client'
+import { defineEchartsConfig } from 'vuepress-theme-plume/client'
+
+defineEchartsConfig({
+  options: {
+    // 全局 Echarts 配置
+  },
+  setup: async () => {
+    // Echarts 设置
+    // 例如: await import("echarts-wordcloud")
+  },
+})
+
+export default defineClientConfig({
+  // ...
+})
+```
+
+## 示例
+
+### 线图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-1.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-1.snippet.md{2-100} -->
+
+### 柱状图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-2.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-2.snippet.md{2-75} -->
+
+### 饼图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-3.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-3.snippet.md{2-74} -->
+
+### 散点图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-4.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-4.snippet.md{2-39} -->
+
+### 极坐标图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-5.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-5.snippet.md{2-40} -->
+
+### 烛台图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-6.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-6.snippet.md{2-308} -->
+
+### 雷达图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-7.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-7.snippet.md{2-36} -->
+
+### 热力图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-8.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-8.snippet.md{2-179} -->
+
+### 树图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-9.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-9.snippet.md{2-33} -->
+
+### 多图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/echarts-10.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/echarts-10.snippet.md{2-69} -->
diff --git a/docs/notes/theme/guide/图表/flowchart.md b/docs/notes/theme/guide/图表/flowchart.md
new file mode 100644
index 00000000..7505472b
--- /dev/null
+++ b/docs/notes/theme/guide/图表/flowchart.md
@@ -0,0 +1,332 @@
+---
+title: flowchart
+author: pengzhanbo
+createTime: 2024/03/16 19:34:31
+icon: f7:flowchart
+permalink: /guide/chart/flowchart/
+---
+
+## 概述
+
+主题支持在 文章中 嵌入由 [flowchart](http://flowchart.js.org/) 。
+
+该功能由 [vuepress-plugin-md-enhance](https://plugin-md-enhance.vuejs.press/) 提供支持。
+
+## 配置
+
+主题默认不启用该功能。
+
+你需要在你的项目中安装 [flowchart.ts](http://flowchart.js.org/) 库。
+
+::: code-tabs
+@tab pnpm
+```sh
+pnpm add flowchart.ts
+```
+@tab npm
+```sh
+npm install flowchart.ts
+```
+@tab yarn
+```sh
+yarn add flowchart.ts
+```
+:::
+
+然后在 `.vuepress/config.ts` 配置文件中，启用该功能：
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownEnhance: {
+        flowchart: true,
+      },
+    }
+  })
+})
+```
+:::
+
+## 语法
+
+````md
+<!------- ↓ :preset 是可选的 -->
+```flow:preset
+
+<!-- 放置你的流程图代码 -->
+
+```
+````
+
+目前可用的预设:
+
+- vue (默认)
+- ant
+- pie
+
+## 演示
+
+::: md-demo Vue 主题
+
+```flow
+st=>start: 开始|past:>http://www.google.com[blank]
+e=>end: 结束|future:>http://www.google.com
+op1=>operation: 操作1|past
+op2=>operation: 操作2|current
+sub1=>subroutine: 子程序|invalid
+cond=>condition: 是/否?|approved:>http://www.google.com
+c2=>condition: 判断2|rejected
+io=>inputoutput: 进行反思...|future
+
+st->op1(right)->cond
+cond(yes, right)->c2
+cond(no)->sub1(left)->op1
+c2(yes)->io->e
+c2(no)->op2->e
+```
+
+:::
+
+::: md-demo Ant 主题
+
+```flow:ant
+st=>start: 开始|past:>http://www.google.com[blank]
+e=>end: 结束|future:>http://www.google.com
+op1=>operation: 操作1|past
+op2=>operation: 操作2|current
+sub1=>subroutine: 子程序|invalid
+cond=>condition: 是/否?|approved:>http://www.google.com
+c2=>condition: 判断2|rejected
+io=>inputoutput: 进行反思...|future
+
+st->op1(right)->cond
+cond(yes, right)->c2
+cond(no)->sub1(left)->op1
+c2(yes)->io->e
+c2(no)->op2->e
+```
+
+:::
+
+::: md-demo Pie 主题
+
+```flow:pie
+st=>start: 开始|past:>http://www.google.com[blank]
+e=>end: 结束|future:>http://www.google.com
+op1=>operation: 操作1|past
+op2=>operation: 操作2|current
+sub1=>subroutine: 子程序|invalid
+cond=>condition: 是/否?|approved:>http://www.google.com
+c2=>condition: 判断2|rejected
+io=>inputoutput: 进行反思...|future
+
+st->op1(right)->cond
+cond(yes, right)->c2
+cond(no)->sub1(left)->op1
+c2(yes)->io->e
+c2(no)->op2->e
+```
+
+:::
+
+## 流程图介绍
+
+### 节点类型
+
+定义了结点形状。
+
+#### 开始 & 结束
+
+- `[Variable]->start: [Text]`
+
+  被用于流程开始的第一个节点。
+  默认文字为 `Start`.
+
+- `[Variable]->end: [Text]`
+
+  被用于流程结束的最后一个节点。
+  默认文字为 `End`.
+
+::: md-demo 开始 & 结束
+
+```flow
+st=>start: 开始
+e=>end: 结束
+
+st->e
+```
+
+:::
+
+#### 操作
+
+`[Variable]->operation: [Text]`
+
+::: md-demo 操作
+```flow
+process=>operation: 操作
+e=>end: 结束
+
+process->e
+```
+
+:::
+
+#### 输入输出
+
+`[Variable]->inputoutput: [Text]`
+
+::: md-demo 输入输出
+```flow
+process=>inputoutput: 输入输出
+e=>end: 结束
+
+process->e
+```
+
+:::
+
+#### 子程序
+
+`[Variable]->subroutine: [Text]`
+
+::: md-demo 子程序
+```flow
+process=>subroutine: 子程序
+e=>end: 结束
+
+process->e
+```
+
+:::
+
+#### 条件
+
+- `[Variable]->condition: [Text]`
+
+- `[Variable]([yesText])->[Position]`
+- `[Variable]([noText])->[Position]`
+
+::: md-demo 条件
+```flow
+cond=>condition: 是否执行操作?
+process=>operation: 操作
+e=>end: 结束
+
+cond(yes)->process->e
+cond(no)->e
+```
+
+:::
+
+#### 平行
+
+定义同时开始的多个程序。
+
+- `[Variable]->parallel: [Text]`
+- `[Variable](path1, direction)->[Position]`
+- `[Variable](path1, direction)->[Position]`
+
+::: md-demo 平行
+```flow
+para=>parallel: 平行任务
+process=>operation: 操作
+e=>end: 结束
+
+para(path1, bottom)->process->e
+para(path2)->e
+```
+
+:::
+
+### 链接
+
+连接方式在流程图中节点定义后描述，使用 `->` 指定一个节点之间的链接，例如 `nodeVar1->nodeVar2->nodeVar3`
+
+流程可以被分开:
+
+```md
+nodeVar1->nodeVar2
+nodeVar2->nodeVar3
+```
+
+连接格式定义如下:
+
+`<node variable name>[(<specification1>[, <specification2])]-><node variable name>[[(<specification1>[, <specification2])]-><node variable name>]`
+
+在 `[]` 中的项是可选的。
+
+### 方向
+
+以下方向可用，并定义了连接将从节点离开的方向。如果指定符不止一个，则总是最后一个。所有节点都有默认方向，这使其成为可选规范。`<direction>` 的可选值为:
+
+- `left`
+- `right`
+- `top`
+- `bottom`
+
+### 节点特定说明符
+
+每个节点变量都有可选的说明符，例如方向，有些变量有特殊的说明符，具体取决于下面定义的节点类型。在 `()` 中的变量名后添加说明符，并用`,` 分隔，例如 `nodeVar (spec1，spec2)`。
+
+- **start**
+  **operation**
+  **inputoutput**
+  **subroutine**
+
+  可选方向
+
+  `startVar(<direction>)->nextNode`
+
+  `operationVar(<direction>)->nextNode`
+
+  `inputoutputVar(<direction>)->nextNode`
+
+  `subroutineVar(<direction>)->nextNode`
+
+- **condition**
+
+  必需指定 `yes` or `no`
+
+  可选方向
+
+  ```md
+  conditionalVar(yes, <direction>)->nextNode1
+  conditionalVar(no, <direction>)->nextNode2
+  ```
+
+- **parallel**
+
+  必需指定路径方向 `path1`, `path2`, 或 `path3`
+
+  可选方向
+
+  ```md
+  parallelVar(path1, <direction>)->nextNode1
+  parallelVar(path2, <direction>)->nextNode2
+  parallelVar(path3, <direction>)->nextNode3
+  ```
+
+### 网址
+
+可以使用 `:>` 运算符将外部链接添加到节点。
+
+`[blank]` 指定打开新的页面
+
+```md
+st=>start: Start:>http://www.google.com[blank]
+e=>end: End:>http://www.yahoo.com
+```
+
+### 建议
+
+文本中可能不应该使用的符号: `=>`、`->`、 `:>`、`|`、`@>` 和 `:$`
+
+如果要在流程图中强调特定路径，则可以另外定义它，如下所示:
+
+```
+st@>op1({"stroke":"Red"})@>cond({"stroke":"Red","stroke-width":6,"arrow-end":"classic-wide-long"})@>c2({"stroke":"Red"})@>op2({"stroke":"Red"})@>e({"stroke":"Red"})
+```
diff --git a/docs/notes/theme/guide/图表/mermaid.md b/docs/notes/theme/guide/图表/mermaid.md
new file mode 100644
index 00000000..b343afba
--- /dev/null
+++ b/docs/notes/theme/guide/图表/mermaid.md
@@ -0,0 +1,313 @@
+---
+title: mermaid
+author: pengzhanbo
+createTime: 2024/03/16 19:34:16
+icon: file-icons:mermaid
+permalink: /guide/chart/mermaid/
+---
+
+## 概述
+
+主题支持在 文章中 嵌入由 [Mermaid](https://mermaid.js.org/) 。
+
+该功能由 [vuepress-plugin-md-enhance](https://plugin-md-enhance.vuejs.press/) 提供支持。
+
+## 配置
+
+主题默认不启用该功能。
+
+你需要在你的项目中安装 [mermaid](https://mermaid.js.org/) 库。
+
+::: code-tabs
+@tab pnpm
+```sh
+pnpm add mermaid
+```
+@tab npm
+```sh
+npm install mermaid
+```
+@tab yarn
+```sh
+yarn add mermaid
+```
+:::
+
+然后在 `.vuepress/config.ts` 配置文件中，启用该功能：
+
+::: code-tabs
+@tab .vuepress/config.ts
+```ts
+export default defineUserConfig({
+  theme: plumeTheme({
+    plugins: {
+      markdownEnhance: {
+        mermaid: true,
+      },
+    }
+  })
+})
+```
+:::
+
+## 语法
+
+````md
+```mermaid
+
+<!-- 在此处放置 mermaid 代码 -->
+
+```
+````
+
+除了使用 mermaid 代码块，你也可以直接使用以下代码块：
+
+- class: `classDiagram`
+- c4c: `C4Context`
+- er: `erDiagram`
+- gantt: `gantt`
+- git-graph: `gitGraph`
+- journey: `journey`
+- mindmap: `mindmap`
+- pie: `pie`
+- quadrant: `quadrantChart`
+- requirement: `requirementDiagram`
+- sankey: `sankey-beta`
+- sequence: `sequenceDiagram`
+- state: `stateDiagram-v2`
+- timeline: `timeline`
+- xy: `xychart-beta`
+
+你不需要再声明图表类型，也不需要缩进图表代码。
+
+当图表支持设置标题时，你可以直接在代码块信息后添加标题:
+
+````md
+```sequence 代码标题
+<!-- 顺序图代码内容
+... -->
+```
+````
+
+配置文档详见 [Mermaid 文档](https://mermaid.js.org/)
+
+## 高级
+
+你可以在 [客户端配置文件](https://vuejs.press/zh/guide/configuration.html#%E5%AE%A2%E6%88%B7%E7%AB%AF%E9%85%8D%E7%BD%AE%E6%96%87%E4%BB%B6) 中导入并使用 `defineMermaidConfig` 来自定义 Mermaid 配置:
+
+```ts
+import { defineClientConfig } from 'vuepress/client'
+import { defineMermaidConfig } from 'vuepress-theme-plume/client'
+
+defineMermaidConfig({
+  // 在此设置 mermaid 选项
+})
+
+export default defineClientConfig({
+  // ...
+})
+```
+
+## 示例
+
+### 流程图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-1.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-1.snippet.md{2-20} -->
+
+### 循序图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-2.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-2.snippet.md{2-11} -->
+
+### 类图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-3.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-3.snippet.md{2-25} -->
+
+### 状态图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-4.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-4.snippet.md{2-9} -->
+
+### 关系图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-5.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-5.snippet.md{2-15} -->
+
+### 用户日记图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-6.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-6.snippet.md{2-11} -->
+
+### 甘特图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/mermaid-7.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-7.snippet.md{2-31} -->
+
+### 饼图
+
+**输入：**
+
+````md
+```pie
+title What Voldemort doesn't have?
+  "FRIENDS" : 2
+  "FAMILY" : 3
+  "NOSE" : 45
+```
+````
+
+**输出：**
+
+```pie
+title What Voldemort doesn't have?
+  "FRIENDS" : 2
+  "FAMILY" : 3
+  "NOSE" : 45
+```
+
+### Git 图表
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/mermaid-8.snippet.md-->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-8.snippet.md{2-44} -->
+
+### C4C 图表
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/mermaid-9.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-9.snippet.md{2-34} -->
+
+### 思维导图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-10.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-10.snippet.md{2-19} -->
+
+### 时序图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-11.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-11.snippet.md{2-11} -->
+
+### 桑基图
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/mermaid-12.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-12.snippet.md{2-71} -->
+
+### 依赖图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-13.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-13.snippet.md{2-15} -->
+
+### 象限图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-14.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-14.snippet.md{2-16} -->
+
+### XY图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-15.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-15.snippet.md{2-8} -->
+
+### 块图
+
+**输入：**
+
+<!-- @include: ../../snippet/mermaid-16.snippet.md -->
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-16.snippet.md{2-12} -->
+
+### 复杂例子
+
+**输入：**
+
+:::: details 查看代码
+<!-- @include: ../../snippet/mermaid-17.snippet.md -->
+::::
+
+**输出：**
+
+<!-- @include: ../../snippet/mermaid-17.snippet.md{2-24} -->
diff --git a/docs/notes/theme/guide/安装与使用.md b/docs/notes/theme/guide/安装与使用.md
index d0c9fbfc..a12e1d8b 100644
--- a/docs/notes/theme/guide/安装与使用.md
+++ b/docs/notes/theme/guide/安装与使用.md
@@ -82,6 +82,11 @@ npm i -D vuepress-theme-plume @vuepress/bundler-vite@next
 ```
 :::
 
+:::warning
+主题当前版本 已适配至 `vuepress@2.0.0-rc.8`，你应该安装这个版本的 VuePress。
+高于或低于这个版本，可能会存在潜在的兼容性问题。
+:::
+
 ### 步骤 4
 
 **在 `package.json` 中添加 `script`**
@@ -141,6 +146,11 @@ export default defineUserConfig({
 ```
 :::
 
+:::warning
+无论是否需要使用 **多语言** ，你都应该为 VuePress 配置 正确 `lang` 选项值。
+主题需要根据 `lang` 选项来确定语言环境文本。
+:::
+
 ### 步骤 7
 
 **在 `docs` 目录下新建 `README.md` 文件**
diff --git a/docs/notes/theme/guide/评论.md b/docs/notes/theme/guide/评论.md
deleted file mode 100644
index 9f2c5b07..00000000
--- a/docs/notes/theme/guide/评论.md
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: 评论
-author: pengzhanbo
-icon: la:comment
-createTime: 2024/03/04 11:58:59
-permalink: /guide/features/comments/
----
-
-## 概述
-
-文章评论由 [vuepress-plugin-comment2](https://vuepress-theme-hope.github.io/v2/comment2/zh) 提供支持。
-
-在本主题中，通过以下字段进行配置：
-
-```ts
-// .vuepress/config.ts
-import { defineUserConfig } from 'vuepress'
-import { plumeTheme } from 'vuepress-theme-plume'
-
-export default defineUserConfig({
-  theme: plumeTheme({
-    plugins: {
-      comment: {
-        // comment options
-      }
-    }
-  })
-})
-```
-
-### 服务提供商
-
-[vuepress-plugin-comment2](https://vuepress-theme-hope.github.io/v2/comment2/zh) 支持
-`"Artalk“ | "Giscus" | "Twikoo" | "Waline"` 等多种不同的评论服务提供商。
-
-你可以根据自己的需求进行配置。
-
-- `Giscus` 是一个基于 GitHub Discussion 的评论系统，启用简便。[查看文档](https://plugin-comment2.vuejs.press/zh/guide/giscus.html)
-- `Waline` 是一个 需要后端的评论系统，安全性较高。[查看文档](https://plugin-comment2.vuejs.press/zh/guide/waline.html)
-- `Twikoo` 一个简洁、安全、免费的静态网站评论系统，基于 腾讯云开发。[查看文档](https://plugin-comment2.vuejs.press/zh/guide/twikoo.html)
-- `Artalk` 是一款简洁的自托管评论系统，你可以在服务器上轻松部署并置入前端页面中。[查看文档](https://plugin-comment2.vuejs.press/zh/guide/artalk.html)
diff --git a/docs/notes/theme/snippet/chart-1.snippet.md b/docs/notes/theme/snippet/chart-1.snippet.md
new file mode 100644
index 00000000..ff9e6a45
--- /dev/null
+++ b/docs/notes/theme/snippet/chart-1.snippet.md
@@ -0,0 +1,42 @@
+````md
+::: chart 块状图案例
+```json
+{
+  "type": "bar",
+  "data": {
+    "labels": ["红色", "蓝色", "黄色", "绿色", "紫色", "橙色"],
+    "datasets": [
+      {
+        "label": "投票数",
+        "data": [12, 19, 3, 5, 2, 3],
+        "backgroundColor": [
+          "rgba(255, 99, 132, 0.2)",
+          "rgba(54, 162, 235, 0.2)",
+          "rgba(255, 206, 86, 0.2)",
+          "rgba(75, 192, 192, 0.2)",
+          "rgba(153, 102, 255, 0.2)",
+          "rgba(255, 159, 64, 0.2)"
+        ],
+        "borderColor": [
+          "rgba(255, 99, 132, 1)",
+          "rgba(54, 162, 235, 1)",
+          "rgba(255, 206, 86, 1)",
+          "rgba(75, 192, 192, 1)",
+          "rgba(153, 102, 255, 1)",
+          "rgba(255, 159, 64, 1)"
+        ],
+        "borderWidth": 1
+      }
+    ]
+  },
+  "options": {
+    "scales": {
+      "y": {
+        "beginAtZero": true
+      }
+    }
+  }
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/chart-2.snippet.md b/docs/notes/theme/snippet/chart-2.snippet.md
new file mode 100644
index 00000000..515a1176
--- /dev/null
+++ b/docs/notes/theme/snippet/chart-2.snippet.md
@@ -0,0 +1,21 @@
+````md
+::: chart 气泡图案例
+```json
+{
+  "type": "bubble",
+  "data": {
+    "datasets": [
+      {
+        "label": "第一个数据集",
+        "data": [
+          { "x": 20, "y": 30, "r": 15 },
+          { "x": 40, "y": 10, "r": 10 }
+        ],
+        "backgroundColor": "rgb(255, 99, 132)"
+      }
+    ]
+  }
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/chart-3.snippet.md b/docs/notes/theme/snippet/chart-3.snippet.md
new file mode 100644
index 00000000..12019de9
--- /dev/null
+++ b/docs/notes/theme/snippet/chart-3.snippet.md
@@ -0,0 +1,21 @@
+````md
+::: chart 折线图案例
+```json
+{
+  "type": "line",
+  "data": {
+    "labels": ["一月", "二月", "三月", "四月", "五月", "六月", "七月"],
+    "datasets": [
+      {
+        "label": "我的第一个数据集",
+        "data": [65, 59, 80, 81, 56, 55, 40],
+        "fill": false,
+        "borderColor": "rgb(75, 192, 192)",
+        "tension": 0.1
+      }
+    ]
+  }
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/chart-4.snippet.md b/docs/notes/theme/snippet/chart-4.snippet.md
new file mode 100644
index 00000000..77348a5a
--- /dev/null
+++ b/docs/notes/theme/snippet/chart-4.snippet.md
@@ -0,0 +1,25 @@
+````md
+::: chart 玫瑰图案例
+```json
+{
+  "type": "polarArea",
+  "data": {
+    "labels": ["红色", "绿色", "黄色", "灰色", "蓝色"],
+    "datasets": [
+      {
+        "label": "我的第一个数据集",
+        "data": [11, 16, 7, 3, 14],
+        "backgroundColor": [
+          "rgb(255, 99, 132)",
+          "rgb(75, 192, 192)",
+          "rgb(255, 205, 86)",
+          "rgb(201, 203, 207)",
+          "rgb(54, 162, 235)"
+        ]
+      }
+    ]
+  }
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/chart-5.snippet.md b/docs/notes/theme/snippet/chart-5.snippet.md
new file mode 100644
index 00000000..9b8745cc
--- /dev/null
+++ b/docs/notes/theme/snippet/chart-5.snippet.md
@@ -0,0 +1,43 @@
+````md
+::: chart 雷达图案例
+```json
+{
+  "type": "radar",
+  "data": {
+    "labels": ["吃饭", "喝水", "睡觉", "设计", "编程", "骑车", "跑步"],
+    "datasets": [
+      {
+        "label": "我的第一个数据集",
+        "data": [65, 59, 90, 81, 56, 55, 40],
+        "fill": true,
+        "backgroundColor": "rgba(255, 99, 132, 0.2)",
+        "borderColor": "rgb(255, 99, 132)",
+        "pointBackgroundColor": "rgb(255, 99, 132)",
+        "pointBorderColor": "#fff",
+        "pointHoverBackgroundColor": "#fff",
+        "pointHoverBorderColor": "rgb(255, 99, 132)"
+      },
+      {
+        "label": "我的第二个数据集",
+        "data": [28, 48, 40, 19, 96, 27, 100],
+        "fill": true,
+        "backgroundColor": "rgba(54, 162, 235, 0.2)",
+        "borderColor": "rgb(54, 162, 235)",
+        "pointBackgroundColor": "rgb(54, 162, 235)",
+        "pointBorderColor": "#fff",
+        "pointHoverBackgroundColor": "#fff",
+        "pointHoverBorderColor": "rgb(54, 162, 235)"
+      }
+    ]
+  },
+  "options": {
+    "elements": {
+      "line": {
+        "borderWidth": 3
+      }
+    }
+  }
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/chart-6.snippet.md b/docs/notes/theme/snippet/chart-6.snippet.md
new file mode 100644
index 00000000..d23b1fda
--- /dev/null
+++ b/docs/notes/theme/snippet/chart-6.snippet.md
@@ -0,0 +1,31 @@
+````md
+::: chart 散点图案例
+```json
+{
+  "type": "scatter",
+  "data": {
+    "datasets": [
+      {
+        "label": "散点数据集",
+        "data": [
+          { "x": -10, "y": 0 },
+          { "x": 0, "y": 10 },
+          { "x": 10, "y": 5 },
+          { "x": 0.5, "y": 5.5 }
+        ],
+        "backgroundColor": "rgb(255, 99, 132)"
+      }
+    ]
+  },
+  "options": {
+    "scales": {
+      "x": {
+        "type": "linear",
+        "position": "bottom"
+      }
+    }
+  }
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-1.snippet.md b/docs/notes/theme/snippet/echarts-1.snippet.md
new file mode 100644
index 00000000..b41cb7f6
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-1.snippet.md
@@ -0,0 +1,101 @@
+````md
+::: echarts Dynamic Data & Time Axis
+```js
+const oneDay = 86400000
+const data = []
+let now = new Date(1997, 9, 3)
+let value = Math.random() * 1000
+
+function randomData() {
+  now = new Date(+now + oneDay)
+  value = value + Math.random() * 21 - 10
+  return {
+    name: now.toString(),
+    value: [
+      [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'),
+      Math.round(value),
+    ],
+  }
+}
+
+for (let i = 0; i < 1000; i++) data.push(randomData())
+
+const option = {
+  tooltip: {
+    trigger: 'axis',
+    formatter(params) {
+      params = params[0]
+      const date = new Date(params.name)
+      return (
+        `${date.getDate()
+        }/${
+        date.getMonth() + 1
+        }/${
+        date.getFullYear()
+        } : ${
+        params.value[1]}`
+      )
+    },
+    axisPointer: {
+      animation: false,
+    },
+  },
+  xAxis: {
+    type: 'time',
+    splitLine: {
+      show: false,
+    },
+  },
+  yAxis: {
+    type: 'value',
+    boundaryGap: [0, '100%'],
+    splitLine: {
+      show: false,
+    },
+  },
+  toolbox: {
+    show: true,
+    feature: {
+      mark: {
+        show: true,
+      },
+      dataView: {
+        show: true,
+        readOnly: false,
+      },
+      restore: {
+        show: true,
+      },
+      saveAsImage: {
+        show: true,
+      },
+    },
+  },
+  series: [
+    {
+      name: 'Fake Data',
+      type: 'line',
+      showSymbol: false,
+      data,
+    },
+  ],
+}
+const timeId = setInterval(() => {
+  if (myChart._disposed)
+    return clearInterval(timeId)
+
+  for (let i = 0; i < 5; i++) {
+    data.shift()
+    data.push(randomData())
+  }
+  myChart.setOption({
+    series: [
+      {
+        data,
+      },
+    ],
+  })
+}, 1000)
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-10.snippet.md b/docs/notes/theme/snippet/echarts-10.snippet.md
new file mode 100644
index 00000000..7e862946
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-10.snippet.md
@@ -0,0 +1,70 @@
+````md
+::: echarts
+```js
+const option = {
+  legend: {},
+  tooltip: {
+    trigger: 'axis',
+    showContent: false,
+  },
+  dataset: {
+    source: [
+      ['product', '2012', '2013', '2014', '2015', '2016', '2017'],
+      ['Milk Tea', 56.5, 82.1, 88.7, 70.1, 53.4, 85.1],
+      ['Matcha Latte', 51.1, 51.4, 55.1, 53.3, 73.8, 68.7],
+      ['Cheese Cocoa', 40.1, 62.2, 69.5, 36.4, 45.2, 32.5],
+      ['Walnut Brownie', 25.2, 37.1, 41.2, 18, 33.9, 49.1],
+    ],
+  },
+  xAxis: { type: 'category' },
+  yAxis: { gridIndex: 0 },
+  grid: { top: '55%' },
+  series: [
+    {
+      type: 'line',
+      smooth: true,
+      seriesLayoutBy: 'row',
+      emphasis: { focus: 'series' },
+    },
+    {
+      type: 'line',
+      smooth: true,
+      seriesLayoutBy: 'row',
+      emphasis: { focus: 'series' },
+    },
+    {
+      type: 'line',
+      smooth: true,
+      seriesLayoutBy: 'row',
+      emphasis: { focus: 'series' },
+    },
+    {
+      type: 'line',
+      smooth: true,
+      seriesLayoutBy: 'row',
+      emphasis: { focus: 'series' },
+    },
+    {
+      type: 'pie',
+      id: 'pie',
+      radius: '30%',
+      center: ['50%', '25%'],
+      emphasis: {
+        focus: 'self',
+      },
+      label: {
+        formatter: '{b}: {@2012} ({d}%)',
+      },
+      encode: {
+        itemName: 'product',
+        value: '2012',
+        tooltip: '2012',
+      },
+    },
+  ],
+}
+
+const height = 800
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-2.snippet.md b/docs/notes/theme/snippet/echarts-2.snippet.md
new file mode 100644
index 00000000..2b89c71a
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-2.snippet.md
@@ -0,0 +1,76 @@
+````md
+::: echarts A bar chart
+```js
+const data = []
+
+for (let i = 0; i < 5; i++) data.push(Math.round(Math.random() * 200))
+
+const option = {
+  xAxis: {
+    max: 'dataMax',
+  },
+  yAxis: {
+    type: 'category',
+    data: ['A', 'B', 'C', 'D', 'E'],
+    inverse: true,
+    animationDuration: 300,
+    animationDurationUpdate: 300,
+    max: 2, // only the largest 3 bars will be displayed
+  },
+  series: [
+    {
+      realtimeSort: true,
+      name: 'X',
+      type: 'bar',
+      data,
+      label: {
+        show: true,
+        position: 'right',
+        valueAnimation: true,
+      },
+    },
+  ],
+  legend: {
+    show: true,
+  },
+  toolbox: {
+    show: true,
+    feature: {
+      mark: {
+        show: true,
+      },
+      dataView: {
+        show: true,
+        readOnly: false,
+      },
+      restore: {
+        show: true,
+      },
+      saveAsImage: {
+        show: true,
+      },
+    },
+  },
+  animationDuration: 0,
+  animationDurationUpdate: 3000,
+  animationEasing: 'linear',
+  animationEasingUpdate: 'linear',
+}
+function run() {
+  for (let i = 0; i < data.length; i++)
+    data[i] += Math.round(Math.random() * Math.random() > 0.9 ? 2000 : 200)
+
+  myChart.setOption({
+    series: [{ type: 'bar', data }],
+  })
+}
+
+const timeId = setInterval(() => {
+  if (myChart._disposed)
+    return clearInterval(timeId)
+
+  run()
+}, 3000)
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-3.snippet.md b/docs/notes/theme/snippet/echarts-3.snippet.md
new file mode 100644
index 00000000..3b7e36c1
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-3.snippet.md
@@ -0,0 +1,75 @@
+````md
+::: echarts A nightingale chart
+```json
+{
+  "legend": {
+    "top": "bottom"
+  },
+  "toolbox": {
+    "show": true,
+    "feature": {
+      "mark": {
+        "show": true
+      },
+      "dataView": {
+        "show": true,
+        "readOnly": false
+      },
+      "restore": {
+        "show": true
+      },
+      "saveAsImage": {
+        "show": true
+      }
+    }
+  },
+  "series": [
+    {
+      "name": "Nightingale Chart",
+      "type": "pie",
+      "radius": [20, 100],
+      "center": ["50%", "50%"],
+      "roseType": "area",
+      "itemStyle": {
+        "borderRadius": 8
+      },
+      "data": [
+        {
+          "value": 40,
+          "name": "rose 1"
+        },
+        {
+          "value": 38,
+          "name": "rose 2"
+        },
+        {
+          "value": 32,
+          "name": "rose 3"
+        },
+        {
+          "value": 30,
+          "name": "rose 4"
+        },
+        {
+          "value": 28,
+          "name": "rose 5"
+        },
+        {
+          "value": 26,
+          "name": "rose 6"
+        },
+        {
+          "value": 22,
+          "name": "rose 7"
+        },
+        {
+          "value": 18,
+          "name": "rose 8"
+        }
+      ]
+    }
+  ]
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-4.snippet.md b/docs/notes/theme/snippet/echarts-4.snippet.md
new file mode 100644
index 00000000..bd555fa7
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-4.snippet.md
@@ -0,0 +1,40 @@
+````md
+::: echarts A scatter chart
+```json
+{
+  "xAxis": {},
+  "yAxis": {},
+  "series": [
+    {
+      "symbolSize": 20,
+      "data": [
+        [10.0, 8.04],
+        [8.07, 6.95],
+        [13.0, 7.58],
+        [9.05, 8.81],
+        [11.0, 8.33],
+        [14.0, 7.66],
+        [13.4, 6.81],
+        [10.0, 6.33],
+        [14.0, 8.96],
+        [12.5, 6.82],
+        [9.15, 7.2],
+        [11.5, 7.2],
+        [3.03, 4.23],
+        [12.2, 7.83],
+        [2.02, 4.47],
+        [1.05, 3.33],
+        [4.05, 4.96],
+        [6.03, 7.24],
+        [12.0, 6.26],
+        [12.0, 8.84],
+        [7.08, 5.82],
+        [5.02, 5.68]
+      ],
+      "type": "scatter"
+    }
+  ]
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-5.snippet.md b/docs/notes/theme/snippet/echarts-5.snippet.md
new file mode 100644
index 00000000..1b42bf2a
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-5.snippet.md
@@ -0,0 +1,41 @@
+````md
+::: echarts Two Value-Axes in Polar
+```js
+const data = []
+
+for (let i = 0; i <= 100; i++) {
+  const theta = (i / 100) * 360
+  const r = 5 * (1 + Math.sin((theta / 180) * Math.PI))
+  data.push([r, theta])
+}
+
+const height = 450
+
+const option = {
+  legend: {
+    data: ['line'],
+  },
+  polar: {},
+  tooltip: {
+    trigger: 'axis',
+    axisPointer: {
+      type: 'cross',
+    },
+  },
+  angleAxis: {
+    type: 'value',
+    startAngle: 0,
+  },
+  radiusAxis: {},
+  series: [
+    {
+      coordinateSystem: 'polar',
+      name: 'line',
+      type: 'line',
+      data,
+    },
+  ],
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-6.snippet.md b/docs/notes/theme/snippet/echarts-6.snippet.md
new file mode 100644
index 00000000..cf8e91a8
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-6.snippet.md
@@ -0,0 +1,309 @@
+````md
+::: echarts Stocks
+```js
+const upColor = '#ec0000'
+const upBorderColor = '#8A0000'
+const downColor = '#00da3c'
+const downBorderColor = '#008F28'
+
+function splitData(rawData) {
+  const categoryData = []
+  const values = []
+
+  for (let i = 0; i < rawData.length; i++) {
+    categoryData.push(rawData[i].splice(0, 1)[0])
+    values.push(rawData[i])
+  }
+
+  return {
+    categoryData,
+    values,
+  }
+}
+
+// Each item: open，close，lowest，highest
+const data0 = splitData([
+  ['2013/1/24', 2320.26, 2320.26, 2287.3, 2362.94],
+  ['2013/1/25', 2300, 2291.3, 2288.26, 2308.38],
+  ['2013/1/28', 2295.35, 2346.5, 2295.35, 2346.92],
+  ['2013/1/29', 2347.22, 2358.98, 2337.35, 2363.8],
+  ['2013/1/30', 2360.75, 2382.48, 2347.89, 2383.76],
+  ['2013/1/31', 2383.43, 2385.42, 2371.23, 2391.82],
+  ['2013/2/1', 2377.41, 2419.02, 2369.57, 2421.15],
+  ['2013/2/4', 2425.92, 2428.15, 2417.58, 2440.38],
+  ['2013/2/5', 2411, 2433.13, 2403.3, 2437.42],
+  ['2013/2/6', 2432.68, 2434.48, 2427.7, 2441.73],
+  ['2013/2/7', 2430.69, 2418.53, 2394.22, 2433.89],
+  ['2013/2/8', 2416.62, 2432.4, 2414.4, 2443.03],
+  ['2013/2/18', 2441.91, 2421.56, 2415.43, 2444.8],
+  ['2013/2/19', 2420.26, 2382.91, 2373.53, 2427.07],
+  ['2013/2/20', 2383.49, 2397.18, 2370.61, 2397.94],
+  ['2013/2/21', 2378.82, 2325.95, 2309.17, 2378.82],
+  ['2013/2/22', 2322.94, 2314.16, 2308.76, 2330.88],
+  ['2013/2/25', 2320.62, 2325.82, 2315.01, 2338.78],
+  ['2013/2/26', 2313.74, 2293.34, 2289.89, 2340.71],
+  ['2013/2/27', 2297.77, 2313.22, 2292.03, 2324.63],
+  ['2013/2/28', 2322.32, 2365.59, 2308.92, 2366.16],
+  ['2013/3/1', 2364.54, 2359.51, 2330.86, 2369.65],
+  ['2013/3/4', 2332.08, 2273.4, 2259.25, 2333.54],
+  ['2013/3/5', 2274.81, 2326.31, 2270.1, 2328.14],
+  ['2013/3/6', 2333.61, 2347.18, 2321.6, 2351.44],
+  ['2013/3/7', 2340.44, 2324.29, 2304.27, 2352.02],
+  ['2013/3/8', 2326.42, 2318.61, 2314.59, 2333.67],
+  ['2013/3/11', 2314.68, 2310.59, 2296.58, 2320.96],
+  ['2013/3/12', 2309.16, 2286.6, 2264.83, 2333.29],
+  ['2013/3/13', 2282.17, 2263.97, 2253.25, 2286.33],
+  ['2013/3/14', 2255.77, 2270.28, 2253.31, 2276.22],
+  ['2013/3/15', 2269.31, 2278.4, 2250, 2312.08],
+  ['2013/3/18', 2267.29, 2240.02, 2239.21, 2276.05],
+  ['2013/3/19', 2244.26, 2257.43, 2232.02, 2261.31],
+  ['2013/3/20', 2257.74, 2317.37, 2257.42, 2317.86],
+  ['2013/3/21', 2318.21, 2324.24, 2311.6, 2330.81],
+  ['2013/3/22', 2321.4, 2328.28, 2314.97, 2332],
+  ['2013/3/25', 2334.74, 2326.72, 2319.91, 2344.89],
+  ['2013/3/26', 2318.58, 2297.67, 2281.12, 2319.99],
+  ['2013/3/27', 2299.38, 2301.26, 2289, 2323.48],
+  ['2013/3/28', 2273.55, 2236.3, 2232.91, 2273.55],
+  ['2013/3/29', 2238.49, 2236.62, 2228.81, 2246.87],
+  ['2013/4/1', 2229.46, 2234.4, 2227.31, 2243.95],
+  ['2013/4/2', 2234.9, 2227.74, 2220.44, 2253.42],
+  ['2013/4/3', 2232.69, 2225.29, 2217.25, 2241.34],
+  ['2013/4/8', 2196.24, 2211.59, 2180.67, 2212.59],
+  ['2013/4/9', 2215.47, 2225.77, 2215.47, 2234.73],
+  ['2013/4/10', 2224.93, 2226.13, 2212.56, 2233.04],
+  ['2013/4/11', 2236.98, 2219.55, 2217.26, 2242.48],
+  ['2013/4/12', 2218.09, 2206.78, 2204.44, 2226.26],
+  ['2013/4/15', 2199.91, 2181.94, 2177.39, 2204.99],
+  ['2013/4/16', 2169.63, 2194.85, 2165.78, 2196.43],
+  ['2013/4/17', 2195.03, 2193.8, 2178.47, 2197.51],
+  ['2013/4/18', 2181.82, 2197.6, 2175.44, 2206.03],
+  ['2013/4/19', 2201.12, 2244.64, 2200.58, 2250.11],
+  ['2013/4/22', 2236.4, 2242.17, 2232.26, 2245.12],
+  ['2013/4/23', 2242.62, 2184.54, 2182.81, 2242.62],
+  ['2013/4/24', 2187.35, 2218.32, 2184.11, 2226.12],
+  ['2013/4/25', 2213.19, 2199.31, 2191.85, 2224.63],
+  ['2013/4/26', 2203.89, 2177.91, 2173.86, 2210.58],
+  ['2013/5/2', 2170.78, 2174.12, 2161.14, 2179.65],
+  ['2013/5/3', 2179.05, 2205.5, 2179.05, 2222.81],
+  ['2013/5/6', 2212.5, 2231.17, 2212.5, 2236.07],
+  ['2013/5/7', 2227.86, 2235.57, 2219.44, 2240.26],
+  ['2013/5/8', 2242.39, 2246.3, 2235.42, 2255.21],
+  ['2013/5/9', 2246.96, 2232.97, 2221.38, 2247.86],
+  ['2013/5/10', 2228.82, 2246.83, 2225.81, 2247.67],
+  ['2013/5/13', 2247.68, 2241.92, 2231.36, 2250.85],
+  ['2013/5/14', 2238.9, 2217.01, 2205.87, 2239.93],
+  ['2013/5/15', 2217.09, 2224.8, 2213.58, 2225.19],
+  ['2013/5/16', 2221.34, 2251.81, 2210.77, 2252.87],
+  ['2013/5/17', 2249.81, 2282.87, 2248.41, 2288.09],
+  ['2013/5/20', 2286.33, 2299.99, 2281.9, 2309.39],
+  ['2013/5/21', 2297.11, 2305.11, 2290.12, 2305.3],
+  ['2013/5/22', 2303.75, 2302.4, 2292.43, 2314.18],
+  ['2013/5/23', 2293.81, 2275.67, 2274.1, 2304.95],
+  ['2013/5/24', 2281.45, 2288.53, 2270.25, 2292.59],
+  ['2013/5/27', 2286.66, 2293.08, 2283.94, 2301.7],
+  ['2013/5/28', 2293.4, 2321.32, 2281.47, 2322.1],
+  ['2013/5/29', 2323.54, 2324.02, 2321.17, 2334.33],
+  ['2013/5/30', 2316.25, 2317.75, 2310.49, 2325.72],
+  ['2013/5/31', 2320.74, 2300.59, 2299.37, 2325.53],
+  ['2013/6/3', 2300.21, 2299.25, 2294.11, 2313.43],
+  ['2013/6/4', 2297.1, 2272.42, 2264.76, 2297.1],
+  ['2013/6/5', 2270.71, 2270.93, 2260.87, 2276.86],
+  ['2013/6/6', 2264.43, 2242.11, 2240.07, 2266.69],
+  ['2013/6/7', 2242.26, 2210.9, 2205.07, 2250.63],
+  ['2013/6/13', 2190.1, 2148.35, 2126.22, 2190.1],
+])
+
+function calculateMA(dayCount) {
+  const result = []
+
+  for (let i = 0; i < data0.values.length; i++) {
+    if (i < dayCount) {
+      result.push('-')
+      continue
+    }
+    let sum = 0
+
+    for (let j = 0; j < dayCount; j++) sum += +data0.values[i - j][1]
+
+    result.push(sum / dayCount)
+  }
+
+  return result
+}
+const option = {
+  tooltip: {
+    trigger: 'axis',
+    axisPointer: {
+      type: 'cross',
+    },
+  },
+  legend: {
+    data: ['日K', 'MA5', 'MA10', 'MA20', 'MA30'],
+  },
+  grid: {
+    left: '10%',
+    right: '10%',
+    bottom: '15%',
+  },
+  xAxis: {
+    type: 'category',
+    data: data0.categoryData,
+    boundaryGap: false,
+    axisLine: { onZero: false },
+    splitLine: { show: false },
+    min: 'dataMin',
+    max: 'dataMax',
+  },
+  yAxis: {
+    scale: true,
+    splitArea: {
+      show: true,
+    },
+  },
+  dataZoom: [
+    {
+      type: 'inside',
+      start: 50,
+      end: 100,
+    },
+    {
+      show: true,
+      type: 'slider',
+      top: '90%',
+      start: 50,
+      end: 100,
+    },
+  ],
+  series: [
+    {
+      name: '日K',
+      type: 'candlestick',
+      data: data0.values,
+      itemStyle: {
+        color: upColor,
+        color0: downColor,
+        borderColor: upBorderColor,
+        borderColor0: downBorderColor,
+      },
+      markPoint: {
+        label: {
+          formatter: param =>
+            param == null ? '' : Math.round(param.value).toString(),
+        },
+        data: [
+          {
+            name: 'Mark',
+            coord: ['2013/5/31', 2300],
+            value: 2300,
+            itemStyle: {
+              color: 'rgb(41,60,85)',
+            },
+          },
+          {
+            name: 'highest value',
+            type: 'max',
+            valueDim: 'highest',
+          },
+          {
+            name: 'lowest value',
+            type: 'min',
+            valueDim: 'lowest',
+          },
+          {
+            name: 'average value on close',
+            type: 'average',
+            valueDim: 'close',
+          },
+        ],
+        tooltip: {
+          formatter: param => `${param.name}<br>${param.data.coord || ''}`,
+        },
+      },
+      markLine: {
+        symbol: ['none', 'none'],
+        data: [
+          [
+            {
+              name: 'from lowest to highest',
+              type: 'min',
+              valueDim: 'lowest',
+              symbol: 'circle',
+              symbolSize: 10,
+              label: {
+                show: false,
+              },
+              emphasis: {
+                label: {
+                  show: false,
+                },
+              },
+            },
+            {
+              type: 'max',
+              valueDim: 'highest',
+              symbol: 'circle',
+              symbolSize: 10,
+              label: {
+                show: false,
+              },
+              emphasis: {
+                label: {
+                  show: false,
+                },
+              },
+            },
+          ],
+          {
+            name: 'min line on close',
+            type: 'min',
+            valueDim: 'close',
+          },
+          {
+            name: 'max line on close',
+            type: 'max',
+            valueDim: 'close',
+          },
+        ],
+      },
+    },
+    {
+      name: 'MA5',
+      type: 'line',
+      data: calculateMA(5),
+      smooth: true,
+      lineStyle: {
+        opacity: 0.5,
+      },
+    },
+    {
+      name: 'MA10',
+      type: 'line',
+      data: calculateMA(10),
+      smooth: true,
+      lineStyle: {
+        opacity: 0.5,
+      },
+    },
+    {
+      name: 'MA20',
+      type: 'line',
+      data: calculateMA(20),
+      smooth: true,
+      lineStyle: {
+        opacity: 0.5,
+      },
+    },
+    {
+      name: 'MA30',
+      type: 'line',
+      data: calculateMA(30),
+      smooth: true,
+      lineStyle: {
+        opacity: 0.5,
+      },
+    },
+  ],
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-7.snippet.md b/docs/notes/theme/snippet/echarts-7.snippet.md
new file mode 100644
index 00000000..705199b6
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-7.snippet.md
@@ -0,0 +1,37 @@
+````md
+::: echarts A Radar Chart
+```json
+{
+  "legend": {
+    "data": ["Allocated Budget", "Actual Spending"]
+  },
+  "radar": {
+    "indicator": [
+      { "name": "Sales", "max": 6500 },
+      { "name": "Administration", "max": 16000 },
+      { "name": "Information Technology", "max": 30000 },
+      { "name": "Customer Support", "max": 38000 },
+      { "name": "Development", "max": 52000 },
+      { "name": "Marketing", "max": 25000 }
+    ]
+  },
+  "series": [
+    {
+      "name": "Budget vs spending",
+      "type": "radar",
+      "data": [
+        {
+          "value": [4200, 3000, 20000, 35000, 50000, 18000],
+          "name": "Allocated Budget"
+        },
+        {
+          "value": [5000, 14000, 28000, 26000, 42000, 21000],
+          "name": "Actual Spending"
+        }
+      ]
+    }
+  ]
+}
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-8.snippet.md b/docs/notes/theme/snippet/echarts-8.snippet.md
new file mode 100644
index 00000000..d7987110
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-8.snippet.md
@@ -0,0 +1,180 @@
+````md
+::: echarts
+```js
+/* eslint-disable */
+
+function getNoiseHelper() {
+  class Grad {
+    constructor(x, y, z) {
+      this.x = x
+      this.y = y
+      this.z = z
+    }
+
+    dot2(x, y) {
+      return this.x * x + this.y * y
+    }
+
+    dot3(x, y, z) {
+      return this.x * x + this.y * y + this.z * z
+    }
+  }
+  const grad3 = [
+    new Grad(1, 1, 0),
+    new Grad(-1, 1, 0),
+    new Grad(1, -1, 0),
+    new Grad(-1, -1, 0),
+    new Grad(1, 0, 1),
+    new Grad(-1, 0, 1),
+    new Grad(1, 0, -1),
+    new Grad(-1, 0, -1),
+    new Grad(0, 1, 1),
+    new Grad(0, -1, 1),
+    new Grad(0, 1, -1),
+    new Grad(0, -1, -1),
+  ]
+  const p = [
+    151, 160, 137, 91, 90, 15, 131, 13, 201, 95, 96, 53, 194, 233, 7, 225, 140,
+    36, 103, 30, 69, 142, 8, 99, 37, 240, 21, 10, 23, 190, 6, 148, 247, 120,
+    234, 75, 0, 26, 197, 62, 94, 252, 219, 203, 117, 35, 11, 32, 57, 177, 33,
+    88, 237, 149, 56, 87, 174, 20, 125, 136, 171, 168, 68, 175, 74, 165, 71,
+    134, 139, 48, 27, 166, 77, 146, 158, 231, 83, 111, 229, 122, 60, 211, 133,
+    230, 220, 105, 92, 41, 55, 46, 245, 40, 244, 102, 143, 54, 65, 25, 63, 161,
+    1, 216, 80, 73, 209, 76, 132, 187, 208, 89, 18, 169, 200, 196, 135, 130,
+    116, 188, 159, 86, 164, 100, 109, 198, 173, 186, 3, 64, 52, 217, 226, 250,
+    124, 123, 5, 202, 38, 147, 118, 126, 255, 82, 85, 212, 207, 206, 59, 227,
+    47, 16, 58, 17, 182, 189, 28, 42, 223, 183, 170, 213, 119, 248, 152, 2, 44,
+    154, 163, 70, 221, 153, 101, 155, 167, 43, 172, 9, 129, 22, 39, 253, 19, 98,
+    108, 110, 79, 113, 224, 232, 178, 185, 112, 104, 218, 246, 97, 228, 251, 34,
+    242, 193, 238, 210, 144, 12, 191, 179, 162, 241, 81, 51, 145, 235, 249, 14,
+    239, 107, 49, 192, 214, 31, 181, 199, 106, 157, 184, 84, 204, 176, 115, 121,
+    50, 45, 127, 4, 150, 254, 138, 236, 205, 93, 222, 114, 67, 29, 24, 72, 243,
+    141, 128, 195, 78, 66, 215, 61, 156, 180,
+  ]
+  // To remove the need for index wrapping, double the permutation table length
+  const perm = Array.from({ length: 512 })
+  const gradP = Array.from({ length: 512 })
+  // This isn't a very good seeding function, but it works ok. It supports 2^16
+  // different seed values. Write something better if you need more seeds.
+  function seed(seed) {
+    if (seed > 0 && seed < 1) {
+      // Scale the seed out
+      seed *= 65536
+    }
+    seed = Math.floor(seed)
+    if (seed < 256)
+      seed |= seed << 8
+
+    for (let i = 0; i < 256; i++) {
+      let v
+      if (i & 1)
+        v = p[i] ^ (seed & 255)
+      else
+        v = p[i] ^ ((seed >> 8) & 255)
+
+      perm[i] = perm[i + 256] = v
+      gradP[i] = gradP[i + 256] = grad3[v % 12]
+    }
+  }
+  seed(0)
+  // ##### Perlin noise stuff
+  function fade(t) {
+    return t * t * t * (t * (t * 6 - 15) + 10)
+  }
+  function lerp(a, b, t) {
+    return (1 - t) * a + t * b
+  }
+  // 2D Perlin Noise
+  function perlin2(x, y) {
+    // Find unit grid cell containing point
+    let X = Math.floor(x)
+    let Y = Math.floor(y)
+    // Get relative xy coordinates of point within that cell
+    x = x - X
+    y = y - Y
+    // Wrap the integer cells at 255 (smaller integer period can be introduced here)
+    X = X & 255
+    Y = Y & 255
+    // Calculate noise contributions from each of the four corners
+    const n00 = gradP[X + perm[Y]].dot2(x, y)
+    const n01 = gradP[X + perm[Y + 1]].dot2(x, y - 1)
+    const n10 = gradP[X + 1 + perm[Y]].dot2(x - 1, y)
+    const n11 = gradP[X + 1 + perm[Y + 1]].dot2(x - 1, y - 1)
+    // Compute the fade curve value for x
+    const u = fade(x)
+    // Interpolate the four results
+    return lerp(lerp(n00, n10, u), lerp(n01, n11, u), fade(y))
+  }
+  return {
+    seed,
+    perlin2,
+  }
+}
+
+const noise = getNoiseHelper()
+const xData = []
+const yData = []
+noise.seed(Math.random())
+
+const data = []
+for (let i = 0; i <= 200; i++) {
+  for (let j = 0; j <= 100; j++)
+    data.push([i, j, noise.perlin2(i / 40, j / 20) + 0.5])
+
+  xData.push(i)
+}
+for (let j = 0; j < 100; j++)
+  yData.push(j)
+
+option = {
+  tooltip: {},
+  xAxis: {
+    type: 'category',
+    data: xData,
+  },
+  yAxis: {
+    type: 'category',
+    data: yData,
+  },
+  visualMap: {
+    min: 0,
+    max: 1,
+    calculable: true,
+    realtime: false,
+    inRange: {
+      color: [
+        '#313695',
+        '#4575b4',
+        '#74add1',
+        '#abd9e9',
+        '#e0f3f8',
+        '#ffffbf',
+        '#fee090',
+        '#fdae61',
+        '#f46d43',
+        '#d73027',
+        '#a50026',
+      ],
+    },
+  },
+  series: [
+    {
+      name: 'Gaussian',
+      type: 'heatmap',
+      data,
+      emphasis: {
+        itemStyle: {
+          borderColor: '#333',
+          borderWidth: 1,
+        },
+      },
+      progressive: 1000,
+      animation: false,
+    },
+  ],
+}
+
+const height = 500
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/echarts-9.snippet.md b/docs/notes/theme/snippet/echarts-9.snippet.md
new file mode 100644
index 00000000..ba89414d
--- /dev/null
+++ b/docs/notes/theme/snippet/echarts-9.snippet.md
@@ -0,0 +1,34 @@
+````md
+::: echarts Tree
+```js
+const data = await fetch(
+  '/data/flare.json',
+).then(res => res.json())
+
+const option = {
+  tooltip: {
+    trigger: 'item',
+    triggerOn: 'mousemove',
+  },
+  series: [
+    {
+      type: 'tree',
+      data: [data],
+      top: '18%',
+      bottom: '14%',
+      layout: 'radial',
+      symbol: 'emptyCircle',
+      symbolSize: 7,
+      initialTreeDepth: 3,
+      animationDurationUpdate: 750,
+      emphasis: {
+        focus: 'descendant',
+      },
+    },
+  ],
+}
+
+const height = 600
+```
+:::
+````
diff --git a/docs/notes/theme/snippet/include-1.snippet.md b/docs/notes/theme/snippet/include-1.snippet.md
new file mode 100644
index 00000000..8f9ae492
--- /dev/null
+++ b/docs/notes/theme/snippet/include-1.snippet.md
@@ -0,0 +1,252 @@
+::: code-tabs
+
+@tab HTML
+```html
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <body>
+    <!-- region snippet -->
+    <p>
+      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Eligendi,
+      repellendus. Voluptatibus alias cupiditate at, fuga tenetur error officiis
+      provident quisquam autem, porro facere! Neque quibusdam animi quaerat
+      eligendi recusandae eaque.
+    </p>
+    <!-- endregion snippet -->
+    <p>
+      Veniam harum illum natus omnis necessitatibus numquam architecto eum
+      dignissimos, quos a adipisci et non quam maxime repellendus alias ipsum,
+      vero praesentium laborum commodi perferendis velit repellat? Vero,
+      cupiditate sequi.
+    </p>
+  </body>
+</html>
+```
+
+@tab Markdown
+```md
+## Hello world
+
+<!-- #region snippet -->
+
+Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates
+inventore iure quo aut doloremque, ipsum ab voluptatem ipsa, velit laborum
+illo quae omnis reiciendis hic, ut dolorem non debitis in!
+
+<!-- #endregion snippet -->
+
+Veniam harum illum natus omnis necessitatibus numquam architecto eum
+dignissimos, quos a adipisci et non quam maxime repellendus alias ipsum,
+vero praesentium laborum commodi perferendis velit repellat? Vero,
+cupiditate sequi.
+```
+
+@tab TS
+```ts
+import MarkdownIt from 'markdown-it'
+import { include } from '@mdit/plugin-include'
+
+// #region snippet
+const mdIt = MarkdownIt().use(include, {
+  // your options, currentPath is required
+  currentPath: env => env.filePath,
+})
+// #endregion snippet
+
+mdIt.render('<!-- @include: ./path/to/include/file.md -->', {
+  filePath: 'path/to/current/file.md',
+})
+```
+
+@tab JS
+```js
+const MarkdownIt = require('markdown-it')
+const { include } = require('@mdit/plugin-include')
+
+// #region snippet
+const mdIt = MarkdownIt().use(include, {
+  // your options, currentPath is required
+  currentPath: env => env.filePath,
+})
+// #endregion snippet
+
+mdIt.render('<!-- @include: ./path/to/include/file.md -->', {
+  filePath: 'path/to/current/file.md',
+})
+```
+
+@tab css
+```css
+html,
+body {
+  margin: 0;
+  padding: 0;
+}
+
+/* #region snippet */
+h1 {
+  font-size: 1.5rem;
+}
+/* #endregion snippet */
+
+h2 {
+  font-size: 1.2rem;
+}
+```
+
+@tab Less
+```less
+html,
+body {
+  margin: 0;
+  padding: 0;
+}
+
+/* #region snippet */
+h1 {
+  font-size: 1.5rem;
+}
+/* #endregion snippet */
+
+h2 {
+  font-size: 1.2rem;
+}
+```
+
+@tab Sass
+```scss
+html,
+body {
+  margin: 0;
+  padding: 0;
+}
+
+/* #region snippet */
+h1 {
+  font-size: 1.5rem;
+}
+/* #endregion snippet */
+
+h2 {
+  font-size: 1.2rem;
+}
+```
+
+@tab Java
+```java
+public class HelloWorld {
+  // #region snippet
+  public static void main(String args[]){
+    System.out.println("Hello World");
+  }
+  // #endregion snippet
+}
+```
+
+@tab Python
+```py
+class MyClass:
+    msg = "world"
+
+    #region snippet
+    def sayHello(self):
+        print("Hello " + self.msg + "!")
+    #region snippet
+
+    def sayBye(self):
+        print("Bye " + self.msg + "!")
+```
+
+@tab Visual Basic
+```vb
+Imports System
+
+Module Module1
+   # Region snippet
+   Sub Main()
+     Console.WriteLine("Hello World!")
+     Console.WriteLine("Press Enter Key to Exit.")
+     Console.ReadLine()
+   End Sub
+   # EndRegion
+End Module
+```
+
+@tab Bat
+```bat
+>nul 2>&1 "%SYSTEMROOT%\system32\cacls.exe" "%SYSTEMROOT%\system32\config\system"
+if '%errorlevel%' NEQ '0' (
+echo Requesting administrative privileges...
+goto UACPrompt
+) else ( goto gotAdmin )
+
+::#region snippet
+:UACPrompt
+echo Set UAC = CreateObject^("Shell.Application"^) > "%temp%\getadmin.vbs"
+echo UAC.ShellExecute "%~s0", "", "", "runas", 1 >> "%temp%\getadmin.vbs"
+"%temp%\getadmin.vbs"
+exit /B
+::#endregion snippet
+
+:gotAdmin
+if exist "%temp%\getadmin.vbs" ( del "%temp%\getadmin.vbs" )
+pushd "%CD%"
+CD /D "%~dp0"
+```
+
+@tab C\#
+```cs
+using System;
+
+namespace HelloWorldApp {
+
+    class Geeks {
+
+        // #region snippet
+        static void Main(string[] args) {
+
+            // statement
+            // printing Hello World!
+            Console.WriteLine("Hello World!");
+
+            // To prevents the screen from
+            // running and closing quickly
+            Console.ReadKey();
+        }
+        // #endregion snippet
+    }
+}
+```
+
+@tab C/C++
+```cpp
+#include <iostream>
+#include <vector>
+
+std::vector<int> v;
+
+#pragma region snippet
+int f() {
+  for (int item : v) std::cout << item << std::endl;
+  return v.size();
+}
+#pragma endregion snippet
+
+int main() {
+  int n, u;
+  std::cin >> n;
+  for (int i = 1; i <= n; ++i) {
+    std::cin >> u;
+    v.push_back(u);
+  }
+  std::cout << f();
+  return 0;
+}
+```
+:::
diff --git a/docs/notes/theme/snippet/include-2.snippet.md b/docs/notes/theme/snippet/include-2.snippet.md
new file mode 100644
index 00000000..79198a48
--- /dev/null
+++ b/docs/notes/theme/snippet/include-2.snippet.md
@@ -0,0 +1,14 @@
+### 三级标题
+
+这是 foo.snippet.md 文件中的内容。
+
+:::info
+提示容器包括的内容
+:::
+
+<!-- region snippet -->
+这里是被 `<!-- region snippet -->` 包裹的内容。
+
+通过 `<!-- @include: ./foo.snippet.md#snippet -->` 来引入。
+
+<!-- endregion snippet -->
diff --git a/docs/notes/theme/snippet/mermaid-1.snippet.md b/docs/notes/theme/snippet/mermaid-1.snippet.md
new file mode 100644
index 00000000..4247491e
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-1.snippet.md
@@ -0,0 +1,21 @@
+````md
+```mermaid
+---
+title: Flowchart
+---
+flowchart TB
+    c1-->a2
+    subgraph one
+    a1-->a2
+    end
+    subgraph two
+    b1-->b2
+    end
+    subgraph three
+    c1-->c2
+    end
+    one --> two
+    three --> two
+    two --> c2
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-10.snippet.md b/docs/notes/theme/snippet/mermaid-10.snippet.md
new file mode 100644
index 00000000..adb438b6
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-10.snippet.md
@@ -0,0 +1,20 @@
+````md
+```mindmap
+root((VuePress))
+  Out of box
+    Default theme
+      Navbar
+      Sidebar
+      Darkmode
+    I18n
+    Search
+      Search
+      DocSearch<br />by algolia
+  Customize
+    Theme
+      (hope)
+    Plugins
+      (components)
+      (md-enhance)
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-11.snippet.md b/docs/notes/theme/snippet/mermaid-11.snippet.md
new file mode 100644
index 00000000..8fcdde0b
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-11.snippet.md
@@ -0,0 +1,12 @@
+````md
+```timeline
+title Timeline of Industrial Revolution
+section 17th-20th century
+    Industry 1.0 : Machinery, Water power, Steam <br>power
+    Industry 2.0 : Electricity, Internal combustion engine, Mass production
+    Industry 3.0 : Electronics, Computers, Automation
+section 21st century
+    Industry 4.0 : Internet, Robotics, Internet of Things
+    Industry 5.0 : Artificial intelligence, Big data,3D printing
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-12.snippet.md b/docs/notes/theme/snippet/mermaid-12.snippet.md
new file mode 100644
index 00000000..28186d0c
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-12.snippet.md
@@ -0,0 +1,72 @@
+````md
+```sankey
+Agricultural 'waste',Bio-conversion,124.729
+Bio-conversion,Liquid,0.597
+Bio-conversion,Losses,26.862
+Bio-conversion,Solid,280.322
+Bio-conversion,Gas,81.144
+Biofuel imports,Liquid,35
+Biomass imports,Solid,35
+Coal imports,Coal,11.606
+Coal reserves,Coal,63.965
+Coal,Solid,75.571
+District heating,Industry,10.639
+District heating,Heating and cooling - commercial,22.505
+District heating,Heating and cooling - homes,46.184
+Electricity grid,Over generation / exports,104.453
+Electricity grid,Heating and cooling - homes,113.726
+Electricity grid,H2 conversion,27.14
+Electricity grid,Industry,342.165
+Electricity grid,Road transport,37.797
+Electricity grid,Agriculture,4.412
+Electricity grid,Heating and cooling - commercial,40.858
+Electricity grid,Losses,56.691
+Electricity grid,Rail transport,7.863
+Electricity grid,Lighting & appliances - commercial,90.008
+Electricity grid,Lighting & appliances - homes,93.494
+Gas imports,Ngas,40.719
+Gas reserves,Ngas,82.233
+Gas,Heating and cooling - commercial,0.129
+Gas,Losses,1.401
+Gas,Thermal generation,151.891
+Gas,Agriculture,2.096
+Gas,Industry,48.58
+Geothermal,Electricity grid,7.013
+H2 conversion,H2,20.897
+H2 conversion,Losses,6.242
+H2,Road transport,20.897
+Hydro,Electricity grid,6.995
+Liquid,Industry,121.066
+Liquid,International shipping,128.69
+Liquid,Road transport,135.835
+Liquid,Domestic aviation,14.458
+Liquid,International aviation,206.267
+Liquid,Agriculture,3.64
+Liquid,National navigation,33.218
+Liquid,Rail transport,4.413
+Marine algae,Bio-conversion,4.375
+Ngas,Gas,122.952
+Nuclear,Thermal generation,839.978
+Oil imports,Oil,504.287
+Oil reserves,Oil,107.703
+Oil,Liquid,611.99
+Other waste,Solid,56.587
+Other waste,Bio-conversion,77.81
+Pumped heat,Heating and cooling - homes,193.026
+Pumped heat,Heating and cooling - commercial,70.672
+Solar PV,Electricity grid,59.901
+Solar Thermal,Heating and cooling - homes,19.263
+Solar,Solar Thermal,19.263
+Solar,Solar PV,59.901
+Solid,Agriculture,0.882
+Solid,Thermal generation,400.12
+Solid,Industry,46.477
+Thermal generation,Electricity grid,525.531
+Thermal generation,Losses,787.129
+Thermal generation,District heating,79.329
+Tidal,Electricity grid,9.452
+UK land based bioenergy,Bio-conversion,182.01
+Wave,Electricity grid,19.013
+Wind,Electricity grid,289.366
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-13.snippet.md b/docs/notes/theme/snippet/mermaid-13.snippet.md
new file mode 100644
index 00000000..2fed46cc
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-13.snippet.md
@@ -0,0 +1,16 @@
+````md
+```requirement
+requirement test_req {
+id: 1
+text: the test text.
+risk: high
+verifymethod: test
+}
+
+element test_entity {
+type: simulation
+}
+
+test_entity - satisfies -> test_req
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-14.snippet.md b/docs/notes/theme/snippet/mermaid-14.snippet.md
new file mode 100644
index 00000000..652f8331
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-14.snippet.md
@@ -0,0 +1,17 @@
+````md
+```quadrant
+title Reach and engagement of campaigns
+x-axis Low Reach --> High Reach
+y-axis Low Engagement --> High Engagement
+quadrant-1 We should expand
+quadrant-2 Need to promote
+quadrant-3 Re-evaluate
+quadrant-4 May be improved
+Campaign A: [0.3, 0.6]
+Campaign B: [0.45, 0.23]
+Campaign C: [0.57, 0.69]
+Campaign D: [0.78, 0.34]
+Campaign E: [0.40, 0.34]
+Campaign F: [0.35, 0.78]
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-15.snippet.md b/docs/notes/theme/snippet/mermaid-15.snippet.md
new file mode 100644
index 00000000..ee03fc79
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-15.snippet.md
@@ -0,0 +1,9 @@
+````md
+```xy
+title "Sales Revenue"
+x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+y-axis "Revenue (in $)" 4000 --> 11000
+bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-16.snippet.md b/docs/notes/theme/snippet/mermaid-16.snippet.md
new file mode 100644
index 00000000..daeccd99
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-16.snippet.md
@@ -0,0 +1,13 @@
+````md
+```block
+columns 3
+前端 blockArrowId6<[" "]>(right) 后端
+space:2 down<[" "]>(down)
+硬盘 left<[" "]>(left) Database[("数据库")]
+
+classDef front fill:#696,stroke:#333;
+classDef back fill:#969,stroke:#333;
+class Frontend front
+class Backend,Database back
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-17.snippet.md b/docs/notes/theme/snippet/mermaid-17.snippet.md
new file mode 100644
index 00000000..a86a934f
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-17.snippet.md
@@ -0,0 +1,25 @@
+````md
+```mermaid
+graph TB
+    sq[Square shape] --> ci((Circle shape))
+
+    subgraph A
+        od>Odd shape]-- Two line<br/>edge comment --> ro
+        di{Diamond with <br/> line break} -.-> ro(Rounded<br>square<br>shape)
+        di==>ro2(Rounded square shape)
+    end
+
+    %% Notice that no text in shape are added here instead that is appended further down
+    e --> od3>Really long text with line break<br>in an Odd shape]
+
+    %% Comments after double percent signs
+    e((Inner / circle<br>and some odd <br>special characters)) --> f(,.?!+-*ز)
+
+    cyr[Cyrillic]-->cyr2((Circle shape));
+
+     classDef green fill:#9f6,stroke:#333,stroke-width:2px;
+     classDef orange fill:#f96,stroke:#333,stroke-width:4px;
+     class sq,e green
+     class di orange
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-2.snippet.md b/docs/notes/theme/snippet/mermaid-2.snippet.md
new file mode 100644
index 00000000..6bdb20ea
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-2.snippet.md
@@ -0,0 +1,12 @@
+````md
+```sequence Greetings
+Alice ->> Bob: Hello Bob, how are you?
+Bob-->>John: How about you John?
+Bob--x Alice: I am good thanks!
+Bob-x John: I am good thanks!
+Note right of John: Bob thinks a long<br/>long time, so long<br/>that the text does<br/>not fit on a row.
+
+Bob-->Alice: Checking with John...
+Alice->John: Yes... John, how are you?
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-3.snippet.md b/docs/notes/theme/snippet/mermaid-3.snippet.md
new file mode 100644
index 00000000..aa13eaad
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-3.snippet.md
@@ -0,0 +1,26 @@
+````md
+```class Animal Example
+note "From Duck till Zebra"
+Animal <|-- Duck
+note for Duck "can fly\ncan swim\ncan dive\ncan help in debugging"
+Animal <|-- Fish
+Animal <|-- Zebra
+Animal : +int age
+Animal : +String gender
+Animal: +isMammal()
+Animal: +mate()
+class Duck{
+  +String beakColor
+  +swim()
+  +quack()
+}
+class Fish{
+  -int sizeInFeet
+  -canEat()
+}
+class Zebra{
+  +bool is_wild
+  +run()
+}
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-4.snippet.md b/docs/notes/theme/snippet/mermaid-4.snippet.md
new file mode 100644
index 00000000..2fda6e9a
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-4.snippet.md
@@ -0,0 +1,10 @@
+````md
+```state Check if n is negative
+
+state if_state <<choice>>
+[*] --> IsPositive
+IsPositive --> if_state
+if_state --> False: if n < 0
+if_state --> True : if n >= 0
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-5.snippet.md b/docs/notes/theme/snippet/mermaid-5.snippet.md
new file mode 100644
index 00000000..54274c6a
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-5.snippet.md
@@ -0,0 +1,16 @@
+````md
+```er Er Example
+CAR ||--o{ NAMED-DRIVER : allows
+CAR {
+    string registrationNumber
+    string make
+    string model
+}
+PERSON ||--o{ NAMED-DRIVER : is
+PERSON {
+    string firstName
+    string lastName
+    int age
+}
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-6.snippet.md b/docs/notes/theme/snippet/mermaid-6.snippet.md
new file mode 100644
index 00000000..fdfba407
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-6.snippet.md
@@ -0,0 +1,12 @@
+````md
+```journey
+title My working day
+section Go to work
+  Make tea: 5: Me
+  Go upstairs: 3: Me
+  Do work: 1: Me, Cat
+section Go home
+  Go downstairs: 5: Me
+  Sit down: 5: Me
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-7.snippet.md b/docs/notes/theme/snippet/mermaid-7.snippet.md
new file mode 100644
index 00000000..bb4215a6
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-7.snippet.md
@@ -0,0 +1,32 @@
+````md
+```gantt
+dateFormat  YYYY-MM-DD
+title       Adding GANTT diagram functionality to mermaid
+excludes    weekends
+%% (`excludes` accepts specific dates in YYYY-MM-DD format, days of the week ("sunday") or "weekends", but not the word "weekdays".)
+
+section A section
+Completed task            :done,    des1, 2014-01-06,2014-01-08
+Active task               :active,  des2, 2014-01-09, 3d
+Future task               :         des3, after des2, 5d
+Future task2              :         des4, after des3, 5d
+
+section Critical tasks
+Completed task in the critical line :crit, done, 2014-01-06,24h
+Implement parser                    :crit, done, after des1, 2d
+Create tests for parser             :crit, active, 3d
+Future task in critical line        :crit, 5d
+Create tests for renderer           :2d
+Add to mermaid                      :1d
+
+section Documentation
+Describe gantt syntax               :active, a1, after des1, 3d
+Add gantt diagram to demo page      :after a1  , 20h
+Add another diagram to demo page    :doc1, after a1  , 48h
+
+section Last section
+Describe gantt syntax               :after doc1, 3d
+Add gantt diagram to demo page      :20h
+Add another diagram to demo page    :48h
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-8.snippet.md b/docs/notes/theme/snippet/mermaid-8.snippet.md
new file mode 100644
index 00000000..117265bc
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-8.snippet.md
@@ -0,0 +1,45 @@
+````md
+```git-graph
+commit
+branch hotfix
+checkout hotfix
+commit
+branch develop
+checkout develop
+commit id:"ash" tag:"abc"
+branch featureB
+checkout featureB
+commit type:HIGHLIGHT
+checkout main
+checkout hotfix
+commit type:NORMAL
+checkout develop
+commit type:REVERSE
+checkout featureB
+commit
+checkout main
+merge hotfix
+checkout featureB
+commit
+checkout develop
+branch featureA
+commit
+checkout develop
+merge hotfix
+checkout featureA
+commit
+checkout featureB
+commit
+checkout develop
+merge featureA
+branch release
+checkout release
+commit
+checkout main
+commit
+checkout release
+merge main
+checkout develop
+merge release
+```
+````
diff --git a/docs/notes/theme/snippet/mermaid-9.snippet.md b/docs/notes/theme/snippet/mermaid-9.snippet.md
new file mode 100644
index 00000000..f0bc8b83
--- /dev/null
+++ b/docs/notes/theme/snippet/mermaid-9.snippet.md
@@ -0,0 +1,35 @@
+````md
+```c4c
+title System Context diagram for Internet Banking System
+
+Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
+Person(customerB, "Banking Customer B")
+Person_Ext(customerC, "Banking Customer C")
+System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")
+
+Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")
+
+Enterprise_Boundary(b1, "BankBoundary") {
+
+  SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
+
+  System_Boundary(b2, "BankBoundary2") {
+    System(SystemA, "Banking System A")
+    System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts.")
+  }
+
+  System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
+  SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")
+
+  Boundary(b3, "BankBoundary3", "boundary") {
+    SystemQueue(SystemF, "Banking System F Queue", "A system of the bank, with personal bank accounts.")
+    SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
+  }
+}
+
+BiRel(customerA, SystemAA, "Uses")
+BiRel(SystemAA, SystemE, "Uses")
+Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
+Rel(SystemC, customerA, "Sends e-mails to")
+```
+````
diff --git a/docs/package.json b/docs/package.json
index e9d9775e..fb7287a6 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -14,6 +14,10 @@
   "dependencies": {
     "@vuepress/bundler-vite": "2.0.0-rc.8",
     "anywhere": "^1.6.0",
+    "chart.js": "^4.4.2",
+    "echarts": "^5.5.0",
+    "flowchart.ts": "^3.0.0",
+    "mermaid": "^10.9.0",
     "vue": "^3.4.21",
     "vuepress-theme-plume": "workspace:*"
   },
diff --git a/eslint.config.js b/eslint.config.js
index bec65bcf..25aee2d2 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -17,10 +17,11 @@ export default config({
     'vue/no-v-text-v-html-on-component': 'off',
   },
 }, {
-  files: ['**/*.md/*.ts'],
+  files: ['**/*.md/*.{js,ts}'],
   rules: {
     'import/no-duplicates': 'off',
     'import/first': 'off',
     'no-new': 'off',
+    'eslint-comments/no-unlimited-disable': 'off',
   },
 })
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ef851432..ddb1972a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -85,6 +85,18 @@ importers:
       anywhere:
         specifier: ^1.6.0
         version: 1.6.0
+      chart.js:
+        specifier: ^4.4.2
+        version: 4.4.2
+      echarts:
+        specifier: ^5.5.0
+        version: 5.5.0
+      flowchart.ts:
+        specifier: ^3.0.0
+        version: 3.0.0
+      mermaid:
+        specifier: ^10.9.0
+        version: 10.9.0
       vue:
         specifier: ^3.4.21
         version: 3.4.21(typescript@5.4.2)
@@ -358,6 +370,9 @@ importers:
       '@vuepress/plugin-active-header-links':
         specifier: 2.0.0-rc.17
         version: 2.0.0-rc.17(typescript@5.4.2)(vuepress@2.0.0-rc.8)
+      '@vuepress/plugin-comment':
+        specifier: 2.0.0-rc.20
+        version: 2.0.0-rc.20(typescript@5.4.2)(vuepress@2.0.0-rc.8)
       '@vuepress/plugin-container':
         specifier: 2.0.0-rc.15
         version: 2.0.0-rc.15(vuepress@2.0.0-rc.8)
@@ -421,9 +436,6 @@ importers:
       vuepress:
         specifier: 2.0.0-rc.8
         version: 2.0.0-rc.8(@vuepress/bundler-vite@2.0.0-rc.8)(typescript@5.4.2)(vue@3.4.21)
-      vuepress-plugin-comment2:
-        specifier: 2.0.0-rc.25
-        version: 2.0.0-rc.25(typescript@5.4.2)(vuepress@2.0.0-rc.8)
       vuepress-plugin-md-enhance:
         specifier: 2.0.0-rc.25
         version: 2.0.0-rc.25(katex@0.16.9)(markdown-it@14.0.0)(typescript@5.4.2)(vuepress@2.0.0-rc.8)
@@ -619,6 +631,10 @@ packages:
       '@babel/helper-validator-identifier': 7.22.20
       to-fast-properties: 2.0.0
 
+  /@braintree/sanitize-url@6.0.4:
+    resolution: {integrity: sha512-s3jaWicZd0pkP0jf5ysyHUI/RE7MHos6qlToFcGWXVp+ykHOy77OUMrfbgJ9it2C5bow7OIQwYYaHjk9XlBQ2A==}
+    dev: false
+
   /@bugsnag/browser@7.20.2:
     resolution: {integrity: sha512-4J4s53ZpYr3hHA+QjxUjOI6U+A8+XuUVH45UshE87Jp2Y4mV8ML2DovejqJS8J8yjdbnh2z1Wtg/v3WUNt4ayQ==}
     dependencies:
@@ -1962,6 +1978,10 @@ packages:
       string-argv: 0.3.2
       type-detect: 4.0.8
 
+  /@kurkle/color@0.3.2:
+    resolution: {integrity: sha512-fuscdXJ9G1qb7W8VdHi+IwRqij3lBkosAm4ydQtEmbY58OzHXqQhvlxqEkoz0yssNVn38bcpRWgA9PP+OGoisw==}
+    dev: false
+
   /@lit-labs/ssr-dom-shim@1.2.0:
     resolution: {integrity: sha512-yWJKmpGE6lUURKAaIltoPIE/wrbY3TEkqQt+X0m+7fQNnAv0keydnYvbiJFP1PnMhizmIWRWOG5KLhYyc/xl+g==}
     dev: false
@@ -3673,6 +3693,20 @@ packages:
       '@types/node': 20.11.27
     dev: true
 
+  /@types/d3-scale-chromatic@3.0.3:
+    resolution: {integrity: sha512-laXM4+1o5ImZv3RpFAsTRn3TEkzqkytiOY0Dz0sq5cnd1dtNlk6sHLon4OvqaiJb28T0S/TdsBI3Sjsy+keJrw==}
+    dev: false
+
+  /@types/d3-scale@4.0.8:
+    resolution: {integrity: sha512-gkK1VVTr5iNiYJ7vWDI+yUFFlszhNMtVeneJ6lUTKPjprsvLLI9/tgEGiXJOnlINJA8FyA88gfnQsHbybVZrYQ==}
+    dependencies:
+      '@types/d3-time': 3.0.3
+    dev: false
+
+  /@types/d3-time@3.0.3:
+    resolution: {integrity: sha512-2p6olUZ4w3s+07q3Tm2dbiMZy5pCDfYwtLXXHUnVzXgQlZ/OyPtUz6OL382BkOuGlLXqfT+wqv8Fw2v8/0geBw==}
+    dev: false
+
   /@types/debug@4.1.12:
     resolution: {integrity: sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==}
     dependencies:
@@ -3797,7 +3831,6 @@ packages:
     resolution: {integrity: sha512-LnwD+mUEfxWMa1QpDraczIn6k0Ee3SMicuYSSzS6ZYl2gKS09EClnJYGd8Du6rfc5r/GZEk5o1mRb8TaTj03sQ==}
     dependencies:
       '@types/unist': 2.0.10
-    dev: true
 
   /@types/mdast@4.0.3:
     resolution: {integrity: sha512-LsjtqsyF+d2/yFOYaN22dHZI1Cpwkrj+g06G8+qtUKlhovPW89YhqSnfKtMbkgmEtYpH2gydRNULd6y8mciAFg==}
@@ -3853,6 +3886,10 @@ packages:
     resolution: {integrity: sha512-hKormJbkJqzQGhziax5PItDUTMAM9uE2XXQmM37dyd4hVM+5aVl7oVxMVUiVQn2oCQFN/LKCZdvSM0pFRqbSmQ==}
     dev: true
 
+  /@types/raphael@2.3.9:
+    resolution: {integrity: sha512-K1dZwoLNvEN+mvleFU/t2swG9Z4SE5Vub7dA5wDYojH0bVTQ8ZAP+lNsl91t1njdu/B+roSEL4QXC67I7Hpiag==}
+    dev: false
+
   /@types/retry@0.12.1:
     resolution: {integrity: sha512-xoDlM2S4ortawSWORYqsdU+2rxdh4LRW9ytc3zmT37RIKQh6IHyKwwtKhKis9ah8ol07DCkZxPt8BBvPjC6v4g==}
     dev: false
@@ -3888,7 +3925,6 @@ packages:
 
   /@types/unist@2.0.10:
     resolution: {integrity: sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA==}
-    dev: true
 
   /@types/unist@3.0.2:
     resolution: {integrity: sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==}
@@ -4441,6 +4477,21 @@ packages:
       - typescript
     dev: false
 
+  /@vuepress/helper@2.0.0-rc.19(typescript@5.4.2)(vuepress@2.0.0-rc.8):
+    resolution: {integrity: sha512-g8udvFCIBcEcpLTo1BFZw452oBmnflW3lCmN0rR+SfIkZymi9CnFV8LgxTF/KV7vB71QMjN8IAwCVvJ3pGCUag==}
+    peerDependencies:
+      vuepress: 2.0.0-rc.8
+    dependencies:
+      '@vue/shared': 3.4.21
+      cheerio: 1.0.0-rc.12
+      fflate: 0.8.2
+      gray-matter: 4.0.3
+      vue: 3.4.21(typescript@5.4.2)
+      vuepress: 2.0.0-rc.8(@vuepress/bundler-vite@2.0.0-rc.8)(typescript@5.4.2)(vue@3.4.21)
+    transitivePeerDependencies:
+      - typescript
+    dev: false
+
   /@vuepress/markdown@2.0.0-rc.8(patch_hash=f3on36z73gmvj4jugj25dg7wje):
     resolution: {integrity: sha512-BJfun3rFpKbq3WwVNyJGZyc9QXN6sXKwMY2PRFiJqpG0A1ZxjZQFUvDRnSUgWEsBiluB23hZ4Pd0WP+6YNAq9w==}
     dependencies:
@@ -4478,6 +4529,32 @@ packages:
       - typescript
     dev: false
 
+  /@vuepress/plugin-comment@2.0.0-rc.20(typescript@5.4.2)(vuepress@2.0.0-rc.8):
+    resolution: {integrity: sha512-B7Bh6oK/ijdmNgXxk8AJcB+bSCLirAK0y1nM62yieZ66rHTIenoYfCgqqkhrxKp/ABPyjiBPj9TEcgptmJC4bA==}
+    peerDependencies:
+      '@waline/client': ^3.1.0
+      artalk: ^2.7.3
+      sass-loader: ^14.0.0
+      twikoo: ^1.5.0
+      vuepress: 2.0.0-rc.8
+    peerDependenciesMeta:
+      '@waline/client':
+        optional: true
+      artalk:
+        optional: true
+      sass-loader:
+        optional: true
+      twikoo:
+        optional: true
+    dependencies:
+      '@vuepress/helper': 2.0.0-rc.19(typescript@5.4.2)(vuepress@2.0.0-rc.8)
+      giscus: 1.5.0
+      vue: 3.4.21(typescript@5.4.2)
+      vuepress: 2.0.0-rc.8(@vuepress/bundler-vite@2.0.0-rc.8)(typescript@5.4.2)(vue@3.4.21)
+    transitivePeerDependencies:
+      - typescript
+    dev: false
+
   /@vuepress/plugin-container@2.0.0-rc.15(vuepress@2.0.0-rc.8):
     resolution: {integrity: sha512-9bo7LX2ANKiY2T9Yy05kKhLScSiY2BlbuHHpPiF3zNGG6FlAQke0D/sn9DxVvXTxFDVMfqw+Hr637rih0B9lfw==}
     peerDependencies:
@@ -5643,6 +5720,13 @@ packages:
   /chardet@0.7.0:
     resolution: {integrity: sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==}
 
+  /chart.js@4.4.2:
+    resolution: {integrity: sha512-6GD7iKwFpP5kbSD4MeRRRlTnQvxfQREy36uEtm1hzHzcOqwWx0YEHuspuoNlslu+nciLIB7fjjsHkUv/FzFcOg==}
+    engines: {pnpm: '>=8'}
+    dependencies:
+      '@kurkle/color': 0.3.2
+    dev: false
+
   /cheerio-select@2.1.0:
     resolution: {integrity: sha512-9v9kG0LvzrlcungtnJtpGNxY+fzECQKhK4EGJX2vByejiMX84MFNQw4UxPJl3bFbTMw+Dfs37XaIkCwTZfLh4g==}
     dependencies:
@@ -6472,6 +6556,12 @@ packages:
     resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
     dev: false
 
+  /cose-base@1.0.3:
+    resolution: {integrity: sha512-s9whTXInMSgAp/NVXVNuVxVKzGH2qck3aQlVHxDCdAEPgtMKwc4Wq6/QKhgdEdgbLSi9rBTAcPoRa6JpiG4ksg==}
+    dependencies:
+      layout-base: 1.0.2
+    dev: false
+
   /cosmiconfig-typescript-loader@5.0.0(@types/node@20.9.1)(cosmiconfig@8.3.6)(typescript@5.4.2):
     resolution: {integrity: sha512-+8cK7jRAReYkMwMiG+bxhcNKiHJDM6bR9FD/nGBXOWdMLuYawjF5cGrtLilJ+LGd3ZjCXnJjR5DkfWPoIVlqJA==}
     engines: {node: '>=v16'}
@@ -6690,6 +6780,23 @@ packages:
     resolution: {integrity: sha512-NJGVKPS81XejHcLhaLJS7plab0fK3slPh11mESeeDq2W4ZI5kUKK/LRRdVDvjJseojbPB7ZwjnyOybg3Igea/A==}
     dev: false
 
+  /cytoscape-cose-bilkent@4.1.0(cytoscape@3.28.1):
+    resolution: {integrity: sha512-wgQlVIUJF13Quxiv5e1gstZ08rnZj2XaLHGoFMYXz7SkNfCDOOteKBE6SYRfA9WxxI/iBc3ajfDoc6hb/MRAHQ==}
+    peerDependencies:
+      cytoscape: ^3.2.0
+    dependencies:
+      cose-base: 1.0.3
+      cytoscape: 3.28.1
+    dev: false
+
+  /cytoscape@3.28.1:
+    resolution: {integrity: sha512-xyItz4O/4zp9/239wCcH8ZcFuuZooEeF8KHRmzjDfGdXsj3OG9MFSMA0pJE0uX3uCN/ygof6hHf4L7lst+JaDg==}
+    engines: {node: '>=0.10'}
+    dependencies:
+      heap: 0.2.7
+      lodash: 4.17.21
+    dev: false
+
   /cz-conventional-changelog@3.3.0(@types/node@20.9.1)(typescript@5.4.2):
     resolution: {integrity: sha512-U466fIzU5U22eES5lTNiNbZ+d8dfcHcssH4o7QsdWaCcRs/feIPCxKYSWkYBNs5mny7MvEfwpTLWjvbm94hecw==}
     engines: {node: '>= 10'}
@@ -6707,6 +6814,284 @@ packages:
       - typescript
     dev: true
 
+  /d3-array@2.12.1:
+    resolution: {integrity: sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==}
+    dependencies:
+      internmap: 1.0.1
+    dev: false
+
+  /d3-array@3.2.4:
+    resolution: {integrity: sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==}
+    engines: {node: '>=12'}
+    dependencies:
+      internmap: 2.0.3
+    dev: false
+
+  /d3-axis@3.0.0:
+    resolution: {integrity: sha512-IH5tgjV4jE/GhHkRV0HiVYPDtvfjHQlQfJHs0usq7M30XcSBvOotpmH1IgkcXsO/5gEQZD43B//fc7SRT5S+xw==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-brush@3.0.0:
+    resolution: {integrity: sha512-ALnjWlVYkXsVIGlOsuWH1+3udkYFI48Ljihfnh8FZPF2QS9o+PzGLBslO0PjzVoHLZ2KCVgAM8NVkXPJB2aNnQ==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-drag: 3.0.0
+      d3-interpolate: 3.0.1
+      d3-selection: 3.0.0
+      d3-transition: 3.0.1(d3-selection@3.0.0)
+    dev: false
+
+  /d3-chord@3.0.1:
+    resolution: {integrity: sha512-VE5S6TNa+j8msksl7HwjxMHDM2yNK3XCkusIlpX5kwauBfXuyLAtNg9jCp/iHH61tgI4sb6R/EIMWCqEIdjT/g==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-path: 3.1.0
+    dev: false
+
+  /d3-color@3.1.0:
+    resolution: {integrity: sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-contour@4.0.2:
+    resolution: {integrity: sha512-4EzFTRIikzs47RGmdxbeUvLWtGedDUNkTcmzoeyg4sP/dvCexO47AaQL7VKy/gul85TOxw+IBgA8US2xwbToNA==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-array: 3.2.4
+    dev: false
+
+  /d3-delaunay@6.0.4:
+    resolution: {integrity: sha512-mdjtIZ1XLAM8bm/hx3WwjfHt6Sggek7qH043O8KEjDXN40xi3vx/6pYSVTwLjEgiXQTbvaouWKynLBiUZ6SK6A==}
+    engines: {node: '>=12'}
+    dependencies:
+      delaunator: 5.0.1
+    dev: false
+
+  /d3-dispatch@3.0.1:
+    resolution: {integrity: sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-drag@3.0.0:
+    resolution: {integrity: sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-selection: 3.0.0
+    dev: false
+
+  /d3-dsv@3.0.1:
+    resolution: {integrity: sha512-UG6OvdI5afDIFP9w4G0mNq50dSOsXHJaRE8arAS5o9ApWnIElp8GZw1Dun8vP8OyHOZ/QJUKUJwxiiCCnUwm+Q==}
+    engines: {node: '>=12'}
+    hasBin: true
+    dependencies:
+      commander: 7.2.0
+      iconv-lite: 0.6.3
+      rw: 1.3.3
+    dev: false
+
+  /d3-ease@3.0.1:
+    resolution: {integrity: sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-fetch@3.0.1:
+    resolution: {integrity: sha512-kpkQIM20n3oLVBKGg6oHrUchHM3xODkTzjMoj7aWQFq5QEM+R6E4WkzT5+tojDY7yjez8KgCBRoj4aEr99Fdqw==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-dsv: 3.0.1
+    dev: false
+
+  /d3-force@3.0.0:
+    resolution: {integrity: sha512-zxV/SsA+U4yte8051P4ECydjD/S+qeYtnaIyAs9tgHCqfguma/aAQDjo85A9Z6EKhBirHRJHXIgJUlffT4wdLg==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-quadtree: 3.0.1
+      d3-timer: 3.0.1
+    dev: false
+
+  /d3-format@3.1.0:
+    resolution: {integrity: sha512-YyUI6AEuY/Wpt8KWLgZHsIU86atmikuoOmCfommt0LYHiQSPjvX2AcFc38PX0CBpr2RCyZhjex+NS/LPOv6YqA==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-geo@3.1.1:
+    resolution: {integrity: sha512-637ln3gXKXOwhalDzinUgY83KzNWZRKbYubaG+fGVuc/dxO64RRljtCTnf5ecMyE1RIdtqpkVcq0IbtU2S8j2Q==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-array: 3.2.4
+    dev: false
+
+  /d3-hierarchy@3.1.2:
+    resolution: {integrity: sha512-FX/9frcub54beBdugHjDCdikxThEqjnR93Qt7PvQTOHxyiNCAlvMrHhclk3cD5VeAaq9fxmfRp+CnWw9rEMBuA==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-interpolate@3.0.1:
+    resolution: {integrity: sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-color: 3.1.0
+    dev: false
+
+  /d3-path@1.0.9:
+    resolution: {integrity: sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==}
+    dev: false
+
+  /d3-path@3.1.0:
+    resolution: {integrity: sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-polygon@3.0.1:
+    resolution: {integrity: sha512-3vbA7vXYwfe1SYhED++fPUQlWSYTTGmFmQiany/gdbiWgU/iEyQzyymwL9SkJjFFuCS4902BSzewVGsHHmHtXg==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-quadtree@3.0.1:
+    resolution: {integrity: sha512-04xDrxQTDTCFwP5H6hRhsRcb9xxv2RzkcsygFzmkSIOJy3PeRJP7sNk3VRIbKXcog561P9oU0/rVH6vDROAgUw==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-random@3.0.1:
+    resolution: {integrity: sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-sankey@0.12.3:
+    resolution: {integrity: sha512-nQhsBRmM19Ax5xEIPLMY9ZmJ/cDvd1BG3UVvt5h3WRxKg5zGRbvnteTyWAbzeSvlh3tW7ZEmq4VwR5mB3tutmQ==}
+    dependencies:
+      d3-array: 2.12.1
+      d3-shape: 1.3.7
+    dev: false
+
+  /d3-scale-chromatic@3.1.0:
+    resolution: {integrity: sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-color: 3.1.0
+      d3-interpolate: 3.0.1
+    dev: false
+
+  /d3-scale@4.0.2:
+    resolution: {integrity: sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-array: 3.2.4
+      d3-format: 3.1.0
+      d3-interpolate: 3.0.1
+      d3-time: 3.1.0
+      d3-time-format: 4.1.0
+    dev: false
+
+  /d3-selection@3.0.0:
+    resolution: {integrity: sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-shape@1.3.7:
+    resolution: {integrity: sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==}
+    dependencies:
+      d3-path: 1.0.9
+    dev: false
+
+  /d3-shape@3.2.0:
+    resolution: {integrity: sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-path: 3.1.0
+    dev: false
+
+  /d3-time-format@4.1.0:
+    resolution: {integrity: sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-time: 3.1.0
+    dev: false
+
+  /d3-time@3.1.0:
+    resolution: {integrity: sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-array: 3.2.4
+    dev: false
+
+  /d3-timer@3.0.1:
+    resolution: {integrity: sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==}
+    engines: {node: '>=12'}
+    dev: false
+
+  /d3-transition@3.0.1(d3-selection@3.0.0):
+    resolution: {integrity: sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==}
+    engines: {node: '>=12'}
+    peerDependencies:
+      d3-selection: 2 - 3
+    dependencies:
+      d3-color: 3.1.0
+      d3-dispatch: 3.0.1
+      d3-ease: 3.0.1
+      d3-interpolate: 3.0.1
+      d3-selection: 3.0.0
+      d3-timer: 3.0.1
+    dev: false
+
+  /d3-zoom@3.0.0:
+    resolution: {integrity: sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-drag: 3.0.0
+      d3-interpolate: 3.0.1
+      d3-selection: 3.0.0
+      d3-transition: 3.0.1(d3-selection@3.0.0)
+    dev: false
+
+  /d3@7.9.0:
+    resolution: {integrity: sha512-e1U46jVP+w7Iut8Jt8ri1YsPOvFpg46k+K8TpCb0P+zjCkjkPnV7WzfDJzMHy1LnA+wj5pLT1wjO901gLXeEhA==}
+    engines: {node: '>=12'}
+    dependencies:
+      d3-array: 3.2.4
+      d3-axis: 3.0.0
+      d3-brush: 3.0.0
+      d3-chord: 3.0.1
+      d3-color: 3.1.0
+      d3-contour: 4.0.2
+      d3-delaunay: 6.0.4
+      d3-dispatch: 3.0.1
+      d3-drag: 3.0.0
+      d3-dsv: 3.0.1
+      d3-ease: 3.0.1
+      d3-fetch: 3.0.1
+      d3-force: 3.0.0
+      d3-format: 3.1.0
+      d3-geo: 3.1.1
+      d3-hierarchy: 3.1.2
+      d3-interpolate: 3.0.1
+      d3-path: 3.1.0
+      d3-polygon: 3.0.1
+      d3-quadtree: 3.0.1
+      d3-random: 3.0.1
+      d3-scale: 4.0.2
+      d3-scale-chromatic: 3.1.0
+      d3-selection: 3.0.0
+      d3-shape: 3.2.0
+      d3-time: 3.1.0
+      d3-time-format: 4.1.0
+      d3-timer: 3.0.1
+      d3-transition: 3.0.1(d3-selection@3.0.0)
+      d3-zoom: 3.0.0
+    dev: false
+
+  /dagre-d3-es@7.0.10:
+    resolution: {integrity: sha512-qTCQmEhcynucuaZgY5/+ti3X/rnszKZhEQH/ZdWdtP1tA/y3VoHJzcVrO9pjjJCNpigfscAtoUB5ONcd2wNn0A==}
+    dependencies:
+      d3: 7.9.0
+      lodash-es: 4.17.21
+    dev: false
+
   /dargs@7.0.0:
     resolution: {integrity: sha512-2iy1EkLdlBzQGvbweYRFxmFath8+K7+AKB0TlhHWkNuH+TmovaMH/Wp7V7R4u7f4SnX3OgLsU9t1NI9ioDnUpg==}
     engines: {node: '>=8'}
@@ -6883,6 +7268,12 @@ packages:
   /defu@6.1.4:
     resolution: {integrity: sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==}
 
+  /delaunator@5.0.1:
+    resolution: {integrity: sha512-8nvh+XBe96aCESrGOqMp/84b13H9cdKbG5P2ejQCh4d4sK9RL4371qou9drQjMhvnPmhWl5hnmqbEE0fXr9Xnw==}
+    dependencies:
+      robust-predicates: 3.0.2
+    dev: false
+
   /delegates@1.0.0:
     resolution: {integrity: sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==}
     dev: false
@@ -7024,6 +7415,11 @@ packages:
     engines: {node: '>=0.3.1'}
     dev: false
 
+  /diff@5.2.0:
+    resolution: {integrity: sha512-uIFDxqpRZGZ6ThOk84hEfqWoHx2devRFvpTZcTHur85vImfaxUbTW9Ryh4CpCuDnToOP1CEtXKIgytHBPVff5A==}
+    engines: {node: '>=0.3.1'}
+    dev: false
+
   /dir-glob@3.0.1:
     resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
     engines: {node: '>=8'}
@@ -7053,6 +7449,10 @@ packages:
     dependencies:
       domelementtype: 2.3.0
 
+  /dompurify@3.0.9:
+    resolution: {integrity: sha512-uyb4NDIvQ3hRn6NiC+SIFaP4mJ/MdXlvtunaqK9Bn6dD3RuB/1S/gasEjDHD8eiaqdSael2vBv+hOs7Y+jhYOQ==}
+    dev: false
+
   /domutils@3.0.1:
     resolution: {integrity: sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q==}
     dependencies:
@@ -7101,6 +7501,13 @@ packages:
       safe-buffer: 5.2.1
     dev: false
 
+  /echarts@5.5.0:
+    resolution: {integrity: sha512-rNYnNCzqDAPCr4m/fqyUFv7fD9qIsd50S6GDFgO1DxZhncCsNsG7IfUlAlvZe5oSEQxtsjnHiUuppzccry93Xw==}
+    dependencies:
+      tslib: 2.3.0
+      zrender: 5.5.0
+    dev: false
+
   /ee-first@1.1.1:
     resolution: {integrity: sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=}
     dev: false
@@ -7108,6 +7515,10 @@ packages:
   /electron-to-chromium@1.4.616:
     resolution: {integrity: sha512-1n7zWYh8eS0L9Uy+GskE0lkBUNK83cXTVJI0pU3mGprFsbfSdAc15VTFbo+A+Bq4pwstmL30AVcEU3Fo463lNg==}
 
+  /elkjs@0.9.2:
+    resolution: {integrity: sha512-2Y/RaA1pdgSHpY0YG4TYuYCD2wh97CRvu22eLG3Kz0pgQ/6KbIFTxsTnDc4MH/6hFlg2L/9qXrDMG0nMjP63iw==}
+    dev: false
+
   /emoji-regex@10.3.0:
     resolution: {integrity: sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw==}
 
@@ -7807,6 +8218,10 @@ packages:
     engines: {node: '>= 0.6'}
     dev: false
 
+  /eve-raphael@0.5.0:
+    resolution: {integrity: sha1-F8dUt5K+7z+maE15z1pHxjxM2jA=}
+    dev: false
+
   /event-target-shim@5.0.1:
     resolution: {integrity: sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==}
     engines: {node: '>=6'}
@@ -8399,6 +8814,15 @@ packages:
       vue-resize: 2.0.0-alpha.1(vue@3.4.21)
     dev: false
 
+  /flowchart.ts@3.0.0:
+    resolution: {integrity: sha512-yD+0wVJHvV6SutpNpao5S0hQp+7tnPuETtPORIodGEuUAP8LzegVVSUy+NFDWU9pUO2F1E+PikBD83PddoCfnw==}
+    engines: {node: ^18.0.0 || >= 20}
+    dependencies:
+      '@types/raphael': 2.3.9
+      raphael: 2.3.0
+      tslib: 2.6.2
+    dev: false
+
   /flush-write-stream@2.0.0:
     resolution: {integrity: sha512-uXClqPxT4xW0lcdSBheb2ObVU+kuqUk3Jk64EwieirEXZx9XUrVwp/JuBfKAWaM4T5Td/VL7QLDWPXp/MvGm/g==}
     dependencies:
@@ -9095,6 +9519,10 @@ packages:
     hasBin: true
     dev: false
 
+  /heap@0.2.7:
+    resolution: {integrity: sha512-2bsegYkkHO+h/9MGbn6KWcE45cHZgPANo5LXF7EvWdT0yT2EguSVO1nDgU5c8+ZOPwp2vMNa7YFsJhVcDR9Sdg==}
+    dev: false
+
   /homedir-polyfill@1.0.3:
     resolution: {integrity: sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==}
     engines: {node: '>=0.10.0'}
@@ -9276,6 +9704,13 @@ packages:
     dependencies:
       safer-buffer: 2.1.2
 
+  /iconv-lite@0.6.3:
+    resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
+    engines: {node: '>=0.10.0'}
+    dependencies:
+      safer-buffer: 2.1.2
+    dev: false
+
   /ieee754@1.2.1:
     resolution: {integrity: sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==}
 
@@ -9417,6 +9852,15 @@ packages:
       kind-of: 6.0.3
     dev: false
 
+  /internmap@1.0.1:
+    resolution: {integrity: sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw==}
+    dev: false
+
+  /internmap@2.0.3:
+    resolution: {integrity: sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==}
+    engines: {node: '>=12'}
+    dev: false
+
   /ioredis@5.3.2:
     resolution: {integrity: sha512-1DKMMzlIHM02eBBVOFQ1+AolGjs6+xEcM4PDL7NqOS6szq7H9jSaEkIUH6/a5Hl241LzW6JLSiAbNvTQjUupUA==}
     engines: {node: '>=12.22.0'}
@@ -10031,6 +10475,10 @@ packages:
     dependencies:
       json-buffer: 3.0.1
 
+  /khroma@2.1.0:
+    resolution: {integrity: sha512-Ls993zuzfayK269Svk9hzpeGUKob/sIgZzyHYdjQoAdQetRKpOLj+k/QQQ/6Qi0Yz65mlROrfd+Ev+1+7dz9Kw==}
+    dev: false
+
   /kind-of@3.2.2:
     resolution: {integrity: sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==}
     engines: {node: '>=0.10.0'}
@@ -10088,6 +10536,10 @@ packages:
       package-json: 8.1.0
     dev: false
 
+  /layout-base@1.0.2:
+    resolution: {integrity: sha512-8h2oVEZNktL4BH2JCOI90iD1yXwL6iNW7KcCKT2QZgQJR2vbqDsldCTPRU9NifTCqHZci57XvQQ15YTu+sTYPg==}
+    dev: false
+
   /lazystream@1.0.1:
     resolution: {integrity: sha512-b94GiNHQNy6JNTrt5w6zNyffMrNkXZb3KTkCZJb2V1xaEGCk093vkZ2jk3tpaeP33/OiXC+WvK9AxUebnf5nbw==}
     engines: {node: '>= 0.6.3'}
@@ -10596,6 +11048,25 @@ packages:
       - supports-color
     dev: true
 
+  /mdast-util-from-markdown@1.3.1:
+    resolution: {integrity: sha512-4xTO/M8c82qBcnQc1tgpNtubGUW/Y1tBQ1B0i5CtSoelOLKFYlElIr3bvgREYYO5iRqbMY1YuqZng0GVOI8Qww==}
+    dependencies:
+      '@types/mdast': 3.0.15
+      '@types/unist': 2.0.10
+      decode-named-character-reference: 1.0.2
+      mdast-util-to-string: 3.2.0
+      micromark: 3.2.0
+      micromark-util-decode-numeric-character-reference: 1.1.0
+      micromark-util-decode-string: 1.1.0
+      micromark-util-normalize-identifier: 1.1.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+      unist-util-stringify-position: 3.0.3
+      uvu: 0.5.6
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /mdast-util-from-markdown@2.0.0:
     resolution: {integrity: sha512-n7MTOr/z+8NAX/wmhhDji8O3bRvPTV/U0oTCaZJkjhPSKTPhS3xufVhKGF8s1pJ7Ox4QgoIU7KHseh09S+9rTA==}
     dependencies:
@@ -10722,6 +11193,12 @@ packages:
     resolution: {integrity: sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==}
     dev: true
 
+  /mdast-util-to-string@3.2.0:
+    resolution: {integrity: sha512-V4Zn/ncyN1QNSqSBxTrMOLpjr+IKdHl2v3KVLoWmDPscP4r9GcCi71gjgvUV1SFSKh92AjAG4peFuBl2/YgCJg==}
+    dependencies:
+      '@types/mdast': 3.0.15
+    dev: false
+
   /mdast-util-to-string@4.0.0:
     resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==}
     dependencies:
@@ -10801,6 +11278,33 @@ packages:
     resolution: {integrity: sha512-jz+Cfrg9GWOZbQAnDQ4hlVnQky+341Yk5ru8bZSe6sIDTCIg8n9i/u7hSQGSVOF3C7lH6mGtqjkiT9G4wFLL0w==}
     dev: true
 
+  /mermaid@10.9.0:
+    resolution: {integrity: sha512-swZju0hFox/B/qoLKK0rOxxgh8Cf7rJSfAUc1u8fezVihYMvrJAS45GzAxTVf4Q+xn9uMgitBcmWk7nWGXOs/g==}
+    dependencies:
+      '@braintree/sanitize-url': 6.0.4
+      '@types/d3-scale': 4.0.8
+      '@types/d3-scale-chromatic': 3.0.3
+      cytoscape: 3.28.1
+      cytoscape-cose-bilkent: 4.1.0(cytoscape@3.28.1)
+      d3: 7.9.0
+      d3-sankey: 0.12.3
+      dagre-d3-es: 7.0.10
+      dayjs: 1.11.10
+      dompurify: 3.0.9
+      elkjs: 0.9.2
+      katex: 0.16.9
+      khroma: 2.1.0
+      lodash-es: 4.17.21
+      mdast-util-from-markdown: 1.3.1
+      non-layered-tidy-tree-layout: 2.0.2
+      stylis: 4.3.1
+      ts-dedent: 2.2.0
+      uuid: 9.0.0
+      web-worker: 1.3.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /methods@1.1.2:
     resolution: {integrity: sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==}
     engines: {node: '>= 0.6'}
@@ -10814,6 +11318,27 @@ packages:
     resolution: {integrity: sha512-2tzWP1w2Hh+r7kCYa4f//jpBEA6dAueiuLco38NxfjF9Py3KCCI7wVOTdCvOhmTC043t+ulclVBdl3v+s+UJIQ==}
     dev: false
 
+  /micromark-core-commonmark@1.1.0:
+    resolution: {integrity: sha512-BgHO1aRbolh2hcrzL2d1La37V0Aoz73ymF8rAcKnohLy93titmv62E0gP8Hrx9PKcKrqCZ1BbLGbP3bEhoXYlw==}
+    dependencies:
+      decode-named-character-reference: 1.0.2
+      micromark-factory-destination: 1.1.0
+      micromark-factory-label: 1.1.0
+      micromark-factory-space: 1.1.0
+      micromark-factory-title: 1.1.0
+      micromark-factory-whitespace: 1.1.0
+      micromark-util-character: 1.2.0
+      micromark-util-chunked: 1.1.0
+      micromark-util-classify-character: 1.1.0
+      micromark-util-html-tag-name: 1.2.0
+      micromark-util-normalize-identifier: 1.1.0
+      micromark-util-resolve-all: 1.1.0
+      micromark-util-subtokenize: 1.1.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+      uvu: 0.5.6
+    dev: false
+
   /micromark-core-commonmark@2.0.0:
     resolution: {integrity: sha512-jThOz/pVmAYUtkroV3D5c1osFXAMv9e0ypGDOIZuCeAe91/sD6BoE2Sjzt30yuXtwOYUmySOhMas/PVyh02itA==}
     dependencies:
@@ -10835,6 +11360,14 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-factory-destination@1.1.0:
+    resolution: {integrity: sha512-XaNDROBgx9SgSChd69pjiGKbV+nfHGDPVYFs5dOoDd7ZnMAE+Cuu91BCpsY8RT2NP9vo/B8pds2VQNCLiu0zhg==}
+    dependencies:
+      micromark-util-character: 1.2.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-factory-destination@2.0.0:
     resolution: {integrity: sha512-j9DGrQLm/Uhl2tCzcbLhy5kXsgkHUrjJHg4fFAeoMRwJmJerT9aw4FEhIbZStWN8A3qMwOp1uzHr4UL8AInxtA==}
     dependencies:
@@ -10843,6 +11376,15 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-factory-label@1.1.0:
+    resolution: {integrity: sha512-OLtyez4vZo/1NjxGhcpDSbHQ+m0IIGnT8BoPamh+7jVlzLJBH98zzuCoUeMxvM6WsNeh8wx8cKvqLiPHEACn0w==}
+    dependencies:
+      micromark-util-character: 1.2.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+      uvu: 0.5.6
+    dev: false
+
   /micromark-factory-label@2.0.0:
     resolution: {integrity: sha512-RR3i96ohZGde//4WSe/dJsxOX6vxIg9TimLAS3i4EhBAFx8Sm5SmqVfR8E87DPSR31nEAjZfbt91OMZWcNgdZw==}
     dependencies:
@@ -10852,6 +11394,13 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-factory-space@1.1.0:
+    resolution: {integrity: sha512-cRzEj7c0OL4Mw2v6nwzttyOZe8XY/Z8G0rzmWQZTBi/jjwyw/U4uqKtUORXQrR5bAZZnbTI/feRV/R7hc4jQYQ==}
+    dependencies:
+      micromark-util-character: 1.2.0
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-factory-space@2.0.0:
     resolution: {integrity: sha512-TKr+LIDX2pkBJXFLzpyPyljzYK3MtmllMUMODTQJIUfDGncESaqB90db9IAUcz4AZAJFdd8U9zOp9ty1458rxg==}
     dependencies:
@@ -10859,6 +11408,15 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-factory-title@1.1.0:
+    resolution: {integrity: sha512-J7n9R3vMmgjDOCY8NPw55jiyaQnH5kBdV2/UXCtZIpnHH3P6nHUKaH7XXEYuWwx/xUJcawa8plLBEjMPU24HzQ==}
+    dependencies:
+      micromark-factory-space: 1.1.0
+      micromark-util-character: 1.2.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-factory-title@2.0.0:
     resolution: {integrity: sha512-jY8CSxmpWLOxS+t8W+FG3Xigc0RDQA9bKMY/EwILvsesiRniiVMejYTE4wumNc2f4UbAa4WsHqe3J1QS1sli+A==}
     dependencies:
@@ -10868,6 +11426,15 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-factory-whitespace@1.1.0:
+    resolution: {integrity: sha512-v2WlmiymVSp5oMg+1Q0N1Lxmt6pMhIHD457whWM7/GUlEks1hI9xj5w3zbc4uuMKXGisksZk8DzP2UyGbGqNsQ==}
+    dependencies:
+      micromark-factory-space: 1.1.0
+      micromark-util-character: 1.2.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-factory-whitespace@2.0.0:
     resolution: {integrity: sha512-28kbwaBjc5yAI1XadbdPYHX/eDnqaUFVikLwrO7FDnKG7lpgxnvk/XGRhX/PN0mOZ+dBSZ+LgunHS+6tYQAzhA==}
     dependencies:
@@ -10877,6 +11444,13 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-util-character@1.2.0:
+    resolution: {integrity: sha512-lXraTwcX3yH/vMDaFWCQJP1uIszLVebzUa3ZHdrgxr7KEU/9mL4mVgCpGbyhvNLNlauROiNUq7WN5u7ndbY6xg==}
+    dependencies:
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-util-character@2.1.0:
     resolution: {integrity: sha512-KvOVV+X1yLBfs9dCBSopq/+G1PcgT3lAK07mC4BzXi5E7ahzMAF8oIupDDJ6mievI6F+lAATkbQQlQixJfT3aQ==}
     dependencies:
@@ -10884,12 +11458,26 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-util-chunked@1.1.0:
+    resolution: {integrity: sha512-Ye01HXpkZPNcV6FiyoW2fGZDUw4Yc7vT0E9Sad83+bEDiCJ1uXu0S3mr8WLpsz3HaG3x2q0HM6CTuPdcZcluFQ==}
+    dependencies:
+      micromark-util-symbol: 1.1.0
+    dev: false
+
   /micromark-util-chunked@2.0.0:
     resolution: {integrity: sha512-anK8SWmNphkXdaKgz5hJvGa7l00qmcaUQoMYsBwDlSKFKjc6gjGXPDw3FNL3Nbwq5L8gE+RCbGqTw49FK5Qyvg==}
     dependencies:
       micromark-util-symbol: 2.0.0
     dev: false
 
+  /micromark-util-classify-character@1.1.0:
+    resolution: {integrity: sha512-SL0wLxtKSnklKSUplok1WQFoGhUdWYKggKUiqhX+Swala+BtptGCu5iPRc+xvzJ4PXE/hwM3FNXsfEVgoZsWbw==}
+    dependencies:
+      micromark-util-character: 1.2.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-util-classify-character@2.0.0:
     resolution: {integrity: sha512-S0ze2R9GH+fu41FA7pbSqNWObo/kzwf8rN/+IGlW/4tC6oACOs8B++bh+i9bVyNnwCcuksbFwsBme5OCKXCwIw==}
     dependencies:
@@ -10898,6 +11486,13 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-util-combine-extensions@1.1.0:
+    resolution: {integrity: sha512-Q20sp4mfNf9yEqDL50WwuWZHUrCO4fEyeDCnMGmG5Pr0Cz15Uo7KBs6jq+dq0EgX4DPwwrh9m0X+zPV1ypFvUA==}
+    dependencies:
+      micromark-util-chunked: 1.1.0
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-util-combine-extensions@2.0.0:
     resolution: {integrity: sha512-vZZio48k7ON0fVS3CUgFatWHoKbbLTK/rT7pzpJ4Bjp5JjkZeasRfrS9wsBdDJK2cJLHMckXZdzPSSr1B8a4oQ==}
     dependencies:
@@ -10905,12 +11500,27 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-util-decode-numeric-character-reference@1.1.0:
+    resolution: {integrity: sha512-m9V0ExGv0jB1OT21mrWcuf4QhP46pH1KkfWy9ZEezqHKAxkj4mPCy3nIH1rkbdMlChLHX531eOrymlwyZIf2iw==}
+    dependencies:
+      micromark-util-symbol: 1.1.0
+    dev: false
+
   /micromark-util-decode-numeric-character-reference@2.0.1:
     resolution: {integrity: sha512-bmkNc7z8Wn6kgjZmVHOX3SowGmVdhYS7yBpMnuMnPzDq/6xwVA604DuOXMZTO1lvq01g+Adfa0pE2UKGlxL1XQ==}
     dependencies:
       micromark-util-symbol: 2.0.0
     dev: false
 
+  /micromark-util-decode-string@1.1.0:
+    resolution: {integrity: sha512-YphLGCK8gM1tG1bd54azwyrQRjCFcmgj2S2GoJDNnh4vYtnL38JS8M4gpxzOPNyHdNEpheyWXCTnnTDY3N+NVQ==}
+    dependencies:
+      decode-named-character-reference: 1.0.2
+      micromark-util-character: 1.2.0
+      micromark-util-decode-numeric-character-reference: 1.1.0
+      micromark-util-symbol: 1.1.0
+    dev: false
+
   /micromark-util-decode-string@2.0.0:
     resolution: {integrity: sha512-r4Sc6leeUTn3P6gk20aFMj2ntPwn6qpDZqWvYmAG6NgvFTIlj4WtrAudLi65qYoaGdXYViXYw2pkmn7QnIFasA==}
     dependencies:
@@ -10920,26 +11530,54 @@ packages:
       micromark-util-symbol: 2.0.0
     dev: false
 
+  /micromark-util-encode@1.1.0:
+    resolution: {integrity: sha512-EuEzTWSTAj9PA5GOAs992GzNh2dGQO52UvAbtSOMvXTxv3Criqb6IOzJUBCmEqrrXSblJIJBbFFv6zPxpreiJw==}
+    dev: false
+
   /micromark-util-encode@2.0.0:
     resolution: {integrity: sha512-pS+ROfCXAGLWCOc8egcBvT0kf27GoWMqtdarNfDcjb6YLuV5cM3ioG45Ys2qOVqeqSbjaKg72vU+Wby3eddPsA==}
     dev: false
 
+  /micromark-util-html-tag-name@1.2.0:
+    resolution: {integrity: sha512-VTQzcuQgFUD7yYztuQFKXT49KghjtETQ+Wv/zUjGSGBioZnkA4P1XXZPT1FHeJA6RwRXSF47yvJ1tsJdoxwO+Q==}
+    dev: false
+
   /micromark-util-html-tag-name@2.0.0:
     resolution: {integrity: sha512-xNn4Pqkj2puRhKdKTm8t1YHC/BAjx6CEwRFXntTaRf/x16aqka6ouVoutm+QdkISTlT7e2zU7U4ZdlDLJd2Mcw==}
     dev: false
 
+  /micromark-util-normalize-identifier@1.1.0:
+    resolution: {integrity: sha512-N+w5vhqrBihhjdpM8+5Xsxy71QWqGn7HYNUvch71iV2PM7+E3uWGox1Qp90loa1ephtCxG2ftRV/Conitc6P2Q==}
+    dependencies:
+      micromark-util-symbol: 1.1.0
+    dev: false
+
   /micromark-util-normalize-identifier@2.0.0:
     resolution: {integrity: sha512-2xhYT0sfo85FMrUPtHcPo2rrp1lwbDEEzpx7jiH2xXJLqBuy4H0GgXk5ToU8IEwoROtXuL8ND0ttVa4rNqYK3w==}
     dependencies:
       micromark-util-symbol: 2.0.0
     dev: false
 
+  /micromark-util-resolve-all@1.1.0:
+    resolution: {integrity: sha512-b/G6BTMSg+bX+xVCshPTPyAu2tmA0E4X98NSR7eIbeC6ycCqCeE7wjfDIgzEbkzdEVJXRtOG4FbEm/uGbCRouA==}
+    dependencies:
+      micromark-util-types: 1.1.0
+    dev: false
+
   /micromark-util-resolve-all@2.0.0:
     resolution: {integrity: sha512-6KU6qO7DZ7GJkaCgwBNtplXCvGkJToU86ybBAUdavvgsCiG8lSSvYxr9MhwmQ+udpzywHsl4RpGJsYWG1pDOcA==}
     dependencies:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-util-sanitize-uri@1.2.0:
+    resolution: {integrity: sha512-QO4GXv0XZfWey4pYFndLUKEAktKkG5kZTdUNaTAkzbuJxn2tNBOr+QtxR2XpWaMhbImT2dPzyLrPXLlPhph34A==}
+    dependencies:
+      micromark-util-character: 1.2.0
+      micromark-util-encode: 1.1.0
+      micromark-util-symbol: 1.1.0
+    dev: false
+
   /micromark-util-sanitize-uri@2.0.0:
     resolution: {integrity: sha512-WhYv5UEcZrbAtlsnPuChHUAsu/iBPOVaEVsntLBIdpibO0ddy8OzavZz3iL2xVvBZOpolujSliP65Kq0/7KIYw==}
     dependencies:
@@ -10948,6 +11586,15 @@ packages:
       micromark-util-symbol: 2.0.0
     dev: false
 
+  /micromark-util-subtokenize@1.1.0:
+    resolution: {integrity: sha512-kUQHyzRoxvZO2PuLzMt2P/dwVsTiivCK8icYTeR+3WgbuPqfHgPPy7nFKbeqRivBvn/3N3GBiNC+JRTMSxEC7A==}
+    dependencies:
+      micromark-util-chunked: 1.1.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+      uvu: 0.5.6
+    dev: false
+
   /micromark-util-subtokenize@2.0.0:
     resolution: {integrity: sha512-vc93L1t+gpR3p8jxeVdaYlbV2jTYteDje19rNSS/H5dlhxUYll5Fy6vJ2cDwP8RnsXi818yGty1ayP55y3W6fg==}
     dependencies:
@@ -10957,10 +11604,18 @@ packages:
       micromark-util-types: 2.0.0
     dev: false
 
+  /micromark-util-symbol@1.1.0:
+    resolution: {integrity: sha512-uEjpEYY6KMs1g7QfJ2eX1SQEV+ZT4rUD3UcF6l57acZvLNK7PBZL+ty82Z1qhK1/yXIY4bdx04FKMgR0g4IAag==}
+    dev: false
+
   /micromark-util-symbol@2.0.0:
     resolution: {integrity: sha512-8JZt9ElZ5kyTnO94muPxIGS8oyElRJaiJO8EzV6ZSyGQ1Is8xwl4Q45qU5UOg+bGH4AikWziz0iN4sFLWs8PGw==}
     dev: false
 
+  /micromark-util-types@1.1.0:
+    resolution: {integrity: sha512-ukRBgie8TIAcacscVHSiddHjO4k/q3pnedmzMQ4iwDcK0FtFCohKOlFbaOL/mPgfnPsL3C1ZyxJa4sbWrBl3jg==}
+    dev: false
+
   /micromark-util-types@2.0.0:
     resolution: {integrity: sha512-oNh6S2WMHWRZrmutsRmDDfkzKtxF+bc2VxLC9dvtrDIRFln627VsFP6fLMgTryGDljgLPjkrzQSDcPrjPyDJ5w==}
     dev: false
@@ -10974,6 +11629,30 @@ packages:
       - supports-color
     dev: true
 
+  /micromark@3.2.0:
+    resolution: {integrity: sha512-uD66tJj54JLYq0De10AhWycZWGQNUvDI55xPgk2sQM5kn1JYlhbCMTtEeT27+vAhW2FBQxLlOmS3pmA7/2z4aA==}
+    dependencies:
+      '@types/debug': 4.1.12
+      debug: 4.3.4(supports-color@9.2.2)
+      decode-named-character-reference: 1.0.2
+      micromark-core-commonmark: 1.1.0
+      micromark-factory-space: 1.1.0
+      micromark-util-character: 1.2.0
+      micromark-util-chunked: 1.1.0
+      micromark-util-combine-extensions: 1.1.0
+      micromark-util-decode-numeric-character-reference: 1.1.0
+      micromark-util-encode: 1.1.0
+      micromark-util-normalize-identifier: 1.1.0
+      micromark-util-resolve-all: 1.1.0
+      micromark-util-sanitize-uri: 1.2.0
+      micromark-util-subtokenize: 1.1.0
+      micromark-util-symbol: 1.1.0
+      micromark-util-types: 1.1.0
+      uvu: 0.5.6
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /micromark@4.0.0:
     resolution: {integrity: sha512-o/sd0nMof8kYff+TqcDx3VSrgBTcZpSvYcAHIfHhv5VAuNmisCxjhx6YmxS8PFEpb9z5WKWKPdzf0jM23ro3RQ==}
     dependencies:
@@ -11562,6 +12241,10 @@ packages:
       semver: 7.6.0
     dev: false
 
+  /non-layered-tidy-tree-layout@2.0.2:
+    resolution: {integrity: sha512-gkXMxRzUH+PB0ax9dUN0yYF0S25BqeAYqhgMaLUFmpXLEk7Fcu8f4emJuOAY0V8kjDICxROIKsTAKsV/v355xw==}
+    dev: false
+
   /noop2@2.0.0:
     resolution: {integrity: sha512-2bu7Pfpf6uNqashWV8P7yYeutQ3XkLY9MBSYI5sOAFZxuWcW/uJfLbKj5m6SvMDT9U1Y0C+7UFG+7VSiIdXjtA==}
     dev: false
@@ -12618,6 +13301,12 @@ packages:
     engines: {node: '>= 0.6'}
     dev: false
 
+  /raphael@2.3.0:
+    resolution: {integrity: sha512-w2yIenZAQnp257XUWGni4bLMVxpUpcIl7qgxEgDIXtmSypYtlNxfXWpOBxs7LBTps5sDwhRnrToJrMUrivqNTQ==}
+    dependencies:
+      eve-raphael: 0.5.0
+    dev: false
+
   /raw-body@2.5.1:
     resolution: {integrity: sha512-qqJBtEyVgS0ZmPGdCFPWJ3FreoqvG4MVQln/kCgF7Olq95IbOp0/BWyMwbdtn4VTvkM8Y7khCQ2Xgk/tcrCXig==}
     engines: {node: '>= 0.8'}
@@ -13023,6 +13712,10 @@ packages:
       glob: 10.3.10
     dev: true
 
+  /robust-predicates@3.0.2:
+    resolution: {integrity: sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==}
+    dev: false
+
   /rollup@4.12.0:
     resolution: {integrity: sha512-wz66wn4t1OHIJw3+XU7mJJQV/2NAfw5OAk6G6Hoo3zcvz/XOfQ52Vgi+AN4Uxoxi0KBBwk2g8zPrTDA4btSB/Q==}
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
@@ -13077,6 +13770,10 @@ packages:
     dependencies:
       queue-microtask: 1.2.3
 
+  /rw@1.3.3:
+    resolution: {integrity: sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==}
+    dev: false
+
   /rxjs@6.6.7:
     resolution: {integrity: sha512-hTdwr+7yYNIT5n4AMYp85KA6yw2Va0FLa3Rguvbpa4W3I5xynaBZo41cM3XM+4Q6fRMj3sBYIR1VAmZMXYJvRQ==}
     engines: {npm: '>=2.0.0'}
@@ -13087,7 +13784,7 @@ packages:
   /rxjs@7.8.0:
     resolution: {integrity: sha512-F2+gxDshqmIub1KdvZkaEfGDwLNpPvk9Fs6LD/MyQxNgMds/WH9OdDDXOmxUZpME+iSK3rQCctkL0DYyytUqMg==}
     dependencies:
-      tslib: 2.4.1
+      tslib: 2.5.3
     dev: true
 
   /rxjs@7.8.1:
@@ -13096,6 +13793,13 @@ packages:
       tslib: 2.5.3
     dev: true
 
+  /sade@1.8.1:
+    resolution: {integrity: sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==}
+    engines: {node: '>=6'}
+    dependencies:
+      mri: 1.2.0
+    dev: false
+
   /safe-buffer@5.1.2:
     resolution: {integrity: sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==}
     dev: false
@@ -13883,6 +14587,10 @@ packages:
       - typescript
     dev: true
 
+  /stylis@4.3.1:
+    resolution: {integrity: sha512-EQepAV+wMsIaGVGX1RECzgrcqRRU/0sYOHkeLsZ3fzHaHXZy4DaOOX0vOlGQdlsjkh3mFHAIlVimpwAs4dslyQ==}
+    dev: false
+
   /subarg@1.0.0:
     resolution: {integrity: sha512-RIrIdRY0X1xojthNcVtgT9sjpOGagEUKpZdgBUi054OEPFo282yg+zE+t1Rj3+RqKq2xStL7uUHhY+AjbC4BXg==}
     dependencies:
@@ -14272,6 +14980,11 @@ packages:
     resolution: {integrity: sha512-+1iDGY6NmOGidq7i7xZGA4cm8DAa6fqdYcvO5Z6yBevH++Bdo9Qt/mN0TzHUgcCcKv1gmh9+W5dHqz8pMWbCbg==}
     dev: false
 
+  /ts-dedent@2.2.0:
+    resolution: {integrity: sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==}
+    engines: {node: '>=6.10'}
+    dev: false
+
   /ts-node@10.9.2(@types/node@20.11.27)(typescript@5.4.2):
     resolution: {integrity: sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==}
     hasBin: true
@@ -14311,14 +15024,18 @@ packages:
     resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}
     dev: false
 
-  /tslib@2.4.1:
-    resolution: {integrity: sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==}
-    dev: true
+  /tslib@2.3.0:
+    resolution: {integrity: sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==}
+    dev: false
 
   /tslib@2.5.3:
     resolution: {integrity: sha512-mSxlJJwl3BMEQCUNnxXBU9jP4JBktcEGhURcPR6VQVlnP0FdDEsIaz0C35dXNGLyRfrATNofF0F5p2KPxQgB+w==}
     dev: true
 
+  /tslib@2.6.2:
+    resolution: {integrity: sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==}
+    dev: false
+
   /tsutils@3.21.0(typescript@5.4.2):
     resolution: {integrity: sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==}
     engines: {node: '>= 6'}
@@ -14543,6 +15260,12 @@ packages:
       '@types/unist': 2.0.10
     dev: true
 
+  /unist-util-stringify-position@3.0.3:
+    resolution: {integrity: sha512-k5GzIBZ/QatR8N5X2y+drfpWG8IDBzdnVj6OInRNWm1oXrzydiaAT2OQiA8DPRRZyAKb9b6I2a6PxYklZD0gKg==}
+    dependencies:
+      '@types/unist': 2.0.10
+    dev: false
+
   /unist-util-stringify-position@4.0.0:
     resolution: {integrity: sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==}
     dependencies:
@@ -14751,6 +15474,17 @@ packages:
     hasBin: true
     dev: false
 
+  /uvu@0.5.6:
+    resolution: {integrity: sha512-+g8ENReyr8YsOc6fv/NVJs2vFdHBnBNdfE49rshrTzDWOlUx4Gq7KOS2GD8eqhy2j+Ejq29+SbKH8yjkAqXqoA==}
+    engines: {node: '>=8'}
+    hasBin: true
+    dependencies:
+      dequal: 2.0.3
+      diff: 5.2.0
+      kleur: 4.1.5
+      sade: 1.8.1
+    dev: false
+
   /v8-compile-cache-lib@3.0.1:
     resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==}
     dev: false
@@ -14933,36 +15667,6 @@ packages:
       typescript: 5.4.2
     dev: false
 
-  /vuepress-plugin-comment2@2.0.0-rc.25(typescript@5.4.2)(vuepress@2.0.0-rc.8):
-    resolution: {integrity: sha512-mLqsCJLHxDnVdRuRdgFIgO7eCKEk01NiTAXy23y261xxlrQkY0VALE1UtE58ikyOgPAfiPWzwQkQLqQ45Hzfaw==}
-    engines: {node: '>=18.16.0', npm: '>=8', pnpm: '>=7', yarn: '>=2'}
-    peerDependencies:
-      '@waline/client': ^3.1.0
-      artalk: ^2.7.3
-      sass-loader: ^14.0.0
-      twikoo: ^1.5.0
-      vuepress: 2.0.0-rc.8
-    peerDependenciesMeta:
-      '@waline/client':
-        optional: true
-      artalk:
-        optional: true
-      sass-loader:
-        optional: true
-      twikoo:
-        optional: true
-    dependencies:
-      '@vuepress/helper': 2.0.0-rc.15(typescript@5.4.2)(vuepress@2.0.0-rc.8)
-      giscus: 1.5.0
-      vue: 3.4.21(typescript@5.4.2)
-      vuepress: 2.0.0-rc.8(@vuepress/bundler-vite@2.0.0-rc.8)(typescript@5.4.2)(vue@3.4.21)
-      vuepress-plugin-sass-palette: 2.0.0-rc.25(typescript@5.4.2)(vuepress@2.0.0-rc.8)
-      vuepress-shared: 2.0.0-rc.25(typescript@5.4.2)(vuepress@2.0.0-rc.8)
-    transitivePeerDependencies:
-      - '@vue/composition-api'
-      - typescript
-    dev: false
-
   /vuepress-plugin-md-enhance@2.0.0-rc.25(katex@0.16.9)(markdown-it@14.0.0)(typescript@5.4.2)(vuepress@2.0.0-rc.8):
     resolution: {integrity: sha512-zmwWCk92S0yQL/uCF6l5YV1Zm2lsGjL9XJZVHEOVY1guXNfnvc92O0gf1dN9E4v+8henIFag5fluMrsfrUP8UQ==}
     engines: {node: '>=18.16.0', npm: '>=8', pnpm: '>=7', yarn: '>=2'}
@@ -15142,6 +15846,10 @@ packages:
     engines: {node: '>= 8'}
     dev: false
 
+  /web-worker@1.3.0:
+    resolution: {integrity: sha512-BSR9wyRsy/KOValMgd5kMyr3JzpdeoR9KVId8u5GVlTTAtNChlsE4yTxeY7zMdNSyOmoKBv8NH2qeRY9Tg+IaA==}
+    dev: false
+
   /webidl-conversions@3.0.1:
     resolution: {integrity: sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==}
     dev: false
@@ -15401,6 +16109,12 @@ packages:
     resolution: {integrity: sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==}
     dev: false
 
+  /zrender@5.5.0:
+    resolution: {integrity: sha512-O3MilSi/9mwoovx77m6ROZM7sXShR/O/JIanvzTwjN3FORfLSr81PsUGd7jlaYOeds9d8tw82oP44+3YucVo+w==}
+    dependencies:
+      tslib: 2.3.0
+    dev: false
+
   /zwitch@2.0.4:
     resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
     dev: false