From 0b9e547458555c00828d1aedde71475de86099f1 Mon Sep 17 00:00:00 2001
From: Li Jin <dragon-fly@qq.com>
Date: Wed, 24 Jan 2024 11:46:51 +0800
Subject: [PATCH] update docs. [skip CI]

---
 .../tutorial/Using Dora Xml/dora-xml-ui-1.mdx |  20 +-
 .../tutorial/Using Dora Xml/dora-xml-ui-2.mdx |  10 +-
 Site/docs/tutorial/dev-configuration.md       |   6 +-
 Site/docs/tutorial/quick-start.mdx            |  81 ++-
 .../tutorial/Using Dora Xml/dora-xml-ui-1.mdx |  24 +-
 .../tutorial/Using Dora Xml/dora-xml-ui-2.mdx |  18 +-
 .../current/tutorial/dev-configuration.md     |   6 +-
 .../current/tutorial/quick-start.mdx          |  39 +-
 Site/package.json                             |   6 +-
 Site/yarn.lock                                | 468 +++++++++++++-----
 Tools/dora-dora/src/App.tsx                   |   2 +-
 Tools/dora-dora/src/NewFileDialog.tsx         |   6 +-
 Tools/dora-dora/src/i18n.ts                   |   2 +-
 13 files changed, 492 insertions(+), 196 deletions(-)

diff --git a/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-1.mdx b/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-1.mdx
index 38bc6466d..c3607ac62 100644
--- a/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-1.mdx	
+++ b/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-1.mdx	
@@ -2,11 +2,15 @@ import "@site/src/languages/highlight";
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
-# Using Dora Xml for UI Development I
+# Using Dora XML for UI Development I
 
-Dora SSR provides a functionality called Dora Xml, which helps separate the graphical presentation and logical processing code. The core functionality of Dora Xml is to write code for graphical presentation and interaction, especially code focused on user display in game UI interfaces, using an XML markup language, similar to HTML in web pages. Creating UI components, setting layout dimensions and appearance colors, creating interactive animations, and UI animations triggered by events can all be organized and written in the Dora Xml language. Dora Xml mostly complies with the XML specification, but with some modifications and additions, including many predefined tags and the ability to create custom tags.
+Dora SSR provides a functionality called Dora XML, which helps separate the graphical presentation and logical processing code. The core functionality of Dora XML is to write code for graphical presentation and interaction, especially code focused on user display in game UI interfaces, using an XML markup language, similar to HTML in web pages. Creating UI components, setting layout dimensions and appearance colors, creating interactive animations, and UI animations triggered by events can all be organized and written in the Dora XML language. Dora XML mostly complies with the XML specification, but with some modifications and additions, including many predefined tags and the ability to create custom tags.
 
-To write Dora Xml, you can create and edit code files in the web IDE provided by Dora SSR to benefit from features such as syntax highlighting, code completion, and error checking, which make the writing process much more easier. Now let's see how to use Dora Xml to write a custom button component.
+:::tip Use Dora TSX instead
+Currently Dora SSR also provides a solution to use TSX to write game scenes or UI interfaces. It can provide better code editor auxiliary functions through Typescript language and offers more detailed syntax static checking. However, using The TSX solution will slightly decrease performance. If you do not encounter performance problems, it is recommended to use Dora TSX instead of Dora XML.
+:::
+
+To write Dora XML, you can create and edit code files in the web IDE provided by Dora SSR to benefit from features such as syntax highlighting, code completion, and error checking, which make the writing process much more easier. Now let's see how to use Dora XML to write a custom button component.
 
 First, let's design our button:
 
@@ -16,7 +20,7 @@ First, let's design our button:
 * The appearance of the button should change when a click event is triggered.
 * As an independent control, it should be reusable in multiple places and support adjusting displays with different parameters.
 
-Now we can start our Dora Xml coding.
+Now we can start our Dora XML coding.
 
 ### 1. Creating a Clickable Area
 
@@ -131,7 +135,7 @@ We use the `<Import>` tag to import the XML module. The `Module` attribute of Im
 
 The Import module can have additional attributes. Apart from the special-purpose built-in attributes Name and Ref (Ref="True" allows accessing the module object through the root node variable, and Name is used for subsequent code references), any other attributes set will be passed as lowercase parameter variables into the module internally. So be sure to fill in the required parameter variables in the module.
 
-This way, our custom button is complete. Loading and running a Dora Xml file is straightforward; you can directly load it like a regular Lua file. For example:
+This way, our custom button is complete. Loading and running a Dora XML file is straightforward; you can directly load it like a regular Lua file. For example:
 
 ```lua
 local Director = require("Director")
@@ -167,11 +171,11 @@ return function()
 end
 ```
 
-In fact, Dora Xml is compiled into Lua code for execution. The above code is the result of compiling MainScene.xml. However, writing Lua code logic using XML tags provides a clearer code structure and improves the maintainability of the program.
+In fact, Dora XML is compiled into Lua code for execution. The above code is the result of compiling MainScene.xml. However, writing Lua code logic using XML tags provides a clearer code structure and improves the maintainability of the program.
 
 ### 7. Creating a Button Template
 
-If we want to create buttons with different appearances but similar functionality, we can create a reusable template for certain fixed button functionalities. In Dora Xml, we can modify the previously written button into such a template.
+If we want to create buttons with different appearances but similar functionality, we can create a reusable template for certain fixed button functionalities. In Dora XML, we can modify the previously written button into such a template.
 
 ```xml title="ButtonBase.xml"
 <!-- params: X, Y, Width, Height, Text, FontSize -->
@@ -201,7 +205,7 @@ local buttonBase = ButtonBase()
 print(buttonBase.face) -- This will give you access to the face node
 ```
 
-Next, we can use this template in Dora Xml:
+Next, we can use this template in Dora XML:
 
 ```xml title="SpriteButton.xml"
 <!-- params: X, Y, Text -->
diff --git a/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-2.mdx b/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-2.mdx
index e97a919f3..7c2c91fc0 100644
--- a/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-2.mdx	
+++ b/Site/docs/tutorial/Using Dora Xml/dora-xml-ui-2.mdx	
@@ -2,9 +2,9 @@ import "@site/src/languages/highlight";
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
-# Using Dora Xml for UI Development II
+# Using Dora XML for UI Development II
 
-After defining the graphical UI using Dora Xml, the next problem to solve is how to add handling logic for UI interactions. We can use the class mechanism of Dora SSR to write a new class that inherits from the Xml UI component and contains the interface logic for the UI. For example, we have a button Xml component.
+After defining the graphical UI using Dora XML, the next problem to solve is how to add handling logic for UI interactions. We can use the class mechanism of Dora SSR to write a new class that inherits from the XML UI component and contains the interface logic for the UI. For example, we have a button XML component.
 
 ```xml title="ButtonView.xml"
 <!-- params: X, Y, Radius, Text, FontSize -->
@@ -75,7 +75,7 @@ The business logic we added to the button mainly includes a feature to count the
 
 ```xml title="MainSceneView.xml"
 <Node>
-	<Import Module="Button"/><!-- Import the Lua module directly in Xml -->
+	<Import Module="Button"/><!-- Import the Lua module directly in XML -->
 
 	<Menu X="100" Y="100" Width="100" Height="100">
 		<Button X="25" Y="25" Radius="50" Text="Click"
@@ -112,11 +112,11 @@ local MainScene = require("MainScene")
 Director.entry:addChild(MainScene())
 ```
 
-This way, the organization of our program logic for UI development is more complete. We use Dora Xml to manage the appearance of the UI, and then write the UI logic in Lua classes. Now the appearance definition of UI components and the code for business logic can be developed and maintained in separate files.
+This way, the organization of our program logic for UI development is more complete. We use Dora XML to manage the appearance of the UI, and then write the UI logic in Lua classes. Now the appearance definition of UI components and the code for business logic can be developed and maintained in separate files.
 
 ## Writing UI Logic with Yuescript
 
-With Dora Xml simplifying the UI code, we can further introduce a new language called Yuescript for development. Yuescript is a language that compiles into Lua and can seamlessly integrate with Lua. Its main feature is concise and easy-to-maintain code. Let's see how to use Yuescript together with Dora Xml to write business logic. The code from the previous section can be written in Yuescript as follows:
+With Dora XML simplifying the UI code, we can further introduce a new language called Yuescript for development. Yuescript is a language that compiles into Lua and can seamlessly integrate with Lua. Its main feature is concise and easy-to-maintain code. Let's see how to use Yuescript together with Dora XML to write business logic. The code from the previous section can be written in Yuescript as follows:
 
 ```yue title="Button.yue"
 _ENV = Dora!
diff --git a/Site/docs/tutorial/dev-configuration.md b/Site/docs/tutorial/dev-configuration.md
index 4268b79e6..fd3c28c33 100644
--- a/Site/docs/tutorial/dev-configuration.md
+++ b/Site/docs/tutorial/dev-configuration.md
@@ -95,8 +95,10 @@ git clone https://github.com/ippclub/Dora-SSR.git
 2. Install the latest version of **Node.js**.
 3. Initialize the project and enter the Dora Dora editor development mode.
    ```sh
-   cd Tools/YarnEditor && yarn && yarn build && rm -rf ../dora-dora/public/yarn-editor && mv dist ../dora-dora/public/yarn-editor && cd ../..
-   cd Tools/dora-dora
+   cd Tools/YarnEditor && yarn && yarn build
+   rm -rf ../dora-dora/public/yarn-editor
+   mv dist ../dora-dora/public/yarn-editor
+   cd ../../Tools/dora-dora
    yarn
    yarn start
    ```
diff --git a/Site/docs/tutorial/quick-start.mdx b/Site/docs/tutorial/quick-start.mdx
index 2601fc28e..3f0e4e0b5 100644
--- a/Site/docs/tutorial/quick-start.mdx
+++ b/Site/docs/tutorial/quick-start.mdx
@@ -30,28 +30,57 @@ import TabItem from '@theme/TabItem';
    - In the browser, open the right-click menu of the game resource tree on the left side of the Dora Dora editor.
    - Click the `New` menu item, select "New Folder", and name it `Hello`.
 2. Step Two: Write the game code
-   - Create a new game entry code file in the project folder, select the Yuescript language (or Teal, Lua), and name it `init`.
+   - Create a new game entry code file in the project folder, select the Yuescript language (or Teal, Lua, Typescript), and name it `init`.
    - Write the code:
 
 <Tabs>
+<TabItem value="tsx" label="TSX">
+
+```tsx title="Hello/init.tsx"
+// @preview-file on
+import { React, toNode, useRef } from 'dora-x';
+import { Ease, Move, Sprite } from 'dora';
+
+const sprite = useRef<Sprite.Type>();
+
+// create the root node of the game scene tree
+// and a sprite as a child node
+toNode(
+	<node onTapBegan={(touch) => {
+			const sp = sprite.current;
+			if (sp) {
+				sp.perform(Move(
+					1, // duration in seconds
+					sp.position, // start position
+					touch.location, // end position
+					Ease.OutBack // easing function
+				));
+			}
+		}}>
+		<sprite ref={sprite} file='Image/logo.png'/>
+	</node>
+);
+```
+
+</TabItem>
 <TabItem value="yue" label="Yuescript">
 
 ```yue title="Hello/init.yue"
--- Import modules
+-- import modules
 _ENV = Dora!
 
--- Create a sprite
+-- create a sprite
 sprite = Sprite "Image/logo.png"
 
--- Create the root node of the game scene tree
+-- create the root node of the game scene tree
 with Node!
 
-	-- Mount the sprite to the root node
+	-- mount the sprite to the root node
 	\addChild sprite
 
-	-- Receive and process click events to move the sprite
+	-- receive and process click events to move the sprite
 	.touchEnabled = true
-	\slot "Tapped", (touch)->
+	\slot "TapBegan", (touch)->
 		sprite\perform Move(
 			1 -- duration in seconds
 			sprite.position -- start position
@@ -64,24 +93,24 @@ with Node!
 <TabItem value="lua" label="Lua">
 
 ```lua title="Hello/init.lua"
--- Import modules
+-- import modules
 local Sprite <const> = require("Sprite")
 local Node <const> = require("Node")
 local Move <const> = require("Move")
 local Ease <const> = require("Ease")
 
--- Create a sprite
+-- create a sprite
 local sprite = Sprite("Image/logo.png")
 
--- Create the root node of the game scene tree
+-- create the root node of the game scene tree
 local root = Node!
 
--- Mount the sprite to the root node
+-- mount the sprite to the root node
 root:addChild(sprite)
 
--- Receive and process click events to move the sprite
+-- receive and process click events to move the sprite
 root.touchEnabled = true
-root:slot("Tapped", function(touch)
+root:slot("TapBegan", function(touch)
 	sprite:perform(Move(
 		1, -- duration in seconds
 		sprite.position, -- start position
@@ -95,25 +124,25 @@ end)
 <TabItem value="tl" label="Teal">
 
 ```tl title="Hello/init.tl"
--- Import modules
+-- import modules
 local Sprite <const> = require("Sprite")
 local Node <const> = require("Node")
 local Move <const> = require("Move")
 local Ease <const> = require("Ease")
 local type Touch = require("TouchType")
 
--- Create a sprite
+-- create a sprite
 local sprite = Sprite("Image/logo.png")
 
--- Create the root node of the game scene tree
+-- create the root node of the game scene tree
 local root = Node!
 
--- Mount the sprite to the root node
+-- mount the sprite to the root node
 root:addChild(sprite)
 
--- Receive and process click events to move the sprite
+-- receive and process click events to move the sprite
 root.touchEnabled = true
-root:slot("Tapped", function(touch: Touch)
+root:slot("TapBegan", function(touch: Touch)
 	sprite:perform(Move(
 		1, -- duration in seconds
 		sprite.position, -- start position
@@ -125,22 +154,23 @@ end)
 
 </TabItem>
 <TabItem value="ts" label="Typescript">
+
 ```ts title="Hello/init.ts"
-// Import modules
+// import modules
 import {Ease, Move, Node, Slot, Sprite} from 'dora';
 
-// Create a sprite
+// create a sprite
 const sprite = Sprite("Image/logo.png");
 
-// Create the root node of the game scene tree
+// create the root node of the game scene tree
 const root = Node();
 
-// Mount the sprite to the root node
+// mount the sprite to the root node
 root.addChild(sprite);
 
-// Receive and process click events to move the sprite
+// receive and process click events to move the sprite
 root.touchEnabled = true;
-root.slot(Slot.Tapped, touch => {
+root.slot(Slot.TapBegan, touch => {
 	sprite.perform(
 		Move(
 			1, // duration in seconds
@@ -151,6 +181,7 @@ root.slot(Slot.Tapped, touch => {
 	);
 });
 ```
+
 </TabItem>
 </Tabs>
 
diff --git a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-1.mdx b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-1.mdx
index e7cd2e101..63416dce6 100644
--- a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-1.mdx	
+++ b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-1.mdx	
@@ -2,11 +2,15 @@ import "@site/src/languages/highlight";
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
-# 使用 Dora Xml 编写 UI 1
+# 使用 Dora XML 编写 UI 1
 
-&emsp;&emsp;Dora SSR 提供了一个可以帮助做图形展示与逻辑处理代码做一些开发分离的功能框架，叫做Dora Xml。Dora Xml的核心功能就是把图形展示和交互的代码，特别是一些游戏UI界面中的关注于用户展示的代码用Xml标记语言来编写，就像Web网页中的HTML语言类似的定位。像创建UI组件，设置布局尺寸、颜色外观，创建交互动画和UI动画响应消息事件，都可以只用Dora Xml语言来组织和完成编写。Dora Xml基本符合Xml规范，但也稍微做了些修改，有很多预定义的标签，也可以自定义新的标签。
+&emsp;&emsp;Dora SSR 提供了一个可以帮助做图形展示与逻辑处理代码做一些开发分离的功能框架，叫做 Dora XML。Dora XML 的核心功能就是把图形展示和交互的代码，特别是一些游戏 UI 界面中的关注于用户展示的代码用 XML 标记语言来编写，就像 Web 网页中的 HTML 语言类似的定位。像创建 UI 组件，设置布局尺寸、颜色外观，创建交互动画和 UI 动画响应消息事件，都可以只用 Dora XML 语言来组织和完成编写。Dora XML 基本符合 XML 规范，但也稍微做了些修改，有很多预定义的标签，也可以自定义新的标签。
 
-&emsp;&emsp;编写Dora Xml，只要在 Dora SSR 自带的 Web IDE 中创建和编辑代码文件，就可以获得语法高亮、代码补全和一些错误检查的功能，写起来就能省力一些。下面我们来看看怎么用 Dora Xml 写一个自定义的按钮组件吧。
+:::tip 使用 Dora TSX 作为替代
+&emsp;&emsp;目前 Dora SSR 也提供了使用 TSX 来编写游戏场景或是 UI 界面的方案，可以通过 Typescript 语言来提供更好的代码编辑器辅助功能，并获得更细致的语法静态检查功能，但是使用 TSX 的方案也会稍微增加一些性能消耗，如果没有遇到性能瓶颈的问题，推荐优先使用 Dora TSX 的功能来代替 Dora XML。
+:::
+
+&emsp;&emsp;编写 Dora XML，只要在 Dora SSR 自带的 Web IDE 中创建和编辑代码文件，就可以获得语法高亮、代码补全和一些错误检查的功能，写起来就能省力一些。下面我们来看看怎么用 Dora XML 写一个自定义的按钮组件吧。
 
 &emsp;&emsp;先简单地设计一下我们的按钮：
 
@@ -83,7 +87,7 @@ import TabItem from '@theme/TabItem';
 </Node>
 ```
 
-&emsp;&emsp;用`<Slot>`标签添加对按钮点击事件的监听，并在处理事件时执行相应的动作。执行动作的对象为绘图的节点，所以为了在事件标签中引用它，所以给它添加了`Name`的属性。其实在`<Slot>`标签里还可以内嵌代码，可以支持`<Lua>`或是`<Yue>`标签在任意位置插入并执行一段代码，这些标签中可以编写的代码不限行数与内容，也不用担心`>`和`<`操作符影响Xml标签解析的问题。
+&emsp;&emsp;用`<Slot>`标签添加对按钮点击事件的监听，并在处理事件时执行相应的动作。执行动作的对象为绘图的节点，所以为了在事件标签中引用它，所以给它添加了`Name`的属性。其实在`<Slot>`标签里还可以内嵌代码，可以支持`<Lua>`或是`<Yue>`标签在任意位置插入并执行一段代码，这些标签中可以编写的代码不限行数与内容，也不用担心`>`和`<`操作符影响XML标签解析的问题。
 
 ### 5.让按钮支持显示参数的调整
 
@@ -125,11 +129,11 @@ import TabItem from '@theme/TabItem';
 </Node>
 ```
 
-&emsp;&emsp;用`<Import>`标签导入Xml模块。Import的Module属性的中需要填入模块的完整路径，如果Button.xml的路径为View/Button.xml，则需要写为`<Import Module="View.Button"/>`。此外还可以在当前模块范围内重命名导入的模块，比如写成`<Import Module="View.Button" Name="ButtonView"/>`，之后的标签名称就可以使用ButtonView而不是Button了。
+&emsp;&emsp;用`<Import>`标签导入XML模块。Import的Module属性的中需要填入模块的完整路径，如果Button.xml的路径为View/Button.xml，则需要写为`<Import Module="View.Button"/>`。此外还可以在当前模块范围内重命名导入的模块，比如写成`<Import Module="View.Button" Name="ButtonView"/>`，之后的标签名称就可以使用ButtonView而不是Button了。
 
 &emsp;&emsp;导入模块可以设置的属性，除了有特殊作用内置的Name和Ref属性（Ref="True"可以通过根节点节点变量访问这个模块对象，Name用于做后续代码引用），其它设置的属性都会作为首字母小写的参数变量传入模块内部使用。所以一定不能漏填模块中所需要的参数变量。
 
-&emsp;&emsp;这样我们的自定义按钮就完成了，要加载运行Dora Xml文件很简单，可以直接当成普通的Lua文件进行加载，比如这样：
+&emsp;&emsp;这样我们的自定义按钮就完成了，要加载运行Dora XML文件很简单，可以直接当成普通的Lua文件进行加载，比如这样：
 
 ```lua
 local Director = require("Director")
@@ -165,11 +169,11 @@ return function()
 end
 ```
 
-&emsp;&emsp;事实上，Dora Xml也是编译生成Lua代码执行的，以上代码正是MainScene.xml编译生成的结果。但是用Xml标签来编写这样的Lua代码逻辑可以得到更加清晰的代码结构，也提升了程序代码的可维护性。
+&emsp;&emsp;事实上，Dora XML也是编译生成Lua代码执行的，以上代码正是MainScene.xml编译生成的结果。但是用XML标签来编写这样的Lua代码逻辑可以得到更加清晰的代码结构，也提升了程序代码的可维护性。
 
 ### 7.制作按钮模板
 
-&emsp;&emsp;如果我们想做多种外观不同但是功能基本相同的按钮，我们就可以想把一些固定的按钮功能做成通用的模板。在Dora Xml里我们可以把之前写的按钮改造成这样的模版。
+&emsp;&emsp;如果我们想做多种外观不同但是功能基本相同的按钮，我们就可以想把一些固定的按钮功能做成通用的模板。在Dora XML里我们可以把之前写的按钮改造成这样的模版。
 
 ```xml title="ButtonBase.xml"
 <!-- params: X, Y, Width, Height, Text, FontSize -->
@@ -197,7 +201,7 @@ local buttonBase = ButtonBase()
 print(buttonBase.face) -- 这里就可以获取到face节点
 ```
 
-&emsp;&emsp;接下来在Dora Xml中可以这样使用这个模板：
+&emsp;&emsp;接下来在Dora XML中可以这样使用这个模板：
 
 ```xml title="SpriteButton.xml"
 <!-- params: X, Y, Text -->
@@ -222,4 +226,4 @@ print(buttonBase.face) -- 这里就可以获取到face节点
 </Node>
 ```
 
-&emsp;&emsp;我们导入并复用了这个模板模块，并通过`<Item>`标签获取模板中导出的子组件，把Item标签中的Name属性设置为与导出的子节点相同的名字face，并在这个子组件下添加了一个图元节点。Dora Xml 中`<Import>`标签必须出现在引用的外部组件之前，如果引用的外部组件要用作根节点，可以通过添加一个顶层的`<Dora>`将所有实际的代码包裹起来。通过这样的写法，我们就可以在套用按钮模板功能之下，定制不同外观的按钮了。
+&emsp;&emsp;我们导入并复用了这个模板模块，并通过`<Item>`标签获取模板中导出的子组件，把Item标签中的Name属性设置为与导出的子节点相同的名字face，并在这个子组件下添加了一个图元节点。Dora XML 中`<Import>`标签必须出现在引用的外部组件之前，如果引用的外部组件要用作根节点，可以通过添加一个顶层的`<Dora>`将所有实际的代码包裹起来。通过这样的写法，我们就可以在套用按钮模板功能之下，定制不同外观的按钮了。
diff --git a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-2.mdx b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-2.mdx
index 57733f4af..976ffb2dd 100644
--- a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-2.mdx	
+++ b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/Using Dora Xml/dora-xml-ui-2.mdx	
@@ -2,9 +2,9 @@ import "@site/src/languages/highlight";
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
-# 使用 Dora Xml 编写 UI 2
+# 使用 Dora XML 编写 UI 2
 
-&emsp;&emsp;使用 Dora Xml 编写UI界面的图形定义以后，接下来要解决的问题是如何增加界面交互的处理逻辑。我们可以使用Dora SSR的class类的机制，写一个继承Xml界面组件的带有界面处理逻辑的新的类。比如我们有一个按钮的Xml组件。
+&emsp;&emsp;使用 Dora XML 编写 UI 界面的图形定义以后，接下来要解决的问题是如何增加界面交互的处理逻辑。我们可以使用 Dora SSR 的 class 类的机制，写一个继承 XML 界面组件的带有界面处理逻辑的新的类。比如我们有一个按钮的 XML 组件。
 
 ```xml title="ButtonView.xml"
 <!-- params: X, Y, Radius, Text, FontSize -->
@@ -27,7 +27,7 @@ import TabItem from '@theme/TabItem';
 </Node>
 ```
 
-&emsp;&emsp;注意我们通过设置Name和Ref属性来导出了访问Label的接口label。然后我们写一个类来继承这个组件并添加一些业务逻辑：
+&emsp;&emsp;注意我们通过设置 Name 和 Ref 属性来导出了访问 Label 的接口 label。然后我们写一个类来继承这个组件并添加一些业务逻辑：
 
 ```lua title="Button.lua"
 local _ENV = Dora()
@@ -71,11 +71,11 @@ local Button = Class({
 return Button
 ```
 
-&emsp;&emsp;我们给按钮增加的业务逻辑主要是一个统计点击次数的功能，一个获取点击次数的接口clickCount，还有一个直接设置按钮文本的接口text。接下来使用这个扩展业务逻辑了的按钮。
+&emsp;&emsp;我们给按钮增加的业务逻辑主要是一个统计点击次数的功能，一个获取点击次数的接口 clickCount，还有一个直接设置按钮文本的接口 text。接下来使用这个扩展业务逻辑了的按钮。
 
 ```xml title="MainSceneView.xml"
 <Node>
-	<Import Module="Button"/><!-- 直接在Xml中导入Lua模块 -->
+	<Import Module="Button"/><!-- 直接在XML中导入Lua模块 -->
 
 	<Menu X="100" Y="100" Width="100" Height="100">
 		<Button X="25" Y="25" Radius="50" Text="Click"
@@ -84,7 +84,7 @@ return Button
 </Node>
 ```
 
-&emsp;&emsp;接下来给MainSceneView.xml也添加相应的业务逻辑。
+&emsp;&emsp;接下来给 MainSceneView.xml 也添加相应的业务逻辑。
 
 ```lua title="MainScene.lua"
 local _ENV = Dora()
@@ -112,11 +112,11 @@ local MainScene = require("MainScene")
 Director.entry:addChild(MainScene())
 ```
 
-&emsp;&emsp;这样我们的界面开发的程序逻辑组织就比较完善了。用Dora Xml来管理界面外观，然后在Lua类中写界面逻辑。现在UI组件的外观定义和业务逻辑的代码就可以分别在不同的文件中进行开发和维护了。
+&emsp;&emsp;这样我们的界面开发的程序逻辑组织就比较完善了。用 Dora XML 来管理界面外观，然后在 Lua 类中写界面逻辑。现在UI组件的外观定义和业务逻辑的代码就可以分别在不同的文件中进行开发和维护了。
 
 ## 使用 Yuescript 编写 UI 逻辑
 
-&emsp;&emsp;有了Dora Xml简化界面代码的编写，我们可以进一步地引入了叫做Yuescript的新语言进行开发，Yuescript是一门编译成Lua运行的语言，所以可以和Lua无缝结合使用。它的最大的特性是代码比较简洁和易于维护。下面就来看一下怎么用 Yuescript 配合 Dora Xml 写业务逻辑吧。前文中的代码如果使用 Yuescript 就可以写成：
+&emsp;&emsp;有了 Dora XML 简化界面代码的编写，我们可以进一步地引入了叫做 Yuescript 的新语言进行开发，Yuescript 是一门编译成Lua运行的语言，所以可以和 Lua 无缝结合使用。它的最大的特性是代码比较简洁和易于维护。下面就来看一下怎么用 Yuescript 配合 Dora XML 写业务逻辑吧。前文中的代码如果使用 Yuescript 就可以写成：
 
 ```yue title="Button.yue"
 _ENV = Dora!
@@ -156,4 +156,4 @@ import "MainScene"
 Director.entry\addChild MainScene!
 ```
 
-&emsp;&emsp;比前文的代码要简练了很多，但实现的功能是完全相同的。所以推荐读者可以尝试使用 Yuescript 来编写UI界面的逻辑代码。Yuescript 使用了Python的缩进控制代码块的代码风格，以及从包括 Python 在内的很多语言中吸收了优秀的语法特性。目前在 Dora SSR 的 Web IDE 中也添加了对 Yuescript 的代码编写的支持，包括高亮补全和错误检查等，想学习 Yuescript 这门语言，就从[这里](https://yuescript.org/doc)开始吧。
+&emsp;&emsp;比前文的代码要简练了很多，但实现的功能是完全相同的。所以推荐读者可以尝试使用 Yuescript 来编写UI界面的逻辑代码。Yuescript 使用了 Python 的缩进控制代码块的代码风格，以及从包括 Python 在内的很多语言中吸收了优秀的语法特性。目前在 Dora SSR 的 Web IDE 中也添加了对 Yuescript 的代码编写的支持，包括高亮补全和错误检查等，想学习 Yuescript 这门语言，就从[这里](https://yuescript.org/doc)开始吧。
diff --git a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/dev-configuration.md b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/dev-configuration.md
index 9c2a5f1fe..e1151c94f 100644
--- a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/dev-configuration.md
+++ b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/dev-configuration.md
@@ -98,8 +98,10 @@ git clone https://github.com/ippclub/Dora-SSR.git
 2. 安装最新版的 **Node.js**。
 3. 初始化项目并进入 Dora Dora 编辑器开发模式。
    ```sh
-   cd Tools/YarnEditor && yarn && yarn build && rm -rf ../dora-dora/public/yarn-editor && mv dist ../dora-dora/public/yarn-editor && cd ../..
-   cd Tools/dora-dora
+   cd Tools/YarnEditor && yarn && yarn build
+   rm -rf ../dora-dora/public/yarn-editor
+   mv dist ../dora-dora/public/yarn-editor
+   cd ../../Tools/dora-dora
    yarn
    yarn start
    ```
diff --git a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/quick-start.mdx b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/quick-start.mdx
index 6d19909c0..d818ef5f9 100644
--- a/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/quick-start.mdx
+++ b/Site/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorial/quick-start.mdx
@@ -34,10 +34,39 @@ import TabItem from '@theme/TabItem';
 
 2. 第二步：编写游戏代码
 
-	- 在项目文件夹下新建游戏入口代码文件，选择Yuescript语言（或Teal、Lua）命名为`init`。
+	- 在项目文件夹下新建游戏入口代码文件，选择Yuescript语言（或Teal、Lua、Typescript）命名为`init`。
 	- 编写代码：
 
 <Tabs>
+<TabItem value="tsx" label="TSX">
+
+```tsx title="Hello/init.tsx"
+// @preview-file on
+import { React, toNode, useRef } from 'dora-x';
+import { Ease, Move, Sprite } from 'dora';
+
+const sprite = useRef<Sprite.Type>();
+
+// 创建游戏场景树根节点
+// 以及一个图片精灵作为子节点
+toNode(
+	<node onTapBegan={(touch) => {
+			const sp = sprite.current;
+			if (sp) {
+				sp.perform(Move(
+					1, // 持续时间，单位为秒
+					sp.position, // 开始位置
+					touch.location, // 结束位置
+					Ease.OutBack // 缓动函数
+				));
+			}
+		}}>
+		<sprite ref={sprite} file='Image/logo.png'/>
+	</node>
+);
+```
+
+</TabItem>
 <TabItem value="yue" label="Yuescript">
 
 ```yue title="Hello/init.yue"
@@ -55,7 +84,7 @@ with Node!
 
 	-- 接收并处理点击事件移动图片精灵
 	.touchEnabled = true
-	\slot "Tapped", (touch)->
+	\slot "TapBegan", (touch)->
 		sprite\perform Move(
 			1 -- 持续时间，单位为秒
 			sprite.position -- 开始位置
@@ -85,7 +114,7 @@ root:addChild(sprite)
 
 -- 接收并处理点击事件移动图片精灵
 root.touchEnabled = true
-root:slot("Tapped", function(touch)
+root:slot("TapBegan", function(touch)
 	sprite:perform(Move(
 		1, -- 持续时间，单位为秒
 		sprite.position, -- 开始位置
@@ -117,7 +146,7 @@ root:addChild(sprite)
 
 -- 接收并处理点击事件移动图片精灵
 root.touchEnabled = true
-root:slot("Tapped", function(touch: Touch)
+root:slot("TapBegan", function(touch: Touch)
 	sprite:perform(Move(
 		1, -- 持续时间，单位为秒
 		sprite.position, -- 开始位置
@@ -145,7 +174,7 @@ root.addChild(sprite);
 
 // 接收并处理点击事件移动图片精灵
 root.touchEnabled = true;
-root.slot(Slot.Tapped, touch => {
+root.slot(Slot.TapBegan, touch => {
 	sprite.perform(
 		Move(
 			1, // 持续时间，单位为秒
diff --git a/Site/package.json b/Site/package.json
index 0ebc04a6b..527a6003f 100644
--- a/Site/package.json
+++ b/Site/package.json
@@ -15,8 +15,8 @@
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@docusaurus/core": "^3.0.1",
-    "@docusaurus/preset-classic": "^3.0.1",
+    "@docusaurus/core": "^3.1.0",
+    "@docusaurus/preset-classic": "^3.1.0",
     "@easyops-cn/docusaurus-search-local": "^0.38.1",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
@@ -25,7 +25,7 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "^3.0.1",
+    "@docusaurus/module-type-aliases": "^3.1.0",
     "@tsconfig/docusaurus": "^2.0.2",
     "typescript": "^5.3.2"
   },
diff --git a/Site/yarn.lock b/Site/yarn.lock
index 426d22c5e..513c24ca1 100644
--- a/Site/yarn.lock
+++ b/Site/yarn.lock
@@ -1210,7 +1210,7 @@
     "@docsearch/css" "3.5.2"
     algoliasearch "^4.19.1"
 
-"@docusaurus/core@3.0.1", "@docusaurus/core@^3.0.1":
+"@docusaurus/core@3.0.1":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/core/-/core-3.0.1.tgz#ad9a66b20802ea81b25e65db75d4ca952eda7e01"
   integrity sha512-CXrLpOnW+dJdSv8M5FAJ3JBwXtL6mhUWxFA8aS0ozK6jBG/wgxERk5uvH28fCeFxOGbAT9v1e9dOMo1X2IEVhQ==
@@ -1285,6 +1285,81 @@
     webpack-merge "^5.9.0"
     webpackbar "^5.0.2"
 
+"@docusaurus/core@3.1.0", "@docusaurus/core@^3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/core/-/core-3.1.0.tgz#b66e7eaf867c1f44738d725d217a1c0e879629d7"
+  integrity sha512-GWudMGYA9v26ssbAWJNfgeDZk+lrudUTclLPRsmxiknEBk7UMp7Rglonhqbsf3IKHOyHkMU4Fr5jFyg5SBx9jQ==
+  dependencies:
+    "@babel/core" "^7.23.3"
+    "@babel/generator" "^7.23.3"
+    "@babel/plugin-syntax-dynamic-import" "^7.8.3"
+    "@babel/plugin-transform-runtime" "^7.22.9"
+    "@babel/preset-env" "^7.22.9"
+    "@babel/preset-react" "^7.22.5"
+    "@babel/preset-typescript" "^7.22.5"
+    "@babel/runtime" "^7.22.6"
+    "@babel/runtime-corejs3" "^7.22.6"
+    "@babel/traverse" "^7.22.8"
+    "@docusaurus/cssnano-preset" "3.1.0"
+    "@docusaurus/logger" "3.1.0"
+    "@docusaurus/mdx-loader" "3.1.0"
+    "@docusaurus/react-loadable" "5.5.2"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-common" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
+    "@slorber/static-site-generator-webpack-plugin" "^4.0.7"
+    "@svgr/webpack" "^6.5.1"
+    autoprefixer "^10.4.14"
+    babel-loader "^9.1.3"
+    babel-plugin-dynamic-import-node "^2.3.3"
+    boxen "^6.2.1"
+    chalk "^4.1.2"
+    chokidar "^3.5.3"
+    clean-css "^5.3.2"
+    cli-table3 "^0.6.3"
+    combine-promises "^1.1.0"
+    commander "^5.1.0"
+    copy-webpack-plugin "^11.0.0"
+    core-js "^3.31.1"
+    css-loader "^6.8.1"
+    css-minimizer-webpack-plugin "^4.2.2"
+    cssnano "^5.1.15"
+    del "^6.1.1"
+    detect-port "^1.5.1"
+    escape-html "^1.0.3"
+    eta "^2.2.0"
+    file-loader "^6.2.0"
+    fs-extra "^11.1.1"
+    html-minifier-terser "^7.2.0"
+    html-tags "^3.3.1"
+    html-webpack-plugin "^5.5.3"
+    leven "^3.1.0"
+    lodash "^4.17.21"
+    mini-css-extract-plugin "^2.7.6"
+    postcss "^8.4.26"
+    postcss-loader "^7.3.3"
+    prompts "^2.4.2"
+    react-dev-utils "^12.0.1"
+    react-helmet-async "^1.3.0"
+    react-loadable "npm:@docusaurus/react-loadable@5.5.2"
+    react-loadable-ssr-addon-v5-slorber "^1.0.1"
+    react-router "^5.3.4"
+    react-router-config "^5.1.1"
+    react-router-dom "^5.3.4"
+    rtl-detect "^1.0.4"
+    semver "^7.5.4"
+    serve-handler "^6.1.5"
+    shelljs "^0.8.5"
+    terser-webpack-plugin "^5.3.9"
+    tslib "^2.6.0"
+    update-notifier "^6.0.2"
+    url-loader "^4.1.1"
+    webpack "^5.88.1"
+    webpack-bundle-analyzer "^4.9.0"
+    webpack-dev-server "^4.15.1"
+    webpack-merge "^5.9.0"
+    webpackbar "^5.0.2"
+
 "@docusaurus/cssnano-preset@3.0.1":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/cssnano-preset/-/cssnano-preset-3.0.1.tgz#22fbf2e97389e338747864baf011743846e8fd26"
@@ -1295,6 +1370,16 @@
     postcss-sort-media-queries "^4.4.1"
     tslib "^2.6.0"
 
+"@docusaurus/cssnano-preset@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/cssnano-preset/-/cssnano-preset-3.1.0.tgz#b3fe7134cc4d0c1950eeb1c940089a190591ad4e"
+  integrity sha512-ned7qsgCqSv/e7KyugFNroAfiszuxLwnvMW7gmT2Ywxb/Nyt61yIw7KHyAZCMKglOalrqnYA4gMhLUCK/mVePA==
+  dependencies:
+    cssnano-preset-advanced "^5.3.10"
+    postcss "^8.4.26"
+    postcss-sort-media-queries "^4.4.1"
+    tslib "^2.6.0"
+
 "@docusaurus/logger@3.0.1":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/logger/-/logger-3.0.1.tgz#06f512eef6c6ae4e2da63064257e01b1cdc41a82"
@@ -1303,6 +1388,14 @@
     chalk "^4.1.2"
     tslib "^2.6.0"
 
+"@docusaurus/logger@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/logger/-/logger-3.1.0.tgz#eef6475c2d59a3ae7e138ac1f60007d6fafd76b0"
+  integrity sha512-p740M+HCst1VnKKzL60Hru9xfG4EUYJDarjlEC4hHeBy9+afPmY3BNPoSHx9/8zxuYfUlv/psf7I9NvRVdmdvg==
+  dependencies:
+    chalk "^4.1.2"
+    tslib "^2.6.0"
+
 "@docusaurus/mdx-loader@3.0.1":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/mdx-loader/-/mdx-loader-3.0.1.tgz#89f221e5bcc570983fd61d7ab56d6fbe36810b59"
@@ -1335,7 +1428,39 @@
     vfile "^6.0.1"
     webpack "^5.88.1"
 
-"@docusaurus/module-type-aliases@3.0.1", "@docusaurus/module-type-aliases@^3.0.1":
+"@docusaurus/mdx-loader@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/mdx-loader/-/mdx-loader-3.1.0.tgz#61d562ff442f62ef04cc31d3f0d5865a8dd390e4"
+  integrity sha512-D7onDz/3mgBonexWoQXPw3V2E5Bc4+jYRf9gGUUK+KoQwU8xMDaDkUUfsr7t6UBa/xox9p5+/3zwLuXOYMzGSg==
+  dependencies:
+    "@babel/parser" "^7.22.7"
+    "@babel/traverse" "^7.22.8"
+    "@docusaurus/logger" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
+    "@mdx-js/mdx" "^3.0.0"
+    "@slorber/remark-comment" "^1.0.0"
+    escape-html "^1.0.3"
+    estree-util-value-to-estree "^3.0.1"
+    file-loader "^6.2.0"
+    fs-extra "^11.1.1"
+    image-size "^1.0.2"
+    mdast-util-mdx "^3.0.0"
+    mdast-util-to-string "^4.0.0"
+    rehype-raw "^7.0.0"
+    remark-directive "^3.0.0"
+    remark-emoji "^4.0.0"
+    remark-frontmatter "^5.0.0"
+    remark-gfm "^4.0.0"
+    stringify-object "^3.3.0"
+    tslib "^2.6.0"
+    unified "^11.0.3"
+    unist-util-visit "^5.0.0"
+    url-loader "^4.1.1"
+    vfile "^6.0.1"
+    webpack "^5.88.1"
+
+"@docusaurus/module-type-aliases@3.0.1":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/module-type-aliases/-/module-type-aliases-3.0.1.tgz#d45990fe377d7ffaa68841cf89401188a5d65293"
   integrity sha512-DEHpeqUDsLynl3AhQQiO7AbC7/z/lBra34jTcdYuvp9eGm01pfH1wTVq8YqWZq6Jyx0BgcVl/VJqtE9StRd9Ag==
@@ -1349,18 +1474,32 @@
     react-helmet-async "*"
     react-loadable "npm:@docusaurus/react-loadable@5.5.2"
 
-"@docusaurus/plugin-content-blog@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/plugin-content-blog/-/plugin-content-blog-3.0.1.tgz#dee6147187c2d8b634252444d60312d12c9571a6"
-  integrity sha512-cLOvtvAyaMQFLI8vm4j26svg3ktxMPSXpuUJ7EERKoGbfpJSsgtowNHcRsaBVmfuCsRSk1HZ/yHBsUkTmHFEsg==
+"@docusaurus/module-type-aliases@3.1.0", "@docusaurus/module-type-aliases@^3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/module-type-aliases/-/module-type-aliases-3.1.0.tgz#f3451702f143557bfde0502287713a08086a0415"
+  integrity sha512-XUl7Z4PWlKg4l6KF05JQ3iDHQxnPxbQUqTNKvviHyuHdlalOFv6qeDAm7IbzyQPJD5VA6y4dpRbTWSqP9ClwPg==
   dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/logger" "3.0.1"
-    "@docusaurus/mdx-loader" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils" "3.0.1"
-    "@docusaurus/utils-common" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+    "@docusaurus/react-loadable" "5.5.2"
+    "@docusaurus/types" "3.1.0"
+    "@types/history" "^4.7.11"
+    "@types/react" "*"
+    "@types/react-router-config" "*"
+    "@types/react-router-dom" "*"
+    react-helmet-async "*"
+    react-loadable "npm:@docusaurus/react-loadable@5.5.2"
+
+"@docusaurus/plugin-content-blog@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-content-blog/-/plugin-content-blog-3.1.0.tgz#d2102e9286486e526dbc0dfc741e53dc5cee0ff0"
+  integrity sha512-iMa6WBaaEdYuxckvJtLcq/HQdlA4oEbCXf/OFfsYJCCULcDX7GDZpKxLF3X1fLsax3sSm5bmsU+CA0WD+R1g3A==
+  dependencies:
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/logger" "3.1.0"
+    "@docusaurus/mdx-loader" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-common" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     cheerio "^1.0.0-rc.12"
     feed "^4.2.2"
     fs-extra "^11.1.1"
@@ -1372,7 +1511,28 @@
     utility-types "^3.10.0"
     webpack "^5.88.1"
 
-"@docusaurus/plugin-content-docs@3.0.1", "@docusaurus/plugin-content-docs@^2 || ^3":
+"@docusaurus/plugin-content-docs@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-content-docs/-/plugin-content-docs-3.1.0.tgz#55d7bdb8e14f854ea6c6e256f1b51b8c17963c19"
+  integrity sha512-el5GxhT8BLrsWD0qGa8Rq+Ttb/Ni6V3DGT2oAPio0qcs/mUAxeyXEAmihkvmLCnAgp6xD27Ce7dISZ5c6BXeqA==
+  dependencies:
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/logger" "3.1.0"
+    "@docusaurus/mdx-loader" "3.1.0"
+    "@docusaurus/module-type-aliases" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
+    "@types/react-router-config" "^5.0.7"
+    combine-promises "^1.1.0"
+    fs-extra "^11.1.1"
+    js-yaml "^4.1.0"
+    lodash "^4.17.21"
+    tslib "^2.6.0"
+    utility-types "^3.10.0"
+    webpack "^5.88.1"
+
+"@docusaurus/plugin-content-docs@^2 || ^3":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/plugin-content-docs/-/plugin-content-docs-3.0.1.tgz#d9b1884562186573d5c4521ac3546b68512c1126"
   integrity sha512-dRfAOA5Ivo+sdzzJGXEu33yAtvGg8dlZkvt/NEJ7nwi1F2j4LEdsxtfX2GKeETB2fP6XoGNSQnFXqa2NYGrHFg==
@@ -1393,96 +1553,96 @@
     utility-types "^3.10.0"
     webpack "^5.88.1"
 
-"@docusaurus/plugin-content-pages@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/plugin-content-pages/-/plugin-content-pages-3.0.1.tgz#27e6424c77173f867760efe53f848bbab8849ea6"
-  integrity sha512-oP7PoYizKAXyEttcvVzfX3OoBIXEmXTMzCdfmC4oSwjG4SPcJsRge3mmI6O8jcZBgUPjIzXD21bVGWEE1iu8gg==
-  dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/mdx-loader" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+"@docusaurus/plugin-content-pages@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-content-pages/-/plugin-content-pages-3.1.0.tgz#cdb73c804ded307e81ceea39874dc0bb540c2dc4"
+  integrity sha512-9gntYQFpk+93+Xl7gYczJu8I9uWoyRLnRwS0+NUFcs9iZtHKsdqKWPRrONC9elfN3wJ9ORwTbcVzsTiB8jvYlg==
+  dependencies:
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/mdx-loader" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     fs-extra "^11.1.1"
     tslib "^2.6.0"
     webpack "^5.88.1"
 
-"@docusaurus/plugin-debug@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/plugin-debug/-/plugin-debug-3.0.1.tgz#886b5dd03c066e970484ca251c1b79613df90700"
-  integrity sha512-09dxZMdATky4qdsZGzhzlUvvC+ilQ2hKbYF+wez+cM2mGo4qHbv8+qKXqxq0CQZyimwlAOWQLoSozIXU0g0i7g==
+"@docusaurus/plugin-debug@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-debug/-/plugin-debug-3.1.0.tgz#545872bc8f9cd697d9f1d6c695f8a1674bfc149c"
+  integrity sha512-AbvJwCVRbmQ8w9d8QXbF4Iq/ui0bjPZNYFIhtducGFnm2YQRN1mraK8mCEQb0Aq0T8SqRRvSfC/far4n/s531w==
   dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils" "3.0.1"
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
     fs-extra "^11.1.1"
     react-json-view-lite "^1.2.0"
     tslib "^2.6.0"
 
-"@docusaurus/plugin-google-analytics@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/plugin-google-analytics/-/plugin-google-analytics-3.0.1.tgz#ec69902131ea3aad8b062eeb1d17bf0962986f80"
-  integrity sha512-jwseSz1E+g9rXQwDdr0ZdYNjn8leZBnKPjjQhMBEiwDoenL3JYFcNW0+p0sWoVF/f2z5t7HkKA+cYObrUh18gg==
+"@docusaurus/plugin-google-analytics@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-google-analytics/-/plugin-google-analytics-3.1.0.tgz#3035eace3121db16aec7c10852ebb4cd860f4434"
+  integrity sha512-zvUOMzu9Uhz0ciqnSbtnp/5i1zEYlzarQrOXG90P3Is3efQI43p2YLW/rzSGdLb5MfQo2HvKT6Q5+tioMO045Q==
   dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     tslib "^2.6.0"
 
-"@docusaurus/plugin-google-gtag@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/plugin-google-gtag/-/plugin-google-gtag-3.0.1.tgz#bb5526377d3a324ebec235127846fda386562b05"
-  integrity sha512-UFTDvXniAWrajsulKUJ1DB6qplui1BlKLQZjX4F7qS/qfJ+qkKqSkhJ/F4VuGQ2JYeZstYb+KaUzUzvaPK1aRQ==
+"@docusaurus/plugin-google-gtag@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-google-gtag/-/plugin-google-gtag-3.1.0.tgz#2f4040da81d36bfc6324abc1a12b258e6c7f202a"
+  integrity sha512-0txshvaY8qIBdkk2UATdVcfiCLGq3KAUfuRQD2cRNgO39iIf4/ihQxH9NXcRTwKs4Q5d9yYHoix3xT6pFuEYOg==
   dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     "@types/gtag.js" "^0.0.12"
     tslib "^2.6.0"
 
-"@docusaurus/plugin-google-tag-manager@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/plugin-google-tag-manager/-/plugin-google-tag-manager-3.0.1.tgz#4e36d13279cf90c2614b62438aa1109dd4696ec8"
-  integrity sha512-IPFvuz83aFuheZcWpTlAdiiX1RqWIHM+OH8wS66JgwAKOiQMR3+nLywGjkLV4bp52x7nCnwhNk1rE85Cpy/CIw==
+"@docusaurus/plugin-google-tag-manager@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-google-tag-manager/-/plugin-google-tag-manager-3.1.0.tgz#4c026e9f65468a332326770f95ccd9c6e12d564b"
+  integrity sha512-zOWPEi8kMyyPtwG0vhyXrdbLs8fIZmY5vlbi9lUU+v8VsroO5iHmfR2V3SMsrsfOanw5oV/ciWqbxezY00qEZg==
   dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     tslib "^2.6.0"
 
-"@docusaurus/plugin-sitemap@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/plugin-sitemap/-/plugin-sitemap-3.0.1.tgz#ab55857e90d4500f892e110b30e4bc3289202bd4"
-  integrity sha512-xARiWnjtVvoEniZudlCq5T9ifnhCu/GAZ5nA7XgyLfPcNpHQa241HZdsTlLtVcecEVVdllevBKOp7qknBBaMGw==
-  dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/logger" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils" "3.0.1"
-    "@docusaurus/utils-common" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+"@docusaurus/plugin-sitemap@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/plugin-sitemap/-/plugin-sitemap-3.1.0.tgz#9d9dbb4d87e6dc46ae9321badf6ac7cd9aa96b23"
+  integrity sha512-TkR5vGBpUooEB9SoW42thahqqwKzfHrQQhkB+JrEGERsl4bKODSuJNle4aA4h6LSkg4IyfXOW8XOI0NIPWb9Cg==
+  dependencies:
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/logger" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-common" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     fs-extra "^11.1.1"
     sitemap "^7.1.1"
     tslib "^2.6.0"
 
-"@docusaurus/preset-classic@^3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/preset-classic/-/preset-classic-3.0.1.tgz#d363ac837bba967095ed2a896d13c54f3717d6b5"
-  integrity sha512-il9m9xZKKjoXn6h0cRcdnt6wce0Pv1y5t4xk2Wx7zBGhKG1idu4IFHtikHlD0QPuZ9fizpXspXcTzjL5FXc1Gw==
-  dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/plugin-content-blog" "3.0.1"
-    "@docusaurus/plugin-content-docs" "3.0.1"
-    "@docusaurus/plugin-content-pages" "3.0.1"
-    "@docusaurus/plugin-debug" "3.0.1"
-    "@docusaurus/plugin-google-analytics" "3.0.1"
-    "@docusaurus/plugin-google-gtag" "3.0.1"
-    "@docusaurus/plugin-google-tag-manager" "3.0.1"
-    "@docusaurus/plugin-sitemap" "3.0.1"
-    "@docusaurus/theme-classic" "3.0.1"
-    "@docusaurus/theme-common" "3.0.1"
-    "@docusaurus/theme-search-algolia" "3.0.1"
-    "@docusaurus/types" "3.0.1"
+"@docusaurus/preset-classic@^3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/preset-classic/-/preset-classic-3.1.0.tgz#ca67d5e416c211b4c23f0fb01f0e3e36b759dfa0"
+  integrity sha512-xGLQRFmmT9IinAGUDVRYZ54Ys28USNbA3OTXQXnSJLPr1rCY7CYnHI4XoOnKWrNnDiAI4ruMzunXWyaElUYCKQ==
+  dependencies:
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/plugin-content-blog" "3.1.0"
+    "@docusaurus/plugin-content-docs" "3.1.0"
+    "@docusaurus/plugin-content-pages" "3.1.0"
+    "@docusaurus/plugin-debug" "3.1.0"
+    "@docusaurus/plugin-google-analytics" "3.1.0"
+    "@docusaurus/plugin-google-gtag" "3.1.0"
+    "@docusaurus/plugin-google-tag-manager" "3.1.0"
+    "@docusaurus/plugin-sitemap" "3.1.0"
+    "@docusaurus/theme-classic" "3.1.0"
+    "@docusaurus/theme-common" "3.1.0"
+    "@docusaurus/theme-search-algolia" "3.1.0"
+    "@docusaurus/types" "3.1.0"
 
 "@docusaurus/react-loadable@5.5.2", "react-loadable@npm:@docusaurus/react-loadable@5.5.2":
   version "5.5.2"
@@ -1492,23 +1652,23 @@
     "@types/react" "*"
     prop-types "^15.6.2"
 
-"@docusaurus/theme-classic@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/theme-classic/-/theme-classic-3.0.1.tgz#3ba4dc77553d2c1608e433c0d01bed7c6db14eb9"
-  integrity sha512-XD1FRXaJiDlmYaiHHdm27PNhhPboUah9rqIH0lMpBt5kYtsGjJzhqa27KuZvHLzOP2OEpqd2+GZ5b6YPq7Q05Q==
-  dependencies:
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/mdx-loader" "3.0.1"
-    "@docusaurus/module-type-aliases" "3.0.1"
-    "@docusaurus/plugin-content-blog" "3.0.1"
-    "@docusaurus/plugin-content-docs" "3.0.1"
-    "@docusaurus/plugin-content-pages" "3.0.1"
-    "@docusaurus/theme-common" "3.0.1"
-    "@docusaurus/theme-translations" "3.0.1"
-    "@docusaurus/types" "3.0.1"
-    "@docusaurus/utils" "3.0.1"
-    "@docusaurus/utils-common" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+"@docusaurus/theme-classic@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/theme-classic/-/theme-classic-3.1.0.tgz#6ee68bf4d4db53c8d9b18d4866512abadb00a802"
+  integrity sha512-/+jMl2Z9O8QQxves5AtHdt91gWsEZFgOV3La/6eyKEd7QLqQUtM5fxEJ40rq9NKYjqCd1HzZ9egIMeJoWwillw==
+  dependencies:
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/mdx-loader" "3.1.0"
+    "@docusaurus/module-type-aliases" "3.1.0"
+    "@docusaurus/plugin-content-blog" "3.1.0"
+    "@docusaurus/plugin-content-docs" "3.1.0"
+    "@docusaurus/plugin-content-pages" "3.1.0"
+    "@docusaurus/theme-common" "3.1.0"
+    "@docusaurus/theme-translations" "3.1.0"
+    "@docusaurus/types" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-common" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     "@mdx-js/react" "^3.0.0"
     clsx "^2.0.0"
     copy-text-to-clipboard "^3.2.0"
@@ -1523,18 +1683,18 @@
     tslib "^2.6.0"
     utility-types "^3.10.0"
 
-"@docusaurus/theme-common@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/theme-common/-/theme-common-3.0.1.tgz#29a5bcb286296a52bc10afa5308e360cbed6b49c"
-  integrity sha512-cr9TOWXuIOL0PUfuXv6L5lPlTgaphKP+22NdVBOYah5jSq5XAAulJTjfe+IfLsEG4L7lJttLbhW7LXDFSAI7Ag==
-  dependencies:
-    "@docusaurus/mdx-loader" "3.0.1"
-    "@docusaurus/module-type-aliases" "3.0.1"
-    "@docusaurus/plugin-content-blog" "3.0.1"
-    "@docusaurus/plugin-content-docs" "3.0.1"
-    "@docusaurus/plugin-content-pages" "3.0.1"
-    "@docusaurus/utils" "3.0.1"
-    "@docusaurus/utils-common" "3.0.1"
+"@docusaurus/theme-common@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/theme-common/-/theme-common-3.1.0.tgz#d176af1d0fc8ea27fea0afb298157f9a75256336"
+  integrity sha512-YGwEFALLIbF5ocW/Fy6Ae7tFWUOugEN3iwxTx8UkLAcLqYUboDSadesYtVBmRCEB4FVA2qoP7YaW3lu3apUPPw==
+  dependencies:
+    "@docusaurus/mdx-loader" "3.1.0"
+    "@docusaurus/module-type-aliases" "3.1.0"
+    "@docusaurus/plugin-content-blog" "3.1.0"
+    "@docusaurus/plugin-content-docs" "3.1.0"
+    "@docusaurus/plugin-content-pages" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-common" "3.1.0"
     "@types/history" "^4.7.11"
     "@types/react" "*"
     "@types/react-router-config" "*"
@@ -1544,19 +1704,19 @@
     tslib "^2.6.0"
     utility-types "^3.10.0"
 
-"@docusaurus/theme-search-algolia@3.0.1":
-  version "3.0.1"
-  resolved "https://registry.npmmirror.com/@docusaurus/theme-search-algolia/-/theme-search-algolia-3.0.1.tgz#d8fb6bddca8d8355e4706c4c7d30d3b800217cf4"
-  integrity sha512-DDiPc0/xmKSEdwFkXNf1/vH1SzJPzuJBar8kMcBbDAZk/SAmo/4lf6GU2drou4Ae60lN2waix+jYWTWcJRahSA==
+"@docusaurus/theme-search-algolia@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/theme-search-algolia/-/theme-search-algolia-3.1.0.tgz#3cdb1f0e8d15698a60110856ca5a06f10d3b049d"
+  integrity sha512-8cJH0ZhPsEDjq3jR3I+wHmWzVY2bXMQJ59v2QxUmsTZxbWA4u+IzccJMIJx4ooFl9J6iYynwYsFuHxyx/KUmfQ==
   dependencies:
     "@docsearch/react" "^3.5.2"
-    "@docusaurus/core" "3.0.1"
-    "@docusaurus/logger" "3.0.1"
-    "@docusaurus/plugin-content-docs" "3.0.1"
-    "@docusaurus/theme-common" "3.0.1"
-    "@docusaurus/theme-translations" "3.0.1"
-    "@docusaurus/utils" "3.0.1"
-    "@docusaurus/utils-validation" "3.0.1"
+    "@docusaurus/core" "3.1.0"
+    "@docusaurus/logger" "3.1.0"
+    "@docusaurus/plugin-content-docs" "3.1.0"
+    "@docusaurus/theme-common" "3.1.0"
+    "@docusaurus/theme-translations" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    "@docusaurus/utils-validation" "3.1.0"
     algoliasearch "^4.18.0"
     algoliasearch-helper "^3.13.3"
     clsx "^2.0.0"
@@ -1566,7 +1726,15 @@
     tslib "^2.6.0"
     utility-types "^3.10.0"
 
-"@docusaurus/theme-translations@3.0.1", "@docusaurus/theme-translations@^2 || ^3":
+"@docusaurus/theme-translations@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/theme-translations/-/theme-translations-3.1.0.tgz#1c6bdc19723a87e042b5e89b6cdc8b747fdcbc13"
+  integrity sha512-DApE4AbDI+WBajihxB54L4scWQhVGNZAochlC9fkbciPuFAgdRBD3NREb0rgfbKexDC/rioppu/WJA0u8tS+yA==
+  dependencies:
+    fs-extra "^11.1.1"
+    tslib "^2.6.0"
+
+"@docusaurus/theme-translations@^2 || ^3":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/theme-translations/-/theme-translations-3.0.1.tgz#837a01a166ccd698a3eceaed0c2f798555bc024b"
   integrity sha512-6UrbpzCTN6NIJnAtZ6Ne9492vmPVX+7Fsz4kmp+yor3KQwA1+MCzQP7ItDNkP38UmVLnvB/cYk/IvehCUqS3dg==
@@ -1588,6 +1756,21 @@
     webpack "^5.88.1"
     webpack-merge "^5.9.0"
 
+"@docusaurus/types@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/types/-/types-3.1.0.tgz#1dbb60ea38e98ba869f8d7ea2323e4460f05ab65"
+  integrity sha512-VaczOZf7+re8aFBIWnex1XENomwHdsSTkrdX43zyor7G/FY4OIsP6X28Xc3o0jiY0YdNuvIDyA5TNwOtpgkCVw==
+  dependencies:
+    "@mdx-js/mdx" "^3.0.0"
+    "@types/history" "^4.7.11"
+    "@types/react" "*"
+    commander "^5.1.0"
+    joi "^17.9.2"
+    react-helmet-async "^1.3.0"
+    utility-types "^3.10.0"
+    webpack "^5.88.1"
+    webpack-merge "^5.9.0"
+
 "@docusaurus/utils-common@3.0.1", "@docusaurus/utils-common@^2 || ^3":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/utils-common/-/utils-common-3.0.1.tgz#111f450089d5f0a290c0c25f8a574a270d08436f"
@@ -1595,6 +1778,13 @@
   dependencies:
     tslib "^2.6.0"
 
+"@docusaurus/utils-common@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/utils-common/-/utils-common-3.1.0.tgz#846ce9c12b9ebf1ebf513e65303fb8158dcd2e1b"
+  integrity sha512-SfvnRLHoZ9bwTw67knkSs7IcUR0GY2SaGkpdB/J9pChrDiGhwzKNUhcieoPyPYrOWGRPk3rVNYtoy+Bc7psPAw==
+  dependencies:
+    tslib "^2.6.0"
+
 "@docusaurus/utils-validation@3.0.1", "@docusaurus/utils-validation@^2 || ^3":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/utils-validation/-/utils-validation-3.0.1.tgz#3c5f12941b328a19fc9acb34d070219f3e865ec6"
@@ -1606,6 +1796,17 @@
     js-yaml "^4.1.0"
     tslib "^2.6.0"
 
+"@docusaurus/utils-validation@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/utils-validation/-/utils-validation-3.1.0.tgz#3e88c42caec29cd3eedbbd17af97f88719613340"
+  integrity sha512-dFxhs1NLxPOSzmcTk/eeKxLY5R+U4cua22g9MsAMiRWcwFKStZ2W3/GDY0GmnJGqNS8QAQepJrxQoyxXkJNDeg==
+  dependencies:
+    "@docusaurus/logger" "3.1.0"
+    "@docusaurus/utils" "3.1.0"
+    joi "^17.9.2"
+    js-yaml "^4.1.0"
+    tslib "^2.6.0"
+
 "@docusaurus/utils@3.0.1", "@docusaurus/utils@^2 || ^3":
   version "3.0.1"
   resolved "https://registry.npmmirror.com/@docusaurus/utils/-/utils-3.0.1.tgz#c64f68980a90c5bc6d53a5b8f32deb9026b1e303"
@@ -1629,6 +1830,29 @@
     url-loader "^4.1.1"
     webpack "^5.88.1"
 
+"@docusaurus/utils@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/@docusaurus/utils/-/utils-3.1.0.tgz#6ef821bc4c40a91586835a385110b5c0082c590c"
+  integrity sha512-LgZfp0D+UBqAh7PZ//MUNSFBMavmAPku6Si9x8x3V+S318IGCNJ6hUr2O29UO0oLybEWUjD5Jnj9IUN6XyZeeg==
+  dependencies:
+    "@docusaurus/logger" "3.1.0"
+    "@svgr/webpack" "^6.5.1"
+    escape-string-regexp "^4.0.0"
+    file-loader "^6.2.0"
+    fs-extra "^11.1.1"
+    github-slugger "^1.5.0"
+    globby "^11.1.0"
+    gray-matter "^4.0.3"
+    jiti "^1.20.0"
+    js-yaml "^4.1.0"
+    lodash "^4.17.21"
+    micromatch "^4.0.5"
+    resolve-pathname "^3.0.0"
+    shelljs "^0.8.5"
+    tslib "^2.6.0"
+    url-loader "^4.1.1"
+    webpack "^5.88.1"
+
 "@easyops-cn/autocomplete.js@^0.38.1":
   version "0.38.1"
   resolved "https://registry.npmmirror.com/@easyops-cn/autocomplete.js/-/autocomplete.js-0.38.1.tgz#46dff5795a9a032fa9b9250fdf63ca6c61c07629"
diff --git a/Tools/dora-dora/src/App.tsx b/Tools/dora-dora/src/App.tsx
index 839ef2942..ff1ac2909 100644
--- a/Tools/dora-dora/src/App.tsx
+++ b/Tools/dora-dora/src/App.tsx
@@ -1142,7 +1142,7 @@ export default function PersistentDrawerLeft() {
 			case "Lua": ext = ".lua"; break;
 			case "Teal": ext = ".tl"; break;
 			case "Yuescript": ext = ".yue"; break;
-			case "Dora Xml": ext = ".xml"; break;
+			case "Dora XML": ext = ".xml"; break;
 			case "Markdown": ext = ".md"; break;
 			case "Yarn": ext = ".yarn"; break;
 			case "Visual Script": ext = ".vs"; break;
diff --git a/Tools/dora-dora/src/NewFileDialog.tsx b/Tools/dora-dora/src/NewFileDialog.tsx
index 7a3ba1d66..7133416ac 100644
--- a/Tools/dora-dora/src/NewFileDialog.tsx
+++ b/Tools/dora-dora/src/NewFileDialog.tsx
@@ -23,7 +23,7 @@ import { VscMarkdown } from 'react-icons/vsc';
 import { useTranslation } from 'react-i18next';
 import { DialogActions, Grid } from '@mui/material';
 
-export type DoraFileType = "Lua" | "Yuescript" | "Teal" | "Typescript" | "Dora Xml" | "Markdown" | "Yarn" | "Visual Script" | "Folder"
+export type DoraFileType = "Lua" | "Yuescript" | "Teal" | "Typescript" | "Dora XML" | "Markdown" | "Yarn" | "Visual Script" | "Folder"
 
 interface FileType {
 	icon: React.ReactNode;
@@ -59,12 +59,12 @@ const fileTypes: FileType[] = [
 	},
 	{
 		icon: <DiCode size={65} style={{marginLeft: '-3px'}}/>,
-		name: "Dora Xml",
+		name: "Dora XML",
 		desc: "file.xml",
 		padding: '13px'
 	},
 	{
-		icon: <img src="yarn-editor/icon_512x512.png" alt="Yuescript" width="50px" height="50px" style={{marginLeft: '0px'}}/>,
+		icon: <img src="/yarn-editor/icon_512x512.png" alt="Yarn" width="50px" height="50px" style={{marginLeft: '0px'}}/>,
 		name: "Yarn",
 		desc: "file.yarn",
 		padding: '15px'
diff --git a/Tools/dora-dora/src/i18n.ts b/Tools/dora-dora/src/i18n.ts
index 0d6333ee4..cf40a4bb7 100644
--- a/Tools/dora-dora/src/i18n.ts
+++ b/Tools/dora-dora/src/i18n.ts
@@ -94,7 +94,7 @@ i18n
 						yuescript: "expressive, extremely concise language",
 						teal: "a typed dialect of Lua",
 						typescript: "a strongly typed programming language",
-						xml: "write game node trees in Xml format",
+						xml: "write game node trees in XML format",
 						markdown: "do some documentation",
 						folder: "create a file folder",
 						yarn: "a language for game dialogue",